/* ============================================================
   ARABALA — shared stylesheet
   Deep Indigo #0C1340 · Arabala Gold #C4922A · Arabala Cream #F9F7F2
   Cormorant Garamond (display) · Inter (text) · JetBrains Mono (labels)
   Brand rules honoured: three colours, no exceptions; gold is accent
   only and never a large background fill; wordmark tracking +.29em.
   Light-mode only by design — no theme reactivity.
   ============================================================ */

:root{
  --indigo:#0C1340;
  --indigo-mid:#1A2260;
  --indigo-lift:#141d5c;
  --indigo-deep:#080D2B;
  --gold:#C4922A;
  --gold-light:#DFB96A;
  --gold-text:#8A6416;
  --cream:#F9F7F2;
  --cream-dark:#F0EDE5;
  --white:#FFFFFF;
  --warm-dark:#1C1915;
  --warm-mid:#6B6560;
  --warm-light:#B5B0A8;      /* decorative only — 2.0:1 on cream, never for text */
  --warm-cap:#6F6963;        /* caption/label text — 5.06:1 on cream, 4.63:1 on cream-dark */
  --border:#E2DDD4;
  --border-soft:#EDE9E1;
  --on-dark:#F2F3F9;
  --on-dark-mid:#C3C8DD;
  --on-dark-soft:#8B93B8;
  --rule-dark:rgba(196,146,42,.26);

  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --ease-out:cubic-bezier(0.23,1,0.32,1);
  --ease-in-out:cubic-bezier(0.77,0,0.175,1);

  --gutter:24px;
  --measure:1140px;
  --nav-h:68px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 16px);-webkit-text-size-adjust:100%;}
body{
  background:var(--cream);color:var(--warm-dark);
  font-family:var(--sans);font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
::selection{background:var(--gold);color:var(--indigo);}
a{color:inherit;}
img,svg{display:block;max-width:100%;}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px;}

.wrap{max-width:var(--measure);margin:0 auto;padding:0 var(--gutter);}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--gold);color:var(--indigo);
  padding:12px 20px;font-family:var(--mono);font-size:12px;letter-spacing:1.5px;text-decoration:none;text-transform:uppercase;}
.skip:focus{left:12px;top:12px;}
.nowrap{white-space:nowrap;}

/* ---------- shared type ---------- */
.kicker{
  font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:3.4px;
  text-transform:uppercase;color:var(--gold-text);
  display:flex;align-items:center;gap:12px;
}
.kicker::before{content:"";width:22px;height:1px;background:currentColor;opacity:.55;flex:none;}
.on-dark .kicker,.kicker.light{color:var(--gold);}
h1.display,h2.display{
  font-family:var(--serif);font-weight:500;font-size:clamp(32px,4.5vw,52px);
  line-height:1.1;letter-spacing:-0.021em;color:var(--indigo);
  max-width:20ch;margin-top:18px;text-wrap:balance;
}
.display.wide{max-width:26ch;}
.on-dark h1.display,.on-dark h2.display,.display.rev{color:var(--on-dark);}
h3.sub-display{
  font-family:var(--serif);font-weight:500;font-size:clamp(25px,2.9vw,34px);
  line-height:1.18;letter-spacing:-0.016em;color:var(--indigo);
}
.lede{margin-top:20px;max-width:60ch;font-size:17px;line-height:1.72;color:var(--warm-mid);}
.on-dark .lede,.lede.rev{color:var(--on-dark-mid);}
.on-dark{background:var(--indigo);color:var(--on-dark);}
section{padding:clamp(72px,8.5vw,116px) 0;position:relative;}
section.tight{padding:clamp(56px,6vw,84px) 0;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;text-decoration:none;
  font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:1.9px;text-transform:uppercase;
  padding:16px 26px;border-radius:2px;border:1px solid transparent;
  transition:transform 140ms var(--ease-out),background-color 180ms ease,color 180ms ease,border-color 180ms ease;
  cursor:pointer;
}
.btn:active{transform:scale(.975);}
.btn .arw{transition:transform 220ms var(--ease-out);}
.btn-gold{background:var(--gold);color:var(--indigo);}
.btn-outline{border-color:rgba(255,255,255,.3);color:var(--on-dark);}
.btn-ink{border-color:var(--indigo);color:var(--indigo);}
@media(hover:hover) and (pointer:fine){
  .btn-gold:hover{background:var(--gold-light);}
  .btn-outline:hover{border-color:var(--gold);color:var(--gold-light);}
  .btn-ink:hover{background:var(--indigo);color:var(--on-dark);}
  .btn:hover .arw{transform:translateX(4px);}
}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-top:34px;}

/* ---------- nav ---------- */
nav{
  position:fixed;top:0;left:0;right:0;z-index:60;height:var(--nav-h);
  background:transparent;border-bottom:1px solid transparent;
  transition:background-color 300ms ease,border-color 300ms ease;
}
nav.stuck,body.solid-nav nav{
  background:rgba(12,19,64,.92);border-bottom-color:var(--rule-dark);
  backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);
}
.nav-inner{max-width:var(--measure);margin:0 auto;padding:0 var(--gutter);height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;gap:20px;}
.nav-brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--white);}
.nav-brand svg{width:21px;height:24px;flex:none;}
.nav-brand span{font-family:var(--serif);font-weight:500;font-size:19px;letter-spacing:.29em;}
.nav-links{display:flex;align-items:center;gap:26px;}
.nav-links a{
  font-family:var(--mono);font-size:11px;letter-spacing:1.6px;text-transform:uppercase;
  text-decoration:none;color:rgba(255,255,255,.7);transition:color 180ms ease;position:relative;
}
.nav-links a:not(.nav-cta)::after{
  content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform 240ms var(--ease-out);
}
.nav-links a[aria-current="page"]{color:var(--gold-light);}
.nav-links a[aria-current="page"]:not(.nav-cta)::after{transform:scaleX(1);}
@media(hover:hover) and (pointer:fine){
  .nav-links a:hover{color:var(--gold-light);}
  .nav-links a:not(.nav-cta):hover::after{transform:scaleX(1);}
}
.nav-cta{border:1px solid var(--gold);color:var(--gold-light)!important;padding:9px 16px;border-radius:2px;
  transition:background-color 180ms ease,color 180ms ease;}
.nav-cta::after{display:none;}
@media(hover:hover) and (pointer:fine){.nav-cta:hover{background:var(--gold);color:var(--indigo)!important;}}
.nav-links a{white-space:nowrap;}
.nav-cta .short{display:none;}
@media(max-width:940px){
  .nav-brand span{display:none;}
  .nav-links{gap:16px;}
  .nav-links a{font-size:10px;letter-spacing:1px;}
}
@media(max-width:820px){
  .nav-links a[data-drop]{display:none;}
}
/* below this the text links can no longer sit on one line — the brand and a
   single short call to action remain; every link is still in the footer. */
@media(max-width:700px){
  .nav-links a:not(.nav-cta){display:none;}
  .nav-cta{font-size:10.5px;letter-spacing:1.4px;padding:9px 14px;}
  .nav-cta .long{display:none;}
  .nav-cta .short{display:inline;}
}

/* ============================================================
   PAGE HEADERS
   ============================================================ */
header.page-hero{
  position:relative;overflow:hidden;color:var(--on-dark);
  background:
    radial-gradient(120% 90% at 78% 6%, rgba(196,146,42,.19), transparent 58%),
    radial-gradient(90% 80% at 8% 96%, rgba(40,60,160,.34), transparent 62%),
    linear-gradient(162deg,#0A1036 0%,#0C1340 46%,#141d5c 100%);
  padding:calc(var(--nav-h) + clamp(56px,7.4vw,92px)) 0 clamp(56px,7vw,88px);
}
header.page-hero.compact{padding:calc(var(--nav-h) + clamp(48px,5.6vw,72px)) 0 clamp(48px,5.6vw,72px);}
.grid-lines{position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:min(19vw,190px) 100%;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 22%,#000 74%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 22%,#000 74%,transparent);}
.arc{position:absolute;border:1px solid rgba(196,146,42,.13);border-radius:50%;pointer-events:none;
  right:-190px;top:46%;transform:translateY(-50%);width:720px;height:720px;}
.arc.two{width:520px;height:520px;right:-90px;border-color:rgba(196,146,42,.08);}
.hero{position:relative;z-index:2;}
.hero .mark{width:44px;height:49px;margin-bottom:22px;}
.hero .eyebrow{
  font-family:var(--mono);font-size:11px;letter-spacing:3.6px;text-transform:uppercase;color:var(--gold);
  display:flex;align-items:center;gap:11px;
}
.hero .eyebrow .dot{width:5px;height:5px;border-radius:50%;background:var(--gold);flex:none;
  box-shadow:0 0 0 0 rgba(196,146,42,.6);animation:pulse 3.4s var(--ease-out) infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(196,146,42,.55);}70%{box-shadow:0 0 0 9px rgba(196,146,42,0);}100%{box-shadow:0 0 0 0 rgba(196,146,42,0);}}
.hero h1{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(38px,5.3vw,66px);line-height:1.06;letter-spacing:-0.024em;
  margin:20px 0 0;max-width:17ch;color:#F5F6FB;text-wrap:balance;
}
.hero h1 em{font-style:normal;font-weight:500;color:var(--gold-light);}
.hero h1.tight{max-width:15ch;}
.hero .sub{
  margin-top:24px;max-width:56ch;font-size:clamp(16px,1.5vw,18.5px);line-height:1.7;color:var(--on-dark-mid);
}
.hero .sub b{color:#E9ECF7;font-weight:500;}

/* hero split — copy left, artwork right */
.hero-split{display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(32px,5vw,68px);align-items:center;}
@media(max-width:1000px){.hero-split{grid-template-columns:1fr;}.hero-art{display:none;}}

/* ---------- animated brand artwork ---------- */
.hero-art{position:relative;}
.hero-art svg{width:100%;height:auto;overflow:visible;}
.ha-node{fill:var(--gold);}
.ha-ring{fill:none;stroke:rgba(196,146,42,.35);stroke-width:1;}
.ha-link{fill:none;stroke:rgba(255,255,255,.16);stroke-width:1;}
.ha-pulse{fill:none;stroke:var(--gold-light);stroke-width:1.4;stroke-linecap:round;
  stroke-dasharray:26 340;animation:trace 5.2s linear infinite;}
.ha-pulse.d1{animation-delay:-1.3s;}
.ha-pulse.d2{animation-delay:-2.6s;}
.ha-pulse.d3{animation-delay:-3.9s;}
@keyframes trace{to{stroke-dashoffset:-366;}}
.ha-spin{transform-origin:center;animation:spin 58s linear infinite;}
.ha-spin.rev{animation-direction:reverse;animation-duration:76s;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ---------- proof strip ---------- */
.proof-strip{
  position:relative;z-index:2;margin-top:clamp(48px,6vw,72px);
  border-top:1px solid var(--rule-dark);padding-top:26px;
  display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr));gap:26px 34px;align-items:start;
}
.proof-strip .ps-label{
  font-family:var(--mono);font-size:10.5px;letter-spacing:2.2px;text-transform:uppercase;
  color:var(--on-dark-soft);max-width:15ch;line-height:1.75;padding-top:3px;
}
.ps-item{display:flex;flex-direction:column;gap:5px;text-decoration:none;}
.ps-item .n{font-family:var(--serif);font-weight:600;font-size:23px;color:var(--on-dark);letter-spacing:.2px;
  transition:color 180ms ease;}
.ps-item .d{font-size:13px;color:var(--on-dark-soft);line-height:1.55;}
.ps-item .u{font-family:var(--mono);font-size:10.5px;letter-spacing:1.3px;color:var(--gold);margin-top:2px;
  display:flex;align-items:center;gap:5px;transition:gap 200ms var(--ease-out);}
@media(hover:hover) and (pointer:fine){
  .ps-item:hover .n{color:var(--gold-light);}
  .ps-item:hover .u{gap:9px;}
}
@media(max-width:900px){
  .proof-strip{grid-template-columns:1fr 1fr;}
  .proof-strip .ps-label{grid-column:1/-1;max-width:none;}
}
@media(max-width:540px){.proof-strip{grid-template-columns:1fr;gap:20px;}}

/* ============================================================
   THE RACE
   ============================================================ */
.race{
  margin-top:clamp(40px,5vw,60px);
  border:1px solid var(--border);border-radius:6px;background:var(--white);
  padding:clamp(24px,3.4vw,40px);
  box-shadow:0 1px 2px rgba(28,25,21,.03),0 12px 34px -18px rgba(12,19,64,.16);
}
.race-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap;
  padding-bottom:20px;border-bottom:1px solid var(--border-soft);}
.race-head .t{font-family:var(--serif);font-weight:600;font-size:23px;color:var(--indigo);}
.race-head .s{font-family:var(--mono);font-size:10.5px;letter-spacing:1.8px;text-transform:uppercase;color:var(--warm-cap);}
.lane{padding:26px 0;border-bottom:1px solid var(--border-soft);}
.lane:last-of-type{border-bottom:0;padding-bottom:6px;}
.lane-top{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:14px;flex-wrap:wrap;}
.lane-name{font-family:var(--mono);font-size:11px;letter-spacing:2.2px;text-transform:uppercase;color:var(--warm-mid);}
.lane.us .lane-name{color:var(--gold-text);}
.lane-out{font-family:var(--serif);font-style:italic;font-size:16.5px;color:var(--warm-cap);}
.lane.us .lane-out{color:var(--indigo);font-style:normal;font-weight:600;}
.track{position:relative;height:34px;border-radius:2px;background:var(--cream-dark);overflow:hidden;}
.bar{position:absolute;top:0;bottom:0;left:0;width:100%;transform-origin:left;
  transition:transform 5200ms linear;}
.lane.them .bar{background:linear-gradient(90deg,#D6CFC2,#BDB5A7);}
.lane.us .bar{background:linear-gradient(90deg,var(--gold),var(--gold-light));
  transition-duration:640ms;transition-timing-function:var(--ease-out);}
.race.running .lane.them .bar{transform:scaleX(1);}
.race.running .lane.us .bar{transform:scaleX(.058);}
.ticks{position:absolute;inset:0;display:flex;pointer-events:none;}
.ticks span{flex:1;border-right:1px solid rgba(28,25,21,.07);}
.ticks span:last-child{border-right:0;}
.stages{margin-top:12px;display:flex;justify-content:space-between;gap:8px;}
.stages span{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.9px;text-transform:uppercase;color:var(--warm-cap);
  transition:opacity 420ms ease,transform 420ms var(--ease-out);
  flex:1;text-align:center;line-height:1.5;
}
.stages span:first-child{text-align:left;}
.stages span:last-child{text-align:right;}
.lane.us .stages span{text-align:left;color:var(--gold-text);}
.race.running .stages span{opacity:1;transform:none;}
.race.running .lane.them .stages span:nth-child(1){transition-delay:.2s;}
.race.running .lane.them .stages span:nth-child(2){transition-delay:1.1s;}
.race.running .lane.them .stages span:nth-child(3){transition-delay:2.1s;}
.race.running .lane.them .stages span:nth-child(4){transition-delay:3.2s;}
.race.running .lane.them .stages span:nth-child(5){transition-delay:4.4s;}
.race.running .lane.us .stages span{transition-delay:.45s;}
.race-foot{margin-top:24px;padding-top:20px;border-top:1px solid var(--border-soft);
  font-size:13.5px;color:var(--warm-cap);line-height:1.7;max-width:74ch;}
.race-foot b{color:var(--warm-mid);font-weight:500;}
@media(max-width:640px){
  .stages span{font-size:8.5px;letter-spacing:.4px;}
  .lane.them .stages span:nth-child(2),.lane.them .stages span:nth-child(4){display:none;}
}

/* ============================================================
   ROUTE CARDS (home → inner pages)
   ============================================================ */
.routes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:clamp(40px,5vw,56px);
  align-items:stretch;}
@media(max-width:920px){.routes{grid-template-columns:1fr;}}
.route{
  position:relative;display:flex;flex-direction:column;text-decoration:none;overflow:hidden;
  background:var(--white);border:1px solid var(--border);border-radius:6px;padding:30px 28px 26px;
  transition:transform 260ms var(--ease-out),box-shadow 260ms ease;
  box-shadow:0 1px 2px rgba(28,25,21,.03);
}
.route::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform 380ms var(--ease-out);}
@media(hover:hover) and (pointer:fine){
  .route:hover{transform:translateY(-5px);box-shadow:0 1px 2px rgba(28,25,21,.03),0 22px 44px -22px rgba(12,19,64,.26);}
  .route:hover::after{transform:scaleX(1);}
  .route:hover .go{gap:12px;color:var(--indigo);}
}
.route .r-n{font-family:var(--mono);font-size:10.5px;letter-spacing:2px;color:var(--gold-text);}
/* serif headings must not inherit the 1.65 body leading — a two-line card
   title otherwise opens a ~46px gap between its lines */
.route h3{font-family:var(--serif);font-weight:600;font-size:28px;line-height:1.18;
  color:var(--indigo);margin:14px 0 10px;letter-spacing:-.012em;}
.route p{font-size:14.5px;color:var(--warm-mid);line-height:1.7;flex:1;}
.go{
  margin-top:22px;font-family:var(--mono);font-size:11px;letter-spacing:1.6px;color:var(--gold-text);
  text-decoration:none;display:inline-flex;align-items:center;gap:7px;
  transition:gap 200ms var(--ease-out),color 180ms ease;
}
@media(hover:hover) and (pointer:fine){.go:hover{gap:12px;color:var(--indigo);}}

/* ============================================================
   COMMITMENTS / KEYS
   ============================================================ */
.keys-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(36px,5vw,72px);align-items:start;}
@media(max-width:920px){.keys-grid{grid-template-columns:1fr;}}
/* argument above, commitments in two columns below — a single tall column
   beside a short one leaves a large void at desktop widths */
.intro-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:start;}
.intro-split .metaphor{margin-top:0;}
.intro-split .lede{margin-top:22px;}
@media(max-width:920px){.intro-split{grid-template-columns:1fr;gap:26px;}}
.metaphor{
  border-left:2px solid var(--gold);padding:6px 0 6px 26px;margin-top:30px;
  font-family:var(--serif);font-weight:400;font-size:clamp(20px,2.3vw,26px);line-height:1.5;color:var(--indigo);
}
.metaphor .hi{color:var(--gold-text);font-style:italic;}
.get-list{border-top:1px solid var(--border);}
.get-list > div{padding:20px 0;border-bottom:1px solid var(--border);display:grid;grid-template-columns:34px 1fr;gap:16px;align-items:start;}
.get-list.two-col{margin-top:clamp(46px,5.5vw,70px);border-top:0;
  display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(32px,4.5vw,64px);}
.get-list.two-col > div{border-top:1px solid var(--border);border-bottom:0;}
@media(max-width:820px){
  .get-list.two-col{grid-template-columns:1fr;}
  .get-list.two-col > div:first-child{border-top:1px solid var(--border);}
}
.get-list .g-n{font-family:var(--mono);font-size:10.5px;letter-spacing:1.4px;color:var(--gold-text);padding-top:6px;}
.get-list .g-t{display:block;font-family:var(--serif);font-weight:600;font-size:20px;color:var(--indigo);line-height:1.32;}
.get-list .g-b{display:block;font-size:14.5px;color:var(--warm-mid);margin-top:6px;line-height:1.68;}

/* ---------- pillars ---------- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,42px);margin-top:clamp(44px,5vw,64px);}
.pillar{border-top:1px solid var(--rule-dark);padding-top:24px;}
.pillar .p-n{font-family:var(--mono);font-size:10.5px;letter-spacing:2px;color:var(--gold);}
.pillar h3{font-family:var(--serif);font-weight:500;font-size:clamp(27px,2.9vw,34px);line-height:1.16;
  color:var(--on-dark);margin:14px 0 10px;letter-spacing:-.014em;}
.pillar p{font-size:15px;color:var(--on-dark-mid);line-height:1.7;}
@media(max-width:860px){.pillars{grid-template-columns:1fr;gap:28px;}}
.assure{
  margin-top:clamp(44px,5.5vw,68px);
  border:1px solid var(--rule-dark);border-left:2px solid var(--gold);border-radius:4px;
  background:rgba(255,255,255,.035);padding:26px 30px;max-width:70ch;
  font-family:var(--serif);font-weight:400;font-size:clamp(19px,2.1vw,23px);line-height:1.52;color:var(--on-dark);
}

/* ============================================================
   PRODUCT SHOWCASE (work page)
   ============================================================ */
.product{padding:clamp(64px,7.5vw,104px) 0;border-top:1px solid var(--border);}
.product:first-of-type{border-top:0;}
.product .p-grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(36px,5vw,72px);align-items:center;}
.product.flip .p-grid{grid-template-columns:1.14fr .86fr;}
.product.flip .p-copy{order:2;}
.product.flip .p-shot{order:1;}
@media(max-width:960px){
  .product .p-grid,.product.flip .p-grid{grid-template-columns:1fr;gap:34px;}
  .product.flip .p-copy{order:1;}
  .product.flip .p-shot{order:2;}
}
.status{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--mono);font-size:9.5px;letter-spacing:1.7px;text-transform:uppercase;
  color:var(--gold-text);border:1px solid var(--border);border-radius:99px;padding:5px 11px;background:var(--white);
}
.status i{width:5px;height:5px;border-radius:50%;background:var(--gold);font-style:normal;flex:none;}
.product h2{font-family:var(--serif);font-weight:600;font-size:clamp(36px,4.4vw,52px);line-height:1.1;
  color:var(--indigo);margin:18px 0 4px;letter-spacing:-.018em;}
.product .tag{font-family:var(--mono);font-size:11px;letter-spacing:1.9px;text-transform:uppercase;color:var(--warm-cap);}
.product .p-body{margin-top:22px;font-size:16.5px;line-height:1.75;color:var(--warm-mid);max-width:52ch;}
.p-facts{margin-top:26px;border-top:1px solid var(--border);}
.p-facts div{display:grid;grid-template-columns:156px 1fr;gap:14px;padding:12px 0;border-bottom:1px solid var(--border);
  font-size:14px;color:var(--warm-mid);align-items:start;}
.p-facts dt{font-family:var(--mono);font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:var(--warm-cap);padding-top:3px;}
.p-facts dd{color:var(--warm-dark);}
/* a 156px label column eats nearly half a phone screen — stack instead */
@media(max-width:520px){
  .p-facts div{grid-template-columns:1fr;gap:5px;padding:14px 0;}
  .p-facts dt{padding-top:0;}
}

/* browser frame around a real screenshot */
.frame{
  border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--white);
  box-shadow:0 2px 4px rgba(28,25,21,.04),0 30px 60px -30px rgba(12,19,64,.34);
}
.frame .chrome{
  display:flex;align-items:center;gap:7px;padding:11px 14px;background:var(--cream-dark);
  border-bottom:1px solid var(--border);
}
.frame .chrome i{width:9px;height:9px;border-radius:50%;background:#D8D2C6;flex:none;}
.frame .chrome .addr{
  margin-left:8px;flex:1;background:var(--white);border:1px solid var(--border);border-radius:99px;
  font-family:var(--mono);font-size:10px;letter-spacing:.8px;color:var(--warm-cap);
  padding:4px 12px;text-align:center;
}
.frame img{width:100%;height:auto;display:block;}
.frame.phone{max-width:300px;margin:0 auto;border-radius:26px;padding:9px;background:var(--indigo);border-color:var(--indigo);}
.frame.phone img{border-radius:18px;}
.shot-note{margin-top:12px;font-family:var(--mono);font-size:9.5px;letter-spacing:1.4px;text-transform:uppercase;
  color:var(--warm-cap);text-align:center;}

/* ============================================================
   MASTER PLAN
   ============================================================ */
.plan-list{margin-top:clamp(40px,5vw,58px);counter-reset:pl;max-width:80ch;}
.plan-list li{
  list-style:none;counter-increment:pl;
  display:grid;grid-template-columns:64px 1fr;gap:20px;align-items:baseline;
  padding:24px 0;border-top:1px solid rgba(255,255,255,.09);
}
.plan-list li::before{
  content:counter(pl,decimal-leading-zero);
  font-family:var(--mono);font-size:12px;letter-spacing:1.6px;color:var(--gold);
}
.plan-list li span{
  font-family:var(--serif);font-weight:400;font-size:clamp(20px,2.4vw,28px);line-height:1.4;color:var(--on-dark);
}
.plan-wink{
  margin-top:30px;font-family:var(--serif);font-style:italic;font-size:19px;color:var(--gold-light);
  display:flex;align-items:center;gap:12px;
}
.plan-wink::before{content:"";width:34px;height:1px;background:var(--gold);opacity:.6;flex:none;}
@media(max-width:640px){.plan-list li{grid-template-columns:44px 1fr;gap:14px;}}

/* ============================================================
   Q&A
   ============================================================ */
.qa{margin-top:clamp(38px,4.5vw,52px);border-top:1px solid var(--border);max-width:84ch;}
.qa details{border-bottom:1px solid var(--border);}
.qa summary{
  list-style:none;cursor:pointer;padding:22px 44px 22px 0;position:relative;
  font-family:var(--serif);font-weight:600;font-size:clamp(19px,2.1vw,24px);line-height:1.36;color:var(--indigo);
  transition:color 180ms ease;
}
.qa summary::-webkit-details-marker{display:none;}
.qa summary::after{
  content:"";position:absolute;right:6px;top:50%;width:11px;height:11px;
  border-right:1.5px solid var(--gold-text);border-bottom:1.5px solid var(--gold-text);
  transform:translateY(-70%) rotate(45deg);transition:transform 260ms var(--ease-out);
}
.qa details[open] summary::after{transform:translateY(-20%) rotate(225deg);}
@media(hover:hover) and (pointer:fine){.qa summary:hover{color:var(--gold-text);}}
.qa .a{padding:0 44px 26px 0;font-size:15.5px;line-height:1.75;color:var(--warm-mid);max-width:70ch;}
.qa details[open] .a{animation:qaIn 320ms var(--ease-out) both;}
@keyframes qaIn{from{opacity:0;transform:translateY(-5px);}to{opacity:1;transform:none;}}

/* ============================================================
   CONTACT
   ============================================================ */
.band-dark{position:relative;overflow:hidden;color:var(--on-dark);
  background:
    radial-gradient(90% 80% at 92% 100%,rgba(196,146,42,.16),transparent 58%),
    linear-gradient(200deg,#0A1036,#0C1340 55%,#141d5c);}
.contact-grid{position:relative;z-index:2;display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(40px,6vw,84px);align-items:start;}
@media(max-width:940px){.contact-grid{grid-template-columns:1fr;}}
.direct{margin-top:32px;}
.direct a{
  font-family:var(--serif);font-size:clamp(21px,2.3vw,27px);color:var(--gold-light);text-decoration:none;
  border-bottom:1px solid rgba(223,185,106,.3);padding-bottom:3px;transition:border-color 200ms ease,color 200ms ease;}
@media(hover:hover) and (pointer:fine){.direct a:hover{color:var(--white);border-color:var(--gold);}}
.team{margin-top:46px;display:grid;grid-template-columns:1fr 1fr;gap:26px;max-width:440px;}
.team div{border-top:1px solid var(--rule-dark);padding-top:14px;}
.team .name{font-family:var(--serif);font-weight:600;font-size:19px;color:var(--on-dark);}
.team .role{font-family:var(--mono);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-top:5px;}
@media(max-width:480px){.team{grid-template-columns:1fr;}}

form{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.12);border-radius:6px;
  padding:clamp(24px,3vw,34px);}
.f-row{margin-bottom:20px;}
.f-row:last-of-type{margin-bottom:26px;}
label{display:block;font-family:var(--mono);font-size:10px;letter-spacing:2px;text-transform:uppercase;
  color:var(--gold);margin-bottom:9px;}
label .opt{color:var(--on-dark-soft);letter-spacing:1.4px;}
input,textarea,select{
  width:100%;font-family:var(--sans);font-size:15px;line-height:1.6;color:var(--on-dark);
  background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.16);border-radius:3px;
  padding:13px 14px;transition:border-color 180ms ease,background-color 180ms ease;
}
select{appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23C4922A' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:38px;cursor:pointer;}
select option{background:var(--indigo);color:var(--on-dark);}
textarea{resize:vertical;min-height:104px;}
input::placeholder,textarea::placeholder{color:rgba(255,255,255,.32);}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--gold);background:rgba(255,255,255,.08);}
form .btn{width:100%;justify-content:center;}
.f-error{font-size:13.5px;line-height:1.6;color:var(--gold-light);margin-bottom:14px;min-height:0;}
.f-error:empty{display:none;}
[aria-invalid="true"]{border-color:var(--gold-light)!important;}
.f-note{margin-top:14px;font-size:12.5px;line-height:1.65;color:var(--on-dark-soft);}
.f-note a{color:var(--gold-light);}

/* closing CTA band used at the foot of inner pages */
.closer{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap;}
.closer h2{font-family:var(--serif);font-weight:500;font-size:clamp(28px,3.6vw,42px);line-height:1.14;
  letter-spacing:-.018em;color:var(--on-dark);max-width:18ch;text-wrap:balance;}
.closer .cta-row{margin-top:0;}

/* ---------- footer ---------- */
footer{background:var(--indigo-deep);color:#8089AD;border-top:1px solid rgba(196,146,42,.16);padding:36px 0 30px;}
.foot-inner{max-width:var(--measure);margin:0 auto;padding:0 var(--gutter);}
.foot-top{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
  padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.07);}
.foot-brand{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.foot-brand svg{width:17px;height:19px;}
.foot-brand .wm{font-family:var(--serif);font-weight:500;font-size:15px;letter-spacing:.29em;color:#E8EAF4;}
.foot-tag{font-family:var(--serif);font-style:italic;font-size:13px;color:var(--gold-light);letter-spacing:.6px;}
.foot-nav{display:flex;gap:22px;flex-wrap:wrap;}
.foot-nav a{font-family:var(--mono);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;
  text-decoration:none;color:#8089AD;transition:color 180ms ease;}
@media(hover:hover) and (pointer:fine){.foot-nav a:hover{color:var(--gold-light);}}
.foot-legal{margin-top:20px;font-family:var(--mono);font-size:10px;letter-spacing:1.2px;line-height:1.9;}
.foot-legal span{display:block;}

/* ---------- reveal ----------
   The hidden initial state is applied ONLY when the .js class is present, which
   an inline head script sets. If JavaScript is off, blocked, or site.js fails to
   load, every .rv element stays fully visible instead of rendering a blank page. */
.js .rv{opacity:0;transform:translateY(16px);
  transition:opacity 620ms var(--ease-out),transform 620ms var(--ease-out);}
.js .rv.in{opacity:1;transform:none;}
/* :not(.running) keeps these from outranking the .race.running reveal rules,
   which sit earlier in the file at the same specificity. */
.js .race:not(.running) .lane .bar{transform:scaleX(0);}
.js .race:not(.running) .stages span{opacity:0;transform:translateY(4px);}
/* no-JS resting state for the timeline panel */
.lane.them .bar{transform:scaleX(1);}
.lane.us .bar{transform:scaleX(.058);}
[data-stagger] > .rv:nth-child(1){transition-delay:0ms;}
[data-stagger] > .rv:nth-child(2){transition-delay:70ms;}
[data-stagger] > .rv:nth-child(3){transition-delay:140ms;}
[data-stagger] > .rv:nth-child(4){transition-delay:210ms;}
[data-stagger] > .rv:nth-child(5){transition-delay:280ms;}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .rv{transform:none;transition:opacity 240ms ease;}
  .hero .eyebrow .dot,.ha-pulse,.ha-spin{animation:none;}
  .bar{transition:none!important;}
  .stages span{opacity:1!important;transform:none!important;transition:none!important;}
  .qa details[open] .a{animation:none;}
  .btn,.route,.ps-item .u,.go,.nav-links a::after{transition:none;}
}