/* NorthCore Labs — northcorelabs.io v2.1 "glass"
   One stylesheet for every page. Tokens first; every colour used on the site is declared
   here and nowhere else (RULES.md #1, #2, #7).
   Ground: near-black with a slow aurora of brand green, teal and blue. Surfaces: frosted
   glass (translucent white, 1px light edge, blur). Type: Outfit light display, Figtree body,
   JetBrains Mono labels. The only saturated colour in text is --green-2 on dark. */

:root{
  --bg:#070A0D;
  --bg-2:#0B1015;
  --bg-3:#111820;
  --fg:#F2F6F3;             /* headings: 17.5:1 on --bg */
  --text:#BBC6C0;           /* body: 10.9:1 on --bg */
  --muted:#8E9A93;          /* 6.1:1 on --bg, 5.5:1 on glass */
  --line:rgba(255,255,255,.09);
  --line-2:rgba(255,255,255,.18);
  --glass:rgba(255,255,255,.045);
  --glass-2:rgba(255,255,255,.08);
  --glass-hi:rgba(255,255,255,.14);
  --green:#0CC481;
  --green-2:#14FFB0;        /* green as text on dark: 14.6:1 */
  --green-ink:#087A50;      /* green as text on the light band: 5.9:1 */
  --teal:#19C6E6;
  --blue:#3B7BFF;
  --violet:#8B5CF6;
  --light:#F5F7F5;          /* the one light surface: the logo band */
  --light-ink:#0E1210;
  --light-muted:#5E6863;
  --red:#FF6B6B;

  --font:'Figtree',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --display:'Outfit',var(--font);
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --maxw:1240px;
  --gutter:24px;
  --h1:clamp(44px,6.2vw,88px);
  --h2:clamp(32px,4.2vw,58px);
  --h3:22px;
  --quote:clamp(24px,2.8vw,38px);
  --dw:300;
  --dls:-.03em;
  --dlh:1.02;
  --r:20px;
  --r-sm:12px;
  --pill:999px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
@media (max-width:700px){:root{--gutter:18px;--r:16px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--bg)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip;position:relative}
img,video,svg{max-width:100%;display:block}
a{color:var(--fg);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:var(--line-2)}
a:hover{color:var(--green-2);text-decoration-color:var(--green-2)}
h1,h2,h3,h4{margin:0;color:var(--fg);font-family:var(--display)}
h1,h2{font-weight:var(--dw);letter-spacing:var(--dls);line-height:var(--dlh)}
h1{font-size:var(--h1)}
h2{font-size:var(--h2);line-height:1.06}
h3{font-size:var(--h3);font-weight:500;letter-spacing:-.01em;line-height:1.3}
h4{font-size:17px;font-weight:500;letter-spacing:-.005em;line-height:1.35}
p{margin:0}
ul,ol{margin:0;padding:0}
strong,b{color:var(--fg);font-weight:600}
em{font-style:italic}
.hl{color:var(--green-2)}
.grad{background:linear-gradient(92deg,var(--green-2),var(--teal) 60%,#9BD4FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.mono,.label{font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;color:var(--green-2);text-transform:uppercase}
.label{display:inline-flex;align-items:center;gap:10px;margin-bottom:20px}
.label::before{content:"";width:18px;height:1px;background:var(--green)}
.lede{font-size:19px;line-height:1.55;color:var(--text);max-width:62ch}
.lede.big{font-size:clamp(19px,1.8vw,24px);color:var(--text)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);position:relative}
.narrow{max-width:800px}
.sec{padding:clamp(72px,9vw,140px) 0;position:relative}
.sec-tight{padding:clamp(40px,5vw,72px) 0}
.sec-alt{background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,0))}
.sec-head{margin-bottom:clamp(36px,4.5vw,64px)}
.sec-head h2{max-width:22ch}
.sec-head .lede{margin-top:20px}
.sec-head.row{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:end}
.sec-head.row .lede{margin-top:0}
@media (max-width:860px){.sec-head.row{grid-template-columns:1fr;gap:16px}}
.rule{height:1px;background:var(--line);border:0;margin:0}
.dark{background:transparent;color:var(--text)}
.muted{color:var(--muted)}
.small{font-size:14px}
.tiny{font-size:13px;color:var(--muted)}

/* ---------------- Aurora ground ---------------- */
.aurora{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:
  radial-gradient(60% 50% at 8% 0%,rgba(12,196,129,.22),transparent 60%),
  radial-gradient(50% 45% at 100% 10%,rgba(59,123,255,.16),transparent 60%),
  radial-gradient(45% 40% at 60% 100%,rgba(139,92,246,.12),transparent 60%),var(--bg)}
.aurora i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.55;mix-blend-mode:screen;will-change:transform}
.aurora i:nth-child(1){width:60vw;height:60vw;left:-15vw;top:-25vw;background:radial-gradient(circle,rgba(12,196,129,.5),transparent 65%);animation:drift1 38s ease-in-out infinite alternate}
.aurora i:nth-child(2){width:50vw;height:50vw;right:-18vw;top:5vh;background:radial-gradient(circle,rgba(25,198,230,.4),transparent 65%);animation:drift2 46s ease-in-out infinite alternate}
.aurora i:nth-child(3){width:55vw;height:55vw;left:30vw;bottom:-30vw;background:radial-gradient(circle,rgba(59,123,255,.35),transparent 65%);animation:drift3 52s ease-in-out infinite alternate}
.aurora::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(70% 60% at 50% 0%,#000,transparent);-webkit-mask-image:radial-gradient(70% 60% at 50% 0%,#000,transparent)}
@keyframes drift1{to{transform:translate(12vw,10vh) scale(1.12)}}
@keyframes drift2{to{transform:translate(-10vw,18vh) scale(.92)}}
@keyframes drift3{to{transform:translate(-14vw,-12vh) scale(1.08)}}
@media (prefers-reduced-motion:reduce){.aurora i{animation:none}}
@media (max-width:700px){.aurora i{filter:blur(60px)}}

/* ---------------- Glass ---------------- */
.glass{background:linear-gradient(180deg,var(--glass-2),var(--glass));border:1px solid var(--line);border-radius:var(--r);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 24px 60px -30px rgba(0,0,0,.7)}
.glass-sm{border-radius:var(--r-sm)}

/* ---------------- Buttons ---------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font);font-size:15px;font-weight:600;line-height:1;padding:17px 26px;border-radius:var(--pill);border:1px solid transparent;background-color:var(--green);background-image:linear-gradient(135deg,var(--green-2),var(--green));color:var(--light-ink);text-decoration:none;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s;white-space:nowrap;box-shadow:0 0 0 1px rgba(20,255,176,.2),0 10px 30px -10px rgba(12,196,129,.7)}
.btn:hover{color:var(--light-ink);transform:translateY(-1px);box-shadow:0 0 0 1px rgba(20,255,176,.35),0 16px 40px -10px rgba(12,196,129,.85)}
.btn .arw{font-family:var(--mono);font-size:15px}
.btn-out{background-color:var(--glass);background-image:none;border-color:var(--line-2);color:var(--fg);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.btn-out:hover{background:var(--glass-2);border-color:var(--glass-hi);color:var(--fg);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.btn-sm{padding:12px 18px;font-size:14px}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.link{font-weight:600;color:var(--fg);text-decoration:none}
.link:hover{color:var(--green-2)}
.link .arw{font-family:var(--mono);margin-left:6px}

/* ---------------- Header ---------------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .25s,border-color .25s}
.hdr::before{content:"";position:absolute;inset:0;background:rgba(7,10,13,.55);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);border-bottom:1px solid transparent;transition:border-color .25s,background .25s;z-index:-1}
.hdr.is-stuck::before{border-bottom-color:var(--line);background:rgba(7,10,13,.72)}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:20px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--fg);font-family:var(--display);font-weight:500;font-size:17px;letter-spacing:-.01em}
.brand img{width:34px;height:34px;flex:none}
.brand span{white-space:nowrap}
.nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav>a,.nav>details>summary{font-size:14.5px;font-weight:500;color:var(--text);text-decoration:none;padding:10px 14px;border-radius:var(--pill);cursor:pointer;list-style:none;display:flex;align-items:center;gap:6px;transition:background .15s,color .15s}
.nav>details>summary::-webkit-details-marker{display:none}
.nav>a:hover,.nav>details>summary:hover,.nav>a[aria-current="page"],.nav>details>summary[aria-current="page"]{color:var(--fg);background:var(--glass-2)}
.nav>details{position:relative}
.nav>details>summary .chev{font-family:var(--mono);font-size:10px;color:var(--muted)}
.menu{position:absolute;top:calc(100% + 10px);left:0;min-width:320px;background:rgba(11,16,21,.92);border:1px solid var(--line-2);border-radius:var(--r-sm);padding:8px;box-shadow:0 30px 80px -20px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.08);z-index:60;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.menu a{display:grid;grid-template-columns:1fr;padding:10px 12px;text-decoration:none;color:var(--fg);border-radius:8px;font-size:14.5px;font-weight:500}
.menu a span{display:block;font-weight:400;color:var(--muted);font-size:13px;margin-top:2px}
.menu a:hover{background:var(--glass-2);color:var(--fg)}
.menu .all{border-top:1px solid var(--line);margin-top:6px;padding-top:12px;color:var(--green-2)}
.hdr-cta{display:flex;align-items:center;gap:8px;margin-left:8px}
.hdr-cta .tel{font-family:var(--mono);font-size:13px;color:var(--text);text-decoration:none;padding:10px 12px}
.hdr-cta .tel:hover{color:var(--green-2)}
.theme{width:38px;height:38px;border-radius:var(--pill);border:1px solid var(--line-2);background:var(--glass);color:var(--fg);display:grid;place-items:center;cursor:pointer;padding:0;flex:none}
.theme:hover{border-color:var(--green-2);color:var(--green-2)}
.theme svg{width:16px;height:16px;display:block}
.theme .moon{display:none}
:is(:root[data-theme=light],.t-light) .theme .sun{display:none}
:is(:root[data-theme=light],.t-light) .theme .moon{display:block}
.burger{display:none;background:var(--glass);border:1px solid var(--line-2);border-radius:var(--pill);padding:10px 14px;font-family:var(--mono);font-size:12px;color:var(--fg);cursor:pointer}
@media (max-width:1040px){
  .nav,.hdr-cta .tel{display:none}
  .burger{display:inline-flex}
  .hdr.open .nav{display:flex;flex-direction:column;align-items:stretch;position:absolute;left:0;right:0;top:72px;background:rgba(7,10,13,.96);border-bottom:1px solid var(--line);padding:12px var(--gutter) 20px;gap:2px;max-height:calc(100vh - 72px);overflow:auto;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
  .hdr.open .nav>details{position:static}
  .hdr.open .menu{position:static;box-shadow:none;border:0;padding:0 0 6px 10px;min-width:0;background:transparent;backdrop-filter:none}
  .hdr.open .nav>a,.hdr.open .nav>details>summary{padding:12px 10px;font-size:16px;border-radius:8px}
  .hdr-cta .btn{padding:12px 16px;font-size:14px}
}
@media (max-width:520px){.brand span{display:none}.hdr .wrap{gap:10px}.hdr-cta{gap:6px}}
.playbook *{min-width:0}
.playbook input,.playbook select{max-width:100%}
@media (max-width:760px){.playbook [class*="grid"],.playbook [class*="-cols"],.playbook .calc,.playbook .calc-fields,.playbook .calc-layout{grid-template-columns:1fr!important}.playbook table{display:block;overflow-x:auto;max-width:100%}}
main{padding-top:72px}

/* ---------------- Preloader ---------------- */
.pre{position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:22px;transition:opacity .5s ease,visibility .5s}
.pre.done{opacity:0;visibility:hidden}
.pre .word{font-family:var(--display);font-weight:var(--dw);letter-spacing:var(--dls);font-size:clamp(36px,5.4vw,72px);color:var(--fg);display:flex;overflow:hidden;line-height:1.1}
.pre .word span{display:inline-block;transform:translateY(110%);animation:rise .6s var(--ease) forwards}
.pre .word .sp{width:.28em}
.pre .mark{width:76px;height:76px;opacity:0;animation:fadein .7s .05s forwards}
.pre .sub{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);opacity:0;animation:fadein .5s .5s forwards}
.pre .bar{width:min(320px,60vw);height:1px;background:var(--line-2)}
.pre .bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green-2),var(--teal));animation:fill 1.1s ease forwards}
@keyframes rise{to{transform:none}}
@keyframes fill{to{width:100%}}
@keyframes fadein{to{opacity:1}}
@media (prefers-reduced-motion:reduce){.pre{display:none}}

/* ---------------- Reveal (one mechanism only; RULES.md #15, #18) ---------------- */
.rv{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
.rv.from-l{transform:translateX(-56px)}.rv.from-r{transform:translateX(56px)}
.rv.is-in,.no-js .rv{opacity:1;transform:none}
.shot .rv{opacity:1!important;transform:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------------- Hero ---------------- */
.hero{padding:clamp(64px,9vw,140px) 0 clamp(48px,6vw,96px);position:relative}
.hero h1{max-width:15ch;margin-bottom:28px}
.hero .lede{margin-bottom:8px}
.hero .btns{margin-top:34px}
.hero-note{margin-top:22px;font-size:14px;color:var(--muted)}
.hero.split .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,72px);align-items:center}
@media (max-width:900px){.hero.split .wrap{grid-template-columns:1fr}}
.hero.stage{padding-top:clamp(56px,8vw,120px)}
.hero.stage .wrap{display:grid;justify-items:center;gap:clamp(40px,5vw,64px)}
.hero.stage .hero-copy{text-align:center;display:grid;justify-items:center}
.hero.stage h1{max-width:19ch;margin:0 auto 24px}
.hero.stage .lede{margin:0 auto;max-width:58ch}
.hero.stage .btns{justify-content:center;margin-top:30px}
.hero.stage .label{justify-content:center}
.hero-media.wide{width:min(100%,1040px)}
.stage-strip{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:18px;padding:24px 28px;width:min(100%,1040px)}
.stage-strip .st{display:grid;gap:6px}
.stage-strip .st .n{font-family:var(--mono);font-size:12px;color:var(--green-2);letter-spacing:.06em}
.stage-strip .st b{font-family:var(--display);font-weight:400;font-size:24px;letter-spacing:-.02em;color:var(--fg)}
.stage-strip .st span:last-child{font-size:14px;line-height:1.45;color:var(--text)}
.stage-strip .st-arw{width:34px;height:1px;background:var(--line-2);position:relative}
.stage-strip .st-arw::after{content:"";position:absolute;right:-1px;top:-4px;width:8px;height:8px;border-top:1px solid var(--line-2);border-right:1px solid var(--line-2);transform:rotate(45deg)}
@media (max-width:760px){.stage-strip{grid-template-columns:1fr;gap:16px;padding:20px}.stage-strip .st-arw{display:none}}
.hero-media{position:relative;overflow:hidden;padding:10px}
.hero-media video,.hero-media img{width:100%;height:auto;aspect-ratio:1280/670;object-fit:cover;border-radius:calc(var(--r) - 8px);background:#0c0c0c}
.hero-media::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(60% 40% at 50% 0%,rgba(255,255,255,.08),transparent)}
.hero-glow{position:absolute;inset:-20%;z-index:-1;background:radial-gradient(40% 40% at 50% 50%,rgba(12,196,129,.28),transparent 70%);filter:blur(40px);pointer-events:none}
.hero-facts{display:flex;flex-wrap:wrap;gap:8px 12px;margin-top:28px}
.hero-facts span{font-size:13.5px;color:var(--text);padding:8px 14px;border:1px solid var(--line);border-radius:var(--pill);background:var(--glass)}

/* ---------------- Logo band (seamless marquee on the one light surface) ---------------- */
.press{background:#000;color:var(--fg);overflow:hidden;padding:16px 0 20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative}
.press .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:#8E9A93;text-transform:uppercase;text-align:center;margin-bottom:10px}
.press .track{overflow:hidden;position:relative;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.press .track div{display:flex;width:max-content;animation:press 44s linear infinite}
.press .track img{height:68px;width:auto;padding:0 36px;flex:none;filter:brightness(0) invert(1);opacity:.9}
@keyframes press{to{transform:translateX(calc(-100% / 3))}}
@media (prefers-reduced-motion:reduce){.press .track div{animation:none}}
@media (max-width:700px){.press .track img{height:44px;padding:0 22px}}

/* ---------------- Thesis (scroll-lit statement) ---------------- */
.thesis{position:relative}
.thesis .track{height:calc(var(--thesis-n,7) * 58vh + 100vh)}
.thesis .sticky{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.thesis .sticky>.wrap{width:100%}
.thesis .lines{display:grid;gap:clamp(16px,2.2vw,26px);transition:transform .7s var(--ease);will-change:transform}
.shot .thesis .lines,.no-js .thesis .lines{transform:none!important}
.thesis p{font-family:var(--display);font-weight:var(--dw);font-size:clamp(24px,3.2vw,44px);line-height:1.18;letter-spacing:-.02em;color:var(--fg);opacity:0;transform:translateY(22px);transition:opacity .55s var(--ease),transform .7s var(--ease)}
.thesis p.big{font-size:clamp(34px,5.2vw,72px);line-height:1.04;letter-spacing:-.03em;margin-top:clamp(10px,2vw,24px)}
.thesis p.on{opacity:1;transform:none}
.thesis p.past{opacity:.28;transform:none}
.thesis .hl{color:var(--green-2)}
.thesis .kicker{position:absolute;top:calc(72px + 5vh);left:0;right:0;text-align:center;font-family:var(--mono);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);transition:opacity .4s}
.thesis.going .kicker{opacity:0}
.shot .thesis .track,.no-js .thesis .track{height:auto}
.shot .thesis .sticky,.no-js .thesis .sticky{position:static;height:auto;padding:clamp(72px,9vw,140px) 0;overflow:visible}
.shot .thesis .kicker,.no-js .thesis .kicker{position:static;text-align:left;margin-bottom:22px;max-width:var(--maxw);padding:0 var(--gutter);margin-left:auto;margin-right:auto}
.shot .thesis p,.no-js .thesis p{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.thesis .lines{transform:none!important;transition:none}.thesis .track{height:auto}.thesis .sticky{position:static;height:auto;padding:clamp(72px,9vw,140px) 0;overflow:visible}.thesis .kicker{position:static;text-align:left;margin-bottom:22px}.thesis p{opacity:1;transform:none;transition:none}}
@media (max-height:600px){.thesis .lines{transform:none!important}.thesis .track{height:auto}.thesis .sticky{position:static;height:auto;padding:80px 0;overflow:visible}.thesis .kicker{position:static;text-align:left;margin-bottom:22px}.thesis p{opacity:1;transform:none}}

/* ---------------- Offer cards (home) ---------------- */
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.offer{padding:32px 30px 30px;text-decoration:none;color:var(--text);display:flex;flex-direction:column;gap:14px;min-height:340px;position:relative;overflow:hidden;transition:transform .35s var(--ease),border-color .35s,box-shadow .35s}
.offer::before{content:"";position:absolute;inset:-1px;border-radius:inherit;background:radial-gradient(60% 50% at 20% 0%,rgba(12,196,129,.22),transparent 70%);opacity:0;transition:opacity .35s}
.offer:hover{transform:translateY(-4px);border-color:var(--glass-hi);color:var(--text);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 30px 70px -30px rgba(12,196,129,.45)}
.offer:hover::before{opacity:1}
.offer>*{position:relative}
.offer .n{font-family:var(--mono);font-size:12.5px;color:var(--green-2);letter-spacing:.06em}
.offer h3{font-size:28px;font-weight:400;letter-spacing:-.02em;color:var(--fg);line-height:1.15}
@media (min-width:901px){.offer h3{min-height:2.3em}}
.offer p{font-size:15.5px;line-height:1.55}
.offer .price{margin-top:auto;font-family:var(--mono);font-size:13px;color:var(--fg);padding-top:16px;border-top:1px solid var(--line)}
.offer .go{font-weight:600;color:var(--fg)}
.offer:hover .go{color:var(--green-2)}
@media (max-width:900px){.offers{grid-template-columns:1fr}.offer{min-height:0}}

/* ---------------- Industry tiles ---------------- */
.inds{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ind{padding:28px 26px;text-decoration:none;color:var(--text);display:grid;gap:8px;transition:transform .35s var(--ease),border-color .35s,background .35s}
.ind:hover{transform:translateY(-3px);border-color:rgba(20,255,176,.35);color:var(--text);background:linear-gradient(180deg,rgba(12,196,129,.12),var(--glass))}
.ind .k{font-family:var(--mono);font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.ind h3{font-size:21px;font-weight:500;color:var(--fg)}
.ind p{font-size:15px;line-height:1.5}
.ind .go{font-size:14px;font-weight:600;color:var(--fg);margin-top:6px}
.ind:hover .go{color:var(--green-2)}
@media (max-width:860px){.inds{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.inds{grid-template-columns:1fr}}

/* ---------------- Cards / grids ---------------- */
.grid{display:grid;gap:16px}
.grid.c2{grid-template-columns:repeat(2,1fr)}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c4{grid-template-columns:repeat(4,1fr)}
.cell{padding:28px 26px;background:linear-gradient(180deg,var(--glass-2),var(--glass));border:1px solid var(--line);border-radius:var(--r);box-shadow:inset 0 1px 0 rgba(255,255,255,.07);color:var(--text);text-decoration:none;transition:border-color .3s,transform .3s var(--ease)}
a.cell:hover{border-color:var(--glass-hi);transform:translateY(-3px);color:var(--text)}
.cell .n{font-family:var(--mono);font-size:12.5px;color:var(--green-2);margin-bottom:14px;display:block;letter-spacing:.06em}
.cell{display:flex;flex-direction:column}
.cell>.link{margin-top:auto;padding-top:22px;align-self:flex-start}
.cell h3{margin-bottom:10px}
.cell p{font-size:15.5px;line-height:1.55}
.cell ul{list-style:none;margin-top:14px;display:grid;gap:8px}
.cell li{padding-left:22px;position:relative;font-size:15px}
.cell li::before{content:"";position:absolute;left:0;top:7px;width:12px;height:7px;border-left:1.5px solid var(--green-2);border-bottom:1.5px solid var(--green-2);transform:rotate(-45deg)}
.cell.tint{background:linear-gradient(180deg,rgba(12,196,129,.16),rgba(12,196,129,.05));border-color:rgba(20,255,176,.25)}
@media (max-width:1000px){.grid.c4{grid-template-columns:repeat(2,1fr)}.grid.c3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.grid.c2,.grid.c3,.grid.c4{grid-template-columns:1fr}}

/* Steps / process */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step{padding:28px 26px 30px;background:linear-gradient(180deg,var(--glass-2),var(--glass));border:1px solid var(--line);border-radius:var(--r);box-shadow:inset 0 1px 0 rgba(255,255,255,.07);position:relative}
.step .n{font-family:var(--mono);font-size:12.5px;color:var(--green-2);display:block;margin-bottom:16px;letter-spacing:.06em}
.step h3{margin-bottom:10px}
.step p{font-size:15.5px}
.steps.c4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1000px){.steps.c4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:860px){.steps{grid-template-columns:1fr}}
@media (max-width:600px){.steps.c4{grid-template-columns:1fr}}

/* Phases (operations, home) */
.zig{display:grid;gap:clamp(20px,3vw,36px)}
.zrow{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px);align-items:center}
.zrow.flip .ztext{order:2}
.ztext .n{font-family:var(--mono);font-size:12.5px;color:var(--green-2);letter-spacing:.06em;display:block;margin-bottom:14px}
.ztext h3{font-size:clamp(26px,2.6vw,36px);font-weight:300;letter-spacing:-.025em;line-height:1.12;margin-bottom:14px}
.ztext p{font-size:17px;line-height:1.6;max-width:46ch}
.zcard{padding:30px 30px 26px;position:relative;overflow:hidden;display:grid;gap:14px}
.zcard::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,var(--green-2),var(--teal),transparent)}
.zcard .bn{font-family:var(--mono);font-size:12.5px;color:var(--green-2);letter-spacing:.06em}
.zcard h3{font-size:30px;font-weight:400;letter-spacing:-.02em}
.zcard ul{list-style:none;display:grid;gap:8px;border-top:1px solid var(--line);padding-top:14px}
.zcard li{font-size:14.5px;display:flex;gap:10px}
.zcard li i{flex:none;width:12px;height:7px;margin-top:8px;border-left:1.5px solid var(--green-2);border-bottom:1.5px solid var(--green-2);transform:rotate(-45deg)}
.zcard .out{font-size:14px;color:var(--muted);border-top:1px solid var(--line);padding-top:14px}
@media (max-width:820px){.zrow{grid-template-columns:1fr;gap:16px}.zrow.flip .ztext{order:0}.rv.from-l,.rv.from-r{transform:translateY(16px)}}
.phases{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;position:relative}
.phase{padding:30px 28px;display:flex;flex-direction:column;gap:14px;position:relative;overflow:hidden}
.phase::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,var(--green-2),var(--teal),transparent)}
.phase .n{font-family:var(--mono);font-size:12.5px;color:var(--green-2);letter-spacing:.06em}
.phase h3{font-size:28px;font-weight:400;letter-spacing:-.02em}
.phase .pr{margin-top:6px;border-top:1px solid var(--line);padding-top:14px}
.phase .pr b{display:block;font-size:12px;font-family:var(--mono);color:var(--muted);text-transform:uppercase;font-weight:500;margin-bottom:10px;letter-spacing:.08em}
.phase .pr ul{list-style:none;display:grid;gap:8px}
.phase .pr li{font-size:14.5px;display:flex;gap:10px}
.phase .pr li i{flex:none;width:12px;height:7px;margin-top:8px;border-left:1.5px solid var(--green-2);border-bottom:1.5px solid var(--green-2);transform:rotate(-45deg)}
.phase .out{margin-top:auto;font-size:14px;color:var(--muted);border-top:1px solid var(--line);padding-top:14px}
@media (max-width:900px){.phases{grid-template-columns:1fr}}

/* ---------------- Quotes: carousel ---------------- */
.rmq{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);padding:6px 0}
.rmq-track{display:flex;width:max-content;animation:rmq 90s linear infinite}
.rmq:hover .rmq-track{animation-play-state:paused}
.rcard{width:400px;flex:none;margin-right:16px;padding:22px 24px;display:flex;flex-direction:column;gap:12px}
.rcard .stars{font-family:var(--mono);color:var(--green-2);font-size:12px;letter-spacing:.14em}
.rcard blockquote{margin:0;font-size:15px;line-height:1.55;color:var(--fg)}
.rcard .who{font-size:13.5px;color:var(--muted);display:flex;flex-direction:column;gap:2px;margin-top:auto}
.rcard .who b{color:var(--fg);font-weight:600}
@keyframes rmq{to{transform:translateX(-50%)}}
@media (max-width:520px){.rcard{width:300px}}
@media (prefers-reduced-motion:reduce){.rmq{mask-image:none;-webkit-mask-image:none}.rmq-track{animation:none;width:auto;flex-wrap:wrap;gap:16px}.rcard{margin:0;width:auto;flex:1 1 300px}.rcard[aria-hidden]{display:none}}
.no-js .carousel .slide,.shot .carousel .slide{position:relative;opacity:1;transform:none;margin-bottom:28px}
.note{font-size:13.5px;color:var(--muted);max-width:70ch;margin-top:18px}

/* Stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.stat{padding:26px 24px;background:linear-gradient(180deg,var(--glass-2),var(--glass));border:1px solid var(--line);border-radius:var(--r)}
.stat .v{font-family:var(--display);font-weight:var(--dw);font-size:clamp(36px,3.8vw,56px);letter-spacing:-.03em;color:var(--fg);line-height:1}
.stat .l{margin-top:10px;font-size:14.5px;color:var(--text)}
.stat .s{margin-top:8px;font-family:var(--mono);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.stats.c3{grid-template-columns:repeat(3,1fr)}
@media (max-width:860px){.stats,.stats.c3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:460px){.stats,.stats.c3{grid-template-columns:1fr}}

/* ---------------- Pricing ---------------- */
.plans{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;align-items:stretch}
.plans.c3{grid-template-columns:repeat(3,1fr)}
.plan{padding:32px 30px;display:flex;flex-direction:column;gap:16px;position:relative;overflow:hidden}
.plan.hi{border-color:rgba(20,255,176,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 0 1px rgba(20,255,176,.15),0 30px 80px -30px rgba(12,196,129,.5)}
.plan.hi::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 40% at 50% 0%,rgba(12,196,129,.18),transparent 70%);pointer-events:none}
.plan>*{position:relative}
.plan .k{font-family:var(--mono);font-size:12px;color:var(--green-2);text-transform:uppercase;display:flex;justify-content:space-between;letter-spacing:.06em}
.plan .k em{font-style:normal;color:var(--fg);text-transform:none;letter-spacing:0;font-size:12px;padding:5px 11px;border:1px solid var(--line-2);border-radius:var(--pill);background:var(--glass)}
.plan.big .k{flex-direction:column;align-items:flex-start;gap:12px}
.plan h3{font-size:24px;font-weight:500}
.plan .p{font-family:var(--display);font-weight:var(--dw);font-size:52px;letter-spacing:-.03em;color:var(--fg);line-height:1}
.plan .p small{font-size:15px;letter-spacing:0;color:var(--muted);font-weight:400;margin-left:6px;font-family:var(--font)}
.plan ul{list-style:none;display:grid;gap:10px;border-top:1px solid var(--line);padding-top:16px}
.plan li{font-size:15px;padding-left:24px;position:relative}
.plan li::before{content:"";position:absolute;left:0;top:7px;width:12px;height:7px;border-left:1.5px solid var(--green-2);border-bottom:1.5px solid var(--green-2);transform:rotate(-45deg)}
.plan li.no{color:var(--muted)}
.plan li.no::before{border-color:var(--line-2)}
.plan .btn{margin-top:auto}
.plan.big{grid-column:1/-1;flex-direction:row;align-items:center;gap:40px;flex-wrap:wrap}
.plan.big>div{flex:1 1 320px}
@media (max-width:900px){.plans,.plans.c3{grid-template-columns:1fr}}
.ptable{width:100%;border-collapse:separate;border-spacing:0;font-size:15px;overflow:hidden}
.ptable th,.ptable td{text-align:left;padding:18px 18px;border-bottom:1px solid var(--line);vertical-align:top}
.ptable th{font-family:var(--mono);font-size:11.5px;text-transform:uppercase;color:var(--muted);font-weight:500;letter-spacing:.08em}
.ptable td.p{font-family:var(--mono);color:var(--fg);white-space:nowrap;font-size:14px}
.ptable tr:last-child td{border-bottom:0}
.ptable tr:hover td{background:rgba(255,255,255,.03)}
.tablewrap{overflow-x:auto;padding:6px}

/* ---------------- FAQ ---------------- */
.faq{display:grid;gap:10px}
.faq details{background:linear-gradient(180deg,var(--glass-2),var(--glass));border:1px solid var(--line);border-radius:var(--r-sm);padding:0 22px;transition:border-color .3s}
.faq details[open]{border-color:var(--line-2)}
.faq summary{list-style:none;cursor:pointer;padding:20px 40px 20px 0;font-size:17.5px;font-weight:500;color:var(--fg);position:relative;letter-spacing:-.01em;font-family:var(--display)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);position:absolute;right:0;top:18px;color:var(--green-2);font-size:20px;font-weight:300}
.faq details[open] summary::after{content:"–"}
.faq .a{padding:0 0 22px;max-width:70ch;font-size:16px;color:var(--text)}
.faq .a p+p{margin-top:10px}

/* ---------------- Form + calendar ---------------- */
.book{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,4vw,64px);align-items:start}
@media (max-width:900px){.book{grid-template-columns:1fr}}
.lead{display:grid;gap:14px;padding:26px}
.lead label{display:grid;gap:6px;font-size:14px;font-weight:600;color:var(--fg)}
.lead label small{font-weight:400;color:var(--muted)}
.lead input{font:inherit;font-size:16px;padding:14px 16px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:rgba(0,0,0,.25);color:var(--fg);width:100%}
.lead input::placeholder{color:var(--muted)}
.lead input:focus{outline:2px solid var(--green);outline-offset:1px;border-color:var(--green)}
.lead input[aria-invalid="true"]{border-color:var(--red)}
.lead .err{font-size:13px;color:var(--red);display:none}
.lead .consent{font-size:13px;color:var(--muted)}
.lead .btn{width:100%;margin-top:4px}
.lead.sent{display:none}
.calwrap{min-height:520px;position:relative;overflow:hidden;background:var(--light);border-radius:var(--r);border:1px solid var(--line-2)}
.calwrap.locked::before{content:"Fill in the three fields to open the calendar";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;font-family:var(--mono);font-size:13px;color:var(--text);background:var(--bg-2);z-index:2}
.calwrap.locked #cal-inline{visibility:hidden}
#cal-inline{min-height:520px}
.calfall{padding:20px;text-align:center;font-size:14px;color:var(--light-muted)}
.calfall a{display:inline-block;margin-top:10px;color:var(--light-ink)}
.what{display:grid;gap:12px;list-style:none;margin-top:24px}
.what li{display:flex;gap:12px;font-size:15.5px}
.what li b{font-weight:600;color:var(--fg)}
.what li i{flex:none;font-family:var(--mono);font-size:12px;color:var(--green-2);margin-top:5px}

/* ---------------- Terminal demo (Slack brain) ---------------- */
.term{border:1px solid var(--line-2);border-radius:var(--r);background:rgba(0,0,0,.45);color:var(--fg);font-family:var(--mono);font-size:13px;overflow:hidden;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 30px 80px -30px rgba(0,0,0,.8)}
.term .bar{display:flex;gap:6px;padding:12px 14px;border-bottom:1px solid var(--line);align-items:center}
.term .bar i{width:10px;height:10px;border-radius:50%;background:var(--line-2)}
.term .bar i:nth-child(1){background:#FF5F57}.term .bar i:nth-child(2){background:#FEBC2E}.term .bar i:nth-child(3){background:#28C840}
.term .bar span{margin-left:auto;font-size:11px;color:var(--muted)}
.term .out{padding:16px 18px;min-height:260px;white-space:pre-wrap;line-height:1.6}
.term .out .c{color:var(--green-2)}
.term .cmds{display:flex;flex-wrap:wrap;gap:6px;padding:12px 14px;border-top:1px solid var(--line)}
.term .cmds button{font:inherit;font-size:12px;background:transparent;color:var(--text);border:1px solid var(--line-2);border-radius:var(--pill);padding:7px 12px;cursor:pointer}
.term .cmds button:hover,.term .cmds button.on{border-color:var(--green-2);color:var(--green-2)}

/* ---------------- Capability cards with small UI vignettes ---------------- */
.caps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cap{padding:22px;display:flex;flex-direction:column;gap:14px}
.cap-h{display:flex;align-items:baseline;gap:12px}
.cap-h .n{font-family:var(--mono);font-size:12px;color:var(--green-2);letter-spacing:.06em}
.cap h3{font-size:19px}
.cap p{font-size:15px;line-height:1.55}
.viz{background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px;display:grid;gap:8px;font-size:13px}
.ui-row{display:flex;align-items:center;gap:10px;background:var(--glass-2);border:1px solid var(--line);border-radius:10px;padding:9px 11px}
.ui-row .dot{width:8px;height:8px;border-radius:50%;background:var(--green-2);flex:none;box-shadow:0 0 10px var(--green-2)}
.ui-grow{flex:1;min-width:0}
.ui-t{font-weight:600;color:var(--fg);font-size:13px}
.ui-s{color:var(--muted);font-size:12px}
.ui-pill{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;color:var(--green-2);border:1px solid rgba(20,255,176,.4);border-radius:var(--pill);padding:3px 8px}
.bub{background:var(--glass-2);border:1px solid var(--line);border-radius:14px 14px 14px 4px;padding:8px 11px;max-width:85%;font-size:13px;color:var(--fg)}
.bub.me{background-color:var(--green);background-image:linear-gradient(135deg,var(--green-2),var(--green));color:var(--light-ink);border-color:transparent;border-radius:14px 14px 4px 14px;margin-left:auto}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-size:13px;border:1px solid var(--line-2);border-radius:var(--pill);padding:6px 12px;background:var(--glass);color:var(--text)}
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kpi{background:var(--glass-2);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.kpi .n{font-family:var(--display);font-weight:var(--dw);font-size:26px;letter-spacing:-.02em;color:var(--fg)}
.kpi .l{font-size:12px;color:var(--muted)}
.cmdline{font-family:var(--mono);font-size:12.5px;color:var(--green-2)}
.cmdsub{font-size:12px;color:var(--muted)}
.lockrow{background:var(--glass-2);border:1px solid var(--line);border-radius:10px;padding:8px 11px;font-size:12.5px;color:var(--fg);padding-left:28px;position:relative}
.lockrow::before{content:"";position:absolute;left:11px;top:12px;width:8px;height:8px;background:var(--green-2);border-radius:50%;box-shadow:0 0 8px var(--green-2)}
.pbar{height:8px;background:rgba(255,255,255,.08);border-radius:4px;overflow:hidden}
.pbar span{display:block;height:100%;background:linear-gradient(90deg,var(--green-2),var(--teal));border-radius:4px}
.win{background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden}
.win .bar-top{display:flex;gap:5px;padding:8px 10px;border-bottom:1px solid var(--line)}
.win .bar-top i{width:8px;height:8px;border-radius:50%;background:var(--line-2)}
.win .body{padding:12px}
@media (max-width:1000px){.caps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.caps{grid-template-columns:1fr}}

/* Browser mock (websites hero) */
.mock{padding:0;overflow:hidden}
.mock .bar-top{display:flex;gap:6px;padding:12px 14px;border-bottom:1px solid var(--line);align-items:center}
.mock .bar-top i{width:10px;height:10px;border-radius:50%;background:var(--line-2)}
.mock .bar-top i:nth-child(1){background:#FF5F57}.mock .bar-top i:nth-child(2){background:#FEBC2E}.mock .bar-top i:nth-child(3){background:#28C840}
.mock .url{margin-left:10px;flex:1;font-family:var(--mono);font-size:11.5px;color:var(--muted);background:rgba(0,0,0,.3);border-radius:var(--pill);padding:6px 12px}
.mock .body{padding:22px;display:grid;gap:14px}
.mock .hero-l{display:grid;gap:10px}
.mock .hero-l b{display:block;height:14px;border-radius:7px;background:rgba(255,255,255,.22);width:70%}
.mock .hero-l b+b{width:48%}
.mock .hero-l span{display:block;height:8px;border-radius:4px;background:rgba(255,255,255,.1);width:85%}
.mock .m-cta{display:block;width:120px;height:30px;border-radius:var(--pill);background:linear-gradient(135deg,var(--green-2),var(--green))}
.mock .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.mock .cards i{display:block;height:64px;border-radius:10px;background:var(--glass-2);border:1px solid var(--line)}
.mock .row{display:flex;gap:10px;align-items:center}
.mock .row .ui-pill{margin-left:auto}

/* Journey (7 steps) */
.journey{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}
.journey div{padding:18px 16px;background:linear-gradient(180deg,var(--glass-2),var(--glass));border:1px solid var(--line);border-radius:var(--r-sm)}
.journey .n{font-family:var(--mono);font-size:11.5px;color:var(--green-2);display:block;margin-bottom:10px;letter-spacing:.06em}
.journey h3{font-size:16px;margin-bottom:6px}
.journey p{font-size:13.5px;line-height:1.45;color:var(--muted)}
@media (max-width:1100px){.journey{grid-template-columns:repeat(4,1fr)}}
@media (max-width:700px){.journey{grid-template-columns:repeat(2,1fr)}}

/* Agents (8 jobs) */
.agents{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.agents div{padding:22px 20px;background:linear-gradient(180deg,var(--glass-2),var(--glass));border:1px solid var(--line);border-radius:var(--r-sm)}
.agents .n{font-family:var(--mono);font-size:12px;color:var(--green-2);display:block;margin-bottom:10px;letter-spacing:.06em}
.agents h3{font-size:17px;margin-bottom:6px}
.agents p{font-size:14.5px;line-height:1.5}
@media (max-width:1000px){.agents{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.agents{grid-template-columns:1fr}}

/* Roles (outcomes) */
.roles{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.roles h3{font-size:17px;margin-bottom:8px;padding-top:14px;border-top:1px solid var(--line-2)}
.roles p{font-size:15px}
@media (max-width:900px){.roles{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.roles{grid-template-columns:1fr}}

/* Problem statement (industry pages) */
.problem{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
.problem h2{max-width:18ch}
.problem .pain{font-size:clamp(17px,1.5vw,20px);line-height:1.6;color:var(--text)}
.problem .pain b{color:var(--green-2);font-weight:600}
@media (max-width:860px){.problem{grid-template-columns:1fr}}

/* ---------------- Scope builder (websites) ---------------- */
.sb{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:28px;align-items:start}
@media (max-width:900px){.sb{grid-template-columns:1fr}}
.sb-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media (max-width:640px){.sb-opts{grid-template-columns:repeat(2,1fr)}}
.sb-opt{display:flex;align-items:center;gap:10px;border:1px solid var(--line-2);border-radius:var(--r-sm);padding:12px 14px;cursor:pointer;font-size:14.5px;color:var(--fg);background:var(--glass);user-select:none;transition:border-color .2s,background .2s}
.sb-opt input{accent-color:var(--green);width:16px;height:16px;margin:0}
.sb-opt:has(input:checked){border-color:rgba(20,255,176,.5);background:rgba(12,196,129,.12)}
.sb-opt:has(input:disabled){opacity:.7;cursor:default}
.sb-card{padding:26px;position:sticky;top:96px}
.sb-card .k{font-family:var(--mono);font-size:12px;text-transform:uppercase;color:var(--muted);letter-spacing:.08em}
.sb-card .meter{height:6px;background:rgba(255,255,255,.08);border-radius:3px;margin:10px 0 6px;overflow:hidden}
.sb-card .meter i{display:block;height:100%;background:linear-gradient(90deg,var(--green-2),var(--teal));width:10%;transition:width .3s}
.sb-card .row{display:flex;justify-content:space-between;font-size:14px;color:var(--text);padding:6px 0}
.sb-card .row b{color:var(--fg);font-weight:600}
.sb-card .price{font-family:var(--display);font-weight:var(--dw);font-size:56px;letter-spacing:-.03em;color:var(--fg);line-height:1;margin:16px 0 4px}
.sb-card .price small{font-size:15px;letter-spacing:0;color:var(--muted);margin-left:6px;font-family:var(--font)}
.sb-card .lock{font-family:var(--mono);font-size:12px;color:var(--green-2);text-transform:uppercase;letter-spacing:.08em}
.sb-card ul{list-style:none;margin-top:14px;border-top:1px solid var(--line);padding-top:12px;display:grid;gap:5px;font-size:13.5px;color:var(--text)}
.sb-card ul li::before{content:"— ";color:var(--green-2)}

/* ---------------- Prose (legal, guides) ---------------- */
.prose{max-width:760px}
.prose h2{font-size:clamp(26px,2.6vw,34px);margin:clamp(36px,4vw,56px) 0 16px}
.prose h3{margin:28px 0 10px}
.prose p{margin:0 0 16px}
.prose ul,.prose ol{margin:0 0 18px 22px}
.prose li{margin-bottom:6px}
.prose li::marker{color:var(--green-2)}
.prose table{width:100%;border-collapse:collapse;font-size:15px;margin:0 0 20px}
.prose th,.prose td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{font-family:var(--mono);font-size:12px;text-transform:uppercase;color:var(--muted);font-weight:500}
.prose .toc{border:1px solid var(--line);border-radius:var(--r-sm);padding:16px 20px;font-size:14.5px;margin-bottom:28px;background:var(--glass)}
.prose .toc a{display:block;padding:3px 0;text-decoration:none}
.eff{font-family:var(--mono);font-size:12.5px;color:var(--muted);margin-bottom:24px}

/* Crumbs */
.crumbs{font-family:var(--mono);font-size:12px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px;text-transform:uppercase;letter-spacing:.06em}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--green-2)}

/* Two-column feature rows */
.row2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
.row2.rev>:first-child{order:2}
@media (max-width:860px){.row2{grid-template-columns:1fr}.row2.rev>:first-child{order:0}}
.figure{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--glass)}
.figure img,.figure video{width:100%;height:auto}
.figure figcaption{padding:10px 14px;font-size:13px;color:var(--muted);border-top:1px solid var(--line)}
.list{list-style:none;display:grid;gap:12px;margin-top:22px}
.list li{display:flex;gap:12px;font-size:16px}
.list li i{flex:none;width:12px;height:7px;margin-top:9px;border-left:1.5px solid var(--green-2);border-bottom:1.5px solid var(--green-2);transform:rotate(-45deg)}
.list li b{font-weight:600;color:var(--fg)}

/* Linked list of related pages (SEO hubs) */
.links{columns:3;column-gap:32px;font-size:15px}
.links a{display:block;padding:8px 0;text-decoration:none;border-bottom:1px solid var(--line);break-inside:avoid;color:var(--text)}
.links a:hover{color:var(--green-2)}
.links.c4{columns:4}
@media (max-width:900px){.links,.links.c4{columns:2}}
@media (max-width:520px){.links,.links.c4{columns:1}}

/* ---------------- Closing statement + CTA band + footer ---------------- */
.close{padding:clamp(80px,12vw,180px) 0 clamp(48px,6vw,90px);text-align:center}
.close p{font-family:var(--display);font-weight:var(--dw);font-size:clamp(30px,4.6vw,64px);line-height:1.08;letter-spacing:-.03em;color:var(--fg);max-width:22ch;margin:0 auto}
.close p+p{margin-top:.4em}
.close .btns{justify-content:center;margin-top:40px}
.cta{padding:clamp(48px,6vw,96px) 0 clamp(64px,8vw,120px)}
.cta .box{padding:clamp(32px,5vw,64px);display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:end;position:relative;overflow:hidden}
.cta .box::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 0% 0%,rgba(12,196,129,.22),transparent 70%),radial-gradient(40% 50% at 100% 100%,rgba(59,123,255,.18),transparent 70%);pointer-events:none}
.cta .box>*{position:relative}
.cta h2{max-width:20ch}
.cta .lede{margin-top:22px;max-width:56ch}
.cta .btns{margin-top:32px}
.cta .aside{font-size:14.5px;color:var(--text);display:grid;gap:12px}
.cta .aside b{color:var(--fg);font-weight:600}
@media (max-width:860px){.cta .box{grid-template-columns:1fr}}
.ftr{border-top:1px solid var(--line);padding:56px 0 36px;font-size:14.5px;color:var(--muted);background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.35))}
.ftr .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:32px}
.ftr h4{font-family:var(--mono);font-size:11.5px;text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:14px;letter-spacing:.1em}
.ftr a{color:var(--text);text-decoration:none;display:block;padding:4px 0}
.ftr a:hover{color:var(--green-2)}
.ftr .brand{margin-bottom:14px}
.ftr .about{max-width:34ch;font-size:14px;line-height:1.6;color:var(--muted)}
.ftr .about a{display:inline;color:var(--text)}
.ftr .legal{margin-top:44px;padding-top:22px;border-top:1px solid var(--line);font-size:12.5px;line-height:1.6;color:var(--muted);display:grid;gap:10px}
.ftr .legal p{max-width:120ch}
@media (max-width:1000px){.ftr .cols{grid-template-columns:1fr 1fr 1fr}.ftr .cols>:first-child{grid-column:1/-1}}
@media (max-width:560px){.ftr .cols{grid-template-columns:1fr 1fr}}

/* ---------------- Utilities ---------------- */
.mt-0{margin-top:0}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mt-4{margin-top:32px}.mt-6{margin-top:48px}
.center{text-align:center}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--green-2);color:var(--light-ink);padding:10px 14px;z-index:200}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--green-2);outline-offset:2px}

/* ---------- light theme (toggle in the header; ?theme=light for captures) ---------- */
:root[data-theme=light],.t-light{
  --bg:#F3F6F4;--bg-2:#EAF0EC;--bg-3:#DFE7E2;
  --fg:#0E1210;--text:#3D4844;--muted:#5E6863;
  --line:rgba(14,18,16,.09);--line-2:rgba(14,18,16,.2);
  --glass:rgba(255,255,255,.55);--glass-2:rgba(255,255,255,.82);--glass-hi:rgba(255,255,255,1);
  --green-2:#087A50;--light:#FFFFFF;
}
:is(:root[data-theme=light],.t-light) .aurora i{mix-blend-mode:normal;opacity:.5}
:is(:root[data-theme=light],.t-light) .aurora::after{background-image:linear-gradient(rgba(14,18,16,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(14,18,16,.045) 1px,transparent 1px)}
:is(:root[data-theme=light],.t-light) .glass,:is(:root[data-theme=light],.t-light) .cell,:is(:root[data-theme=light],.t-light) .offer,:is(:root[data-theme=light],.t-light) .ind,:is(:root[data-theme=light],.t-light) .phase,:is(:root[data-theme=light],.t-light) .plan{box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 24px 60px -30px rgba(14,18,16,.22)}
:is(:root[data-theme=light],.t-light) .hdr::before{background:rgba(243,246,244,.7)}
:is(:root[data-theme=light],.t-light) .hdr.is-stuck::before{background:rgba(243,246,244,.86)}
:is(:root[data-theme=light],.t-light) .menu{background:rgba(255,255,255,.96)}
:is(:root[data-theme=light],.t-light) .hdr.open .nav{background:rgba(243,246,244,.98)}
:is(:root[data-theme=light],.t-light) .btn{color:#0E1210}
:is(:root[data-theme=light],.t-light) .btn-out{background-color:rgba(255,255,255,.7)}
:is(:root[data-theme=light],.t-light) .term{background:#0B1015;color:#F2F6F3;border-color:rgba(255,255,255,.14)}
:is(:root[data-theme=light],.t-light) .viz,:is(:root[data-theme=light],.t-light) .win{background:rgba(255,255,255,.5)}
:is(:root[data-theme=light],.t-light) .skip{color:#fff}
:is(:root[data-theme=light],.t-light) .term .out .c{color:#14FFB0}
:is(:root[data-theme=light],.t-light) .term .cmds button{color:#D5DCD8;border-color:rgba(255,255,255,.22)}
:is(:root[data-theme=light],.t-light) .term .cmds button:hover,:is(:root[data-theme=light],.t-light) .term .cmds button.on{border-color:#14FFB0;color:#14FFB0}
:is(:root[data-theme=light],.t-light) .term .bar span{color:#8E9A93}
:is(:root[data-theme=light],.t-light) .lead input{background:rgba(255,255,255,.8)}
:is(:root[data-theme=light],.t-light) .mock .url{background:rgba(14,18,16,.06)}
:is(:root[data-theme=light],.t-light) .mock .hero-l b{background:rgba(14,18,16,.22)}
:is(:root[data-theme=light],.t-light) .mock .hero-l span{background:rgba(14,18,16,.1)}
:is(:root[data-theme=light],.t-light) .ftr{background:linear-gradient(180deg,rgba(14,18,16,0),rgba(14,18,16,.05))}
:is(:root[data-theme=light],.t-light) .sec-alt{background:linear-gradient(180deg,rgba(14,18,16,.025),rgba(14,18,16,0))}
:is(:root[data-theme=light],.t-light) .bub{color:var(--fg)}
:is(:root[data-theme=light],.t-light) .bub.me{color:#0E1210}
:is(:root[data-theme=light],.t-light) .offer:hover{box-shadow:inset 0 1px 0 #fff,0 30px 70px -30px rgba(12,196,129,.35)}
:is(:root[data-theme=light],.t-light) .plan.hi{box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(8,122,80,.2),0 30px 80px -30px rgba(12,196,129,.35)}
:is(:root[data-theme=light],.t-light) .pre .bar i{background:linear-gradient(90deg,#0CC481,#19C6E6)}
:is(:root[data-theme=light],.t-light) .hero-glow{opacity:.6}

/* ---------- variation mode: sections alternate black / dark grey / white (app.js adds the classes) ---------- */
.t-grey{background:#0F161C;position:relative}
.t-light{background:#F3F6F4;position:relative;color:var(--text)}
.t-light .sec-head h2,.t-light h3{color:var(--fg)}
.theme .vary{display:none}
:root[data-theme=light] .theme .sun,:root[data-theme=light] .theme .moon{display:none}
:root[data-theme=light] .theme .vary{display:block}
:root[data-theme=vary] .theme .sun,:root[data-theme=vary] .theme .vary{display:none}
:root[data-theme=vary] .theme .moon{display:block}

/* ---------- sweep 5 (2026-09-18) ---------- */
/* struck former price */
s.was{color:var(--muted);font-weight:inherit;text-decoration-line:line-through;text-decoration-thickness:1.5px;margin-right:.2em;font-size:.8em}
.plan h3 s.was,.sec-head h2 s.was{font-size:.62em;vertical-align:.12em}
/* offers: one accent per offer, border + top rule + hover glow */
.offers .offer{border-color:color-mix(in srgb,var(--acc,#14FFB0) 40%,transparent)}
.offers .offer::before{background:radial-gradient(60% 50% at 20% 0%,color-mix(in srgb,var(--acc,#14FFB0) 24%,transparent),transparent 70%)}
.offers .offer:hover{border-color:var(--acc,#14FFB0)}
/* industry cards carry their photo; the card keeps its size, the photo is fitted to it */
.ind.photo{position:relative;overflow:hidden;isolation:isolate;background-color:#0B1015}
.ind.photo:hover{background-color:#0B1015}
.ind.photo::before{content:"";position:absolute;inset:0;background:var(--img) center/cover no-repeat;z-index:-2;transition:transform .8s var(--ease)}
.ind.photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,10,13,.38) 0%,rgba(7,10,13,.8) 52%,rgba(7,10,13,.95) 100%);z-index:-1}
.ind.photo:hover::before{transform:scale(1.06)}
.inds .ind.photo h3,.inds .ind.photo .go{color:#F2F6F3}
.inds .ind.photo p{color:#D5DCD8}
.inds .ind.photo .k{color:#C9D2CD}
.inds .ind.photo:hover .go{color:#14FFB0}
/* big plan cards: the button sits in the bottom-right corner, not under the list */
.plan.big{align-items:stretch}
.plan.big>div:last-child{display:flex;flex-direction:column}
.plan.big>div:last-child>ul{margin-bottom:26px}
.plan.big>div:last-child>.btn{margin-top:auto;align-self:flex-end}
@media (max-width:760px){.plan.big>div:last-child>.btn{align-self:flex-start}}
/* the team */
.team{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.member{padding:14px 26px 14px 14px;display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:24px;align-items:start}
.member .ph{aspect-ratio:4/5;border-radius:calc(var(--r) - 6px);overflow:hidden;background:radial-gradient(80% 70% at 30% 20%,rgba(12,196,129,.35),transparent 70%),#0B1015;display:grid;place-items:center}
.member .ph img{width:100%;height:100%;object-fit:cover;display:block}
.member .ph span{font-family:var(--display);font-weight:300;font-size:56px;color:#F2F6F3;letter-spacing:-.03em}
.member .role{display:block;font-family:var(--mono);font-size:12px;color:var(--green-2);letter-spacing:.06em;text-transform:uppercase;margin-top:12px}
.member h3{font-size:28px;font-weight:400;letter-spacing:-.02em;margin:8px 0 12px}
.member p{font-size:15.5px;line-height:1.6}
.member p+p{margin-top:10px}
@media (max-width:1060px){.team{grid-template-columns:1fr}}
@media (max-width:560px){.member{grid-template-columns:1fr;padding:14px 14px 22px}.member .ph{max-width:240px}.member .role{margin-top:4px}}
/* proof of execution block at the top of /operations/ */
.pb-proof .playbook .sec{padding-top:clamp(40px,5vw,72px)}
.offer .price s.was,.ptable s.was,.hero-facts s.was{font-size:1em}
.hero-media .hero-glow{inset:0}

/* ---------- sweep 6 (2026-09-18) ---------- */
.stage-strip.plain{grid-template-columns:1fr auto 1fr auto 1fr}
.stage-strip .st-div{width:1px;align-self:stretch;background:var(--line-2)}
@media (max-width:760px){.stage-strip .st-div{width:auto;height:1px}}
/* founders: the section pins; each founder fills the screen, photo full-bleed on one half, bio on the other */
.founders{position:relative}
.founders .f-track{height:calc(var(--fn,2) * 100vh + 100vh)}
.founders .f-sticky{position:sticky;top:0;height:100vh;overflow:hidden}
.f-stage{position:relative;height:100%}
.fslide{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,46fr) minmax(0,54fr);opacity:0;transition:opacity .8s var(--ease);pointer-events:none}
.fslide.on{opacity:1;pointer-events:auto}
.fslide.flip{grid-template-columns:minmax(0,54fr) minmax(0,46fr)}
.fslide.flip .f-ph{order:2}
.f-ph{margin:0;position:relative;overflow:hidden;background:radial-gradient(80% 60% at 30% 20%,rgba(12,196,129,.3),transparent 70%),#0B1015;display:grid;place-items:center}
.f-ph::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(7,10,13,.35) 0,rgba(7,10,13,0) 22%,rgba(7,10,13,0) 78%,rgba(7,10,13,.25) 100%)}
.f-ph img{width:100%;height:100%;object-fit:cover;object-position:50% 14%;display:block;transform:scale(1.07);transition:transform 1.8s var(--ease)}
.fslide.on .f-ph img{transform:scale(1)}
.f-ph span{font-family:var(--display);font-weight:300;font-size:96px;color:#F2F6F3}
.f-bio{display:flex;align-items:center;padding:96px clamp(28px,5vw,96px) 40px}
.f-in{max-width:640px;transform:translateY(22px);transition:transform .9s var(--ease)}
.fslide.on .f-in{transform:none}
.f-kick{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:22px}
.f-kick b{color:var(--fg);font-weight:500}
.f-bio .role{display:block;font-family:var(--mono);font-size:12.5px;color:var(--green-2);letter-spacing:.06em;text-transform:uppercase}
.f-bio h2{font-size:clamp(44px,min(5vw,8.4vh),78px);line-height:1;margin:12px 0 18px}
.f-lead{font-family:var(--display);font-weight:300;font-size:clamp(19px,min(1.8vw,3vh),25px);line-height:1.35;color:var(--fg);margin-bottom:16px}
.f-bio p{font-size:clamp(14.5px,1.9vh,16px);line-height:1.62}
.f-bio p+p{margin-top:11px}
.f-bio .f-owns{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:14.5px;color:var(--text)}
.f-owns b{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:500;margin-right:10px}
/* the still layout: phones, short windows, reduced motion, captures */
.founders.static .f-track,.shot .founders .f-track,.no-js .founders .f-track{height:auto}
.founders.static .f-sticky,.shot .founders .f-sticky,.no-js .founders .f-sticky{position:static;height:auto;overflow:visible}
.founders.static .fslide,.shot .founders .fslide,.no-js .founders .fslide{position:relative;opacity:1;pointer-events:auto;min-height:min(100vh,960px)}
.founders.static .f-in,.shot .founders .f-in,.no-js .founders .f-in{transform:none}
.founders.static .f-ph img,.shot .founders .f-ph img,.no-js .founders .f-ph img{transform:none}
@media (prefers-reduced-motion:reduce){.founders .f-track{height:auto}.founders .f-sticky{position:static;height:auto;overflow:visible}.founders .fslide{position:relative;opacity:1;min-height:min(100vh,960px)}.founders .f-in,.founders .f-ph img{transform:none;transition:none}}
@media (max-height:639px){.founders .f-track{height:auto}.founders .f-sticky{position:static;height:auto;overflow:visible}.founders .fslide{position:relative;opacity:1;pointer-events:auto;min-height:0}.founders .f-in,.founders .f-ph img{transform:none}}
@media (max-width:899px){
  .founders .f-track{height:auto}.founders .f-sticky{position:static;height:auto;overflow:visible}
  .founders .fslide,.founders .fslide.flip{position:relative;opacity:1;pointer-events:auto;grid-template-columns:1fr;min-height:0}
  .founders .fslide.flip .f-ph{order:0}
  .founders .f-ph{aspect-ratio:4/5}
  .founders .f-ph img{object-position:50% 12%;transform:none}
  .founders .f-bio{padding:32px var(--gutter) 64px}
  .founders .f-in{transform:none}
}
.founders .f-sticky>.wrap{width:100%}
.stage-strip.plain{align-items:start}
.steps.c5{grid-template-columns:repeat(6,1fr)}.steps.c5 .step{grid-column:span 2}.steps.c5 .step:nth-child(n+4){grid-column:span 3}
@media (max-width:1000px){.steps.c5{grid-template-columns:repeat(2,1fr)}.steps.c5 .step,.steps.c5 .step:nth-child(n+4){grid-column:auto}.steps.c5 .step:last-child{grid-column:1/-1}}
@media (max-width:600px){.steps.c5{grid-template-columns:1fr}.steps.c5 .step:last-child{grid-column:auto}}
.prose .pull{font-family:var(--display);font-weight:300;font-size:clamp(28px,3vw,42px);line-height:1.12;letter-spacing:-.025em;color:var(--fg);margin:0 0 26px}

/* ---------- sweep 8: the NorthCore story, in chapters ---------- */
.saga{padding:clamp(88px,11vw,170px) 0}
.saga-head h2{font-size:clamp(40px,5.4vw,80px);line-height:1.02;max-width:17ch}
.chapters{list-style:none;margin:clamp(56px,7vw,96px) 0 0;padding:0}
.chapter{display:grid;grid-template-columns:minmax(0,210px) minmax(0,1fr) minmax(0,300px);gap:clamp(24px,4vw,64px);padding:clamp(36px,4.5vw,56px) 0;border-top:1px solid var(--line);align-items:start}
.chapter:last-child{border-bottom:1px solid var(--line)}
.chapter.wide .ch-body{grid-column:2 / -1}
.ch-n span{display:block;font-family:var(--display);font-weight:300;font-size:clamp(56px,6vw,96px);line-height:.9;color:var(--green-2);letter-spacing:-.04em}
.ch-n b{display:block;margin-top:12px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:500}
.ch-body h3{font-size:clamp(24px,2.4vw,32px);font-weight:400;letter-spacing:-.02em;line-height:1.15;margin-bottom:14px}
.ch-body p{font-size:17px;line-height:1.65;max-width:64ch}
.ch-body p+p{margin-top:12px}
.ch-stat{padding:26px 24px 24px;display:grid;gap:10px}
.ch-stat b{font-family:var(--display);font-weight:300;font-size:clamp(40px,4vw,58px);line-height:1;color:var(--fg);letter-spacing:-.03em;white-space:nowrap}
.ch-stat span{font-size:14px;line-height:1.5;color:var(--text)}
.why{margin-top:clamp(64px,8vw,120px);max-width:1000px}
.why-big{font-family:var(--display);font-weight:300;font-size:clamp(30px,3.6vw,52px);line-height:1.1;letter-spacing:-.025em;color:var(--fg);margin:4px 0 24px}
.why p:not(.why-big){font-size:18px;line-height:1.65;max-width:66ch}
.why p:not(.why-big)+p{margin-top:12px}
.saga-foot{margin-top:clamp(56px,6vw,88px);display:flex;gap:56px;flex-wrap:wrap;padding-top:24px;border-top:1px solid var(--line);font-size:15px}
.saga-foot .n{font-family:var(--mono);font-size:12px;color:var(--green-2);letter-spacing:.06em;text-transform:uppercase;display:block;margin-bottom:6px}
@media (max-width:1060px){.chapter{grid-template-columns:minmax(0,150px) minmax(0,1fr)}.ch-stat{grid-column:2}.chapter.wide .ch-body{grid-column:2}}
@media (max-width:640px){.chapter,.chapter.wide{grid-template-columns:1fr;gap:16px}.ch-stat,.chapter.wide .ch-body{grid-column:auto}.ch-n{display:flex;align-items:baseline;gap:14px}.ch-n span{font-size:52px}.ch-n b{margin:0}}

/* ---------- sweep 9: the story as a zig-zag, no numbering ---------- */
.story{margin-top:clamp(56px,7vw,96px)}
.srow{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:center}
.srow.flip .stext{order:2}
.stext .k{display:block;font-family:var(--mono);font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--green-2);margin-bottom:14px}
.stext h3{font-size:clamp(28px,2.9vw,40px);font-weight:300;letter-spacing:-.025em;line-height:1.1;margin-bottom:16px}
.stext p{font-size:17px;line-height:1.65;max-width:48ch}
.stext p+p{margin-top:12px}
.s-arrow{display:flex;justify-content:center;padding:clamp(18px,3vw,34px) 0}
.s-arrow i{position:relative;display:block;width:2px;height:clamp(56px,7vw,88px);background:linear-gradient(var(--line),var(--green-2))}
.s-arrow i::after{content:"";position:absolute;left:50%;bottom:0;width:12px;height:12px;border-right:2px solid var(--green-2);border-bottom:2px solid var(--green-2);transform:translate(-50%,1px) rotate(45deg)}
.s-inds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.s-inds a{position:relative;aspect-ratio:4/5;border-radius:14px;overflow:hidden;background:#111 var(--img) center/cover no-repeat;border:1px solid var(--line);display:flex;align-items:flex-end;padding:12px;text-decoration:none;isolation:isolate}
.s-inds a::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.78))}
.s-inds a span{color:#fff;font-size:14px;font-weight:500;letter-spacing:-.01em;line-height:1.2}
.s-inds a{transition:transform .35s ease,border-color .35s ease}
.s-inds a:hover{transform:translateY(-3px);border-color:var(--green-2)}
.s-gap{padding:28px 26px 24px;display:grid;gap:0}
.s-gap .gh,.s-gap .gr{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.s-gap .gh b{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:500;padding-bottom:12px}
.s-gap .gr{border-top:1px solid var(--line);padding:16px 0;font-size:15.5px;line-height:1.45}
.s-gap .ok{color:var(--fg)}
.s-gap .lk{color:var(--fg);padding-left:16px;border-left:2px solid #ff6b5a}
.s-gap p{border-top:1px solid var(--line);padding-top:16px;font-size:15px;color:var(--text)}
.s-stat{padding:36px 32px 32px;display:grid;gap:14px}
.s-stat b{font-family:var(--display);font-weight:300;font-size:clamp(56px,6vw,92px);line-height:1;color:var(--fg);letter-spacing:-.04em;white-space:nowrap}
.s-stat span{font-size:15.5px;line-height:1.55;color:var(--text);max-width:40ch}
@media (max-width:860px){.srow{grid-template-columns:1fr;gap:22px}.srow.flip .stext{order:0}}
@media (max-width:520px){.s-inds{grid-template-columns:repeat(2,minmax(0,1fr))}.s-inds a{aspect-ratio:1/1}.s-gap{padding:22px 18px 18px}.s-gap .gh,.s-gap .gr{gap:12px}.s-gap .gr{font-size:14.5px}.s-gap .lk{padding-left:10px}.s-stat{padding:28px 22px 24px}}

/* ---------- sweep 11: chapters without numbers; the chapter name carries the left column ---------- */
.ch-n b{margin-top:0;font-family:var(--display);font-size:clamp(26px,2.6vw,36px);font-weight:300;letter-spacing:-.02em;text-transform:none;line-height:1.1;color:var(--green-2)}
@media (max-width:640px){.ch-n b{font-size:26px}}
.ch-stat b{font-size:clamp(36px,3.3vw,50px)}

/* ---------- sweep 12: our why, one statement, one font, one highlight ---------- */
.saga{padding-bottom:clamp(56px,7vw,110px)}
.why-sec{padding:clamp(80px,10vw,150px) 0}
.why-one{max-width:1080px;margin:0 auto;text-align:center}
.why-one .label{justify-content:center;margin-bottom:clamp(20px,2.4vw,30px)}
.why-one p{font-family:var(--display);font-weight:300;font-size:clamp(28px,3.4vw,50px);line-height:1.18;letter-spacing:-.025em;color:var(--fg)}
.why-one mark{color:inherit;font-weight:500;background:linear-gradient(180deg,transparent 58%,color-mix(in srgb,var(--green-2) 38%,transparent) 58%);padding:0 .08em;border-radius:2px}
.why-one p{text-wrap:balance}
.why-one mark{background:none;padding:0;border-radius:0;font-weight:inherit;color:var(--green-2)}

/* ---------- sweep 15: the line that closes the NorthCore story ---------- */
.saga-close{margin-top:clamp(40px,5vw,72px);font-family:var(--display);font-weight:300;font-size:clamp(26px,3.1vw,44px);line-height:1.15;letter-spacing:-.025em;color:var(--fg);max-width:22ch;text-wrap:balance}
.saga-close .hl{color:var(--green-2)}

/* sweep 16: the closing line runs across the page, centred */
.saga-close{max-width:min(1100px,100%);margin-left:auto;margin-right:auto;text-align:center;font-size:clamp(25px,2.9vw,42px)}

/* sweep 17: the why is two paragraphs now, so it sits a touch smaller */
.why-one p{font-size:clamp(24px,2.7vw,40px)}
.why-one p+p{margin-top:clamp(18px,2vw,30px)}

/* ---------- sweep 20: bring it to life ---------- */
/* the loader is the logo film */
.pre{overflow:hidden;background:#000;display:block}
.pre-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pre-word{position:absolute;left:0;right:0;bottom:clamp(28px,6vh,64px);text-align:center;font-family:var(--mono);font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:#8E9A93;opacity:0;animation:fadein .8s .6s forwards}
.pre.done{opacity:0;visibility:hidden;transition:opacity .7s ease,visibility .7s}

/* hero: the film runs edge to edge under the headline, with live chips on it */
.hero-live{padding-bottom:0;overflow:hidden}
.hero-live .wrap{position:relative;z-index:2}
.hero-reel{position:relative;width:min(100%,1680px);margin:clamp(-64px,-4.4vw,-16px) auto 0;z-index:1}
.hero-reel video{width:100%;height:auto;aspect-ratio:1280/670;object-fit:cover;background:#000;-webkit-mask-image:radial-gradient(ellipse 64% 72% at 50% 50%,#000 52%,transparent 100%);mask-image:radial-gradient(ellipse 64% 72% at 50% 50%,#000 52%,transparent 100%)}
@keyframes bob{50%{transform:translateY(-10px)}}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(20,255,176,.55)}70%,100%{box-shadow:0 0 0 11px rgba(20,255,176,0)}}
@media (max-width:760px){.hero-reel{margin-top:-8px}}

/* a full green band of numbers */
.statband{background:#12E0A0 linear-gradient(115deg,#0CC481,#14FFB0 58%,#19C6E6);padding:clamp(48px,5.5vw,84px) 0}
.statband .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,72px)}
.sn b{display:block;font-family:var(--display);font-weight:300;font-size:clamp(52px,6.6vw,100px);letter-spacing:-.05em;line-height:.95;color:#04160F}
.sn span{display:block;margin-top:14px;font-size:clamp(15px,1.3vw,18px);line-height:1.4;color:#06231A;max-width:27ch}
@media (max-width:860px){.statband .wrap{grid-template-columns:1fr;gap:34px}}

/* a slow ticker of what we build */
.tick{overflow:hidden;background:var(--bg);border-block:1px solid var(--line);padding:clamp(20px,2.6vw,36px) 0}
.tick div{display:flex;align-items:center;gap:clamp(26px,3.4vw,54px);width:max-content;animation:tickmv 70s linear infinite}
.tick span{font-family:var(--display);font-weight:300;font-size:clamp(38px,5.6vw,88px);letter-spacing:-.04em;line-height:1;color:#F2F6F3;-webkit-text-fill-color:transparent;-webkit-text-stroke:1px rgba(242,246,243,.5);white-space:nowrap}
.tick i{flex:none;width:12px;height:12px;border-radius:50%;background:var(--green)}
@keyframes tickmv{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.tick div{animation:none}}

/* photographs inside the cards */
.offer .o-img{display:block;height:170px;margin:-32px -30px 6px;background:var(--img) center/cover no-repeat;position:relative}
.offer .o-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,10,13,0) 45%,rgba(7,10,13,.4))}
.zcard .z-img{display:block;height:190px;margin:-30px -30px 4px;background:var(--img) center/cover no-repeat}
.zcard .dis{display:flex;flex-wrap:wrap;gap:8px;margin:0;border-top:1px solid var(--line);padding-top:14px}
.zcard .dis b{font-weight:500;font-size:13px;color:var(--fg);padding:6px 13px;border:1px solid var(--line-2);border-radius:var(--pill)}

/* the builds picker on /operations/ */
.picker{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 30px}
.pk{font:500 14.5px var(--font);padding:11px 20px;border-radius:var(--pill);border:1px solid var(--line-2);background:var(--glass);color:var(--text);cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.pk:hover{border-color:var(--green);color:var(--fg)}
.pk:focus-visible{outline:2px solid var(--green-2);outline-offset:3px}
.pk.on{background:var(--green-2);border-color:transparent;color:#04160F}
.tool{gap:10px;min-height:190px;text-decoration:none}
.tool h3{font-size:24px}
.tool .go{margin-top:auto;padding-top:14px;font-weight:600;color:var(--fg)}
.tool:hover .go{color:var(--green-2)}
.tool.off{display:none}

/* two doors into the deeper pages */
.deeper{display:grid;grid-template-columns:1fr 1fr}
.deep{position:relative;min-height:clamp(320px,34vw,470px);padding:clamp(28px,4vw,60px);display:flex;flex-direction:column;justify-content:flex-end;gap:10px;text-decoration:none;color:#F2F6F3;background:linear-gradient(180deg,rgba(7,10,13,.2),rgba(7,10,13,.9)),var(--img) center/cover no-repeat;overflow:hidden}
.deep+.deep{border-left:1px solid var(--line)}
.deep h3{font-size:clamp(28px,3.1vw,46px);font-weight:300;letter-spacing:-.03em;line-height:1.05;max-width:17ch;color:#fff}
.deep p{color:#D5DCD8;max-width:40ch;margin:0}
.deep .k{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--green-2)}
.deep .go{font-weight:600;color:var(--green-2);margin-top:8px}
.deep:hover .go{text-decoration:underline}
@media (max-width:820px){.deeper{grid-template-columns:1fr}.deep+.deep{border-left:0;border-top:1px solid var(--line)}}

/* a light that follows the pointer across cards */
.spot::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(20,255,176,.12),transparent 62%)}
.spot:hover::before{opacity:1}
.playbook .method-track-idx{display:none}

/* a full-bleed photograph band */
.pband{position:relative;min-height:clamp(340px,38vw,520px);display:flex;align-items:center;background:linear-gradient(90deg,rgba(7,10,13,.94),rgba(7,10,13,.72) 55%,rgba(7,10,13,.5)),var(--img) center/cover no-repeat;background-color:#070A0D;border-block:1px solid var(--line)}
.pband h2{font-size:clamp(34px,4.6vw,68px);max-width:16ch;color:#fff}
.pband p{margin-top:20px;max-width:46ch;font-size:clamp(16px,1.4vw,19px);color:#D5DCD8}
.pband .hl{color:var(--green-2)}

/* privacy policy cookie table: scrolls inside its own box on a phone instead of widening the page */
.tw{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;margin-top:14px}
.tw table{border-collapse:collapse;min-width:520px;font-size:15px}
.tw th,.tw td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.tw th{color:var(--fg);font-weight:600}
.tw code{font-family:var(--mono);font-size:13px;color:var(--green-2)}

/* the tab bar across every custom-operations page */
.subnav{position:sticky;top:72px;z-index:40;background:rgba(7,10,13,.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-block:1px solid var(--line)}
.subnav .wrap{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.subnav .wrap::-webkit-scrollbar{display:none}
.subnav a{flex:none;padding:15px 16px;font-size:14.5px;font-weight:500;color:var(--text);text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.subnav a:hover{color:var(--fg)}
.subnav a[aria-current=page]{color:var(--fg);border-bottom-color:var(--green-2)}
section[id]{scroll-margin-top:128px}
/* the three-column Custom operations menu */
.nav>details.dd-wide{position:static}
.menu.mega{display:grid;grid-template-columns:1fr 1fr 1.15fr;gap:6px 14px;position:absolute;top:calc(100% - 4px);left:50%;transform:translateX(-50%);width:min(860px,calc(100vw - 32px));padding:16px}
.menu.mega .mc{display:flex;flex-direction:column;gap:1px;min-width:0}
.menu.mega h4{font-size:13px;font-weight:500;color:var(--muted);padding:4px 12px 8px;letter-spacing:0}
.menu.mega a span{display:inline;margin-left:8px;font-size:12.5px}
.menu.mega .all{margin-top:8px}
@media (max-width:1040px){.hdr.open .menu.mega{display:block;position:static;transform:none;width:auto;padding:0 0 6px 10px}.hdr.open .menu.mega h4{padding:10px 12px 4px}}
/* the four problems on the overview */
.grid.c4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1040px){.grid.c4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.grid.c4{grid-template-columns:1fr}}

/* the playbook tabs, and the notes box on the operations form */
.pbtabs{position:sticky;top:122px;z-index:35;background:rgba(7,10,13,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.pbtabs .wrap{display:flex;gap:8px;overflow-x:auto;padding-block:12px;scrollbar-width:none}
.pbtabs .wrap::-webkit-scrollbar{display:none}
.pbtabs button{flex:none;appearance:none;cursor:pointer;font:500 14.5px var(--font);color:var(--text);background:transparent;border:1px solid var(--line-2);border-radius:var(--pill);padding:9px 16px;white-space:nowrap}
.pbtabs button:hover{color:var(--fg);background:var(--glass-2)}
.pbtabs button[aria-selected=true]{background:var(--green-2);border-color:var(--green-2);color:#06130D}
.playbook > section[hidden]{display:none}
.lead textarea{font:inherit;font-size:16px;padding:14px 16px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:rgba(0,0,0,.25);color:var(--fg);width:100%;resize:vertical;min-height:84px}
.lead textarea:focus{outline:2px solid var(--green);outline-offset:1px;border-color:var(--green)}
:is(:root[data-theme=light],.t-light) .lead textarea{background:rgba(255,255,255,.8)}

.menu.mega a{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.menu.mega a span{margin:0;white-space:nowrap}

.t-light .pk.on{color:#fff}

/* four-column Custom operations menu, five problem doors */
.menu.mega{grid-template-columns:1fr 1fr 1fr 1.15fr;width:min(1060px,calc(100vw - 32px))}
.grid.c4.probs{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}

/* ===== v3, the aesthetics skin (2026-10-21). Appended after style.css by build.py, so every
   rule here wins. Light paper ground tinted toward the brand green, mist and ink bands that
   alternate, Outfit 600 display at six times the body, white cards with a soft shadow, the
   green kept for buttons and one highlighted word. Will: "too dark ... match the vibe of the
   industry ... keep our logo and colors but we just need more life." ===== */

:root,:root[data-theme=light]{
  --bg:#F6F8F6;--bg-2:#EEF3EF;--bg-3:#E3EBE5;
  --fg:#0B1512;--text:#39463F;--muted:#5B6862;
  --line:rgba(11,21,18,.1);--line-2:rgba(11,21,18,.22);
  --glass:rgba(255,255,255,.8);--glass-2:#FFFFFF;--glass-hi:#FFFFFF;
  --green-2:#087A50;--light:#FFFFFF;--light-ink:#0B1512;
  --dw:600;--dls:-.045em;--dlh:1.06;
  --h1:clamp(42px,7vw,104px);--h2:clamp(34px,4.4vw,64px);--h3:22px;
  --r:22px;
}
html,body{background:var(--bg)}
.aurora{display:none}
h1,h2{font-weight:600;letter-spacing:-.045em}
h2{line-height:1.06}
h3{font-weight:600;letter-spacing:-.02em}
h4{font-weight:600}
.lede{color:var(--text)}
.label,.mono{font-family:var(--font);font-weight:600;font-size:12.5px;letter-spacing:.12em;color:var(--green-2)}
.label::before{background:var(--green-2)}
.hl{color:var(--green-2)}

/* cards: white, one hairline, a soft shadow; no glass on paper */
.glass,.cell,.step,.stat,.faq details,.agents div,.journey div,.cap,.offer,.plan,.rcard,.zcard,.phase,.member,.ch-stat,.s-stat,.s-gap,.tool{background:#fff;border:1px solid var(--line);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:0 24px 50px -36px rgba(11,21,18,.25)}
.glass-sm{border-radius:var(--r-sm)}
.spot::before{background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(12,196,129,.1),transparent 62%)}

/* buttons */
.btn{background-image:none;background-color:var(--green);color:#06130D;box-shadow:0 10px 24px -14px rgba(12,196,129,.9)}
.btn:hover{background-color:#0AB274;color:#06130D;box-shadow:0 14px 30px -14px rgba(12,196,129,.9)}
.btn-out{background:transparent;background-image:none;border-color:var(--line-2);color:var(--fg);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.btn-out:hover{background:rgba(11,21,18,.05);border-color:var(--fg);color:var(--fg);box-shadow:none}
.link{color:var(--fg)}
.link:hover{color:var(--green-2)}

/* header on paper */
.hdr::before{background:rgba(246,248,246,.78)}
.hdr.is-stuck::before{background:rgba(246,248,246,.92);border-bottom-color:var(--line)}
.brand{color:var(--fg);font-weight:600}
.nav>a,.nav>details>summary{font-weight:600;color:var(--fg)}
.nav>a:hover,.nav>details>summary:hover,.nav>a[aria-current=page],.nav>details>summary[aria-current=page]{background:rgba(11,21,18,.06);color:var(--fg)}
.nav>details>summary .chev{color:var(--muted)}
.menu{background:#fff;border-color:var(--line);box-shadow:0 30px 80px -30px rgba(11,21,18,.35)}
.menu a{color:var(--fg)}
.menu a span{color:var(--muted)}
.menu a:hover{background:var(--bg-2);color:var(--fg)}
.menu .all{color:var(--green-2)}
.hdr-cta .tel{font-family:var(--font);font-weight:600;font-size:14px;color:var(--fg)}
.burger{background:#fff;color:var(--fg);font-family:var(--font);font-weight:600;font-size:12.5px;letter-spacing:.08em}
@media (max-width:1040px){.hdr.open .nav{background:rgba(246,248,246,.98);border-bottom-color:var(--line)}}

/* the three grounds (the ink rules carry :root[data-theme=light] so they outrank style.css's light-theme block, which is (0,3,0)). app.js (in base.html) tags untagged sections paper / mist / ink in turn. */
.t-grey{background:#E8F0EB;color:var(--text)}
.t-light{background:#fff;color:var(--text)}
:root[data-theme=light] .t-dark{--bg:#0B1512;--bg-2:#10201A;--bg-3:#17291F;--fg:#F2F6F3;--text:#C3CFC8;--muted:#93A099;--line:rgba(255,255,255,.1);--line-2:rgba(255,255,255,.22);--glass:rgba(255,255,255,.05);--glass-2:rgba(255,255,255,.09);--glass-hi:rgba(255,255,255,.16);--green-2:#14FFB0;--light-ink:#0B1512;background:var(--bg);color:var(--text);position:relative}
:root[data-theme=light] .t-dark h1,:root[data-theme=light] .t-dark h2,:root[data-theme=light] .t-dark h3,:root[data-theme=light] .t-dark h4,:root[data-theme=light] .t-dark strong,:root[data-theme=light] .t-dark b{color:var(--fg)}
:root[data-theme=light] .t-dark a{color:var(--fg)}
:root[data-theme=light] .t-dark .glass,:root[data-theme=light] .t-dark .cell,:root[data-theme=light] .t-dark .step,:root[data-theme=light] .t-dark .stat,:root[data-theme=light] .t-dark .faq details,:root[data-theme=light] .t-dark .agents div,:root[data-theme=light] .t-dark .journey div,:root[data-theme=light] .t-dark .cap,:root[data-theme=light] .t-dark .offer,:root[data-theme=light] .t-dark .plan,:root[data-theme=light] .t-dark .rcard,:root[data-theme=light] .t-dark .zcard,:root[data-theme=light] .t-dark .phase,:root[data-theme=light] .t-dark .member,:root[data-theme=light] .t-dark .tool{background:linear-gradient(180deg,var(--glass-2),var(--glass));border-color:var(--line);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
:root[data-theme=light] .t-dark .btn-out{color:#fff;border-color:var(--line-2)}
:root[data-theme=light] .t-dark .btn-out:hover{background:rgba(255,255,255,.08);border-color:#fff;color:#fff}
:root[data-theme=light] .t-dark .viz{background:rgba(0,0,0,.28)}
:root[data-theme=light] .t-dark .ui-row,:root[data-theme=light] .t-dark .kpi,:root[data-theme=light] .t-dark .lockrow,:root[data-theme=light] .t-dark .bub{background:var(--glass-2);color:var(--fg)}
:root[data-theme=light] .t-dark .bub.me{color:#06130D}
:root[data-theme=light] .t-dark .pbar{background:rgba(255,255,255,.08)}
:root[data-theme=light] .t-dark .lead input,:root[data-theme=light] .t-dark .lead textarea{background:rgba(0,0,0,.25);color:var(--fg)}
:root[data-theme=light] .t-dark .ptable tr:hover td{background:rgba(255,255,255,.03)}
:root[data-theme=light] .t-dark .roles h3{border-top-color:var(--line-2)}
:root[data-theme=light] .t-dark .rcard .stars{color:var(--green-2)}
:root[data-theme=light] .t-dark .note,:root[data-theme=light] .t-dark .tiny,:root[data-theme=light] .t-dark .muted{color:var(--muted)}
:root[data-theme=light] .t-dark .chip{background:var(--glass);color:var(--text);border-color:var(--line-2)}
:root[data-theme=light] .t-dark .pk{background:var(--glass);color:var(--text)}
:root[data-theme=light] .t-dark .spot::before{background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(20,255,176,.12),transparent 62%)}

/* bits of chrome that were drawn for the dark site */
.press{background:#0B1512;border-color:rgba(255,255,255,.08)}
.sec-alt:not(.t-dark){background:none}
.thesis p{font-weight:500}
.thesis .kicker{font-family:var(--font);font-weight:600;letter-spacing:.14em}
.sn b{font-weight:600;letter-spacing:-.045em}
/* the green band keeps its green under the ink-band rule, and its ink type */
.statband,:root[data-theme=light] .statband.t-dark{background:#12E0A0 linear-gradient(115deg,#0CC481,#14FFB0 58%,#19C6E6)}
:root[data-theme=light] .statband.t-dark .sn b{color:#04160F}
:root[data-theme=light] .statband.t-dark .sn span{color:#06231A}
.close p{font-weight:600}
.cta .box::before{background:radial-gradient(50% 60% at 0% 0%,rgba(12,196,129,.14),transparent 70%)}
.ftr{background:#fff;border-top-color:var(--line)}
.ftr h4{font-family:var(--font);font-weight:600;color:var(--fg);letter-spacing:.08em}
.calwrap.locked::before{font-family:var(--font);font-weight:600;background:var(--bg-2);color:var(--text)}
.lead input,.lead textarea{background:#fff}
.term{background:#0B1512;color:#F2F6F3;border-color:rgba(255,255,255,.14);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:0 30px 80px -40px rgba(11,21,18,.6)}
.term .out .c{color:#14FFB0}
.term .cmds button{color:#D5DCD8;border-color:rgba(255,255,255,.22)}
.term .cmds button:hover,.term .cmds button.on{border-color:#14FFB0;color:#14FFB0}
.term .bar span{color:#93A099}
.viz,.win{background:var(--bg-2);border-color:var(--line)}
.ui-row,.kpi,.lockrow{background:#fff}
.bub{background:#fff;color:var(--fg)}
.bub.me{color:#06130D}
.pbar{background:rgba(11,21,18,.08)}
.ui-row .dot,.lockrow::before{box-shadow:none}
.chip{background:#fff}
.stat .v,.kpi .n,.plan .p,.sb-card .price,.ch-n span,.ch-stat b,.s-stat b{font-weight:600}
.ztext h3,.deep h3,.f-lead,.why-one p,.saga-close,.prose .pull,.stext h3,.member .ph span,.f-ph span{font-weight:600}
.offer .n,.cell .n,.step .n,.journey .n,.agents .n,.zcard .bn,.phase .n,.ztext .n,.stext .k,.deep .k,.f-kick,.f-bio .role,.member .role,.plan .k,.sb-card .k,.sb-card .lock,.stat .s,.ptable th,.prose th,.crumbs,.eff,.hero-facts span,.stage-strip .st .n,.rcard .stars,.ui-pill,.cmdline,.pre-word,.ch-n b,.saga-foot .n,.f-owns b,.press .k{font-family:var(--font);letter-spacing:.08em}
.ind.photo::after{background:linear-gradient(180deg,rgba(11,21,18,.3) 0%,rgba(11,21,18,.78) 52%,rgba(11,21,18,.94) 100%)}
.offer .o-img::after{background:linear-gradient(180deg,rgba(11,21,18,0) 45%,rgba(11,21,18,.3))}
.pband{background-color:#0B1512}
.pband h2{font-weight:600}
.subnav,.pbtabs{background:rgba(246,248,246,.92)}
.tick{display:none}
.hero-note{color:var(--muted)}
.problem .pain b{color:var(--green-2)}
:root[data-theme=light] .t-dark .problem .pain b{color:#14FFB0}

/* ---------- the v3 hero: copy on paper, the clip full height to the right edge (adpros.com, Will's reference, opens copy left / media right) ---------- */
.hv{display:grid;grid-template-columns:minmax(0,54fr) minmax(0,46fr);min-height:min(calc(100svh - 72px),880px);background:var(--bg)}
.hv-copy{display:flex;align-items:center;padding:clamp(56px,7vw,112px) clamp(28px,4vw,56px) clamp(56px,6vw,96px) max(var(--gutter),calc((100vw - var(--maxw)) / 2 + var(--gutter)))}
.hv-in{max-width:680px}
.hv h1{font-size:clamp(40px,5vw,78px);line-height:1.06;letter-spacing:-.05em;margin-bottom:26px;text-wrap:balance}
.hv .lede.big{max-width:50ch;font-size:clamp(17px,1.45vw,21px)}
.hv .btns{margin-top:30px}
.hv-stack{margin-top:30px;font-size:13.5px;line-height:1.7;color:var(--muted);max-width:56ch}
.hv-stack b{color:var(--fg);font-weight:600}
.hv-media{position:relative;overflow:hidden;background:#0B1512;min-height:min(46svh,560px)}
.hv-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.04) contrast(1.02)}
@media (max-width:960px){.hv{grid-template-columns:1fr;min-height:0}.hv-media{order:-1;min-height:0;height:44svh;max-height:420px}.hv-copy{padding:36px var(--gutter) 48px}.hv h1{font-size:clamp(38px,9.4vw,60px)}}

/* the five solutions */
.sols{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.sol{grid-column:span 2;display:flex;flex-direction:column;text-decoration:none;color:var(--text);overflow:hidden;border-radius:var(--r);background:#fff;border:1px solid var(--line);box-shadow:0 24px 50px -36px rgba(11,21,18,.25);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.sol:nth-child(4),.sol:nth-child(5){grid-column:span 3}
.sols.four .sol,.sols.four .sol:nth-child(4),.sols.four .sol:nth-child(5){grid-column:span 3}
.sol:hover{transform:translateY(-4px);box-shadow:0 34px 60px -30px rgba(11,21,18,.35);color:var(--text)}
.sol .ph{display:block;aspect-ratio:16/10;background:var(--img) center/cover no-repeat;transition:transform .8s var(--ease)}
.sol .tx{display:grid;gap:8px;padding:22px 24px 26px}
.sol h3{font-size:26px;letter-spacing:-.03em;color:var(--fg);line-height:1.1}
.sol .tag{font-size:15px;line-height:1.5}
.sol .go{font-weight:600;color:var(--green-2);margin-top:6px}
:root[data-theme=light] .t-dark .sol{background:linear-gradient(180deg,var(--glass-2),var(--glass))}
@media (max-width:960px){.sols{grid-template-columns:1fr 1fr}.sol,.sol:nth-child(4),.sol:nth-child(5),.sols.four .sol{grid-column:auto}}
@media (max-width:560px){.sols{grid-template-columns:1fr}}

/* a solution page's hero photograph */
.sol-hero .wrap{align-items:center}
.sol-ph{aspect-ratio:4/3;min-height:300px;border-radius:var(--r);background:var(--img) center/cover no-repeat;box-shadow:0 34px 70px -40px rgba(11,21,18,.4)}
@media (max-width:900px){.sol-ph{aspect-ratio:16/10;min-height:0}}

/* the founders on the home page */
.people{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.person{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:22px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:0 24px 50px -36px rgba(11,21,18,.25)}
.person .ph{aspect-ratio:4/5;overflow:hidden;background:var(--bg-3)}
.person .ph img{width:100%;height:100%;object-fit:cover;object-position:50% 14%;display:block}
.person .tx{padding:22px 24px 22px 0}
.person .role{display:block;font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--green-2)}
.person h3{font-size:26px;margin:6px 0 10px}
.person p{font-size:15px;line-height:1.55}
@media (max-width:900px){.people{grid-template-columns:1fr}}
@media (max-width:520px){.person{grid-template-columns:1fr}.person .ph{aspect-ratio:4/4}.person .tx{padding:0 20px 22px}}

/* the section head: the display line and the lede sit on one baseline grid */
.sec-head.row{align-items:end}
.sec-head h2{text-wrap:balance}
.list li b{color:var(--fg)}
.list li i{border-color:var(--green-2)}
.cap.glass{padding:22px}

/* buttons inside an ink band: style.css's light block paints .btn-out white and .t-dark a paints .btn white; both outranked here */
:root[data-theme=light] .btn,:root[data-theme=light] .t-dark .btn,:root[data-theme=light] .t-dark a.btn{color:#06130D}
:root[data-theme=light] .btn:hover,:root[data-theme=light] .t-dark .btn:hover{color:#06130D}
:root[data-theme=light] .btn-out,:root[data-theme=light] a.btn-out{background:transparent;color:var(--fg)}
:root[data-theme=light] .t-dark .btn-out,:root[data-theme=light] .t-dark a.btn-out{background:transparent;color:#fff}
:root[data-theme=light] .t-dark .btn-out:hover{background:rgba(255,255,255,.08);color:#fff}
:root[data-theme=light] .statband,:root[data-theme=light] .statband.t-dark{background:#12E0A0 linear-gradient(115deg,#0CC481,#14FFB0 58%,#19C6E6)}
:root[data-theme=light] .statband.t-dark .sn b{color:#04160F}
:root[data-theme=light] .statband.t-dark .sn span{color:#06231A}

/* ── v3 mascot (2026-10-21): the green cube, perched on photos and standing beside heads.
   Decorative only: empty alt, aria-hidden, pointer-events none. Poses in /assets/mascot/. */
.msct{position:absolute;height:auto;pointer-events:none;user-select:none;z-index:3;filter:drop-shadow(0 12px 20px rgba(11,21,18,.16))}
.msct-close{position:static;display:block;margin:0 auto 20px;width:clamp(92px,10vw,132px)}
.ftr{position:relative}
.msct-ftr{top:0;left:50%;width:76px;transform:translate(-50%,-64%)}
@media (prefers-reduced-motion:no-preference){
  .msct-ftr{animation:msct-bob-f 5.5s ease-in-out infinite}
}
@keyframes msct-bob-f{0%,100%{transform:translate(-50%,-64%)}50%{transform:translate(-50%,-70%)}}
@media (max-width:720px){
}

/* ===== v3 Core sweep (2026-10-23, Will + hirecharm reference): one soft gradient ground,
   charm spacing, liquid-glass nav, Core replaces photography, 90-day guarantee grammar. ===== */

/* the ground: one continuous green-tinted gradient; light sections go transparent over it */
html,body{background-color:#F3F8F5;background-image:
  radial-gradient(1100px 700px at 10% 0%, rgba(12,196,129,.13), transparent 62%),
  radial-gradient(900px 640px at 92% 14%, rgba(96,165,250,.10), transparent 60%),
  radial-gradient(1000px 760px at 46% 60%, rgba(12,196,129,.07), transparent 65%),
  linear-gradient(180deg,#FAFCFA 0%,#F3F8F5 45%,#EEF5F1 100%)}
section[data-vary="light"],section[data-vary="grey"],.hero,.hv{background:transparent}

/* the spacing: let it breathe (charm's biggest lesson) */
.sec{padding:clamp(110px,13vh,180px) 0}
.sec-head{margin-bottom:clamp(44px,5vh,72px)}
.close{padding:clamp(130px,16vh,210px) 0}

/* liquid-glass nav: the bar itself is a floating glass pill */
.hdr::before{background:transparent;border-bottom:0}
.hdr.is-stuck::before{background:transparent;border-bottom:0}
.hdr .wrap{margin-top:12px;border-radius:999px;padding-left:20px;padding-right:12px;
  background:rgba(255,255,255,.44);
  backdrop-filter:blur(22px) saturate(1.5);-webkit-backdrop-filter:blur(22px) saturate(1.5);
  border:1px solid rgba(255,255,255,.66);
  box-shadow:0 18px 44px -26px rgba(11,21,18,.3), inset 0 1px 0 rgba(255,255,255,.85)}
@media (max-width:1040px){.hdr.open .wrap{border-radius:26px}}

/* hero: Core is the art */
.hv{min-height:min(calc(92svh - 72px),820px)}
.hv-media{background:transparent;overflow:visible;display:grid;place-items:center;min-height:0;position:relative}
.hv-media::before{content:"";position:absolute;inset:8% 4%;border-radius:50%;
  background:radial-gradient(closest-side, rgba(12,196,129,.16), transparent 72%)}
.hv-core{position:relative;width:min(74%,520px);height:auto;filter:drop-shadow(0 34px 54px rgba(11,21,18,.17))}
@media (prefers-reduced-motion:no-preference){.hv-core{animation:core-float 6s ease-in-out infinite}}
@keyframes core-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@media (max-width:960px){.hv-media{height:auto;max-height:none;padding:28px 0 0}.hv-core{width:min(56vw,320px)}}

/* the guarantee */
.gpill{display:inline-block;margin-top:18px;padding:10px 18px;border-radius:999px;
  background:rgba(12,196,129,.12);border:1px solid rgba(12,196,129,.3);
  color:var(--green-2);font-weight:600;font-size:14.5px;letter-spacing:.01em}
/* Will, 2026-10-22: on desktop the pill sits under Core on the right; on phones under the button (copy column) */
.hv .gpill-media{display:none}
@media (min-width:961px){
  .hv .gpill-copy{display:none}
  .hv-media{grid-template-rows:auto auto;align-content:center;row-gap:6px}
  .hv .gpill-media{display:inline-block;margin:0 auto;position:relative;z-index:1;text-align:center;max-width:92%}
}
.gband{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:var(--r);
  box-shadow:0 24px 50px -36px rgba(11,21,18,.25);padding:clamp(28px,4vw,56px)}
.gband img{width:100%;height:auto}
.gband h2{font-size:clamp(28px,3.2vw,44px);margin-bottom:14px}
@media (max-width:720px){.gband{grid-template-columns:1fr}.gband img{width:150px;margin:0 auto}}

/* solution cards: Core IS the card art, on a soft gradient tile */
.sol .ph{display:grid;place-items:center;aspect-ratio:16/10;
  background:linear-gradient(160deg,rgba(12,196,129,.14),rgba(96,165,250,.08) 68%,rgba(255,255,255,.5))}
.sol .ph img{width:44%;height:auto;filter:drop-shadow(0 16px 26px rgba(11,21,18,.16));transition:transform .5s var(--ease)}
.sol:hover .ph img{transform:translateY(-7px)}

/* solution-page hero: same tile, bigger */
.sol-ph{display:grid;place-items:center;
  background:linear-gradient(160deg,rgba(12,196,129,.14),rgba(96,165,250,.08) 68%,rgba(255,255,255,.5))}
.sol-ph img{width:min(62%,460px);height:auto;filter:drop-shadow(0 22px 36px rgba(11,21,18,.17))}

/* the press strip sits on the same green gradient as the numbers (Will, 2026-10-21) */
:root[data-theme=light] .press{background:#12E0A0 linear-gradient(115deg,#0CC481,#14FFB0 58%,#19C6E6);border-color:rgba(4,22,15,.12)}
:root[data-theme=light] .press .k{color:#06231A}
:root[data-theme=light] .press .track img{filter:brightness(0);opacity:.85}

/* no bar behind the floating pill: the v2 light block painted .hdr::before at (0,3,1), so the earlier transparent rule lost (Will, 2026-10-21: "remove the other blocky thing behind it") */
:root[data-theme=light] .hdr::before,:root[data-theme=light] .hdr.is-stuck::before{display:none}

/* inner-page headlines flow like the home hero, not the 104px display size (Will, 2026-10-21: "way too big") */
:root[data-theme=light] .hero h1,:root[data-theme=light] .sol-hero h1{font-size:clamp(36px,4.6vw,64px);line-height:1.06;letter-spacing:-.04em;max-width:16ch}
:root[data-theme=light] .sol-hero .lede.big{font-size:clamp(17px,1.4vw,20px)}

/* three-line headlines (Will, 2026-10-21: "get this down to just taking up 3 lines rather than 4") */
:root[data-theme=light] .hv h1{font-size:clamp(38px,4.4vw,66px);max-width:15ch}
:root[data-theme=light] .sol-hero h1{font-size:clamp(34px,4.1vw,58px);max-width:18ch}
:root[data-theme=light] .sec-head.row{grid-template-columns:1.3fr .7fr}
:root[data-theme=light] .sec-head.row h2{font-size:clamp(30px,3.7vw,54px);max-width:26ch}
@media (max-width:860px){:root[data-theme=light] .sec-head.row{grid-template-columns:1fr}}

/* originals with their shadows, no cutouts (Will, 2026-10-21): the tile takes the image's own white, the hero feathers its edges into the page */
:root[data-theme=light] .sol .ph{background:#FCFCFA;padding:0}
:root[data-theme=light] .sol .ph img{width:100%;height:100%;object-fit:cover;object-position:50% 58%;filter:none;transform:none}
:root[data-theme=light] .sol:hover .ph img{transform:scale(1.03)}
:root[data-theme=light] .sol-ph{background:#FCFCFA;overflow:hidden;display:grid;place-items:center}
:root[data-theme=light] .sol-ph img{width:100%;height:100%;object-fit:cover;object-position:50% 58%}
:root[data-theme=light] .hv-core{width:min(96%,640px);filter:none;
  -webkit-mask-image:radial-gradient(ellipse 58% 58% at 50% 52%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 58% 58% at 50% 52%,#000 58%,transparent 100%)}
:root[data-theme=light] .hv-media::before{display:none}

/* the whiteboard scene is wide: the hero column gives it the full width and a wider feather */
:root[data-theme=light] .hv-core{width:min(100%,720px);
  -webkit-mask-image:radial-gradient(ellipse 66% 64% at 50% 54%,#000 60%,transparent 100%);mask-image:radial-gradient(ellipse 66% 64% at 50% 54%,#000 60%,transparent 100%)}

/* the scene gets more of the row and a looser feather so the desk and the whiteboard stay whole */
:root[data-theme=light] .hv{grid-template-columns:minmax(0,46fr) minmax(0,54fr)}
:root[data-theme=light] .hv-core{width:100%;max-width:none;-webkit-mask-image:radial-gradient(ellipse 80% 72% at 50% 54%,#000 68%,transparent 100%);mask-image:radial-gradient(ellipse 80% 72% at 50% 54%,#000 68%,transparent 100%)}
@media (max-width:960px){:root[data-theme=light] .hv-core{width:100%}}

/* white-background scene on a tinted ground: multiply makes the white the page (Will: the hero scene) */
:root[data-theme=light] .hv-core{mix-blend-mode:multiply;-webkit-mask-image:radial-gradient(ellipse 86% 80% at 50% 54%,#000 74%,transparent 100%);mask-image:radial-gradient(ellipse 86% 80% at 50% 54%,#000 74%,transparent 100%)}

/* the founders: stacked, bigger, Will photo left, Chris photo right, rounded photos (Will, 2026-10-21) */
:root[data-theme=light] .people{grid-template-columns:1fr;gap:22px}
:root[data-theme=light] .person{grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:clamp(22px,3vw,44px);padding:18px;align-items:center}
:root[data-theme=light] .person:nth-child(2){grid-template-columns:minmax(0,1fr) minmax(0,400px)}
:root[data-theme=light] .person:nth-child(2) .ph{order:2}
:root[data-theme=light] .person .ph{aspect-ratio:4/5;border-radius:calc(var(--r) - 6px);overflow:hidden;box-shadow:0 20px 40px -30px rgba(11,21,18,.35)}
:root[data-theme=light] .person .tx{padding:10px 12px 10px 0}
:root[data-theme=light] .person:nth-child(2) .tx{padding:10px 0 10px 12px}
:root[data-theme=light] .person h3{font-size:clamp(28px,2.6vw,36px)}
:root[data-theme=light] .person p{font-size:16px;line-height:1.6;max-width:56ch}
@media (max-width:900px){:root[data-theme=light] .person,:root[data-theme=light] .person:nth-child(2){grid-template-columns:minmax(0,260px) minmax(0,1fr)}}
@media (max-width:560px){:root[data-theme=light] .person,:root[data-theme=light] .person:nth-child(2){grid-template-columns:1fr}:root[data-theme=light] .person:nth-child(2) .ph{order:0}:root[data-theme=light] .person .tx,:root[data-theme=light] .person:nth-child(2) .tx{padding:8px 4px 10px}}

/* the scene is true white now; multiply alone makes it the page, so no mask and nothing is cut off */
:root[data-theme=light] .hv-core{-webkit-mask-image:none;mask-image:none}

/* Core with his chart, leaning on the numbers section (Will, 2026-10-21) */
.run-wrap{position:relative}
.msct-run{right:-10px;top:-6px;width:clamp(110px,12vw,170px);transform:rotate(-4deg)}
@media (prefers-reduced-motion:no-preference){.msct-run{animation:msct-bob-r 6s ease-in-out infinite}}
@keyframes msct-bob-r{0%,100%{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(-4deg) translateY(-8px)}}
@media (max-width:1100px){.msct-run{right:0;top:-18px;width:100px}}
@media (max-width:700px){.msct-run{display:none}}

/* Core stands on the Slack window with his chart */
.run-term{position:relative}
.msct-run{left:28px;right:auto;top:auto;bottom:calc(100% - 18px);width:clamp(120px,11vw,160px);transform:none}
@keyframes msct-bob-r{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (max-width:1100px){.msct-run{left:16px;width:110px}}
@media (max-width:700px){.msct-run{display:block;width:96px;bottom:calc(100% - 12px)}}

/* the hero fits one desktop screen (Will, 2026-10-21): less air above and between the pieces, the headline a size down on wide screens */
:root[data-theme=light] .hv{min-height:0}
:root[data-theme=light] .hv-copy{padding-top:clamp(24px,3.2vw,48px);padding-bottom:clamp(32px,3.5vw,56px)}
:root[data-theme=light] .hv h1{font-size:clamp(38px,4.3vw,60px);max-width:none;margin-bottom:18px}
:root[data-theme=light] .hv .lede.big{font-size:clamp(17px,1.3vw,20px)}
:root[data-theme=light] .hv .btns{margin-top:22px}
:root[data-theme=light] .hv .gpill{margin-top:12px}
:root[data-theme=light] .hv-stack{margin-top:18px;font-size:13px}
@media (min-width:1500px){:root[data-theme=light] .hv{grid-template-columns:minmax(0,50fr) minmax(0,50fr)}}

/* phones: copy first, then the scene full width underneath (the Charm pattern Will sent) */
@media (max-width:960px){
  :root[data-theme=light] .hv-media{order:2;height:auto;max-height:none;padding:8px var(--gutter) 28px;display:grid;place-items:center}
  :root[data-theme=light] .hv-core{width:100%;max-width:560px}
  :root[data-theme=light] .hv-copy{padding:28px var(--gutter) 8px}
  :root[data-theme=light] .hv h1{font-size:clamp(34px,8.6vw,48px)}
}

/* phones: one column (the whiteboard rule above forced two at every width), and the guarantee pill keeps soft corners when it wraps */
@media (max-width:960px){:root[data-theme=light] .hv{grid-template-columns:1fr}:root[data-theme=light] .hv .gpill{border-radius:18px}}

/* eight solutions: three rows of three, three, two (the last two wide) */
:root[data-theme=light] .sol:nth-child(4),:root[data-theme=light] .sol:nth-child(5){grid-column:span 2}
:root[data-theme=light] .sol:nth-child(7),:root[data-theme=light] .sol:nth-child(8){grid-column:span 3}
:root[data-theme=light] .sols.four .sol:nth-child(n){grid-column:span 2}
:root[data-theme=light] .sols.four .sol:nth-child(7){grid-column:span 3}
@media (max-width:960px){:root[data-theme=light] .sol:nth-child(n),:root[data-theme=light] .sols.four .sol:nth-child(n){grid-column:auto}}

/* the comeback calendar */
.viz.cb{gap:6px}
.cb-head,.cb-row{display:grid;grid-template-columns:96px 54px 1fr;gap:10px;align-items:center}
.cb-head{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:2px 0 4px}
.cb-row{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.cb-t{font-weight:600;font-size:13px;color:var(--fg)}
.cb-l{font-size:12px;color:var(--muted)}
.cb-bar{position:relative;height:18px;border-radius:9px;background:linear-gradient(90deg,rgba(11,21,18,.06),rgba(11,21,18,.06) 100%)}
.cb-bar::before{content:"";position:absolute;inset:0;border-radius:9px;background:repeating-linear-gradient(90deg,transparent 0 10px,rgba(11,21,18,.05) 10px 11px)}
.cb-bar i{position:absolute;top:0;bottom:0;border-radius:9px;background:linear-gradient(90deg,#0CC481,#14FFB0)}
.cb-bar b{position:absolute;top:50%;transform:translate(-50%,-50%);font-size:10.5px;font-weight:600;color:#04160F;white-space:nowrap}
.cb-foot{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--muted);padding-top:4px}
.cb-key{display:inline-flex;align-items:center;gap:6px}
.cb-key i{width:14px;height:8px;border-radius:4px;background:linear-gradient(90deg,#0CC481,#14FFB0)}
.cb-key.slow i{background:rgba(11,21,18,.12)}
:root[data-theme=light] .t-dark .cb-row{background:var(--glass-2)}

/* ten solutions: rows of three, three, two, two (the last four wide) */
:root[data-theme=light] .sol:nth-child(7),:root[data-theme=light] .sol:nth-child(8),:root[data-theme=light] .sol:nth-child(9),:root[data-theme=light] .sol:nth-child(10){grid-column:span 3}
:root[data-theme=light] .sols.four .sol:nth-child(n){grid-column:span 2}
:root[data-theme=light] .sols.four .sol:nth-child(7),:root[data-theme=light] .sols.four .sol:nth-child(8),:root[data-theme=light] .sols.four .sol:nth-child(9){grid-column:span 3}
@media (max-width:960px){:root[data-theme=light] .sol:nth-child(n),:root[data-theme=light] .sols.four .sol:nth-child(n){grid-column:auto}}

/* the partner card on the social page: Core points at Social Glow */
.pcard{position:relative;display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,3vw,40px);box-shadow:0 24px 50px -36px rgba(11,21,18,.25)}
.msct-partner{position:static;width:100%;max-width:260px;mix-blend-mode:multiply;filter:none;pointer-events:none}
.pcard .ptx h2{font-size:clamp(28px,3.2vw,44px);margin:6px 0 12px}
.pcard .ptx .lede{max-width:56ch}
@media (max-width:760px){.pcard{grid-template-columns:1fr}.msct-partner{max-width:180px;margin:0 auto}}

/* ---------- the orbit: Core in the centre, the solutions circling (Will, 2026-10-21: "I love the solutions orbit, build it") ---------- */
.orb{--n:10}
.orb-stage{position:relative;width:min(100%,920px);aspect-ratio:1;margin:0 auto;container-type:inline-size}
.orb-ring{position:absolute;inset:11%;border-radius:50%;border:1.5px dashed rgba(12,196,129,.45)}
.orb-ring2{position:absolute;inset:2%;border-radius:50%;border:1px solid rgba(11,21,18,.07)}
.orb-core{position:absolute;left:50%;top:50%;width:32%;height:auto;transform:translate(-50%,-52%);mix-blend-mode:multiply}
.orb-wheel{position:absolute;inset:0;animation:orb-spin 90s linear infinite;animation-play-state:paused}
.orb.is-on .orb-wheel{animation-play-state:running}
.orb.is-hold .orb-wheel{animation-play-state:paused}
.orb-node{position:absolute;left:50%;top:50%;width:0;height:0;transform:rotate(calc(var(--i) * 360deg / var(--n)))}
.orb-arm{position:absolute;left:0;top:0;transform:translateY(-39cqw)}
.orb-up{position:relative;transform:translate(-50%,-50%) rotate(calc(var(--i) * -360deg / var(--n)));animation:orb-unspin 90s linear infinite;animation-play-state:paused;display:grid;justify-items:center;gap:9px;width:190px;text-decoration:none}
.orb.is-on .orb-up{animation-play-state:running}
.orb.is-hold .orb-up{animation-play-state:paused}
.orb-ph{width:108px;height:108px;border-radius:50%;background:#fff;border:1px solid rgba(11,21,18,.1);box-shadow:0 24px 50px -30px rgba(11,21,18,.4);overflow:hidden;display:grid;place-items:center;transition:transform .35s var(--ease),box-shadow .35s}
.orb-ph img{width:100%;height:100%;object-fit:cover;object-position:50% 56%}
.orb-pill{font-family:var(--display);font-weight:600;font-size:13.5px;letter-spacing:-.01em;color:var(--fg);background:#fff;border:1px solid rgba(11,21,18,.1);border-radius:999px;padding:7px 13px;white-space:nowrap;box-shadow:0 10px 24px -18px rgba(11,21,18,.4);transition:background .3s,color .3s}
.orb-node.is-on .orb-ph,.orb-up:hover .orb-ph{transform:scale(1.12);box-shadow:0 0 0 4px rgba(12,196,129,.35),0 30px 60px -30px rgba(11,21,18,.45)}
.orb-node.is-on .orb-pill,.orb-up:hover .orb-pill{background:var(--green);color:#04160F;border-color:transparent}
.orb-detail{max-width:760px;margin:6px auto 0;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px 26px;box-shadow:0 30px 60px -40px rgba(11,21,18,.35);display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;min-height:148px}
.orb-detail .dp{width:104px;height:104px;border-radius:50%;background:#fff;border:1px solid var(--line);overflow:hidden}
.orb-detail .dp img{width:100%;height:100%;object-fit:cover;object-position:50% 56%}
.orb-detail b.t{display:block;font-family:var(--display);font-weight:600;font-size:23px;letter-spacing:-.03em;color:var(--fg)}
.orb-detail p{margin:6px 0 10px;font-size:15px;line-height:1.5}
.orb-detail ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.orb-detail li{font-size:13px;font-weight:600;color:var(--green-2);background:rgba(12,196,129,.12);border-radius:999px;padding:6px 12px}
.orb-detail .go{display:inline-block;margin-top:12px;font-weight:600;color:var(--green-2);text-decoration:none}
/* "Run the whole practice" is the whole system, not one solution (Will, 2026-10-22): it glows, in the orbit and the lists */
.orb-node.is-whole .orb-ph{box-shadow:0 0 0 4px rgba(12,196,129,.45),0 0 38px 10px rgba(12,196,129,.32);animation:orb-glow 2.6s ease-in-out infinite}
.orb-node.is-whole .orb-pill{background:var(--green);color:#04160F;border-color:transparent;display:grid;justify-items:center;line-height:1.15;padding:7px 14px}
.orb-node.is-whole .orb-pill em{font-style:normal;font-weight:600;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
@keyframes orb-glow{0%,100%{box-shadow:0 0 0 4px rgba(12,196,129,.45),0 0 30px 6px rgba(12,196,129,.26)}50%{box-shadow:0 0 0 6px rgba(12,196,129,.6),0 0 54px 16px rgba(12,196,129,.42)}}
.sol.whole{border-color:rgba(12,196,129,.65);box-shadow:0 0 0 3px rgba(12,196,129,.22),0 30px 60px -28px rgba(12,196,129,.5);animation:sol-glow 2.6s ease-in-out infinite}
.sol.whole .ph{background:linear-gradient(160deg,rgba(12,196,129,.28),rgba(96,165,250,.1) 68%,rgba(255,255,255,.5))}
.sol .all{display:inline-block;justify-self:start;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#04160F;background:var(--green);border-radius:999px;padding:5px 11px}
@keyframes sol-glow{0%,100%{box-shadow:0 0 0 3px rgba(12,196,129,.22),0 30px 60px -28px rgba(12,196,129,.5)}50%{box-shadow:0 0 0 5px rgba(12,196,129,.38),0 34px 70px -24px rgba(12,196,129,.7)}}
@media (prefers-reduced-motion:reduce){.orb-node.is-whole .orb-ph,.sol.whole{animation:none}}
.orb-list{display:none}
@media (prefers-reduced-motion:reduce){.orb-wheel,.orb-up{animation:none!important}}
@media (max-width:860px){.orb-stage,.orb-detail{display:none}.orb-list{display:grid}}
@keyframes orb-spin{to{transform:rotate(360deg)}}
@keyframes orb-unspin{to{transform:translate(-50%,-50%) rotate(calc(var(--i) * -360deg / var(--n) - 360deg))}}

/* ---------- the dashboard, in place of the Slack terminal ---------- */
.dash{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 34px 70px -40px rgba(11,21,18,.35);overflow:visible;margin-top:8px}
.dash-bar{display:flex;align-items:center;gap:6px;padding:14px 18px;border-bottom:1px solid var(--line);border-radius:var(--r) var(--r) 0 0;background:var(--bg-2)}
.dash-bar i{width:10px;height:10px;border-radius:50%;background:var(--line-2)}
.dash-bar i:nth-child(1){background:#FF5F57}.dash-bar i:nth-child(2){background:#FEBC2E}.dash-bar i:nth-child(3){background:#28C840}
.dash-bar span{margin-left:10px;font-weight:600;font-size:13.5px;color:var(--fg)}
.dash-bar em{margin-left:auto;font-style:normal;font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--green-2);padding:4px 10px;border-radius:999px;background:rgba(12,196,129,.12)}
.dash-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:18px}
.dash-g{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-sm);padding:14px 16px 16px}
.dash-g h4{font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.dash-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.dash-t{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 10px 9px;min-width:0}
.dash-t b{display:block;font-family:var(--display);font-weight:600;font-size:clamp(18px,1.7vw,24px);letter-spacing:-.03em;color:var(--fg);line-height:1.05}
.dash-t span{display:block;margin-top:4px;font-size:11.5px;line-height:1.3;color:var(--muted)}
.dash-row{display:grid;grid-template-columns:110px 1fr;gap:10px;align-items:center;padding:5px 0;font-size:13px;font-weight:600;color:var(--fg)}
.dash-mix .pbar{height:10px}
.dash-found .dash-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
.msct-dash{right:22px;top:auto;bottom:calc(100% - 22px);width:clamp(110px,10vw,150px)}
@media (prefers-reduced-motion:no-preference){.msct-dash{animation:msct-bob-r 6s ease-in-out infinite}}
@media (max-width:860px){.dash-body{grid-template-columns:1fr}.dash-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.dash-found .dash-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}.msct-dash{width:96px;right:12px}}

/* ---------- the roadmap: four steps, a numbered spine, Core on every card ---------- */
.road{list-style:none;margin:0;padding:0;display:grid;gap:clamp(18px,2.4vw,30px);position:relative}
.road::before{content:"";position:absolute;left:34px;top:40px;bottom:40px;width:2px;background:linear-gradient(var(--green),rgba(12,196,129,.15))}
.road-step{display:grid;grid-template-columns:70px minmax(0,1fr);gap:clamp(14px,2vw,28px);align-items:start}
.road-n{position:relative;z-index:1}
.road-n span{display:grid;place-items:center;width:70px;height:70px;border-radius:50%;background:var(--green);color:#04160F;font-family:var(--display);font-weight:600;font-size:22px;letter-spacing:-.02em;box-shadow:0 14px 30px -16px rgba(12,196,129,.9)}
.road-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,260px);gap:clamp(18px,3vw,40px);align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,3vw,36px);box-shadow:0 24px 50px -36px rgba(11,21,18,.25)}
.road-step:nth-child(even) .road-card{grid-template-columns:minmax(0,260px) minmax(0,1fr)}
.road-step:nth-child(even) .road-ph{order:-1}
.road-tx h3{font-size:clamp(22px,2.2vw,30px);letter-spacing:-.03em;margin:6px 0 10px}
.road-tx p{font-size:16px;line-height:1.6;max-width:58ch}
.road-k{display:block;margin:16px 0 8px;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--green-2)}
.road-tx ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.road-tx li{position:relative;padding-left:22px;font-size:15px;line-height:1.5}
.road-tx li::before{content:"";position:absolute;left:0;top:9px;width:12px;height:7px;border-left:1.5px solid var(--green-2);border-bottom:1.5px solid var(--green-2);transform:rotate(-45deg)}
.road-ph{width:100%;max-width:260px;height:auto;margin:0 auto;mix-blend-mode:multiply}
@media (max-width:900px){.road::before{left:22px}.road-step{grid-template-columns:46px minmax(0,1fr)}.road-n span{width:46px;height:46px;font-size:16px}.road-card,.road-step:nth-child(even) .road-card{grid-template-columns:1fr}.road-ph,.road-step:nth-child(even) .road-ph{order:0;max-width:200px}}

:root[data-theme=light] .dash-bar em{color:#06634A}

/* orbit, second cut (Will, 2026-10-21): smaller wheel on the left, the selector card on the right, the whole thing on one screen */
@media (min-width:861px){
  :root[data-theme=light] .orb{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(18px,3vw,44px);align-items:center}
  :root[data-theme=light] .orb-stage{width:min(100%,520px);margin:0}
  :root[data-theme=light] .orb-detail{margin:0;max-width:none;grid-template-columns:1fr;gap:14px;padding:26px 28px;align-self:center}
  :root[data-theme=light] .orb-detail .dp{width:96px;height:96px}
  :root[data-theme=light] .orb-detail b.t{font-size:26px}
  :root[data-theme=light] .orb-detail p{font-size:16px}
  :root[data-theme=light] .orb-ph{width:84px;height:84px}
  :root[data-theme=light] .orb-pill{font-size:12px;padding:5px 11px}
  :root[data-theme=light] .orb-up{width:150px;gap:7px}
  :root[data-theme=light] .orb-arm{transform:translateY(-39cqw)}
  :root[data-theme=light] .orb-core{width:30%}
}
@media (min-width:1280px){:root[data-theme=light] .orb-stage{width:min(100%,580px)}}
/* phones: the ten as a tight list so they fit on one screen */
@media (max-width:860px){
  :root[data-theme=light] .orb-list{display:grid;grid-template-columns:1fr;gap:8px}
  :root[data-theme=light] .orb-list .sol{flex-direction:row;align-items:center;gap:12px;padding:6px 12px 6px 6px;border-radius:14px;box-shadow:0 10px 24px -20px rgba(11,21,18,.3)}
  :root[data-theme=light] .orb-list .sol .ph{width:52px;height:52px;flex:none;aspect-ratio:1;border-radius:50%;overflow:hidden}
  :root[data-theme=light] .orb-list .sol .tx{padding:0;gap:2px;min-width:0}
  :root[data-theme=light] .orb-list .sol h3{font-size:15.5px}
  :root[data-theme=light] .orb-list .sol .tag{display:none}
  :root[data-theme=light] .orb-list .sol .go{margin:0;font-size:12.5px}
}

/* solution heroes: the whole pose, never cropped (Will, 2026-10-21: the social hero was cut off) */
:root[data-theme=light] .sol-ph{aspect-ratio:4/3;background:#FCFCFA}
:root[data-theme=light] .sol-ph img{width:100%;height:100%;object-fit:contain;object-position:50% 50%;mix-blend-mode:multiply}
:root[data-theme=light] .sol .ph img{object-fit:contain;mix-blend-mode:multiply}

/* round five (Will, 2026-10-22): the solution hero floats on the page, no tile, nothing cut */
:root[data-theme=light] .sol-ph{aspect-ratio:auto;min-height:0;background:transparent;box-shadow:none;border-radius:0;overflow:visible;display:grid;place-items:center}
:root[data-theme=light] .sol-ph img{width:min(100%,520px);height:auto;max-height:none;object-fit:contain;mix-blend-mode:multiply}
@media (max-width:900px){:root[data-theme=light] .sol-ph img{width:min(100%,380px)}}

/* the other nine: equal cards, three by three; a compact list on phones */
:root[data-theme=light] .sols.four{grid-template-columns:repeat(3,minmax(0,1fr))}
:root[data-theme=light] .sols.four .sol:nth-child(n){grid-column:auto}
@media (max-width:860px){
  :root[data-theme=light] .sols.four{grid-template-columns:1fr;gap:8px}
  :root[data-theme=light] .sols.four .sol{flex-direction:row;align-items:center;gap:12px;padding:6px 12px 6px 6px;border-radius:14px;box-shadow:0 10px 24px -20px rgba(11,21,18,.3)}
  :root[data-theme=light] .sols.four .sol .ph{width:52px;height:52px;flex:none;aspect-ratio:1;border-radius:50%;overflow:hidden}
  :root[data-theme=light] .sols.four .sol .tx{padding:0;gap:2px;min-width:0}
  :root[data-theme=light] .sols.four .sol h3{font-size:15.5px}
  :root[data-theme=light] .sols.four .sol .tag{display:none}
  :root[data-theme=light] .sols.four .sol .go{margin:0;font-size:12.5px}
}

/* the roadmap reads as a story: bigger line, lighter card, shorter list */
:root[data-theme=light] .road-tx h3{font-size:clamp(26px,2.6vw,36px);letter-spacing:-.035em;margin:4px 0 10px}
:root[data-theme=light] .road-tx p{font-size:17px;max-width:48ch}
:root[data-theme=light] .road-tx ul{margin-top:14px}
:root[data-theme=light] .road-tx li{font-size:15px}
:root[data-theme=light] .road-ph{max-width:220px}

/* the pose image itself fades out on all four edges, so its own ground shadow never ends in a visible rectangle */
:root[data-theme=light] .sol-ph img,:root[data-theme=light] .hv-core,:root[data-theme=light] .road-ph,:root[data-theme=light] .msct-partner{-webkit-mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 9%,#000 91%,transparent);-webkit-mask-composite:source-in;mask-composite:intersect}

:root[data-theme=light] .sol-ph img{filter:none}

/* phones: the header already carries Book a call, so the hero button goes (Will, 2026-10-22) */
@media (max-width:960px){:root[data-theme=light] .hv .btns{display:none}:root[data-theme=light] .hv .gpill{margin-top:4px}}

/* orbit v3 (Will, 2026-10-22): the centre is the whole system, ringed, clickable, titled; no cycling highlight on the wheel */
:root[data-theme=light] .orb-node.is-on .orb-ph{transform:none;box-shadow:0 24px 50px -30px rgba(11,21,18,.4)}
:root[data-theme=light] .orb-node.is-on .orb-pill{background:#fff;color:var(--fg);border-color:rgba(11,21,18,.1)}
:root[data-theme=light] .orb-up:hover .orb-ph,:root[data-theme=light] .orb-node.is-on .orb-up:hover .orb-ph{transform:scale(1.1);box-shadow:0 0 0 4px rgba(12,196,129,.35),0 30px 60px -30px rgba(11,21,18,.45)}
:root[data-theme=light] .orb-up:hover .orb-pill,:root[data-theme=light] .orb-node.is-on .orb-up:hover .orb-pill{background:var(--green);color:#04160F;border-color:transparent}
:root[data-theme=light] .orb-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:36%;display:grid;justify-items:center;gap:10px;text-decoration:none;z-index:2}
:root[data-theme=light] .orb-core-ph{display:grid;place-items:center;width:100%;aspect-ratio:1;border-radius:50%;background:#fff;border:2px solid var(--green);box-shadow:0 0 0 10px rgba(12,196,129,.10),0 30px 60px -30px rgba(11,21,18,.4);overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s}
:root[data-theme=light] .orb-center .orb-core{position:static;transform:none;width:92%;height:auto;mix-blend-mode:multiply}
:root[data-theme=light] .orb-pill-center{display:grid;justify-items:center;line-height:1.15;padding:8px 16px;font-size:14px;background:var(--green);color:#04160F;border-color:transparent}
:root[data-theme=light] .orb-pill-center em{font-style:normal;font-weight:600;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
:root[data-theme=light] .orb-center:hover .orb-core-ph,:root[data-theme=light] .orb-center.is-on .orb-core-ph{transform:scale(1.04);box-shadow:0 0 0 14px rgba(12,196,129,.14),0 34px 70px -30px rgba(11,21,18,.45)}
@media (min-width:861px){:root[data-theme=light] .orb-center{width:34%}}

/* eleven: the other ten as five per row on wide screens, three on laptops */
:root[data-theme=light] .sols.four{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
:root[data-theme=light] .sols.four .sol h3{font-size:18px}
:root[data-theme=light] .sols.four .sol .tag{font-size:13px}
:root[data-theme=light] .sols.four .sol .tx{padding:14px 16px 18px}
@media (max-width:1180px){:root[data-theme=light] .sols.four{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){:root[data-theme=light] .sols.four{grid-template-columns:1fr}}

/* the thesis keeps its scroll effect on phones (Will: "it still does the line by line bit"). The pin is measured in svh,
   the smallest viewport, so the phone URL bar collapsing never changes the section's height or re-times a beat. */
.thesis .track{height:calc(var(--thesis-n,7) * 58vh + 100vh);height:calc(var(--thesis-n,7) * 58svh + 100svh)}
.thesis .sticky{height:100vh;height:100svh}
.thesis .kicker{top:calc(72px + 4svh)}
@media (max-width:860px){
  .thesis .lines{gap:18px}
  .thesis p{font-size:clamp(22px,6vw,28px)}
  .thesis p.big{font-size:clamp(30px,8.4vw,40px)}
  #cal-inline,.calwrap{min-height:720px}
}
.no-js .thesis p{opacity:1;transform:none}

/* phones: the desktop breathing room (110px a section) stacked into 220px of nothing between blocks */
@media (max-width:860px){
  .sec{padding:60px 0}
  .sec-head{margin-bottom:28px}
  .close{padding:84px 0}
  .hero{padding-bottom:40px}
}
/* the open phone menu: a solid card under the pill, nothing shows through it */
@media (max-width:1040px){
  :root[data-theme=light] .hdr.open .nav{background:#F3F6F4;backdrop-filter:none;-webkit-backdrop-filter:none;top:84px;left:12px;right:12px;border:1px solid var(--line);border-radius:18px;box-shadow:0 30px 60px -30px rgba(11,21,18,.35);padding:10px 10px 14px;max-height:calc(100svh - 100px)}
}

/* the guarantee band: Core's box is reserved before the file arrives (a live phone run shifted 130px here) */
.gband img{aspect-ratio:800/694;object-fit:contain}

/* the booking page (Will, 2026-10-22): the claim, the Core video, the calendar, the reviews, the press, the numbers */
.bk-hero .wrap{max-width:860px}
.bk-hero h1{max-width:16ch}
.bk-hero .hv-stack{margin-top:26px;font-size:14px;color:var(--muted);max-width:60ch}
.bk-hero .hv-stack b{font-weight:600;color:var(--fg)}
.bk-video{padding-top:0}
.bk-vid{max-width:1040px;margin:0 auto}
.bk-vid video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:var(--r);background:#0B1512;box-shadow:0 40px 80px -40px rgba(11,21,18,.45);border:1px solid var(--line)}
:root[data-theme=light] .book .calwrap{grid-column:1 / -1}
@media (min-width:901px){:root[data-theme=light] .book:has(.calwrap:first-child){grid-template-columns:1fr}}
:root[data-theme=light] .book:has(.book-side){grid-template-columns:minmax(0,1fr);gap:28px}
:root[data-theme=light] .book:has(.book-side) .calwrap{order:-1}
:root[data-theme=light] .book-side{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 40px;align-items:start}
:root[data-theme=light] .book-side h3{grid-column:1 / -1;margin-top:8px}
:root[data-theme=light] .book-side .what{margin-top:0}
:root[data-theme=light] .book-side .tiny{grid-column:1 / -1}
@media (max-width:900px){:root[data-theme=light] .book-side{grid-template-columns:1fr}}

/* the stack line and the hub chips link to the platform pages (SEO wave one, 2026-10-26) */
.hv-stack b a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(11,21,18,.25)}
.hv-stack b a:hover{color:var(--green-2);border-bottom-color:var(--green-2)}
a.chip{text-decoration:none;color:inherit}
a.chip:hover{border-color:var(--green);color:var(--green-2)}

/* the calculators (wave two, 2026-10-26) */
.calc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(20px,3vw,40px);align-items:start}
.calc-in{display:grid;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:clamp(20px,3vw,30px)}
.calc-f{display:grid;gap:6px}
.calc-l{font-weight:600;font-size:14px;color:var(--fg)}
.calc-f input{font:inherit;font-size:18px;font-weight:600;padding:12px 14px;border-radius:12px;border:1px solid var(--line-2);background:#F6F8F6;color:var(--fg);min-width:0}
.calc-f input:focus{outline:2px solid var(--green);outline-offset:1px;background:#fff}
.calc-h{font-size:13px;color:var(--muted);line-height:1.45}
.calc-note{font-size:13px;color:var(--muted);margin:4px 0 0}
.calc-out{position:relative;display:grid;gap:12px;background:#0B1512;color:#F2F6F3;border-radius:var(--r);padding:clamp(22px,3vw,32px);box-shadow:0 34px 70px -40px rgba(11,21,18,.5)}
.msct-calc{position:absolute;right:14px;top:-78px;width:150px;height:auto}
.calc-r{display:grid;gap:2px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.calc-r b{font-family:var(--display);font-weight:600;font-size:clamp(30px,3.4vw,44px);line-height:1;color:#14FFB0;letter-spacing:-.02em}
.calc-r span{font-size:13px;color:#AAB6B0}
.calc-formula{font-size:13px;color:#AAB6B0;line-height:1.5;margin:6px 0 4px}
.calc-formula b{color:#F2F6F3}
.calc-out .btn{justify-self:start}
.calc-out .tiny{color:#AAB6B0;margin:0}
.calc-wait b{font-size:clamp(22px,2.4vw,28px);color:#F2F6F3}
[hidden]{display:none!important}
.gband-guide{margin-top:8px}
@media (max-width:900px){.calc{grid-template-columns:1fr}.msct-calc{width:110px;top:-56px;right:0}}

/* Core in the hero of every guide, comparison, metro page and calculator (2026-10-26) */
:root[data-theme=light] .guide-hero .wrap{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)}
:root[data-theme=light] .guide-hero .guide-ph img{width:min(78%,380px)}
:root[data-theme=light] .guide-hero h1{max-width:20ch}
:root[data-theme=light] .guide-hero .lede{max-width:62ch}
@media (max-width:900px){:root[data-theme=light] .guide-hero .wrap{grid-template-columns:1fr}:root[data-theme=light] .guide-hero .guide-ph{order:-1;margin:0 auto}:root[data-theme=light] .guide-hero .guide-ph img{width:min(46vw,220px)}}