/* Slipstream Autosport — Joel the Nerd build
   Type:  Archivo (width axis) for display, Poppins for body. Poppins is the font
          Ivan's own brand already uses, so the body voice stays his.
   Colour: his Elementor kit navy #1C244B and deep navy #072D5B carry the surfaces,
          electric blue #467FF7 is the accent. Navy-led, not near-black.
   NOTE: deliberately shares no type family or signature device with RaceCarsHire. */

:root{
  --ink:#070B18;
  --navy-900:#0B1024;
  --navy-800:#141C3C;
  --navy:#1C244B;
  --navy-deep:#072D5B;
  --blue:#467FF7;
  --blue-hi:#7CA6FF;
  --blue-dim:rgba(70,127,247,.14);
  --text:#E8EDF9;
  --body:#B6C2DE;
  --muted:#8E9DBF;
  --line:rgba(232,237,249,.13);
  --line-hi:rgba(232,237,249,.3);

  --wrap:1240px;
  --pad:clamp(20px,4vw,40px);
  --sec:clamp(72px,9.5vw,132px);

  --disp:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --sans:"Poppins",system-ui,-apple-system,"Segoe UI",sans-serif;
}

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

body{
  margin:0;
  background:var(--ink);
  color:var(--text);
  font-family:var(--sans);
  font-size:17px;
  font-weight:400;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
p{margin:0}
ol,ul,dl,dd{margin:0;padding:0;list-style:none}

h1,h2,h3{
  margin:0;
  font-family:var(--disp);
  font-variation-settings:"wdth" 118,"wght" 700;
  text-transform:uppercase;
  line-height:.98;
  letter-spacing:-.005em;
}

.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--pad)}
.label{font-family:var(--disp);font-variation-settings:"wdth" 105,"wght" 600;font-size:12px;letter-spacing:.2em;text-transform:uppercase}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lede{font-size:clamp(17px,1.5vw,20px);color:#C9D3E9;line-height:1.6}

.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--blue);color:var(--ink);font-weight:600;padding:16px 24px}
.skip:focus{left:0}
:where(a,button):focus-visible{outline:2px solid var(--blue-hi);outline-offset:3px}

/* ---------- logo ---------- */
.logo{display:inline-flex;flex-direction:column;line-height:1;position:relative;padding-bottom:7px}
.logo-a{font-family:var(--disp);font-variation-settings:"wdth" 112,"wght" 800;font-size:21px;letter-spacing:.01em;text-transform:uppercase}
.logo-b{font-family:var(--disp);font-variation-settings:"wdth" 100,"wght" 400;font-size:10.5px;letter-spacing:.44em;text-transform:uppercase;margin-top:4px}
.logo::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:3px;background:var(--blue)}

/* ---------- nav ---------- */
.nav{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.nav.is-stuck{background:rgba(11,16,36,.94);backdrop-filter:blur(14px);border-bottom-color:var(--line)}
.nav-in{max-width:var(--wrap);margin:0 auto;padding:18px var(--pad);display:flex;align-items:center;gap:28px}
.nav-links{display:flex;gap:26px;margin-left:auto}
.nav-links a{font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 500;font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--text);opacity:.8;padding:8px 0;position:relative;transition:opacity .2s}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--blue);transition:right .28s ease}
.nav-links a:hover,.nav-links a[aria-current]{opacity:1}
.nav-links a:hover::after,.nav-links a[aria-current]::after{right:0}
.nav-call{font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 600;font-size:12.5px;letter-spacing:.1em;padding:12px 20px;border:1px solid var(--line-hi);border-radius:3px;transition:border-color .2s,background .2s,color .2s}
.nav-call:hover{border-color:var(--blue);background:var(--blue);color:var(--ink)}

.burger{display:none;width:48px;height:48px;background:none;border:0;padding:12px;cursor:pointer;margin-left:auto}
.burger span{display:block;height:2px;background:var(--text);margin:5px 0;transition:transform .25s,opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.drawer{display:none;position:fixed;inset:0;z-index:49;background:rgba(7,11,24,.98);backdrop-filter:blur(8px)}
.drawer.open{display:block}
.drawer-in{display:flex;flex-direction:column;gap:6px;padding:104px var(--pad) 40px}
.drawer-in a{font-family:var(--disp);font-size:28px;text-transform:uppercase;font-variation-settings:"wdth" 112,"wght" 700;padding:14px 0;border-bottom:1px solid var(--line)}
.drawer-call{color:var(--blue) !important;font-size:19px !important;border-bottom:0 !important;margin-top:16px}

/* ---------- buttons ---------- */
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;min-height:54px;padding:0 30px;font-family:var(--disp);font-variation-settings:"wdth" 106,"wght" 600;font-size:13px;letter-spacing:.12em;text-transform:uppercase;border-radius:3px;transition:background .22s,border-color .22s,color .22s}
.btn-solid{background:var(--blue);color:var(--ink);border:1px solid var(--blue)}
.btn-solid:hover{background:var(--blue-hi);border-color:var(--blue-hi)}
.btn-ghost{border:1px solid var(--line-hi);color:var(--text);background:rgba(232,237,249,.05)}
.btn-ghost:hover{border-color:var(--text);background:rgba(232,237,249,.12)}

/* ============================================================
   HERO — split panel. The car gets its own uncovered area rather than
   sitting behind the type, and the left panel states plainly who this is.
   ============================================================ */
.hero{position:relative;background:var(--navy-900);border-bottom:1px solid var(--line)}
.hero-in{display:grid;grid-template-columns:minmax(0,46fr) minmax(0,54fr);align-items:stretch;min-height:min(90vh,880px)}
.hero-body{display:flex;flex-direction:column;justify-content:center;padding:150px clamp(28px,4vw,64px) 44px clamp(20px,calc((100vw - var(--wrap)) / 2 + 20px),260px)}
.hero h1{font-size:clamp(40px,4.9vw,80px);font-variation-settings:"wdth" 122,"wght" 800;line-height:.9;margin-bottom:20px}
.hero h1 em{font-style:normal;color:var(--blue-hi)}
.hero-said{font-size:clamp(19px,1.7vw,25px);font-weight:500;color:var(--text);margin-bottom:14px;max-width:24ch;line-height:1.35}
.hero-sub{max-width:48ch;font-size:clamp(15.5px,1.15vw,17px);color:#B9C5E0;margin-bottom:28px}
.hero .btns{margin-bottom:34px}

/* the photo panel: nothing is ever laid over the subject */
.hero-media{position:relative;overflow:hidden;background:var(--navy-800);min-height:340px}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity .9s ease}
.hero-slide.on{opacity:1}
.hero-slide img{width:100%;height:100%;object-fit:cover}
.no-js .hero-slide:first-child{opacity:1}
/* soft blend into the copy panel only, never across the car */
.hero-media::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to right,rgba(11,16,36,.92) 0%,rgba(11,16,36,.35) 12%,rgba(11,16,36,0) 30%)}

/* scene tabs are real controls */
.scenes{display:flex;flex-wrap:wrap;gap:8px;list-style:none}
.scene-btn{background:none;border:1px solid var(--line-hi);border-radius:3px;padding:0 16px;min-height:44px;cursor:pointer;color:var(--muted);font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 600;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;transition:color .25s,border-color .25s,background .25s}
.scene-btn:hover{color:var(--text);border-color:var(--muted)}
.scene-btn[aria-selected=true]{color:var(--ink);background:var(--blue);border-color:var(--blue)}
.hero-foot{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;margin-top:26px;padding-top:20px;border-top:1px solid var(--line)}
.credit{color:var(--muted);font-family:var(--disp);font-size:11px;letter-spacing:.16em;text-transform:uppercase}

/* ============================================================
   SECTIONS
   ============================================================ */
.band{padding-block:var(--sec)}
.band-navy{background:var(--navy-900);border-block:1px solid var(--line)}
.band-deep{background:linear-gradient(150deg,var(--navy-deep) 0%,var(--navy) 62%,var(--navy-800) 100%);border-block:1px solid var(--line)}
.band h2{font-size:clamp(28px,4vw,54px);margin-bottom:22px}
.band > .wrap > p{color:var(--body)}
.pad-top{padding-top:24px}
.split-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:clamp(32px,5vw,72px)}
.split-2 p{color:var(--body);margin-bottom:16px}
.split-2 p:last-child{margin-bottom:0}
.split-2 h2{margin-bottom:20px}

/* ---------- intro ---------- */
.intro{padding-block:var(--sec);border-bottom:1px solid var(--line)}
.intro h2{font-size:clamp(28px,4.4vw,60px);max-width:20ch;margin-bottom:44px}
.intro-cols{display:grid;gap:24px 64px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));max-width:1000px}
.intro-cols p{color:var(--body)}

/* ---------- programs ---------- */
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.tile{position:relative;display:block;overflow:hidden;background:var(--navy-800);border:1px solid var(--line);border-radius:4px}
.tile img{aspect-ratio:1/1;width:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.3,1);filter:saturate(.96) contrast(1.03)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(7,11,24,.98) 26%,rgba(7,11,24,.9) 44%,rgba(11,16,36,.55) 64%,rgba(11,16,36,.1) 86%)}
.tile:hover img{transform:scale(1.045)}
.tile:hover{border-color:var(--blue)}
.tile-body{position:absolute;inset:auto 0 0;z-index:2;padding:clamp(24px,3vw,38px)}
.idx{display:block;color:var(--blue-hi);margin-bottom:12px}
.tile h3{font-size:clamp(23px,2.5vw,34px);margin-bottom:12px}
.tile-body p{color:#C9D3E6;font-size:15.5px;line-height:1.6;max-width:44ch;margin-bottom:16px}
.tile-go{font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 600;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--text);opacity:.75;transition:opacity .2s,letter-spacing .25s}
.tile:hover .tile-go{opacity:1;letter-spacing:.24em}

/* ============================================================
   RESULTS — built from Ivan's own branded race graphics.
   (Replaces the timing-board treatment, which belongs to RaceCarsHire.)
   ============================================================ */
.results-head{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:flex-end;margin-bottom:40px}
.results-head h2{margin-bottom:0}
.results-head p{color:var(--muted);max-width:46ch}
.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.res{position:relative;display:block;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--navy-800);transition:border-color .25s,transform .35s}
.res:hover{border-color:var(--blue);transform:translateY(-3px)}
.res-media{position:relative;margin:0;overflow:hidden}
.res-media img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.res:hover .res-media img{transform:scale(1.03)}
.res-media::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(104deg,transparent 40%,rgba(232,237,249,.18) 49%,transparent 58%);
  transform:translateX(-115%);transition:transform .85s cubic-bezier(.2,.7,.3,1)}
.res:hover .res-media::after{transform:translateX(115%)}
.res-foot{padding:18px 20px 22px;border-top:1px solid var(--line)}
.res-foot strong{display:block;font-family:var(--disp);font-variation-settings:"wdth" 108,"wght" 600;text-transform:uppercase;font-size:16px;letter-spacing:.01em;margin-bottom:6px}
.res-foot span{color:var(--muted);font-size:14.5px;line-height:1.5}

.next-up{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(16px,3vw,40px);align-items:center;margin-top:16px;padding:24px clamp(20px,3vw,32px);border:1px solid var(--blue);border-radius:4px;background:var(--blue-dim)}
.next-up .label{color:var(--blue-hi)}
.next-up strong{display:block;font-family:var(--disp);font-variation-settings:"wdth" 110,"wght" 700;text-transform:uppercase;font-size:clamp(17px,2vw,23px)}
.next-up span{color:var(--body);font-size:15px}
.next-when{font-family:var(--disp);font-variation-settings:"wdth" 112,"wght" 700;font-size:clamp(18px,2.2vw,26px);color:var(--blue-hi);white-space:nowrap}

/* ============================================================
   PARTNERS
   ============================================================ */
.partners{padding-block:clamp(48px,6vw,80px);background:var(--navy-900);border-block:1px solid var(--line)}
.partners-head{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:baseline;margin-bottom:36px}
.partners-head h2{font-size:clamp(20px,2.2vw,28px)}
.partners-head p{color:var(--muted);font-size:15px}
/* transparent logos knocked to white: a sponsor wall, no boxes */
.plogos{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(26px,3.5vw,56px)}
.plogos figure{margin:0;flex:0 1 calc(25% - clamp(26px,3.5vw,56px));display:flex;align-items:center;justify-content:center;min-height:64px}
.plogos img{width:100%;max-height:74px;object-fit:contain;opacity:.88;transition:opacity .25s}
.plogos figure:hover img{opacity:1}
.partners-head{margin-bottom:44px}

/* ============================================================
   REACH — the sponsor numbers
   ============================================================ */
.reach-in{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,5vw,80px);align-items:center}
.reach h2{font-size:clamp(28px,4vw,52px);margin-bottom:20px}
.reach p{color:#C9D3E9;margin-bottom:18px}
.reach-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:clamp(20px,3vw,40px)}
.rnum{border-left:1px solid var(--line-hi);padding-left:clamp(16px,2vw,26px)}
.rnum b{display:block;font-family:var(--disp);font-variation-settings:"wdth" 120,"wght" 800;font-size:clamp(42px,6vw,76px);line-height:.86;color:var(--text)}
.rnum b i{font-style:normal;font-size:.44em;color:var(--blue-hi);vertical-align:super;margin-left:2px}
.rnum span{display:block;margin-top:14px;color:var(--muted);font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 500;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;line-height:1.5}
.rnote{margin-top:28px;color:var(--muted);font-size:14px}
.chan{display:flex;flex-wrap:wrap;gap:10px;margin-top:36px;padding-top:26px;border-top:1px solid var(--line)}
.chan a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid var(--line-hi);border-radius:3px;font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 500;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text);transition:border-color .2s,background .2s,color .2s}
.chan a:hover{border-color:var(--blue);background:var(--blue);color:var(--ink)}

/* ============================================================
   VIDEO / CONTENT
   ============================================================ */
.vids{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.vid{display:block;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--navy-800);transition:border-color .25s}
.vid:hover{border-color:var(--blue)}
.vid-media{position:relative;margin:0}
.vid-media img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.vid:hover .vid-media img{transform:scale(1.04)}
.vid-play{position:absolute;inset:0;display:grid;place-items:center;background:rgba(7,11,24,.28);transition:background .25s}
.vid:hover .vid-play{background:rgba(7,11,24,.1)}
.vid-play svg{width:54px;height:54px;filter:drop-shadow(0 3px 10px rgba(7,11,24,.6))}
.vid-t{display:block;padding:18px 20px 22px;color:var(--text);font-size:15.5px;line-height:1.5}

/* ============================================================
   PARTNER PITCH / CTA / FOOTER
   ============================================================ */
.pitch{display:grid;grid-template-columns:.85fr 1fr;align-items:stretch}
.pitch-media{position:relative;min-height:520px}
.pitch-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pitch-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to right,rgba(7,11,24,.3),rgba(7,11,24,.9))}
.pitch-body{padding:var(--sec) clamp(24px,5vw,88px) var(--sec) clamp(24px,4vw,64px);max-width:760px;background:var(--navy-900)}
.pitch-body h2{font-size:clamp(28px,4vw,54px);margin-bottom:22px}
.props{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:30px;margin:36px 0 44px}
.props dt{font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--blue-hi);padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid var(--line)}
.props dd{color:var(--body);font-size:15.5px;line-height:1.62}

.cta{padding-block:clamp(56px,7vw,96px);background:linear-gradient(120deg,var(--navy-deep) 0%,var(--navy) 68%,var(--navy-800) 100%);border-top:1px solid var(--line)}
.cta-in{display:grid;grid-template-columns:1.4fr auto;gap:clamp(24px,4vw,64px);align-items:center}
.cta h2{font-size:clamp(26px,3.6vw,46px);margin-bottom:14px}
.cta p{color:#C9D3E9;max-width:62ch}

.foot{padding-top:var(--sec);background:var(--navy-900);border-top:1px solid var(--line)}
.foot-in{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:52px}
.foot-brand p{color:var(--muted);margin-top:18px;font-size:14.5px}
.foot-nav{display:flex;flex-direction:column;gap:11px;align-items:flex-start}
.foot-nav h3{font-family:var(--disp);font-size:11.5px;letter-spacing:.16em;font-variation-settings:"wdth" 104,"wght" 600;color:var(--blue-hi);margin-bottom:8px}
.foot-nav a,.foot-nav span{color:#A4B2D0;font-size:15px;line-height:1.5;transition:color .2s}
.foot-nav a:hover{color:var(--text)}
.foot-base{display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;padding-block:26px;border-top:1px solid var(--line);color:var(--muted);font-size:13.5px}
.foot-base a{display:inline-flex;align-items:center;min-height:44px;color:var(--muted);border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.foot-base a:hover{color:var(--blue-hi);border-bottom-color:var(--blue-hi)}

/* ---------- reveal ---------- */
.js [data-rise]{opacity:0;transform:translateY(22px)}
.js [data-rise].in{opacity:1;transform:none;transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.3,1)}
@media (prefers-reduced-motion:reduce){
  .js [data-rise]{opacity:1;transform:none}
  .tile img,.btn,.nav-links a::after,.hero-slide,.vid-media img,.res-media img{transition:none}
  .res-media::after{display:none}
}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .pitch{grid-template-columns:1fr}
  .pitch-media{min-height:360px}
  .pitch-media::after{background:linear-gradient(to top,rgba(7,11,24,.9),rgba(7,11,24,.2))}
  .pitch-body{padding-inline:var(--pad)}
  .reach-in,.cta-in{grid-template-columns:1fr}
  .res-grid,.vids{grid-template-columns:repeat(2,1fr)}
  .plogos{grid-template-columns:repeat(3,1fr)}
  .foot-in{grid-template-columns:1fr 1fr;gap:40px 32px}
}
@media (max-width:900px){
  .nav-links,.nav-call{display:none}
  .burger{display:block}
}
@media (max-width:760px){
  body{font-size:16px}
  /* mobile: a tall photo with the copy riding up over its lower third, so the
     car keeps real estate and the next section still reaches the fold */
  .hero-in{grid-template-columns:1fr;min-height:0}
  .hero-media{order:-1;min-height:0;aspect-ratio:4/5}
  .hero-media::after{background:linear-gradient(to bottom,rgba(11,16,36,.6) 0%,rgba(11,16,36,0) 22%)}
  .hero-body{
    position:relative;z-index:2;
    margin-top:-196px;
    padding:42px var(--pad) 14px;
    background:linear-gradient(to bottom,rgba(7,11,24,0) 0%,rgba(7,11,24,.62) 16%,rgba(7,11,24,.93) 36%,var(--navy-900) 62%);
  }
  .hero h1{font-size:clamp(38px,10.4vw,52px);margin-bottom:14px}
  .hero-said{margin-bottom:16px}
  /* the intro section directly below carries this same detail in full, and the
     brief wants that heading reaching the fold, so the hero keeps only the
     headline, the identity line and the two calls to action */
  .hero-sub{display:none}
  .credit{display:none}
  .hero .btns{margin-bottom:8px}
  .hero-foot{margin-top:0;padding-top:0;border-top:0;gap:8px}
  .scene-btn{padding:0 12px;font-size:11px;letter-spacing:.12em}
  .hide-sm{display:none}
  .hero .btns{flex-wrap:nowrap;gap:8px}
  .hero .btn{width:auto;flex:1 1 0;min-width:0;padding:0 14px;font-size:11.5px;letter-spacing:.07em}
  .intro{padding-top:22px}
  .intro h2{margin-bottom:24px;font-size:26px}
  .tiles,.res-grid,.vids{grid-template-columns:1fr}
  .tile img{aspect-ratio:4/5}
  .res img{aspect-ratio:4/5}
  .plogos{gap:30px 26px}
  .plogos figure{flex:0 1 calc(50% - 26px)}
  .reach-nums{grid-template-columns:1fr 1fr;gap:24px 16px}
  .rnum:last-child{grid-column:1 / -1;border-left:0;padding-left:0;text-align:center;padding-top:22px;border-top:1px solid var(--line-hi)}
  .next-up{grid-template-columns:1fr;gap:10px}
  .foot-in{grid-template-columns:1fr;gap:34px}
  .btn{width:100%;justify-content:center}
  .logo{padding-top:8px}
  .foot-nav{gap:2px}
  .foot-nav a{min-height:48px;display:inline-flex;align-items:center}
  .foot-nav span{padding-block:10px}
}

/* ============================================================
   INTERIOR PAGES
   ============================================================ */

/* ---------- interior hero: title beside a square photo ---------- */
.phero{padding:clamp(120px,14vw,180px) 0 var(--sec);border-bottom:1px solid var(--line)}
.phero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:center}
.phero-flip .phero-media{order:-1}
.phero-index{color:var(--blue-hi);margin-bottom:18px}
.phero h1{font-size:clamp(38px,6.2vw,86px);font-variation-settings:"wdth" 120,"wght" 800;margin-bottom:22px}
.phero .lede{margin-bottom:0}
.phero-media{margin:0}
.phero-media img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--line);border-radius:4px;filter:saturate(.96) contrast(1.04)}

/* ---------- numbered steps: the one label device this site uses ---------- */
.steps{border-top:1px solid var(--line);margin-top:16px}
.steps.plain li{grid-template-columns:1fr}
.steps li{display:grid;grid-template-columns:88px 1fr;gap:clamp(16px,3vw,40px);padding:clamp(24px,3vw,36px) 0;border-bottom:1px solid var(--line)}
.step-n{color:var(--blue-hi);font-size:13px;padding-top:7px}
.steps h3{font-size:clamp(20px,2.2vw,28px);margin-bottom:12px}
.steps p{color:var(--body);max-width:66ch}

/* ---------- alternating feature rows ---------- */
.feats{padding-block:var(--sec);background:var(--navy-900);border-block:1px solid var(--line)}
.feat{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center;padding-block:clamp(32px,5vw,64px);border-bottom:1px solid var(--line)}
.feat:last-child{border-bottom:0;padding-bottom:0}
.feat:first-child{padding-top:0}
.feat-flip .feat-media{order:2}
.feat-media{margin:0}
.feat-media img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--line);border-radius:4px;filter:saturate(.96) contrast(1.04)}
.feat-body h3{font-size:clamp(22px,2.8vw,36px);margin-bottom:20px}
.feat-body p{color:var(--body);margin-bottom:16px}
.feat-body p:last-child{margin-bottom:0}

/* white-background design artifacts (livery sheets) read as broken photos on a
   dark page, so they are framed deliberately as spec sheets on a light card */
.paper img{background:#E7EBF4;object-fit:contain !important;padding:5%}
.gal-item.paper img{aspect-ratio:1/1}

/* ---------- full bleed band ---------- */
.fullbleed{position:relative}
.fullbleed img{width:100%;height:clamp(320px,52vh,600px);object-fit:cover;object-position:50% 42%;filter:brightness(.86) saturate(.98)}
.fullbleed-cap{position:absolute;inset:auto 0 0;padding-bottom:24px}
.fullbleed-cap p{color:var(--text);text-shadow:0 1px 14px rgba(7,11,24,.9)}

/* ---------- trophy / result callout ---------- */
.trophy{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,64px);align-items:center}
.trophy-media{margin:0}
.trophy-media img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--line);border-radius:4px}
.trophy-body p{color:var(--body);margin-bottom:16px}
.inline-link{display:inline-flex;align-items:center;min-height:44px;color:var(--blue-hi);font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid rgba(124,166,255,.45);transition:border-color .2s,color .2s}
.inline-link:hover{color:var(--text);border-bottom-color:var(--text)}

/* ---------- stats ---------- */
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(24px,4vw,56px)}
.stat{border-left:1px solid var(--line-hi);padding-left:clamp(16px,2vw,28px)}
.stat-n{display:block;font-family:var(--disp);font-size:clamp(54px,7.6vw,96px);line-height:.86;font-variation-settings:"wdth" 120,"wght" 800;color:var(--text)}
.stat-n .plus{font-size:.42em;vertical-align:super;color:var(--blue-hi);margin-left:2px}
.stat-k{display:block;margin-top:14px;color:var(--muted);font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 500;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase}

/* ---------- fee band (Start F1RST) ---------- */
.fee-band{padding-block:var(--sec);background:linear-gradient(150deg,var(--navy-deep) 0%,var(--navy) 60%,var(--navy-800) 100%);border-block:1px solid var(--line)}
.fee-in{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(32px,6vw,88px);align-items:center}
.fee-lead h2{font-size:clamp(28px,4vw,52px);margin-bottom:20px}
.fee-lead p{color:#C9D3E9;max-width:56ch}
.fee-figure{border-left:1px solid var(--line-hi);padding-left:clamp(20px,3vw,40px)}
.fee-num{display:block;font-family:var(--disp);font-size:clamp(72px,9vw,116px);line-height:.82;font-variation-settings:"wdth" 122,"wght" 800;color:var(--blue-hi)}
.fee-num .pct{font-size:.42em;vertical-align:super;margin-left:2px;font-variation-settings:"wdth" 100,"wght" 600}
.fee-txt{margin-top:20px;color:var(--muted);max-width:30ch}
.f1rst-mark{width:190px;margin-bottom:24px}

/* ---------- page head ---------- */
.page-head{padding:clamp(120px,14vw,176px) 0 clamp(40px,5vw,64px);border-bottom:1px solid var(--line)}
.page-head h1{font-size:clamp(40px,6.8vw,94px);font-variation-settings:"wdth" 122,"wght" 800;margin-bottom:18px}
.page-head .lede{margin-bottom:0}

/* ---------- prose ---------- */
.prose{max-width:74ch}
.prose p{color:var(--body);margin-bottom:20px;font-size:clamp(16px,1.4vw,18px)}
.prose p:last-child{margin-bottom:0}

/* ---------- pull quote ---------- */
.quote-block{text-align:center;padding-block:clamp(16px,3vw,40px)}
.quote-block blockquote{margin:0}
.quote-block blockquote p{font-family:var(--disp);font-size:clamp(32px,6.6vw,88px);font-variation-settings:"wdth" 122,"wght" 800;text-transform:uppercase;line-height:.96;color:var(--text)}
.quote-block blockquote em{font-style:normal;color:var(--blue-hi)}
.quote-by{display:block;margin-top:22px;color:var(--muted)}

/* ---------- founder ---------- */
.founder{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(28px,5vw,72px);align-items:center}
.founder-media{margin:0}
.founder-media img{width:100%;aspect-ratio:4/5;object-fit:cover;border:1px solid var(--line);border-radius:4px}
.founder-body blockquote{margin:0 0 24px}
.founder-body blockquote p{font-family:var(--disp);font-size:clamp(30px,4.4vw,60px);font-variation-settings:"wdth" 122,"wght" 800;text-transform:uppercase;line-height:.96;color:var(--text)}
.founder-body blockquote em{font-style:normal;color:var(--blue-hi)}
.founder-body p{color:var(--body);margin-bottom:18px;max-width:60ch}
.founder-body .quote-by{margin-top:0;color:var(--muted)}

/* ---------- gallery ---------- */
.gallery-sec{padding-block:var(--sec)}
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gal-item{margin:0;position:relative;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--navy-800)}
.gal-item img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.3,1);filter:saturate(.96) contrast(1.03)}
.gal-item:hover img{transform:scale(1.04)}
.gal-wide{grid-column:span 2}
.gal-wide img{aspect-ratio:2/1}
.gal-item figcaption{position:absolute;inset:auto 0 0;padding:16px 18px;color:var(--text);font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 500;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;background:linear-gradient(to top,rgba(7,11,24,.95),rgba(7,11,24,0));opacity:0;transform:translateY(8px);transition:opacity .3s,transform .3s}
.gal-item:hover figcaption,.gal-item:focus-within figcaption{opacity:1;transform:none}

/* ---------- news ---------- */
.news-list{display:grid;gap:16px}
.news-item{display:grid;grid-template-columns:.42fr 1fr;gap:clamp(20px,3vw,44px);align-items:center;border:1px solid var(--line);border-radius:4px;background:var(--navy-800);padding:clamp(16px,2vw,24px);transition:border-color .25s,background .25s}
.news-item:hover{border-color:var(--blue);background:var(--blue-dim)}
.news-media{margin:0}
.news-media img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--line);border-radius:3px}
.news-date{display:block;color:var(--blue-hi);margin-bottom:12px}
.news-body h2{font-size:clamp(21px,2.6vw,34px);margin-bottom:14px}
.news-body p{color:var(--body);margin-bottom:18px;max-width:62ch}
.news-item:hover .tile-go{opacity:1;letter-spacing:.24em}
.news-item-sm{grid-template-columns:120px 1fr}
.news-item-sm .news-body h2{font-size:clamp(18px,2vw,24px);margin-bottom:0}

/* ---------- instagram strip ---------- */
.latest{padding-block:var(--sec)}
.latest-head{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:flex-end;margin-bottom:36px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.latest-head h2{font-size:clamp(26px,3.4vw,44px)}
.latest-link{color:var(--muted);transition:color .2s}
.latest-link:hover{color:var(--blue-hi)}
.feed{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.post{display:block;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--navy-800);transition:border-color .25s}
.post img{width:100%;aspect-ratio:4/5;object-fit:cover}
.post-cap{display:block;padding:18px 20px;color:var(--body);font-size:15px;line-height:1.55}
.post:hover{border-color:var(--blue)}
.post:hover .post-cap{color:var(--text)}

/* ---------- article ---------- */
.article{padding-top:clamp(112px,13vw,160px)}
.article-head{max-width:900px;padding-bottom:clamp(28px,4vw,44px)}
.back-link{display:inline-flex;align-items:center;min-height:44px;color:var(--muted);transition:color .2s}
.back-link:hover{color:var(--blue-hi)}
.article-head h1{font-size:clamp(32px,5.2vw,70px);margin:10px 0 16px}
.article-date{color:var(--blue-hi)}
.article-hero{margin:0}
.article-hero img{width:100%;height:clamp(300px,48vh,540px);object-fit:cover;object-position:50% 40%;border-block:1px solid var(--line)}
.article-body{max-width:74ch;padding-block:clamp(40px,5vw,72px)}
.article-body p{color:#C3CDE4;font-size:clamp(16px,1.45vw,18.5px);line-height:1.78;margin-bottom:24px}
.article-body p:first-child{font-size:clamp(18px,1.7vw,22px);color:var(--text)}
.article-next{padding-bottom:var(--sec)}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);align-items:start}
.contact-details{display:grid;gap:8px}
.cd{display:grid;grid-template-columns:118px 1fr;gap:20px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line);transition:border-color .2s}
.cd:first-child{border-top:1px solid var(--line)}
a.cd:hover{border-color:var(--blue)}
.cd-k{color:var(--muted)}
.cd-v{font-family:var(--disp);font-size:clamp(18px,1.9vw,24px);font-variation-settings:"wdth" 110,"wght" 600;line-height:1.35;word-break:break-word}
a.cd:hover .cd-v{color:var(--blue-hi)}
.cd-social{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:17px;font-family:var(--sans);font-weight:400}
.cd-social a{color:var(--text);border-bottom:1px solid var(--line-hi);transition:color .2s,border-color .2s}
.cd-social a:hover{color:var(--blue-hi);border-bottom-color:var(--blue-hi)}

.form h2{font-size:clamp(22px,2.6vw,32px);margin-bottom:26px}
.field{margin-bottom:20px}
.field label{display:block;font-family:var(--disp);font-variation-settings:"wdth" 104,"wght" 500;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.field input,.field select,.field textarea{width:100%;background:var(--ink);color:var(--text);border:1px solid var(--line-hi);border-radius:3px;padding:14px 16px;font-family:var(--sans);font-size:16px;min-height:52px;transition:border-color .2s}
.field textarea{min-height:140px;resize:vertical;line-height:1.6}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--muted)}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--blue-hi);outline-offset:2px;border-color:var(--blue)}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:#FF8080}
.form-note{margin-top:16px;color:var(--muted);font-size:13.5px}
.form-note.is-error{color:#FFA3A3}

/* ---------- interior responsive ---------- */
@media (max-width:1080px){
  .phero-in,.trophy,.fee-in,.contact-grid{grid-template-columns:1fr}
  .phero-flip .phero-media,.feat-flip .feat-media{order:0}
  .phero-media img{aspect-ratio:16/10}
  .gal{grid-template-columns:repeat(2,1fr)}
  .feed{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .feat,.founder{grid-template-columns:1fr;gap:24px}
  .steps li{grid-template-columns:1fr;gap:8px}
  .step-n{padding-top:0}
  .news-item{grid-template-columns:1fr;gap:18px}
  .news-item-sm{grid-template-columns:96px 1fr;align-items:center}
  .gal{grid-template-columns:1fr;gap:12px}
  .gal-wide{grid-column:span 1}
  .gal-wide img{aspect-ratio:16/10}
  .gal-item figcaption{opacity:1;transform:none}
  .feed{grid-template-columns:1fr;gap:12px}
  .post img{aspect-ratio:16/10}
  .article-body p:first-child{font-size:18px}
  .cd{grid-template-columns:1fr;gap:6px}
  .cd-social{gap:0 20px}
  .cd-social a{min-height:48px;display:inline-flex;align-items:center}
  .latest-head{align-items:flex-start}
  .latest-link{min-height:48px;display:inline-flex;align-items:center}
}