/* =========================================================
   Peterborough Modified Cars UK — shared site styles
   ---------------------------------------------------------
   Masthead (logo left, menu right) and footer menu used on
   every main page, plus the building blocks for the simpler
   pages (hero, cards, panels, buttons).

   Link this BEFORE a page's own <style> block so a page can
   still override any of the colour tokens below.
   ========================================================= */

:root{
  --dux-hangar:#1B2A33;
  --dux-marking:#E8B33D;
  --dux-canvas:#F2EFE6;
  --dux-steel:#5A6B75;
  --dux-line:#DCD7C9;
}

/* ---------- MASTHEAD ---------- */
.pmc-mast{
  background:#fff;
  border-bottom:1px solid var(--dux-line);
}
.pmc-mast .inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:.5rem 1.5rem;
  padding:.85rem 0;
}
.pmc-mast .pmc-logo{height:82px;width:auto;display:block;}

/* ---------- MENU (masthead + footer) ---------- */
.pmc-nav{
  display:flex;
  flex-wrap:wrap;
  gap:.25rem 1.4rem;
  list-style:none;
  margin:0;
  padding:0;
}
.pmc-nav a{
  font-family:'Oswald',sans-serif;
  text-transform:uppercase;
  letter-spacing:.13em;
  font-size:.8rem;
  color:var(--dux-hangar);
  text-decoration:none;
  padding:.35rem 0;
  border-bottom:2px solid transparent;
  transition:border-color .15s ease,color .15s ease;
}
.pmc-nav a:hover{border-bottom-color:var(--dux-marking);}
.pmc-nav a[aria-current="page"]{
  border-bottom-color:var(--dux-marking);
  font-weight:600;
}
.pmc-nav a:focus-visible{outline:3px solid var(--dux-marking);outline-offset:3px;}

/* ---------- FOOTER ---------- */
.pmc-foot{
  background:#fff;
  border-top:1px solid var(--dux-line);
  margin-top:3rem;
  padding:1.6rem 0 2rem;
  text-align:center;
}
.pmc-foot .pmc-nav{justify-content:center;margin-bottom:1.1rem;}
.pmc-foot img{max-width:100%;height:auto;}

/* Tablet: tighten the menu so all six links sit beside the logo */
@media (max-width:767.98px){
  .pmc-mast .inner{gap:.5rem 1rem;}
  .pmc-mast .pmc-logo{height:70px;}
  .pmc-nav{gap:.25rem 1rem;}
}
@media (max-width:575.98px){
  .pmc-mast .inner{justify-content:center;text-align:center;}
  .pmc-nav{justify-content:center;gap:.25rem 1rem;}
  .pmc-mast .pmc-logo{height:68px;}
}

/* =========================================================
   Page building blocks — used by index, about and socials.
   (events and find-an-image keep their own page styles.)
   ========================================================= */

body.pmc{
  background:var(--dux-canvas);
  color:var(--dux-hangar);
  font-family:'Roboto',system-ui,sans-serif;
}

/* ---------- HERO ---------- */
.pmc-hero{
  background:var(--dux-hangar);
  color:var(--dux-canvas);
  padding:3rem 0 3.5rem;
  position:relative;
  overflow:hidden;
}
.pmc-hero::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0; height:8px;
  background:repeating-linear-gradient(to right,var(--dux-marking) 0 48px,transparent 48px 86px);
}
.pmc-eyebrow{
  font-family:'Oswald',sans-serif;
  letter-spacing:.2em; text-transform:uppercase;
  font-size:.75rem; color:var(--dux-marking); margin:0 0 .7rem;
}
.pmc-hero h1{
  font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
  line-height:1.08; font-size:clamp(1.8rem,5vw,3rem); margin:0;
  max-width:24ch;
}
.pmc-hero .lead{
  max-width:56ch; margin:1rem 0 0;
  font-size:1.02rem; line-height:1.6; color:rgba(242,239,230,.8);
}

/* ---------- SECTION TITLE ---------- */
.pmc-section-title{
  font-family:'Oswald',sans-serif; font-weight:400;
  letter-spacing:.16em; text-transform:uppercase;
  font-size:.8rem; color:var(--dux-steel);
  margin:0 0 1.1rem; padding-bottom:.6rem;
  border-bottom:1px solid var(--dux-line);
}

/* ---------- BUTTON ---------- */
.pmc-btn{
  font-family:'Oswald',sans-serif; letter-spacing:.1em; text-transform:uppercase;
  background:var(--dux-marking); border:2px solid var(--dux-marking);
  color:var(--dux-hangar); padding:.6rem 1.7rem; border-radius:2px;
  font-weight:600; text-decoration:none; display:inline-block; cursor:pointer;
  transition:background .15s ease,color .15s ease;
}
.pmc-btn:hover,.pmc-btn:focus{background:transparent;color:var(--dux-hangar);}
.pmc-hero .pmc-btn:hover,.pmc-hero .pmc-btn:focus{color:var(--dux-marking);}
.pmc-btn:focus-visible{outline:3px solid var(--dux-hangar);outline-offset:3px;}
.pmc-hero .pmc-btn:focus-visible{outline-color:var(--dux-canvas);}

/* ---------- CARDS ---------- */
.pmc-card{
  display:flex; flex-direction:column; height:100%;
  background:#fff; border:1px solid var(--dux-line); border-radius:2px;
  overflow:hidden; color:inherit; text-decoration:none;
  transition:border-color .15s ease,transform .15s ease,box-shadow .15s ease;
}
a.pmc-card:hover{
  color:inherit; border-color:var(--dux-hangar);
  transform:translateY(-2px); box-shadow:0 6px 18px rgba(27,42,51,.13);
}
a.pmc-card:focus-visible{outline:3px solid var(--dux-marking);outline-offset:2px;}
.pmc-card-img{
  width:100%; aspect-ratio:3/2; object-fit:cover; display:block;
  background:#e6e2d8; border-bottom:1px solid var(--dux-line);
}
.pmc-card-body{display:flex;flex-direction:column;flex:1;padding:1rem 1.1rem 1.2rem;}
.pmc-card-title{
  font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
  font-size:1.1rem; line-height:1.2; color:var(--dux-hangar); margin:0 0 .35rem;
}
.pmc-card-text{font-size:.9rem;color:var(--dux-steel);margin:0 0 1rem;}
.pmc-card-more{
  margin-top:auto; align-self:flex-start;
  font-family:'Oswald',sans-serif; text-transform:uppercase;
  letter-spacing:.12em; font-size:.78rem; color:var(--dux-hangar);
  border-bottom:2px solid var(--dux-marking); padding-bottom:.1rem;
}

/* ---------- PANEL (long-form text) ---------- */
.pmc-panel{
  background:#fff;
  border:1px solid var(--dux-line);
  border-left:5px solid var(--dux-marking);
  padding:1.75rem 1.6rem;
}
.pmc-panel p{line-height:1.7;margin:0 0 1.1rem;max-width:70ch;}
.pmc-panel p:last-child{margin-bottom:0;}

/* =========================================================
   Article pages (/articles/*.html)
   ========================================================= */
.pmc-back{
  display:inline-block; margin-bottom:1rem;
  font-family:'Oswald',sans-serif; text-transform:uppercase;
  letter-spacing:.12em; font-size:.78rem; color:var(--dux-steel);
  text-decoration:none;
}
.pmc-back:hover{color:var(--dux-hangar);}

.pmc-article{
  background:#fff;
  border:1px solid var(--dux-line);
  border-radius:2px;
  padding:2rem 1.75rem 2.25rem;
}
.pmc-article > :first-child{margin-top:0;}
.pmc-article p,
.pmc-article li{font-size:1.05rem;line-height:1.75;}
.pmc-article p{margin:0 0 1.15rem;}
.pmc-article ul,
.pmc-article ol{padding-left:1.3rem;margin:0 0 1.3rem;}
.pmc-article li{margin-bottom:.45rem;}
.pmc-article h1,
.pmc-article h2,
.pmc-article h3,
.pmc-article h4{
  font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
  font-size:1.3rem; line-height:1.2; letter-spacing:.02em;
  color:var(--dux-hangar);
  margin:2.2rem 0 .9rem; padding-left:.8rem;
  border-left:4px solid var(--dux-marking);
}
.pmc-article img{
  display:block; max-width:100%; height:auto;
  margin:1.6rem 0; border-radius:2px;
}
.pmc-article a{
  color:var(--dux-hangar);
  text-decoration:underline; text-decoration-color:var(--dux-marking);
  text-decoration-thickness:2px; text-underline-offset:3px;
}
.pmc-article blockquote:not(.instagram-media){
  margin:1.5rem 0; padding:.9rem 1.2rem;
  border-left:4px solid var(--dux-line); background:var(--dux-canvas);
}
.pmc-article .instagram-media{margin:1.5rem auto !important;}

/* Sidebar */
.pmc-aside{position:sticky;top:1rem;}
.pmc-mini{
  display:flex; gap:.8rem; align-items:center;
  background:#fff; border:1px solid var(--dux-line); border-radius:2px;
  padding:.55rem; margin-bottom:.7rem;
  color:inherit; text-decoration:none;
  transition:border-color .15s ease;
}
.pmc-mini:hover{border-color:var(--dux-hangar);color:inherit;}
.pmc-mini:focus-visible{outline:3px solid var(--dux-marking);outline-offset:2px;}
.pmc-mini-img{
  flex:0 0 84px; width:84px; aspect-ratio:1/1; overflow:hidden; border-radius:2px;
  background:repeating-linear-gradient(135deg,#22323c 0 10px,#1B2A33 10px 20px);
}
.pmc-mini-img img{width:100%;height:100%;object-fit:cover;display:block;}
.pmc-mini-title{
  font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
  font-size:.88rem; line-height:1.25; color:var(--dux-hangar);
}
.pmc-mini-tag{
  display:block; font-family:'Oswald',sans-serif; letter-spacing:.12em;
  text-transform:uppercase; font-size:.68rem; color:var(--dux-steel); margin-bottom:.2rem;
}

@media (max-width:575.98px){
  .pmc-article{padding:1.4rem 1.1rem 1.6rem;}
}

@media (prefers-reduced-motion:reduce){
  .pmc-nav a,.pmc-btn,.pmc-card,.pmc-mini{transition:none !important;}
}