/* ===========================================================================
   San Diego BMX  ·  "Race Day" design system
   Motorsport number-plate energy + San Diego sun.
   Display: Saira Condensed (heavy, italic for speed) · Body: Hanken Grotesk
   =========================================================================== */

:root{
  --ink:#14161b;          /* asphalt black            */
  --ink-2:#1d212b;        /* lighter asphalt          */
  --ink-3:#2b3140;        /* hairlines on dark        */
  --blue:#1322e6;         /* electric cobalt (brand)  */
  --blue-deep:#0c1abd;    /* darker blue for hovers   */
  --sky:#21a5fe;          /* sky blue (brand wave)    */
  --sun:#ffcd20;          /* sun yellow (energy/CTA)  */
  --sun-deep:#f2b500;
  --sand:#c8a982;         /* dirt / sand              */
  --sand-soft:#e7dcc7;
  --paper:#f6f3ec;        /* warm off-white content   */
  --paper-2:#efe9dc;
  --white:#ffffff;
  --text:#1a1d24;         /* body text on light       */
  --muted:#5c6270;        /* secondary text on light  */
  --muted-d:#aeb6c4;      /* secondary text on dark   */

  --plate-radius:14px;
  --shadow-plate:0 18px 40px -22px rgba(20,22,27,.55);
  --shadow-lift:0 28px 60px -28px rgba(19,34,230,.45);
  --maxw:1180px;
  --ease:cubic-bezier(.2,.7,.2,1);

  --font-display:"Saira Condensed", "Arial Narrow", sans-serif;
  --font-body:"Hanken Grotesk", system-ui, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background:var(--paper);
  font-size:clamp(16px,1.05vw + 14px,18px);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ margin:0; line-height:.96; font-family:var(--font-display); font-weight:800; }

.wrap{ width:min(100% - 2.5rem, var(--maxw)); margin-inline:auto; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* ---- Display type helpers --------------------------------------------- */
.display{
  font-family:var(--font-display);
  font-weight:800;
  font-style:italic;
  text-transform:uppercase;
  letter-spacing:-.01em;
  line-height:.9;
}
.eyebrow{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--font-display);
  font-weight:700; font-style:italic; text-transform:uppercase;
  letter-spacing:.12em; font-size:.95rem;
  color:var(--blue);
}
.eyebrow::before{
  content:""; width:0; height:0; border-style:solid;
  border-width:6px 0 6px 10px; border-color:transparent transparent transparent var(--sun);
}
.eyebrow--light{ color:var(--sun); }
.eyebrow--light::before{ border-left-color:var(--sun); }

/* ============================ BUTTONS ================================== */
.btn{
  --bg:var(--blue); --fg:#fff;
  display:inline-flex; align-items:center; gap:.55rem;
  font-family:var(--font-display); font-weight:800; font-style:italic;
  text-transform:uppercase; letter-spacing:.03em; font-size:1.12rem;
  padding:.85rem 1.5rem; border:0; border-radius:10px;
  background:var(--bg); color:var(--fg); cursor:pointer;
  transform:skewX(-7deg);
  transition:transform .18s var(--ease), box-shadow .18s var(--ease), background .18s;
  box-shadow:0 10px 24px -12px rgba(19,34,230,.7);
}
.btn > *{ transform:skewX(7deg); display:inline-flex; align-items:center; gap:.5rem; }
.btn:hover{ transform:skewX(-7deg) translateY(-2px) scale(1.02); box-shadow:var(--shadow-lift); }
.btn:focus-visible{ outline:3px solid var(--sky); outline-offset:3px; }
.btn--sun{ --bg:var(--sun); --fg:var(--ink); box-shadow:0 10px 24px -12px rgba(242,181,0,.85); }
.btn--ghost{ --bg:transparent; --fg:#fff; box-shadow:none; border:2px solid rgba(255,255,255,.5); }
.btn--ghost:hover{ background:rgba(255,255,255,.08); }
.btn--ink{ --bg:var(--ink); --fg:#fff; }
.btn--lg{ font-size:1.32rem; padding:1.05rem 1.9rem; }

.btn-row{ display:flex; flex-wrap:wrap; gap:.9rem; align-items:center; }

/* ============================ HEADER =================================== */
.site-header{
  position:sticky; top:0; z-index:60;
  background:rgba(246,243,236,.92);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid #e3dccd;
}
.site-header__bar{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.6rem 0; }
.brand{ display:flex; align-items:center; gap:.6rem; }
.brand img{ height:54px; width:auto; }
.nav{ display:flex; align-items:center; gap:.3rem; }
.nav a{
  font-family:var(--font-display); font-weight:700; font-style:italic;
  text-transform:uppercase; letter-spacing:.04em; font-size:1.05rem;
  color:var(--ink); padding:.5rem .7rem; border-radius:8px; position:relative;
  transition:color .15s, background .15s;
}
.nav a:hover{ color:var(--blue); }
.nav a[aria-current="page"]{ color:var(--blue); }
.nav a[aria-current="page"]::after{
  content:""; position:absolute; left:.7rem; right:.7rem; bottom:.28rem; height:3px;
  background:var(--sun); transform:skewX(-18deg);
}
.header-cta{ margin-left:.4rem; }
.nav-toggle{ display:none; }

@media (max-width:920px){
  .brand img{ height:46px; }
  .nav-toggle{
    display:inline-flex; flex-direction:column; gap:5px; justify-content:center;
    width:48px; height:44px; border:2px solid var(--ink); border-radius:9px; background:transparent; cursor:pointer;
  }
  .nav-toggle span{ height:3px; width:22px; margin-inline:auto; background:var(--ink); transition:.2s; }
  .nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
  .nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }
  .nav{
    position:fixed; inset:64px 0 auto 0; flex-direction:column; align-items:stretch; gap:.2rem;
    background:var(--ink); padding:1rem 1.25rem 1.4rem; transform:translateY(-120%);
    transition:transform .3s var(--ease); box-shadow:0 30px 50px -20px rgba(0,0,0,.6);
  }
  .nav[data-open="true"]{ transform:translateY(0); }
  .nav a{ color:#fff; font-size:1.5rem; padding:.7rem .4rem; border-bottom:1px solid var(--ink-3); }
  .nav a[aria-current="page"]{ color:var(--sun); }
  .nav a[aria-current="page"]::after{ display:none; }
  .header-cta{ margin:.8rem 0 0; }
  .header-cta .btn{ width:100%; justify-content:center; }
}

/* ============================ HERO ==================================== */
.hero{
  position:relative; background:var(--ink); color:#fff; overflow:hidden;
  isolation:isolate;
}
.hero__media{ position:absolute; inset:0; z-index:-2; }
.hero__media img{ width:100%; height:100%; object-fit:cover; opacity:.5; transform:scale(1.06); }
.hero::after{ /* grain + gradient */
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(105deg, rgba(20,22,27,.96) 30%, rgba(20,22,27,.62) 65%, rgba(19,34,230,.28) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}
.hero__inner{ padding:clamp(3rem,7vw,6.5rem) 0 clamp(3.5rem,7vw,6rem); position:relative; }
.hero h1{
  font-size:clamp(3.2rem,11vw,8rem); font-style:italic; text-transform:uppercase;
  letter-spacing:-.02em; max-width:14ch;
}
.hero h1 em{ color:var(--sun); font-style:italic; }
.hero h1 .stroke{ -webkit-text-stroke:2px var(--sun); color:transparent; }
.hero__sub{ max-width:48ch; color:#e8ebf2; font-size:1.2rem; margin:1.4rem 0 2rem; }
.hero .btn-row{ margin-top:1.5rem; }

/* start-gate light strip (signature motif) */
.gate{ display:inline-flex; align-items:center; gap:.55rem; padding:.5rem .8rem; border:1px solid var(--ink-3);
  border-radius:999px; background:rgba(0,0,0,.35); font-family:var(--font-display); font-style:italic;
  text-transform:uppercase; letter-spacing:.12em; font-size:.82rem; color:var(--muted-d); }
.gate__lights{ display:inline-flex; gap:.4rem; }
.gate__lights i{ width:13px; height:13px; border-radius:50%; background:#3a2a12; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }
.gate__lights i.amber{ animation:gate-amber 3.2s steps(1,end) infinite; }
.gate__lights i.amber:nth-child(2){ animation-delay:.45s; }
.gate__lights i.amber:nth-child(3){ animation-delay:.9s; }
.gate__lights i.green{ background:#0a3a1a; animation:gate-green 3.2s steps(1,end) infinite; }
@keyframes gate-amber{ 0%,12%{ background:#3a2a12; } 14%,42%{ background:var(--sun); box-shadow:0 0 12px var(--sun); } 100%{ background:#3a2a12; } }
@keyframes gate-green{ 0%,42%{ background:#0a3a1a; } 45%,75%{ background:#27d36b; box-shadow:0 0 14px #27d36b; } 100%{ background:#0a3a1a; } }
@media (prefers-reduced-motion:reduce){ .gate__lights i{ animation:none !important; } .gate__lights i.green{ background:#27d36b; } }

/* ===================== SECTION / BAND SCAFFOLD ======================== */
.band{ padding:clamp(3.5rem,7vw,6rem) 0; position:relative; }
.band--paper{ background:var(--paper); }
.band--paper2{ background:var(--paper-2); }
.band--dark{ background:var(--ink); color:#fff; position:relative; isolation:isolate; }
.band--dark .lead, .band--dark p{ color:var(--muted-d); }
.band--dark::before{ content:""; position:absolute; inset:0; z-index:-1; opacity:.06;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.band--blue{ background:var(--blue); color:#fff; }
.band--blue .lead{ color:#dfe3ff; }

/* diagonal cut between bands */
.cut-top{ clip-path:polygon(0 2.2vw,100% 0,100% 100%,0 100%); margin-top:-2.2vw; }

.section-head{ max-width:62ch; margin-bottom:2.4rem; }
.section-head h2{ font-size:clamp(2.2rem,5.5vw,4rem); font-style:italic; text-transform:uppercase; }
.section-head .lead{ font-size:1.18rem; color:var(--muted); margin-top:1rem; }
.band--dark .section-head .lead{ color:var(--muted-d); }

.lead{ font-size:1.18rem; color:var(--muted); }

/* ====================== NUMBER-PLATE CARDS ============================ */
.plates{ display:grid; gap:1.3rem; grid-template-columns:repeat(auto-fit,minmax(248px,1fr)); }
.plate{
  position:relative; background:var(--white); border:3px solid var(--ink);
  border-radius:var(--plate-radius); padding:1.6rem 1.4rem 1.5rem;
  box-shadow:var(--shadow-plate); transition:transform .2s var(--ease), box-shadow .2s var(--ease);
  overflow:hidden;
}
.plate::before{ /* plate top bolt holes */
  content:""; position:absolute; top:.7rem; left:0; right:0; height:8px;
  background:radial-gradient(circle at 16px 50%, var(--ink) 0 3px, transparent 4px),
             radial-gradient(circle at calc(100% - 16px) 50%, var(--ink) 0 3px, transparent 4px);
}
.plate__num{
  font-family:var(--font-display); font-style:italic; font-weight:800; font-size:1.5rem;
  color:var(--blue); letter-spacing:.02em; margin-top:.4rem;
}
.plate h3{ font-size:1.7rem; font-style:italic; text-transform:uppercase; margin:.15rem 0 .5rem; }
.plate p{ color:var(--muted); margin:0 0 .9rem; font-size:1rem; }
.plate:hover{ transform:translateY(-6px) rotate(-.6deg); box-shadow:var(--shadow-lift); }
.plate--feature{ border-color:var(--blue); }
.plate--feature .plate__num{ color:var(--sun-deep); }

.price{ font-family:var(--font-display); font-style:italic; font-weight:800; display:flex; align-items:baseline; gap:.3rem; color:var(--ink); }
.price .amt{ font-size:2.6rem; line-height:1; }
.price .per{ font-size:1rem; color:var(--muted); font-style:normal; font-family:var(--font-body); font-weight:600; }
.tag{ display:inline-block; font-family:var(--font-display); font-style:italic; font-weight:700; text-transform:uppercase;
  letter-spacing:.06em; font-size:.78rem; padding:.18rem .6rem; border-radius:6px; background:var(--sun); color:var(--ink); transform:skewX(-8deg); }

.feature-list{ list-style:none; margin:.4rem 0 0; padding:0; }
.feature-list li{ position:relative; padding:.32rem 0 .32rem 1.7rem; color:var(--text); font-size:1rem; }
.feature-list li::before{ content:""; position:absolute; left:0; top:.62rem; width:11px; height:11px;
  background:var(--blue); transform:skewX(-12deg); border-radius:2px; }
.band--dark .feature-list li{ color:#e7eaf1; }

/* ====================== SCHEDULE TABLE ================================ */
.sched{ display:grid; gap:.7rem; }
.sched__row{
  display:grid; grid-template-columns:auto 1fr auto; gap:1rem; align-items:center;
  background:var(--white); border:2px solid #e7dfce; border-left:6px solid var(--blue);
  border-radius:12px; padding:1rem 1.2rem;
}
.sched__day{ font-family:var(--font-display); font-style:italic; font-weight:800; text-transform:uppercase;
  font-size:1.5rem; color:var(--ink); min-width:5.5ch; }
.sched__what b{ font-size:1.1rem; }
.sched__what span{ display:block; color:var(--muted); font-size:.98rem; }
.sched__price{ font-family:var(--font-display); font-style:italic; font-weight:800; color:var(--blue); font-size:1.3rem; white-space:nowrap; }

/* multi-session day: one line per class/event with its own time + price */
.sched__row.multi{ grid-template-columns:auto 1fr; align-items:start; }
.sessions{ display:grid; width:100%; }
.session{ display:grid; grid-template-columns:1fr auto; gap:.2rem 1.2rem; align-items:start;
  padding:.6rem 0; border-top:1px dashed #e7dfce; }
.session:first-child{ border-top:0; padding-top:.1rem; }
.session:last-child{ padding-bottom:.1rem; }
.s-name{ font-weight:600; color:var(--text); }
.s-time{ display:block; color:var(--muted); font-size:.95rem; margin-top:.1rem; }
.s-price{ font-family:var(--font-display); font-style:italic; font-weight:800; color:var(--blue);
  font-size:1.2rem; white-space:nowrap; text-align:right; }
@media (max-width:560px){
  .sched__row{ grid-template-columns:1fr auto; }
  .sched__row.multi{ grid-template-columns:1fr; }
  .sched__day{ grid-column:1 / -1; font-size:1.3rem; }
}

/* ====================== SPLIT / FEATURE ROWS ========================== */
.split{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:center; }
.split--flip .split__media{ order:2; }
.split__media{ position:relative; }
.split__media img{ border-radius:18px; width:100%; aspect-ratio:4/3; object-fit:cover;
  box-shadow:var(--shadow-plate); }
.split__media.portrait img{ aspect-ratio:auto; height:clamp(380px,56vh,560px); object-position:center top; }
.split__media .badge{
  position:absolute; bottom:-16px; left:-12px; background:var(--sun); color:var(--ink);
  font-family:var(--font-display); font-style:italic; font-weight:800; text-transform:uppercase;
  padding:.5rem .9rem; border-radius:10px; transform:skewX(-8deg) rotate(-2deg); box-shadow:var(--shadow-plate);
}
.split h2,.split h3{ font-style:italic; text-transform:uppercase; }
.split h2{ font-size:clamp(2rem,4.5vw,3.2rem); margin-bottom:.8rem; }
@media (max-width:820px){
  .split{ grid-template-columns:1fr; }
  .split--flip .split__media{ order:0; }
}

/* ====================== STAT BAND ===================================== */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; text-align:center; }
.stat__num{ font-family:var(--font-display); font-style:italic; font-weight:800; color:var(--sun);
  font-size:clamp(2.4rem,5vw,3.6rem); line-height:1; }
.stat__label{ text-transform:uppercase; letter-spacing:.08em; font-size:.86rem; color:var(--muted-d);
  font-family:var(--font-display); font-style:italic; font-weight:600; margin-top:.4rem; }
@media (max-width:680px){ .stats{ grid-template-columns:repeat(2,1fr); gap:2rem 1rem; } }

/* ====================== STEPS (new riders) ============================ */
.steps{ display:grid; gap:1.1rem; counter-reset:step; }
.step{ display:grid; grid-template-columns:auto 1fr; gap:1.2rem; align-items:start;
  background:var(--white); border:2px solid #e7dfce; border-radius:14px; padding:1.3rem 1.4rem; }
.step__no{ counter-increment:step; font-family:var(--font-display); font-style:italic; font-weight:800;
  font-size:2.4rem; line-height:1; color:#fff; background:var(--blue); width:64px; height:64px;
  display:grid; place-items:center; border-radius:12px; transform:skewX(-7deg); }
.step__no span{ transform:skewX(7deg); }
.step h3{ font-style:italic; text-transform:uppercase; font-size:1.4rem; margin-bottom:.3rem; }
.step p{ color:var(--muted); margin:0; }

/* ====================== CALLOUT ======================================= */
.callout{ background:var(--sand-soft); border:2px dashed var(--sand); border-radius:14px;
  padding:1.3rem 1.5rem; color:#4a4230; }
.callout strong{ color:var(--ink); }

/* ====================== QUOTE ========================================= */
.quote{ max-width:60ch; }
.quote p{ font-family:var(--font-display); font-style:italic; font-weight:600; font-size:clamp(1.5rem,3vw,2.2rem);
  line-height:1.15; text-transform:none; color:#fff; }
.quote cite{ display:block; margin-top:1.2rem; font-style:normal; color:var(--sun);
  font-family:var(--font-display); text-transform:uppercase; letter-spacing:.08em; font-weight:700; }

/* ====================== CONTACT / MAP ================================= */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,4vw,3rem); align-items:start; }
.info-card{ background:var(--white); border:3px solid var(--ink); border-radius:var(--plate-radius);
  padding:1.6rem 1.5rem; box-shadow:var(--shadow-plate); }
.info-card h3{ font-style:italic; text-transform:uppercase; font-size:1.5rem; margin-bottom:.2rem; }
.info-row{ display:flex; gap:.8rem; align-items:flex-start; padding:.7rem 0; border-top:1px solid #ece5d6; }
.info-row:first-of-type{ border-top:0; }
.info-row .k{ font-family:var(--font-display); font-style:italic; font-weight:700; text-transform:uppercase;
  letter-spacing:.05em; color:var(--blue); min-width:5.5rem; }
.map-embed{ border:0; width:100%; height:100%; min-height:340px; border-radius:18px; box-shadow:var(--shadow-plate); }
@media (max-width:820px){ .contact-grid{ grid-template-columns:1fr; } .map-embed{ min-height:300px; } }

/* ====================== FOOTER ======================================== */
.site-footer{ background:#0e1014; color:#cfd4de; padding:3.2rem 0 6.5rem; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:2rem; }
.site-footer img.emblem{ width:96px; margin-bottom:1rem; }
.site-footer h4{ font-family:var(--font-display); font-style:italic; text-transform:uppercase; color:#fff;
  letter-spacing:.05em; font-size:1.2rem; margin-bottom:.7rem; }
.site-footer a:not(.btn){ color:#cfd4de; }
.site-footer a:not(.btn):hover{ color:var(--sun); }
.footer-links{ list-style:none; padding:0; margin:0; display:grid; gap:.4rem; }
.footer-contact{ list-style:none; padding:0; margin:0; display:grid; gap:.5rem; }
.socials{ display:flex; gap:.7rem; margin-top:.6rem; }
.socials a{ width:42px; height:42px; display:grid; place-items:center; border:1px solid var(--ink-3);
  border-radius:10px; transition:.18s; }
.socials a:hover{ background:var(--blue); border-color:var(--blue); transform:translateY(-2px); }
.socials svg{ width:20px; height:20px; fill:currentColor; }
.colophon{ border-top:1px solid var(--ink-3); margin-top:2.4rem; padding-top:1.4rem;
  display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; justify-content:space-between; font-size:.9rem; color:#8b91a0; }
.colophon .credit a{ color:var(--sky); font-weight:600; }
@media (max-width:760px){ .footer-grid{ grid-template-columns:1fr; gap:2rem; } }

/* ====================== STICKY MOBILE CALL BAR ======================== */
.callbar{ position:fixed; left:0; right:0; bottom:0; z-index:70; display:none;
  grid-template-columns:1fr 1fr; gap:.5rem; padding:.55rem .6rem;
  background:rgba(14,16,20,.96); backdrop-filter:blur(8px); border-top:1px solid var(--ink-3); }
.callbar .btn{ width:100%; justify-content:center; font-size:1.05rem; padding:.7rem; }
@media (max-width:920px){ .callbar{ display:grid; } .site-footer{ padding-bottom:6.5rem; } }

/* ====================== REVEAL ANIMATION ============================== */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal[data-d="1"]{ transition-delay:.08s; }
.reveal[data-d="2"]{ transition-delay:.16s; }
.reveal[data-d="3"]{ transition-delay:.24s; }
.reveal[data-d="4"]{ transition-delay:.32s; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* ====================== PAGE HERO (sub-pages) ========================= */
.page-hero{ position:relative; isolation:isolate; background:var(--ink); color:#fff; overflow:hidden;
  padding:clamp(2.8rem,6vw,4.8rem) 0 clamp(2.8rem,6vw,4.4rem); }
.page-hero::after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(100deg, rgba(20,22,27,.97) 40%, rgba(19,34,230,.34) 100%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E"); }
.page-hero__media{ position:absolute; inset:0; z-index:-2; }
.page-hero__media img{ width:100%; height:100%; object-fit:cover; opacity:.32; }
.page-hero h1{ font-size:clamp(2.6rem,8vw,5.4rem); font-style:italic; text-transform:uppercase; letter-spacing:-.02em; max-width:16ch; }
.page-hero h1 em{ color:var(--sun); font-style:italic; }
.page-hero .lead{ color:#e3e7f1; max-width:56ch; margin-top:1.1rem; font-size:1.18rem; }

/* ====================== FAQ ========================================== */
.qa{ border:2px solid #e7dfce; border-radius:12px; background:#fff; padding:0 1.3rem; margin-bottom:.7rem; }
.qa summary{ cursor:pointer; font-family:var(--font-display); font-style:italic; font-weight:700;
  text-transform:uppercase; font-size:1.2rem; padding:1rem 0; list-style:none; display:flex; justify-content:space-between; gap:1rem; align-items:center; }
.qa summary::-webkit-details-marker{ display:none; }
.qa summary::after{ content:"+"; font-family:var(--font-display); color:var(--blue); font-size:1.6rem; transition:transform .2s; }
.qa[open] summary{ color:var(--blue); }
.qa[open] summary::after{ transform:rotate(45deg); }
.qa p{ color:var(--muted); margin:0 0 1.1rem; }

/* simple two/three-up card grid (gear, etc.) */
.cards{ display:grid; gap:1.2rem; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }

/* prose helper for body-heavy sections */
.prose p{ margin:0 0 1.1rem; }
.prose p:last-child{ margin-bottom:0; }

/* misc */
.center{ text-align:center; }
.mt-2{ margin-top:1.4rem; } .mt-3{ margin-top:2rem; }
.lede-block{ max-width:60ch; }
.kicker-link{ font-family:var(--font-display); font-style:italic; font-weight:700; text-transform:uppercase;
  letter-spacing:.04em; color:var(--blue); border-bottom:3px solid var(--sun); padding-bottom:2px; }
.kicker-link:hover{ color:var(--blue-deep); }
.note{ font-size:.95rem; color:var(--muted); }
.band--dark .note{ color:var(--muted-d); }