/* Grateful Prints Investor Experience v10.
   Type scale, containers, section rhythm, buttons, cards and media treatment follow computed styles measured on the
   reference page (2026-10-07, 390 and 1440 px). Colors follow /GP-BRANDING. Manrope for headings, navigation, metrics
   and UI; Inter for longer text (Neil, 10-07). Weights stop at 600 and labels are sentence case. */
@font-face{font-family:"Manrope";src:url("manrope.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("inter.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{
  /* brand */
  --gp-cobalt:#1565E0; --gp-cobalt-strong:#0F52BD; --gp-navy:#0B1F4B; --gp-navy-deep:#081838;
  --gp-sky:#7DB0FF; --gp-yellow:#FACC15; --gp-tint:#EDF3FD; --gp-white:#fff;
  /* neutrals: reference #111 / #555 / #FAFAFA, tinted to GP navy */
  --ink:#0B1F4B; --text:#4A5468; --muted:#5F6B82; --bg-alt:#FAFAFA;
  --line:rgba(11,31,75,.08); --line-strong:rgba(11,31,75,.16);
  --on-dark:rgba(255,255,255,.82); --on-dark-muted:rgba(255,255,255,.66); --line-dark:rgba(255,255,255,.12);
  /* aliases kept for inline styles in older markup */
  --gp-text:var(--text); --gp-muted:var(--muted); --gp-ink:var(--ink); --gp-soft:var(--bg-alt); --gp-line:#E6E9F0;
  /* type: 390 px value -> 1440 px value */
  --font:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --gp-display:var(--font); --gp-body:var(--font-body);
  --fs-h1:clamp(1.8125rem,1.186rem + 2.571vw,3.5rem);      /* 29 -> 56 */
  --fs-h2:clamp(1.625rem,1.3rem + 1.333vw,2.5rem);         /* 26 -> 40 */
  --fs-h3:clamp(1.1875rem,1.118rem + .286vw,1.375rem);     /* 19 -> 22 */
  --fs-lead:clamp(1rem,.954rem + .19vw,1.125rem);          /* 16 -> 18 */
  --fs-hero-sub:clamp(1rem,.93rem + .286vw,1.1875rem);     /* 16 -> 19 */
  --fs-body:clamp(1rem,.985rem + .06vw,1.03125rem);        /* 16 -> 16.5 */
  --fs-label:.8125rem;                                     /* 13 */
  /* layout */
  --w-wide:1040px; --w-narrow:760px; --w-hero:920px; --w-lead:680px; --w-media:880px;
  --pad-x:18px;
  --sec-top:clamp(44px,31px + 3.2vw,78px); --sec-bot:clamp(52px,42px + 2.5vw,78px);
  --head-gap:clamp(28px,22px + 1.6vw,44px);
  /* surfaces */
  --radius:12px; --pill:100px;
  --shadow-card:0 12px 32px rgba(11,31,75,.08);
  --shadow-media:0 24px 60px rgba(11,31,75,.16);
  --shadow-dark:0 30px 80px rgba(0,0,0,.45);
  --ease:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
}
@media (min-width:600px){:root{--pad-x:24px}}
@media (min-width:768px){:root{--radius:16px}}

/* Base */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{margin:0;background:#fff;color:var(--text);font:400 var(--fs-body)/1.68 var(--font-body);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
b,strong{font-weight:600}
a{color:var(--gp-cobalt);text-underline-offset:3px}
a:hover{color:var(--gp-cobalt-strong)}
:focus-visible{outline:3px solid var(--gp-cobalt);outline-offset:3px}
.hdr :focus-visible,.hero :focus-visible,#story :focus-visible,.navy :focus-visible,footer :focus-visible{outline-color:var(--gp-yellow)}
.navy form :focus-visible,.navy .thanks :focus-visible{outline-color:var(--gp-cobalt)}
.skip{position:absolute;left:-999px;top:8px;background:#fff;color:var(--ink);padding:10px 16px;border-radius:var(--pill);z-index:100;font-weight:500}
.skip:focus{left:16px}
.wrap{width:100%;max-width:var(--w-wide);margin:0 auto;padding:0 var(--pad-x)}
p{margin:0 0 14px}
.small{font-size:13px;line-height:1.55}
.muted{color:var(--muted)}
.read{max-width:var(--w-lead)}

/* Header: dark, continuous with the hero */
.hdr{position:sticky;top:0;z-index:50;background:rgba(11,31,75,.97);border-bottom:1px solid rgba(255,255,255,.08)}
@supports ((-webkit-backdrop-filter:blur(8px)) or (backdrop-filter:blur(8px))){.hdr{background:rgba(11,31,75,.9);-webkit-backdrop-filter:saturate(1.3) blur(10px);backdrop-filter:saturate(1.3) blur(10px)}}
.hdr .wrap{display:flex;align-items:center;gap:12px;min-height:60px;max-width:1200px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;font-weight:600;font-size:15px;line-height:1.15;white-space:nowrap}
.brand:hover{color:#fff}
.brand img{width:34px;height:34px;border-radius:9px}
.brand small{display:block;font-weight:400;font-size:12px;color:var(--on-dark-muted)}
@media (max-width:479px){.brand span{display:none}}
.nav{display:none;margin-left:auto;gap:2px}
.nav a{color:var(--on-dark);text-decoration:none;font-weight:500;font-size:14px;padding:8px 11px;border-radius:var(--pill);transition:color .3s var(--ease),background-color .3s var(--ease)}
.nav a:hover,.nav a[aria-current="true"]{color:#fff;background:rgba(255,255,255,.08)}
.hdr .btn{margin-left:auto;white-space:nowrap}
.menu-btn{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;border:1px solid rgba(255,255,255,.22);background:transparent;border-radius:var(--pill);color:#fff;cursor:pointer}
.hdr .mnav{display:none;border-top:1px solid rgba(255,255,255,.08);padding:6px var(--pad-x) 16px}
.hdr .mnav.open{display:block}
.mnav a{display:block;padding:13px 4px;color:#fff;text-decoration:none;font-weight:500;border-bottom:1px solid rgba(255,255,255,.07)}
.mnav a:last-child{border-bottom:0}
@media (min-width:1024px){.nav{display:flex}.hdr .btn{margin-left:8px}.menu-btn,.mnav{display:none!important}}

/* Buttons: pill system (primary, secondary, text) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 30px;border-radius:var(--pill);border:1px solid transparent;font:600 16px/1.15 var(--font);letter-spacing:.01em;text-align:center;text-decoration:none;cursor:pointer;transition:background-color .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:none}
.btn-primary{background:var(--gp-cobalt);color:#fff}
.btn-primary:hover{background:var(--gp-cobalt-strong);color:#fff;box-shadow:0 10px 24px rgba(21,101,224,.26)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn-ghost:hover{background:#fff;color:var(--gp-cobalt);border-color:var(--gp-cobalt)}
.hero .btn-ghost,#story .btn-ghost,.navy .btn-ghost,.btn-onnavy{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)}
.hero .btn-ghost:hover,#story .btn-ghost:hover,.navy .btn-ghost:hover,.btn-onnavy:hover{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.6)}
.btn-light{background:#fff;color:var(--ink)}
.btn-light:hover{background:var(--gp-tint);color:var(--ink)}
.btn-sm{min-height:44px;padding:0 22px;font-size:14px}
.btn-lg{min-height:60px;padding:0 40px;font-size:17px}
.btn-text{display:inline-flex;align-items:center;gap:10px;min-height:44px;font:600 15px/1.2 var(--font);color:var(--gp-cobalt);text-decoration:none}
.btn-text::after{content:"";width:7px;height:7px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);transition:transform .3s var(--ease)}
.btn-text:hover{color:var(--gp-cobalt-strong)}
.btn-text:hover::after{transform:translateX(3px) rotate(45deg)}
.cta-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
@media (max-width:600px){.hero .cta-row .btn,.navy .cta-row .btn{width:100%}.btn-lg{padding:0 28px}}

/* Type */
h1,h2,h3{color:var(--ink);margin:0;font-weight:600;overflow-wrap:break-word}
.display{font-size:var(--fs-h2);line-height:1.14;letter-spacing:-.025em;font-weight:600;max-width:var(--w-narrow);text-wrap:balance}
h3{font-size:var(--fs-h3);line-height:1.25;letter-spacing:-.01em}
.eyebrow{display:block;font-size:var(--fs-label);font-weight:500;letter-spacing:.01em;line-height:1.4;color:var(--gp-cobalt-strong);margin:0 0 12px}
.lead,.body-lead{font-size:var(--fs-lead);line-height:1.7;color:var(--text);max-width:var(--w-lead)}
.body-lead{margin:16px 0 0}
.line-accent{display:block;color:var(--gp-cobalt)}
.navy .line-accent{color:var(--gp-sky)}
.sec-head{max-width:var(--w-narrow);margin-bottom:var(--head-gap)}
.sec-head .lead{margin:16px auto 0}
/* every section header is centered */
.wrap > .eyebrow,.wrap > .display,.wrap > .body-lead,.wrap > .lead,.wrap > .sec-head{text-align:center;margin-left:auto;margin-right:auto}

/* Sections */
section{padding:var(--sec-top) 0 var(--sec-bot);scroll-margin-top:60px}
.alt{background:var(--bg-alt)}
.navy{background:var(--gp-navy);color:var(--on-dark)}
.navy h2,.navy h3,.navy .display{color:#fff}
.navy .eyebrow{color:var(--gp-yellow)}
.navy .muted{color:var(--on-dark-muted)}
.navy .body-lead,.navy .lead{color:var(--on-dark)}
.navy p.muted a{color:#fff}
.two-col{display:grid;gap:40px;align-items:center}

/* Status labels: text plus a dot, never colour alone */
.tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;letter-spacing:.01em;line-height:1.3;padding:5px 11px;border-radius:var(--pill);white-space:nowrap}
.tag::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:currentColor}
.tag-live{background:#E6F0FF;color:#0B4FB3}
.tag-pilot{background:#FFF4C2;color:#6B5200}
.tag-dev{background:#EEF0F4;color:#3E4A63}
.tag-planned{background:#fff;color:#56627C;box-shadow:inset 0 0 0 1px #C9D1DF}
.tag-planned::before{background:transparent;box-shadow:inset 0 0 0 1.5px currentColor}
.navy .tag-planned{background:transparent;color:#C9D4EA;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.legend{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 16px;margin:20px auto 0;font-size:14px;color:var(--muted)}
.legend div{display:flex;gap:8px;align-items:center}

/* Hero: dark band, centered (reference hero 920 px, H1 56/29 px) */
.hero{background:var(--gp-navy);box-shadow:0 2px 0 var(--gp-navy);color:var(--on-dark);text-align:center;padding:clamp(48px,28px + 4.5vw,96px) 0 clamp(40px,28px + 2.5vw,64px)}
.hero .wrap{max-width:var(--w-hero)}
.hero .eyebrow{color:var(--gp-yellow);margin-bottom:16px}
.hero-title{font-size:var(--fs-h1);line-height:1.06;letter-spacing:-.03em;font-weight:600;color:#fff;max-width:800px;margin:0 auto 20px;text-wrap:balance}
.hero-problem{display:block;color:#fff}
.hero-answer{display:block;color:var(--gp-sky);margin-top:.08em}
.hero-lead{font-size:var(--fs-hero-sub);line-height:1.6;color:var(--on-dark);max-width:600px;margin:0 auto 32px}
.strip{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 20px;margin:28px 0 0;padding:0;list-style:none;font-size:13px;font-weight:500;color:var(--on-dark-muted)}
.strip-live{display:flex;align-items:center;gap:8px;color:#fff}
.strip-live::before{content:"";width:8px;height:8px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 4px rgba(34,197,94,.18)}
.strip a{color:#fff;text-decoration:none;border-bottom:1.5px solid var(--gp-yellow);padding-bottom:2px}
.strip a:hover{color:var(--gp-yellow)}
/* room and 404 heroes */
.hero .display,.hero .lead{margin-left:auto;margin-right:auto}
.hero .display{color:#fff}
.hero h1.display{font-size:var(--fs-h1);line-height:1.06;letter-spacing:-.03em}
.hero .lead{color:var(--on-dark);margin-top:16px}
.hero .legend{color:var(--on-dark-muted);margin-top:24px}

/* Investor story: continues the dark hero, video framed like the reference */
#story{background:var(--gp-navy);color:var(--on-dark);padding-top:0}
#story .eyebrow{color:var(--gp-yellow)}
#story .display{color:#fff}
#story .lead{color:var(--on-dark)}
#story .muted{color:var(--on-dark-muted)}
#story .small{text-align:center}
.video{position:relative;aspect-ratio:16/9;max-width:var(--w-media);margin:0 auto;border-radius:var(--radius);overflow:hidden;background:#06122C;border:1px solid rgba(255,255,255,.16);box-shadow:var(--shadow-dark)}
.video button{all:unset;box-sizing:border-box;cursor:pointer;position:absolute;inset:0;display:grid;place-items:center}
.video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.92}
/* round play button, centered; duration in a corner chip */
.video .play{position:relative;display:grid;place-items:center;width:clamp(56px,44px + 3vw,88px);aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.96);box-shadow:0 12px 32px rgba(0,0,0,.35),0 0 0 8px rgba(255,255,255,.16);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.video button:hover .play{transform:scale(1.08);box-shadow:0 14px 36px rgba(0,0,0,.4),0 0 0 12px rgba(255,255,255,.2)}
.video .play svg{width:42%;height:42%;margin-left:7%;fill:var(--gp-cobalt)}
.video .play-time{position:absolute;right:12px;bottom:12px;padding:4px 10px;border-radius:var(--pill);background:rgba(6,18,44,.78);color:#fff;font-size:13px;font-weight:500;line-height:1.4;font-variant-numeric:tabular-nums}
.video button:focus-visible .play{outline:3px solid var(--gp-yellow);outline-offset:3px}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media (max-width:600px){.video .play{box-shadow:0 10px 24px rgba(0,0,0,.35),0 0 0 6px rgba(255,255,255,.16)}.video .play-time{right:8px;bottom:8px;padding:2px 8px;font-size:12px}}
.chapters{display:grid;gap:0 24px;max-width:var(--w-media);margin:20px auto 0;padding:0;list-style:none;font-size:14px}
@media (min-width:768px){.chapters{grid-template-columns:repeat(3,1fr)}}
.chapters li{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--line-dark);color:var(--on-dark)}
.chapters b{color:var(--gp-sky);font-variant-numeric:tabular-nums;min-width:40px}

/* 01 Problem */
.chain{display:flex;flex-direction:column;list-style:none;margin:var(--head-gap) auto 0;padding:0;max-width:260px}
.chain li{position:relative;font-weight:500;font-size:16px;color:var(--ink);padding:10px 0 10px 28px;border-left:2px solid rgba(11,31,75,.14)}
.chain li::before{content:"";position:absolute;left:-7px;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;background:#fff;border:2px solid var(--gp-cobalt)}
@media (min-width:768px){
  .chain{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 0;max-width:var(--w-wide)}
  .chain li{border:1px solid var(--line);padding:10px 18px;background:#fff;border-radius:var(--pill);font-size:15px;box-shadow:0 4px 14px rgba(11,31,75,.04)}
  .chain li::before{display:none}
  .chain li:not(:last-child){margin-right:34px}
  .chain li:not(:last-child)::after{content:"";position:absolute;right:-27px;top:50%;width:20px;height:1.5px;background:rgba(11,31,75,.25)}
  .chain li:not(:last-child)::before{display:block;content:"";position:absolute;right:-27px;left:auto;top:50%;width:7px;height:7px;margin-top:-3.5px;border:0;border-top:1.5px solid rgba(11,31,75,.35);border-right:1.5px solid rgba(11,31,75,.35);border-radius:0;background:none;transform:rotate(45deg)}
}
.reveal-lines{max-width:var(--w-narrow);margin:clamp(36px,5vw,64px) auto 0;text-align:center}
.reveal-lines p{font-weight:500;font-size:clamp(1.25rem,1.05rem + .9vw,1.75rem);line-height:1.3;letter-spacing:-.015em;color:var(--muted);margin:0 0 6px}
.reveal-lines .payoff{margin-top:18px;font-weight:600;font-size:clamp(1.875rem,1.45rem + 1.8vw,3rem);line-height:1.08;letter-spacing:-.03em;color:var(--gp-cobalt);text-wrap:balance}

/* 02 Solution (dark band, single centered column) */
#solution .two-col{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:32px}
#solution .two-col .eyebrow,#solution .two-col .display,#solution .two-col .body-lead{margin-left:auto;margin-right:auto}
.roles-line{list-style:none;margin:28px auto 0;padding:0;max-width:620px}
.roles-line li{padding:13px 0;border-top:1px solid var(--line-dark);color:var(--on-dark);font-size:15.5px}
.roles-line li:last-child{border-bottom:1px solid var(--line-dark)}
.roles-line b{display:block;color:#fff;font-size:16px;margin-bottom:2px}
.eco{position:relative;width:100%;max-width:420px;margin:0 auto;aspect-ratio:1/1}
.eco svg{width:100%;height:100%;display:block}
.navy .eco g text{fill:#E6ECF8}
.navy .eco circle[fill="none"]{stroke:rgba(255,255,255,.14)}
.manifesto{font-weight:600;letter-spacing:-.03em;font-size:var(--fs-h1);line-height:1.06;color:#fff;text-align:center;margin:clamp(32px,5vw,64px) auto 0;text-wrap:balance}
.manifesto span{color:var(--gp-yellow)}

/* 03 Product proof + investor demo */
.platforms{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 18px;list-style:none;margin:20px 0 0;padding:0;font-weight:500;font-size:15px}
.platforms a{color:var(--ink);text-decoration:none;border-bottom:1.5px solid var(--gp-yellow);padding-bottom:2px}
.platforms a:hover{color:var(--gp-cobalt)}
.demo{display:grid;gap:40px;align-items:center;max-width:var(--w-wide);margin:var(--head-gap) auto 0}
@media (min-width:960px){.demo{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:56px}}
.demo-media{display:flex;justify-content:center;min-width:0}
.device{position:relative;width:min(100%,340px);padding:30px 9px 9px;border-radius:40px;background:var(--gp-navy);box-shadow:var(--shadow-media)}
.device-badge{position:absolute;top:8px;left:50%;transform:translateX(-50%);font:500 12px/1.3 var(--font);letter-spacing:.01em;color:#fff;white-space:nowrap}
.device-badge::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--gp-yellow);margin-right:7px;vertical-align:1px}
.device .screen{position:relative;overflow:hidden;border-radius:30px;background:#fff;aspect-ratio:var(--ar,600/1298)}
.device .screen img{width:100%;height:100%;object-fit:cover;object-position:top;transition:opacity .2s}
.device .screen img.loading{opacity:.35}
@media (max-width:479px){.device{width:100%;padding:26px 5px 5px;border-radius:28px}.device .screen{border-radius:22px}}
.screen-tap{position:absolute;inset:0;z-index:1;border:0;padding:0;background:transparent;cursor:pointer}
.hotspot{position:absolute;z-index:2;border:0;padding:0;background:rgba(250,204,21,.12);cursor:pointer;border-radius:12px;box-shadow:0 0 0 3px var(--gp-yellow),0 0 0 7px rgba(250,204,21,.3);animation:gp-pulse 1.8s ease-in-out infinite}
.hotspot::after{content:"";position:absolute;inset:-8px -4px}
.hotspot.nudge{animation:gp-nudge .45s ease-in-out 2}
.hotspot:focus-visible{outline:3px solid var(--gp-cobalt);outline-offset:3px}
@keyframes gp-pulse{0%,100%{box-shadow:0 0 0 3px var(--gp-yellow),0 0 0 5px rgba(250,204,21,.35)}50%{box-shadow:0 0 0 3px var(--gp-yellow),0 0 0 12px rgba(250,204,21,0)}}
@keyframes gp-nudge{50%{transform:scale(1.06)}}
.demo-toast{position:absolute;left:10px;right:10px;bottom:12px;z-index:3;background:var(--gp-navy);color:#fff;font:400 13px/1.45 var(--font-body);padding:12px 14px;border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.3)}
.demo-toast b{color:var(--gp-yellow)}
.demo-content{min-width:0;width:100%;max-width:520px;margin:0 auto}
.demo-progress{height:4px;background:rgba(11,31,75,.08);border-radius:4px;overflow:hidden;margin-bottom:20px}
.demo-progress span{display:block;height:100%;width:11%;background:var(--gp-cobalt);border-radius:4px;transition:width .35s var(--ease)}
.demo-title{font-size:clamp(1.375rem,1.2rem + .8vw,1.75rem);font-weight:600;letter-spacing:-.02em;line-height:1.2;margin:0 0 12px}
.demo-desc{font-size:var(--fs-lead);line-height:1.7;color:var(--text);margin:0 0 16px}
.demo-status{margin:0 0 14px}
.demo-points{list-style:none;margin:0 0 24px;padding:0}
.demo-points:empty{display:none}
.demo-points li{position:relative;padding:9px 0 9px 28px;border-bottom:1px solid var(--line)}
.demo-points li::before{content:"";position:absolute;left:4px;top:16px;width:11px;height:6px;border-left:2px solid var(--gp-cobalt);border-bottom:2px solid var(--gp-cobalt);transform:rotate(-45deg)}
.demo-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 16px;max-width:400px}
.demo-bar button{min-height:48px;min-width:96px;padding:0 22px;border:1px solid var(--line-strong);background:#fff;border-radius:var(--pill);font:600 15px/1 var(--font);letter-spacing:.01em;color:var(--ink);cursor:pointer;transition:background-color .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease)}
.demo-bar button:hover:not(:disabled){border-color:var(--gp-cobalt);color:var(--gp-cobalt)}
.demo-bar button:disabled{opacity:.4;cursor:default}
.demo-bar #demo-next{background:var(--gp-cobalt);border-color:var(--gp-cobalt);color:#fff}
.demo-bar #demo-next:hover:not(:disabled){background:var(--gp-cobalt-strong);border-color:var(--gp-cobalt-strong);color:#fff}
.demo-count{font:500 14px/1 var(--font);color:var(--muted);text-align:center}
.demo-note{margin:0 0 10px;max-width:460px}
@media (max-width:959px){.demo-bar{margin-left:auto;margin-right:auto}.demo-content > .btn-text{display:flex;width:max-content;margin:0 auto}}

/* Roles */
.tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;background:#fff;padding:5px;border-radius:var(--pill);border:1px solid var(--line);max-width:640px;margin:28px auto 40px;box-shadow:0 4px 14px rgba(11,31,75,.04)}
.tabs button{all:unset;box-sizing:border-box;cursor:pointer;text-align:center;min-height:44px;display:grid;place-items:center;border-radius:var(--pill);font-family:var(--font);font-weight:500;font-size:14px;color:var(--ink);padding:0 6px;transition:background-color .3s var(--ease),color .3s var(--ease)}
.tabs button:hover{color:var(--gp-cobalt)}
@media (max-width:559px){.tabs{display:flex;flex-wrap:wrap;justify-content:center;border-radius:26px}.tabs button{flex:1 1 calc(33.333% - 4px)}}
@media (min-width:640px){.tabs button{font-size:15px}}
.tabs button[aria-selected="true"]{background:var(--gp-cobalt);color:#fff}
.tabs button:focus-visible{outline:3px solid var(--gp-cobalt);outline-offset:2px}
.role{display:grid;gap:36px;align-items:center;max-width:var(--w-wide);margin:0 auto}
@media (min-width:960px){.role{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:56px}}
.role-media{margin:0;display:flex;flex-direction:column;align-items:center;min-width:0}
.phone{width:min(100%,320px);margin:0 auto;border-radius:38px;padding:9px;background:var(--gp-navy);box-shadow:var(--shadow-media)}
.phone img{border-radius:29px;width:100%;background:#fff}
.cap{font-size:12px;color:var(--muted);text-align:center;margin-top:14px}
.role-body{min-width:0;width:100%;max-width:520px;margin:0 auto}
.role-body .tagline{font-weight:600;letter-spacing:-.025em;color:var(--ink);font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem);line-height:1.12;margin:14px 0 12px}
.role-body > p{font-size:var(--fs-lead);line-height:1.7}
.role-body ul{list-style:none;margin:18px 0 0;padding:0}
.role-body li{position:relative;padding:10px 0 10px 28px;border-bottom:1px solid var(--line)}
.role-body li::before{content:"";position:absolute;left:4px;top:18px;width:11px;height:6px;border-left:2px solid var(--gp-cobalt);border-bottom:2px solid var(--gp-cobalt);transform:rotate(-45deg)}

/* 04 How an order moves */
.flow{list-style:none;margin:var(--head-gap) auto 0;padding:0;counter-reset:f;display:grid;gap:0;max-width:440px}
.flow li{position:relative;padding:0 0 26px 52px}
.flow li::before{counter-increment:f;content:counter(f,decimal-leading-zero);position:absolute;left:0;top:0;width:36px;height:36px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1.5px var(--gp-cobalt);display:grid;place-items:center;font:600 13px/1 var(--font);color:var(--gp-cobalt)}
.flow li::after{content:"";position:absolute;left:17px;top:42px;bottom:4px;width:1.5px;background:rgba(11,31,75,.14)}
.flow li:last-child::after{display:none}
.flow b{display:block;font-size:16px;color:var(--ink);padding-top:6px}
.flow span{display:block;font-size:14.5px;color:var(--muted);margin-top:2px;line-height:1.55}
@media (min-width:1100px){
  .flow{grid-template-columns:repeat(8,minmax(0,1fr));column-gap:12px;max-width:var(--w-wide)}
  .flow li{padding:52px 0 0;text-align:center}
  .flow li::before{left:50%;transform:translateX(-50%)}
  .flow li::after{left:calc(50% + 24px);right:calc(-50% + 18px);top:18px;bottom:auto;width:auto;height:1.5px}
  .flow b{font-size:15px}
  .flow span{font-size:13.5px}
}

/* Cards (reference: radius 12 to 16, 1 px hairline, soft shadow) */
.status-board > li,.model-now,.stats > li,.diff > li,.road > div,#invest .split > div{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-card)}

/* 05 Traction */
.status-board{list-style:none;margin:28px auto 0;padding:0;display:grid;gap:16px;max-width:var(--w-wide)}
@media (min-width:768px){.status-board{grid-template-columns:1fr 1fr;gap:20px}}
.status-board > li{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:24px}
.status-board h3{margin-bottom:8px}
.status-board p{margin:0 0 10px;font-size:15.5px;line-height:1.65}
.src{display:block;font-size:12.5px;line-height:1.5;color:var(--muted)}
.note{max-width:var(--w-narrow);margin:32px auto 0;padding:20px 24px 20px 28px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:inset 4px 0 0 var(--gp-yellow);font-size:15.5px;line-height:1.7}
.note b{color:var(--ink)}

/* 06 Business model */
.money-flow{list-style:none;margin:var(--head-gap) auto 0;padding:0;display:flex;flex-direction:column;align-items:center;gap:10px;max-width:var(--w-wide)}
.money-flow li{font-weight:500;font-size:15px;color:var(--ink);padding:12px 22px;border-radius:var(--pill);border:1px solid var(--line-strong);background:#fff;text-align:center;min-width:220px}
.money-flow li.fee{background:var(--gp-cobalt);border-color:var(--gp-cobalt);color:#fff}
@media (min-width:768px){
  .money-flow{flex-direction:row;justify-content:center;gap:0}
  .money-flow li{flex:1 1 0;min-width:0;position:relative}
  .money-flow li:not(:last-child){margin-right:34px}
  .money-flow li:not(:last-child)::after{content:"";position:absolute;right:-27px;top:50%;width:20px;height:1.5px;background:rgba(11,31,75,.25)}
}
.model{display:grid;gap:20px;max-width:var(--w-wide);margin:clamp(32px,5vw,48px) auto 0}
@media (min-width:960px){.model{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.model-now,.model-next{padding:28px 24px}
.model-next{border:1.5px dashed rgba(11,31,75,.2);border-radius:var(--radius)}
.model-label{margin:0 0 14px}
.model h3{margin-bottom:10px}
.model-next ul{list-style:none;margin:0;padding:0}
.model-next li{padding:12px 0;border-bottom:1px solid var(--line)}
.model-next li:last-child{border-bottom:0;padding-bottom:0}
.model-next b{display:block;color:var(--ink)}
.model-next span{font-size:15px;color:var(--muted)}

/* 07 Platform thesis (dark band) */
.thesis{display:grid;gap:12px;max-width:var(--w-wide);margin:var(--head-gap) auto 0;text-align:center}
.thesis .term{display:flex;flex-direction:column;align-items:center;gap:10px;padding:24px 20px;background:rgba(255,255,255,.04);border:1px solid var(--line-dark);border-radius:var(--radius)}
.thesis .term b{font-size:var(--fs-h3);font-weight:600;letter-spacing:-.015em;color:#fff;line-height:1.2}
.thesis .term span:not(.tag){color:var(--on-dark-muted);font-size:14.5px;line-height:1.6}
.thesis .op{font:500 28px/1 var(--font);color:var(--gp-yellow);justify-self:center;align-self:center}
.thesis .result{border-color:rgba(250,204,21,.45)}
.thesis .result b{color:var(--gp-yellow);font-size:clamp(1.375rem,1.15rem + 1vw,1.75rem);letter-spacing:-.025em}
@media (min-width:1100px){.thesis{grid-template-columns:1fr auto 1fr auto 1fr auto 1.15fr;column-gap:12px;align-items:stretch}}

/* 08 Why now */
.stats{list-style:none;margin:var(--head-gap) auto 0;padding:0;display:grid;gap:16px;max-width:var(--w-wide);text-align:center}
@media (min-width:900px){.stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}}
.stats > li{padding:28px 24px}
.stat{display:block;font-weight:600;letter-spacing:-.035em;font-size:clamp(2.25rem,1.9rem + 1.5vw,3rem);line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;margin-bottom:14px}
.stats p{font-size:15.5px;line-height:1.65;margin:0 auto 12px;max-width:34ch}
#why > .wrap > .small{text-align:center;max-width:var(--w-lead);margin:28px auto 0}

/* 09 Differentiation */
.diff{list-style:none;margin:var(--head-gap) auto 0;padding:0;counter-reset:d;display:grid;gap:16px;max-width:var(--w-wide)}
@media (min-width:768px){.diff{grid-template-columns:1fr 1fr;gap:20px}}
@media (min-width:1024px){.diff{grid-template-columns:repeat(3,minmax(0,1fr))}}
.diff > li{padding:24px}
.diff > li::before{counter-increment:d;content:counter(d,decimal-leading-zero);display:block;font:600 13px/1 var(--font);color:var(--gp-cobalt);letter-spacing:.04em;margin-bottom:14px}
.diff b{display:block;font-size:clamp(1.0625rem,1rem + .3vw,1.25rem);font-weight:600;letter-spacing:-.01em;line-height:1.3;color:var(--ink);margin-bottom:8px}
.diff span{display:block;font-size:15px;line-height:1.65;color:var(--text)}

/* 10 Founder */
.founder{display:grid;gap:40px;align-items:center;max-width:var(--w-wide);margin:0 auto}
@media (min-width:960px){.founder{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);column-gap:56px}}
.founder-photo{margin:0;max-width:380px}
.founder-photo img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius);background:var(--gp-tint);box-shadow:var(--shadow-media)}
.founder-photo figcaption{margin-top:16px}
.founder-photo figcaption b{display:block;color:var(--ink);font-size:17px}
.founder-photo figcaption span{font-size:14px;color:var(--muted)}
.founder-story .display{margin-bottom:8px}
.founder-story .lead{margin-bottom:16px}
.principles{margin-top:28px;display:grid;gap:16px}
.principles blockquote{margin:0;padding-left:18px;border-left:3px solid var(--gp-cobalt);font-weight:600;letter-spacing:-.02em;font-size:clamp(1.1875rem,1rem + .8vw,1.5rem);line-height:1.35;color:var(--ink)}
@media (max-width:959px){.founder-photo{margin:0 auto;max-width:300px}.founder-photo figcaption{text-align:center}.founder-story{max-width:640px;margin:0 auto}.founder-story .eyebrow,.founder-story .display{text-align:center;margin-left:auto;margin-right:auto}}

/* 11 Roadmap */
.road{display:grid;gap:16px;max-width:var(--w-wide);margin:var(--head-gap) auto 0}
@media (min-width:900px){.road{grid-template-columns:repeat(3,1fr);gap:20px}}
.road > div{padding:28px 24px}
.road > div:nth-child(3){border:1.5px dashed rgba(11,31,75,.2);box-shadow:none;background:transparent}
.road ul{margin:12px 0 0;padding-left:18px;font-size:15px;line-height:1.6}
.road li{margin:7px 0}

/* 12 Investment */
.split{display:grid;gap:20px;max-width:var(--w-wide);margin:0 auto}
@media (min-width:900px){.split{grid-template-columns:1fr 1fr;align-items:start}}
#invest .split{align-items:stretch}
#invest .split > div{padding:28px 24px}
.steps{list-style:none;margin:0;padding:0;counter-reset:s}
.steps li{position:relative;padding:8px 0 16px 46px;color:var(--ink);font-weight:600;font-size:15.5px}
.steps li::before{counter-increment:s;content:counter(s);position:absolute;left:0;top:5px;width:30px;height:30px;border-radius:50%;background:var(--gp-tint);display:grid;place-items:center;font-size:13px;font-weight:600;color:var(--gp-cobalt)}
.steps li:not(:last-child)::after{content:"";position:absolute;left:14px;top:40px;bottom:0;width:1.5px;background:rgba(11,31,75,.12)}
.steps li span{display:block;font-weight:400;font-size:14.5px;color:var(--muted);margin-top:2px}
.funds{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0}
.funds li{border:1px solid var(--line-strong);border-radius:var(--pill);padding:8px 15px;font-weight:500;color:var(--ink);font-size:14px;background:#fff}

/* Room tables and lists */
.rates{width:100%;max-width:var(--w-narrow);border-collapse:collapse;font-size:15px;margin:8px 0 12px}
.rates th,.rates td{text-align:left;padding:13px 8px;border-bottom:1px solid var(--line)}
.rates th{font-size:14px;color:var(--muted);font-weight:500}
.rates td:last-child,.rates th:last-child{text-align:right;font-variant-numeric:tabular-nums}
.rates td b{color:var(--ink)}
.check{list-style:none;margin:0 auto;padding:0;display:grid;gap:0;max-width:var(--w-wide)}
@media (min-width:900px){.check{grid-template-columns:1fr 1fr;column-gap:48px}}
.check li{padding:18px 0;border-top:1px solid var(--line)}
.check b{display:block;color:var(--ink);margin-bottom:4px}
.check span{font-size:15px;color:var(--text)}
.room-list{list-style:none;margin:0 auto;padding:4px 24px;max-width:var(--w-wide);background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-card)}
.room-list li{display:grid;grid-template-columns:40px 1fr;gap:6px 14px;padding:20px 0;border-top:1px solid var(--line)}
.room-list li:first-child{border-top:0}
@media (min-width:768px){.room-list li{grid-template-columns:52px 1fr auto;align-items:center}}
@media (max-width:479px){.room-list{padding:4px 18px}}
.room-list .num{font-weight:600;font-size:20px;color:var(--gp-cobalt);line-height:1.2}
.room-list h3{font-size:17px;margin-bottom:2px}
.room-list p{margin:0;font-size:14.5px;color:var(--muted)}
.room-list .act{grid-column:2;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
@media (min-width:768px){.room-list .act{grid-column:3;justify-content:flex-end}}
.room-list .btn-sm{min-height:40px;padding:0 18px}

/* FAQ (reference: separate white rows, 15 to 16 px semibold questions) */
.faq{max-width:var(--w-narrow);margin:0 auto}
.faq details{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:2px 20px;margin-bottom:10px}
.faq summary{cursor:pointer;list-style:none;position:relative;padding:17px 36px 17px 0;min-height:44px;font-weight:600;font-size:16px;line-height:1.5;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:12px;font-size:24px;font-weight:400;line-height:1.2;color:var(--gp-cobalt)}
.faq details[open] summary::after{content:"\2212"}
.faq summary:hover{color:var(--gp-cobalt)}
.faq details > div{padding:0 0 18px;color:var(--text);font-size:15px;line-height:1.7}
.faq details > div p{margin:0}

/* Final CTA (dark band, centered, form card) */
.form-wrap{display:grid;gap:28px;max-width:var(--w-wide);margin:0 auto}
.final .form-wrap{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center}
.final .display{max-width:20ch;margin-left:auto;margin-right:auto}
.final .body-lead{margin-left:auto;margin-right:auto}
.final .cta-row{margin:28px 0 20px}
.final .cta-row .btn{min-height:56px;padding:0 32px;font-size:16px}
.final .form-wrap > div{width:100%;max-width:620px}
form.lead-form,.final .thanks{background:#fff;color:var(--text);border-radius:var(--radius);padding:24px;box-shadow:0 24px 60px rgba(0,0,0,.28);text-align:left}
@media (min-width:640px){form.lead-form,.final .thanks{padding:32px}}
.field{margin-bottom:16px}
.field label{display:block;font-weight:500;color:var(--ink);font-size:14px;margin-bottom:6px}
.field .opt{font-weight:400;color:var(--muted)}
.field input,.field select,.field textarea{width:100%;min-height:52px;padding:13px 16px;border:1px solid rgba(11,31,75,.2);border-radius:12px;font:400 16px/1.4 var(--font-body);color:var(--ink);background:#fff;transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:110px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gp-cobalt);box-shadow:0 0 0 3px rgba(21,101,224,.18)}
.field .err{display:none;color:#B42318;font-size:13px;margin:6px 0 0}
.field.invalid input,.field.invalid select{border-color:#B42318}
.field.invalid .err{display:block}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.55;color:var(--muted);margin:4px 0 20px}
.consent input{width:20px;height:20px;margin-top:1px;accent-color:var(--gp-cobalt);flex:none}
.lead-form .btn{min-height:56px}
.form-status{margin:14px 0 0;font-size:14px}
.thanks{display:none}
.thanks.show{display:block}
.thanks h3{margin-bottom:10px}
.thanks ul{padding-left:18px}
.hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}

/* Footer */
footer{background:var(--gp-navy-deep);color:var(--on-dark-muted);padding:48px 0 40px;font-size:14px;line-height:1.65}
footer a{color:#fff;text-decoration:none}
footer a:hover{color:var(--gp-yellow);text-decoration:underline}
footer .grid{display:grid;gap:28px}
@media (min-width:768px){footer .grid{grid-template-columns:1.3fr 1fr 1fr}}
footer h3{color:#fff;font-size:15px;letter-spacing:0;margin-bottom:12px}
footer p{margin:0 0 8px}
footer .legal{border-top:1px solid rgba(255,255,255,.1);margin-top:32px;padding-top:20px;font-size:12.5px;line-height:1.65}

/* ===== v10: Manrope for headings and UI; Inter stays on running text ===== */
h1,h2,h3,.display,.eyebrow,.tag,.brand,.nav a,.mnav a,.strip,.platforms,.chain li,.reveal-lines p,.manifesto,
.demo-title,.device-badge,.tagline,.flow b,.money-flow li,.thesis b,.stat,.diff b,.diff > li::before,
.principles blockquote,.statement,.steps li,.funds li,.faq summary,.field label,.legend,.roles-line b,.model-next b,
.check b,.room-list .num,.founder-photo figcaption b,.chapters b,.powered li,.cards b,.plan-name,.mode b,.cat h3{font-family:var(--font)}
.steps li span{font-family:var(--font-body)}

/* Demo: jump straight to a role */
.demo-roles{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:24px auto 0;padding:0;list-style:none}
.demo-roles button{min-height:40px;padding:0 16px;border:1px solid var(--line-strong);border-radius:var(--pill);background:#fff;color:var(--ink);font:500 14px/1 var(--font);cursor:pointer;transition:background-color .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease)}
.demo-roles button:hover{border-color:var(--gp-cobalt);color:var(--gp-cobalt)}
.demo-roles button[aria-pressed="true"]{background:var(--gp-navy);border-color:var(--gp-navy);color:#fff}
.demo-roles-label{width:100%;text-align:center;font-size:13px;color:var(--muted);margin:0 0 2px}

/* Shared card grid (engines, capabilities, technology, revenue, plans) */
.cards{list-style:none;margin:var(--head-gap) auto 0;padding:0;display:grid;gap:16px;max-width:var(--w-wide)}
@media (min-width:600px){.cards{grid-template-columns:1fr 1fr}}
@media (min-width:960px){.cards.c3{grid-template-columns:repeat(3,minmax(0,1fr))}.cards.c4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cards > li{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:22px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-card)}
.cards b{display:block;font-size:var(--fs-h3);font-weight:600;letter-spacing:-.01em;line-height:1.25;color:var(--ink)}
.cards p{margin:0;font-size:15px;line-height:1.6;color:var(--text)}
.cards .num{font:600 13px/1 var(--font);color:var(--gp-cobalt);letter-spacing:.04em}
.cards .btn-text{margin-top:auto;min-height:36px;font-size:14px}
.cards.compact > li{padding:18px 20px;gap:8px;box-shadow:none}
.cards.compact b{font-size:17px}
.cards.compact p{font-size:14.5px}
.navy .cards > li{background:rgba(255,255,255,.04);border-color:var(--line-dark);box-shadow:none}
.navy .cards b{color:#fff}
.navy .cards p{color:var(--on-dark-muted)}
.planned-card{border-style:dashed!important;border-width:1.5px!important;box-shadow:none!important;background:transparent!important}

/* "Powered by" row */
.powered{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;list-style:none;margin:28px auto 0;padding:0;max-width:var(--w-wide)}
.powered li{padding:7px 14px;border-radius:var(--pill);background:var(--gp-tint);color:var(--ink);font-size:14px;font-weight:500}
.powered .powered-label{background:none;color:var(--muted);padding-left:0;padding-right:4px}
.navy .powered li{background:rgba(255,255,255,.08);color:#fff}
.navy .powered .powered-label{background:none;color:var(--on-dark-muted)}

/* Marketplace categories */
.cat{display:flex;flex-direction:column;gap:12px}
.cat h3{font-size:var(--fs-h3)}
.cat ul{list-style:none;margin:0;padding:0;font-size:15px;line-height:1.5}
.cat li{position:relative;padding:5px 0 5px 18px}
.cat li::before{content:"";position:absolute;left:2px;top:13px;width:6px;height:6px;border-radius:50%;background:var(--gp-cobalt)}
.statement{max-width:var(--w-narrow);margin:32px auto 0;text-align:center;font-size:clamp(1.25rem,1.05rem + .9vw,1.75rem);font-weight:600;line-height:1.3;letter-spacing:-.02em;color:var(--ink);text-wrap:balance}
.statement span{color:var(--gp-cobalt)}
.src-line{text-align:center;margin:14px auto 0}

/* Store: app vs Store */
.compare{display:grid;gap:16px;max-width:var(--w-wide);margin:var(--head-gap) auto 0}
@media (min-width:768px){.compare{grid-template-columns:1fr 1fr}}
.compare > div{padding:24px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-card)}
.compare > div.store{border:1.5px solid var(--gp-cobalt)}
.compare h3{margin:10px 0 12px}
.ticks{list-style:none;margin:0;padding:0}
.ticks li{position:relative;padding:8px 0 8px 28px;border-bottom:1px solid var(--line);font-size:15px}
.ticks li:last-child{border-bottom:0}
.ticks li::before{content:"";position:absolute;left:4px;top:15px;width:11px;height:6px;border-left:2px solid var(--gp-cobalt);border-bottom:2px solid var(--gp-cobalt);transform:rotate(-45deg)}
.split-2{display:grid;gap:16px;max-width:var(--w-wide);margin:20px auto 0}
@media (min-width:768px){.split-2{grid-template-columns:1fr 1fr}}
.split-2 > div{padding:24px}
.split-2 h3{margin-bottom:12px}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.chips li{border:1px solid var(--line-strong);border-radius:var(--pill);padding:7px 14px;font:500 14px/1.3 var(--font);color:var(--ink);background:#fff}

/* GP OS */
.os-status{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 12px;margin:18px auto 0;max-width:var(--w-narrow);text-align:center;font-size:14.5px;color:var(--muted)}
.os-modes{display:grid;gap:20px;align-items:center;max-width:var(--w-wide);margin:var(--head-gap) auto 0}
@media (min-width:960px){.os-modes{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}}
.shot{margin:0}
.shot img{width:100%;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow-media);background:#fff}
.shot figcaption{margin-top:10px;font-size:13px;color:var(--muted);text-align:center}
.navy .shot img{border-color:var(--line-dark);box-shadow:var(--shadow-dark)}
.navy .shot figcaption{color:var(--on-dark-muted)}
.mode-list{display:grid;gap:14px}
.mode{padding:20px 22px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-card)}
.mode b{display:block;font-size:var(--fs-h3);color:var(--ink);margin:10px 0 6px;line-height:1.25}
.mode p{margin:0;font-size:15px;line-height:1.6}
.mode .letter{font:600 13px/1 var(--font);color:var(--gp-cobalt)}
.next-line{max-width:var(--w-narrow);margin:24px auto 0;text-align:center;font-size:14.5px;color:var(--muted)}
.showcase{display:grid;gap:32px;align-items:center;max-width:var(--w-wide);margin:var(--head-gap) auto 0}
@media (min-width:960px){.showcase{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}}
.showcase .ticks li{color:var(--on-dark);border-bottom-color:var(--line-dark)}
.showcase .ticks li::before{border-color:var(--gp-yellow)}
.plans-head{text-align:center;margin:clamp(40px,6vw,64px) auto 0}
.plans-head h3{color:#fff}
.plans-head p{margin:8px auto 0;max-width:var(--w-lead);color:var(--on-dark-muted);font-size:15px}
.plan-name{display:block;font-size:var(--fs-h3);font-weight:600;color:#fff}
.plan-tag{font-size:13px;color:var(--gp-yellow);font-weight:500;margin-top:-4px}
.cards .plan-list{list-style:none;margin:4px 0 0;padding:0;font-size:14.5px;color:var(--on-dark)}
.cards .plan-list li{position:relative;padding:5px 0 5px 18px}
.cards .plan-list li::before{content:"";position:absolute;left:2px;top:13px;width:6px;height:6px;border-radius:50%;background:var(--gp-yellow)}
.plan-command{border-color:rgba(250,204,21,.45)!important}

/* Mission */
.mission-quote{max-width:var(--w-narrow);margin:28px auto 0;text-align:center;font-family:var(--font);font-weight:600;font-size:clamp(1.375rem,1.15rem + 1vw,1.875rem);letter-spacing:-.02em;line-height:1.25;color:var(--gp-cobalt)}

/* Summary (dark band) */
.result-line{max-width:var(--w-narrow);margin:32px auto 0;text-align:center;font-family:var(--font);font-weight:600;font-size:clamp(1.375rem,1.1rem + 1.2vw,2rem);letter-spacing:-.025em;line-height:1.2;color:var(--gp-yellow);text-wrap:balance}

/* Traction: a lone last card spans the row */
@media (min-width:768px){.status-board > li.span{grid-column:1/-1}}

/* Phones: keep the new sections compact */
@media (max-width:599px){
  .cards{gap:12px}
  .cards > li{padding:18px}
  .m-list{gap:0;padding:2px 18px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-card)}
  .m-list > li,.m-list > li.planned-card{padding:14px 0!important;gap:6px;border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0;box-shadow:none!important;background:none!important}
  .m-list > li:last-child{border-bottom:0!important}
  .m-list b{font-size:16.5px}
  .m-list p{font-size:14.5px}
  .cards.c2m{grid-template-columns:1fr 1fr;gap:10px}
  .cards.c2m > li{padding:14px}
  .cards.c2m b{font-size:16px}
  .cards.c2m p{font-size:13.5px;line-height:1.5}
  .cards.c2m .tag{font-size:11.5px;padding:4px 9px}
  .cat h3{font-size:16px}
  .cat ul{font-size:14px}
  .cat li{padding:4px 0 4px 14px}
  .cat li::before{left:0;top:12px;width:5px;height:5px}
  .plans-head{margin-top:36px}
}

/* Motion: content is visible without JS; reveal only after JS opts in */
.js-reveal [data-reveal]{opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.js-reveal [data-reveal].is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
  .js-reveal [data-reveal]{opacity:1;transform:none}
  .btn:hover,.video button:hover .play{transform:none}
}