/* From Answers to Actions (2026): page + gate styles. Generated by build.mjs */
/* Layout concept: a scrolling edition of the PDF. Dark cinematic chapters (1, 3, 5) alternate with
   light-sky chapters (2, 4); every finding = headline + lede + one animated exhibit + key takeaway.
   Sticky chapter bar on top, numbered progress rail on the right (desktop). */
:root{
  /* Canary palette */
  --black:#000000; --midnight:#022440; --navy:#062C69; --ocean:#0673CC; --bluejay:#0890FF;
  --violet:#9D7AFA; --lavender:#D5C4FF; --wink:#3304AD; --sky:#EFF9FE; --ice:#EDF4FB;
  --white:#FFFFFF; --muted:#676767; --ink:#141414; --canary:#FFD214;
  /* derived tints (palette + white / opacity only) */
  --blue-hi:color-mix(in srgb,var(--bluejay) 62%,var(--white));
  --blue-soft:color-mix(in srgb,var(--bluejay) 38%,var(--white));
  --glass:rgba(255,255,255,.06); --glass-2:rgba(255,255,255,.1); --line:rgba(255,255,255,.14);
  --on-dark-2:rgba(255,255,255,.72);
  /* type */
  --f:"Poppins",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --display:clamp(40px,6.9vw,90px); --h2:clamp(30px,4.4vw,56px); --h3:clamp(20px,2vw,26px);
  /* motion */
  --out:cubic-bezier(.23,1,.32,1); --io:cubic-bezier(.77,0,.175,1);
  --gut:clamp(16px,4vw,48px); --max:1240px; --gap:24px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--black);color:var(--white);font-family:var(--f);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4,p{margin:0}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
:focus-visible{outline:2px solid var(--bluejay);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tnum{font-variant-numeric:tabular-nums}

/* ---------- top bar ---------- */
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(2,36,64,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.bar-in{display:flex;align-items:center;gap:16px;height:64px}
.bar .logo{height:24px;width:auto;flex:none}
.chap-tabs{display:none;gap:4px;margin-inline:auto;list-style:none;padding:0}
.chap-tabs a{display:flex;gap:8px;align-items:baseline;text-decoration:none;font-size:13px;font-weight:500;padding:8px 12px;border-radius:999px;color:var(--on-dark-2);transition:color .15s ease,background-color .15s ease}
.chap-tabs a b{font-weight:500;color:var(--blue-hi)}
.chap-tabs a[aria-current="true"]{background:var(--glass-2);color:var(--white)}
@media (hover:hover){.chap-tabs a:hover{color:var(--white)}}
.bar-actions{margin-left:auto;display:flex;gap:8px;align-items:center}
@media(min-width:1100px){.chap-tabs{display:flex}.bar-actions{margin-left:0}.menu-btn{display:none!important}}
.progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--bluejay),var(--violet))}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 24px;border-radius:999px;background:var(--bluejay);color:var(--white);font:500 15px/1 var(--f);text-decoration:none;border:0;cursor:pointer;transition:background-color .15s ease,transform .12s var(--out),box-shadow .15s ease}
.btn.sm{height:36px;padding:0 16px;font-size:13px}
@media (hover:hover){.btn:hover{background:var(--ocean);transform:translateY(-1px);box-shadow:0 6px 18px rgba(6,115,204,.35)}}
.btn:active{transform:scale(.98)}
.btn svg{width:16px;height:16px}
.alink{display:inline-flex;align-items:center;gap:10px;font:500 15px/1 var(--f);color:var(--white);text-decoration:none}
.alink .arr{transition:transform .2s var(--out)}
@media (hover:hover){.alink:hover .arr{transform:translateX(6px)}.alink:hover span:first-child{text-decoration:underline;text-underline-offset:4px}}
.on-light .alink{color:var(--bluejay)}
.menu-btn{height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--white);font:500 13px/1 var(--f);cursor:pointer}

/* chapter sheet (mobile) */
dialog.sheet{border:0;padding:0;margin:auto 0 0;width:100%;max-width:100%;background:var(--midnight);color:var(--white);border-radius:24px 24px 0 0;padding-bottom:env(safe-area-inset-bottom,0px)}
dialog.sheet::backdrop{background:rgba(0,0,0,.55)}
dialog.sheet[open]{animation:sheetIn .32s var(--out)}
@keyframes sheetIn{from{transform:translateY(40px);opacity:0}}
.sheet-in{padding:24px var(--gut) 28px}
.sheet h2{font-size:13px;font-weight:500;color:var(--on-dark-2);margin-bottom:8px}
.sheet ol{list-style:none;padding:0;margin:0}
.sheet li a{display:flex;gap:16px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:17px}
.sheet li a b{font-weight:400;color:var(--blue-hi);width:20px}
.sheet .close{margin-top:16px;width:100%}

/* right rail (desktop) */
.rail{position:fixed;right:20px;top:50%;transform:translateY(-50%);z-index:40;display:none;flex-direction:column;align-items:center;gap:6px;padding:12px 8px;border:1px solid var(--line);border-radius:999px;background:rgba(0,0,0,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.rail a{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;font-size:12px;font-weight:500;text-decoration:none;color:var(--on-dark-2);transition:background-color .2s ease,color .2s ease}
.rail a[aria-current="true"]{background:var(--bluejay);color:var(--white)}
.rail .tick{width:1px;height:10px;background:var(--line)}
@media(min-width:1360px){.rail{display:flex}}

/* ---------- reveal system (visible at rest; JS only hides things below the fold) ---------- */
.js .rv.pre{opacity:0;transform:translateY(14px)}
.rv{transition:opacity .5s var(--out),transform .5s var(--out)}
@media (prefers-reduced-motion:reduce){.rv{transition:none}.js .rv.pre{opacity:1;transform:none}html{scroll-behavior:auto}}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;background:var(--black);border-radius:0 0 32px 32px;isolation:isolate}
.glow{position:absolute;border-radius:50%;filter:blur(70px);z-index:-1;pointer-events:none}
.hero .g1{width:70vw;height:70vw;max-width:900px;max-height:900px;left:-20vw;bottom:-45vw;background:radial-gradient(circle,rgba(8,144,255,.55),transparent 65%)}
.hero .g2{width:50vw;height:50vw;max-width:640px;max-height:640px;left:20vw;bottom:-30vw;background:radial-gradient(circle,rgba(157,122,250,.35),transparent 65%)}
.grain{position:absolute;inset:0;z-index:-1;opacity:.3;mix-blend-mode:overlay;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
.hero-grid{display:grid;gap:32px;padding-block:40px 56px;align-items:end}
@media(min-width:900px){.hero-grid{grid-template-columns:1.1fr .9fr;padding-block:56px clamp(56px,6vw,88px);gap:48px}}
.tag{display:inline-flex;align-items:center;gap:0;border:1px solid var(--line);border-radius:999px;font-size:13px;font-weight:500;overflow:hidden;background:var(--glass)}
.tag span{padding:6px 14px}
.tag span:first-child{background:var(--white);color:var(--black);border-radius:999px}
.eyebrow{font-size:14px;font-weight:500;color:var(--canary);margin-top:28px}
.hero h1{font-size:var(--display);font-weight:400;line-height:1;letter-spacing:-.025em;margin-top:12px}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.06em}
.hero h1 .ln>span{display:inline-block;transform:translateY(0);transition:transform .9s var(--out)}
.js .hero h1.pre .ln>span{transform:translateY(105%)}
.hero h1 .ln:nth-child(2)>span{transition-delay:.09s}
.hero .sub{font-size:clamp(17px,1.8vw,22px);line-height:1.4;color:var(--on-dark-2);margin-top:20px;max-width:30ch}
.cta-row{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;margin-top:32px}

/* photo placeholder slot */
.ph{position:relative;margin:0;border-radius:24px;overflow:hidden;background:
  radial-gradient(120% 90% at 80% 10%,rgba(8,144,255,.35),transparent 60%),
  radial-gradient(90% 80% at 10% 100%,rgba(157,122,250,.3),transparent 60%),var(--navy);
  border:1px dashed rgba(255,255,255,.35);display:grid;place-items:center;min-height:120px;max-width:100%}
.ph::after{content:attr(data-photo);position:absolute;left:12px;bottom:12px;right:12px;font-size:11px;font-weight:500;letter-spacing:.02em;color:rgba(255,255,255,.85);background:rgba(0,0,0,.35);padding:6px 10px;border-radius:8px;width:fit-content;max-width:calc(100% - 24px)}
.ph svg{width:28px;height:28px;opacity:.6}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph:has(img){border-style:solid;border-color:transparent}.ph:has(img)::after{display:none}
.hero .ph{aspect-ratio:4/5;max-height:620px}
@media(min-width:900px){.hero-grid{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);column-gap:40px;align-items:stretch}.hero-grid>div{display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.hero-grid>div>.tag{margin:0}.hero h1{margin-top:36px}.hero .sub{margin-top:32px}.hero .ph{aspect-ratio:1/1;max-height:none;height:auto}}
.report-cta{padding-block:var(--rcta) 8px}:root{--rcta:clamp(48px,5.5vw,80px)}.report-cta .cta-row{justify-content:center;margin-top:0}.study-cta{margin-top:40px}
.hero .ph .tag{position:absolute;top:16px;right:16px}
@media(max-width:899px){.hero .ph{aspect-ratio:4/3}}

/* ---------- summary cards (also the table of contents) ---------- */
.summary{padding-block:clamp(48px,6vw,88px) 0}.summary .intro{row-gap:20px}.summary .intro .lede+.lede{margin-top:4px}.summary .sum-grid{margin-top:clamp(48px,5vw,72px)}@media(min-width:900px){section.summary .intro{max-width:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--gap);align-items:start}.summary .intro h2{padding-right:24px}.summary .intro .kicker{margin-bottom:4px}.summary .intro .kicker{grid-column:1/-1;justify-self:start}.summary .intro h2{grid-column:1;grid-row:2/span 2}.summary .intro .lede{grid-column:2}}.summary .lede{font-size:clamp(15px,1.15vw,16px)}
.summary .intro{display:grid;gap:16px;max-width:880px}
.kicker{display:inline-flex;align-self:start;width:fit-content;font-size:13px;font-weight:500;padding:6px 14px;border-radius:999px;border:1px solid var(--line);background:var(--glass)}
.on-light .kicker{border-color:rgba(8,144,255,.25);background:rgba(8,144,255,.08);color:var(--midnight)}
.summary h2{font-size:var(--h2);font-weight:400;line-height:1.08;letter-spacing:-.02em}
.lede{font-size:clamp(16px,1.35vw,18px);color:var(--on-dark-2);max-width:68ch}
.on-light .lede{color:var(--ink)}
.sum-grid{display:grid;gap:var(--gap);margin-top:40px;grid-template-columns:1fr}
@media(min-width:640px){.sum-grid{grid-template-columns:1fr 1fr}}
@media(min-width:1100px){.sum-grid{grid-template-columns:repeat(4,1fr)}}
.sum{position:relative;display:flex;flex-direction:column;gap:12px;padding:28px;border-radius:24px;text-decoration:none;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid var(--line);transition:transform .45s var(--out),opacity .5s var(--out),border-color .2s ease}
@media (hover:hover){.sum:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.3)}.sum:hover .alink .arr{transform:translateX(6px)}}
.sum .big{font-size:clamp(52px,5.4vw,76px);font-weight:600;line-height:1;letter-spacing:-.02em}
.sum h3{font-size:22px;font-weight:600;line-height:1.15}
.sum p{font-size:15px;color:var(--on-dark-2)}
.sum .alink{margin-top:auto;padding-top:8px;font-size:14px}
.c1{color:var(--blue-hi)}.c2{color:var(--blue-soft)}.c3{color:var(--lavender)}.c4{color:var(--violet)}

/* ---------- chapters ---------- */
.chapter{position:relative;isolation:isolate;overflow:clip}
.chapter.dark{background:var(--black)}
.chapter.on-light{background:linear-gradient(180deg,var(--white),var(--sky));color:var(--ink)}
.opener{position:relative;padding-block:96px 64px;overflow:hidden}
.opener .g1{width:80vw;height:60vw;max-width:1100px;max-height:800px;right:-20vw;top:-10vw;background:radial-gradient(circle,rgba(8,144,255,.5),transparent 62%)}
.opener .g2{width:50vw;height:40vw;max-width:700px;max-height:500px;left:-10vw;bottom:-20vw;background:radial-gradient(circle,rgba(157,122,250,.35),transparent 62%)}
.on-light .opener .g1{background:radial-gradient(circle,rgba(8,144,255,.22),transparent 62%)}
.on-light .opener .g2{background:radial-gradient(circle,rgba(157,122,250,.18),transparent 62%)}
.opener-grid{display:grid;gap:24px;align-items:end}
@media(min-width:900px){.opener-grid{grid-template-columns:auto 1fr;gap:56px}}
.numeral{font-size:clamp(140px,22vw,300px);font-weight:400;line-height:.8;letter-spacing:-.05em;background:linear-gradient(180deg,var(--white),rgba(255,255,255,.35));-webkit-background-clip:text;background-clip:text;color:transparent}
.on-light .numeral{background:linear-gradient(180deg,var(--bluejay),var(--violet));-webkit-background-clip:text;background-clip:text}
.opener h2{font-size:var(--h2);font-weight:400;line-height:1.05;letter-spacing:-.02em;border-top:1px solid var(--line);padding-top:20px}
.on-light .opener h2{border-color:rgba(2,36,64,.15)}
.opener .sub{font-size:18px;font-weight:500;margin-top:12px;color:var(--on-dark-2)}
.on-light .opener .sub{color:var(--midnight)}
.inch{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:24px;list-style:none;padding:0}
.inch a{display:inline-flex;font-size:13px;font-weight:500;padding:8px 14px;border-radius:999px;border:1px solid var(--line);text-decoration:none;background:var(--glass);transition:background-color .15s ease,border-color .15s ease}
.on-light .inch a{border-color:rgba(8,144,255,.3);background:rgba(8,144,255,.08);color:var(--midnight)}
@media (hover:hover){.inch a:hover{border-color:var(--bluejay)}}

.finding{padding-block:clamp(72px,8vw,112px)}
.finding+.finding{border-top:1px solid var(--line)}
.on-light .finding+.finding{border-color:rgba(2,36,64,.1)}
.f-head{display:grid;gap:16px;max-width:900px}
.f-head h2{font-size:var(--h2);font-weight:400;line-height:1.08;letter-spacing:-.02em}
.f-body{display:grid;gap:var(--gap);margin-top:48px;grid-template-columns:minmax(0,1fr)}
@media(min-width:960px){.f-body.half{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}.f-body{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}.f-body.flip{grid-template-columns:minmax(0,8fr) minmax(0,4fr)}.f-body.flip .take{order:2}}
@media(max-width:959px){.f-body .take{order:2}}

/* key takeaway */
.take{border-radius:24px;padding:28px;background:var(--midnight);display:flex;flex-direction:column;gap:12px;align-self:start;color:var(--white)}
.on-light .take{background:var(--ocean)}
.take .lbl{display:inline-flex;align-items:center;gap:6px;width:fit-content;font-size:12px;font-weight:500;padding:4px 10px 4px 6px;border-radius:999px;background:rgba(255,255,255,.12)}
.take .lbl img{width:15px;height:15px;margin-left:2px}
.on-light .take .lbl img{filter:brightness(0) invert(1)}
.take h3{font-size:var(--h3);font-weight:600;line-height:1.15}
.take p{font-size:15px;color:rgba(255,255,255,.85)}

/* exhibit panel */
.panel{border-radius:24px;padding:28px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));border:1px solid var(--line);min-width:0}
.on-light .panel{background:rgba(255,255,255,.72);border-color:rgba(8,144,255,.18);box-shadow:0 0 10px rgba(0,0,0,.06)}
.panel h3{font-size:clamp(18px,1.7vw,22px);font-weight:600;line-height:1.2;margin-bottom:20px}
.stack{display:grid;gap:var(--gap);min-width:0}
.two{display:grid;gap:var(--gap);grid-template-columns:minmax(0,1fr)}
@media(min-width:720px){.two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.note{font-size:12px;color:var(--on-dark-2);margin-top:16px}
.on-light .note{color:var(--muted)}

/* stat tiles */
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 20px}
@media(min-width:720px){.stats.s4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.stat .n{font-size:clamp(40px,4.6vw,64px);font-weight:600;line-height:1;letter-spacing:-.02em}
.stat .l{font-size:14px;font-weight:500;color:var(--on-dark-2);margin-top:6px;display:flex;gap:8px;align-items:center}
.stat .l img{width:20px;height:20px}
.on-light .stat .l{color:var(--midnight)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.chip{font-size:13px;font-weight:500;padding:6px 12px;border-radius:999px;background:var(--glass-2);border:.5px solid rgba(255,255,255,.35)}
.on-light .chip{background:rgba(8,144,255,.1);border-color:var(--bluejay);color:var(--ink)}

/* story (real customer story) */
.story{display:grid;gap:16px;align-content:start;border-radius:24px;padding:24px;background:rgba(255,255,255,.05);border:1px solid var(--line);min-width:0}
.on-light .story{background:var(--white);border-color:rgba(8,144,255,.18);box-shadow:0 0 10px rgba(0,0,0,.06)}
.panel>.meta,.story .meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:12px;color:var(--on-dark-2)}
.on-light .story .meta{color:var(--muted)}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;padding:4px 10px;border-radius:999px;background:rgba(8,144,255,.16);color:var(--blue-hi)}
.on-light .badge{background:rgba(8,144,255,.1);color:var(--ocean)}
.story h3{font-size:clamp(20px,1.9vw,24px);font-weight:600;line-height:1.15}
.story p{font-size:15px;color:var(--on-dark-2)}
.on-light .story p{color:var(--ink)}
.story .ph{min-height:180px}

/* chat thread */
.thread{display:flex;flex-direction:column;gap:10px;min-width:0}
.msg{max-width:86%;padding:10px 14px;border-radius:18px;font-size:14px;line-height:1.45;transition:opacity .35s var(--out),transform .35s var(--out)}
.msg .who{display:block;font-size:11px;font-weight:600;opacity:.75;margin-bottom:2px}
.msg.g{align-self:flex-start;background:rgba(255,255,255,.12);border-bottom-left-radius:6px}
.msg.a{align-self:flex-end;background:color-mix(in srgb,var(--violet) 32%,transparent);border-bottom-right-radius:6px}
.msg.s{align-self:flex-end;background:color-mix(in srgb,var(--bluejay) 30%,transparent);border-bottom-right-radius:6px}
.on-light .msg.g{background:var(--ice)}
.on-light .msg.a{background:color-mix(in srgb,var(--lavender) 55%,var(--white))}
.on-light .msg.s{background:color-mix(in srgb,var(--bluejay) 14%,var(--white))}
.msg .tr{display:block;font-size:12px;opacity:.7;font-style:italic;margin-top:4px}
.sys{align-self:center;font-size:11px;font-weight:500;color:var(--on-dark-2);padding:2px 0}
.on-light .sys{color:var(--muted)}
.done{align-self:flex-start;display:inline-flex;gap:6px;align-items:center;font-size:12px;font-weight:500;padding:4px 10px;border-radius:999px;background:rgba(8,144,255,.16);color:var(--blue-hi)}
.on-light .done{color:var(--ocean);background:rgba(8,144,255,.1)}
.done svg{width:14px;height:14px}
.js .thread.pre>*{opacity:0;transform:translateY(8px)}
.typing{align-self:flex-start;display:none;gap:4px;padding:12px 14px;border-radius:18px;background:rgba(255,255,255,.1)}
.typing i{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.5;animation:blink 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{50%{opacity:1}}

/* stacked bar (stay / context) */
.sbar{display:flex;gap:6px;height:76px}
.sbar .seg{position:relative;border-radius:14px;display:flex;align-items:center;justify-content:flex-end;padding:0 14px;font-size:clamp(18px,2.4vw,30px);font-weight:600;transform-origin:0 50%;transition:transform .9s var(--out);min-width:0}
.sbar .seg:nth-child(2){transition-delay:.12s}.sbar .seg:nth-child(3){transition-delay:.24s}
.js .sbar.pre .seg{transform:scaleX(0)}
.sbar-l{display:flex;gap:6px;margin-top:10px;font-size:13px;font-weight:500;color:var(--on-dark-2)}
.on-light .sbar-l{color:var(--midnight)}
.sbar-l span{min-width:0}

/* language region table */
.regions{display:grid;gap:0}
.region{display:grid;grid-template-columns:72px 40px 1fr;gap:12px;align-items:baseline;padding:14px 0;border-top:1px solid var(--line)}
.region:first-child{border-top:0}
.region .r{font-weight:600}
.region .c{font-size:28px;font-weight:600;color:var(--blue-hi);line-height:1}
.region .langs{font-size:14px;color:var(--on-dark-2)}
.lang-toggle{display:inline-flex;padding:3px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid var(--line);margin-bottom:12px}
.lang-toggle button{border:0;background:transparent;color:var(--on-dark-2);font:500 12px/1 var(--f);padding:7px 12px;border-radius:999px;cursor:pointer;transition:background-color .2s ease,color .2s ease}
.lang-toggle button[aria-pressed="true"]{background:var(--white);color:var(--black)}

/* personalization demo */
.persona{display:grid;gap:16px}
.ai-card{justify-self:center;width:min(100%,560px);border-radius:28px 28px 4px 28px;padding:22px 24px 24px;background:var(--midnight);color:var(--white);font-size:clamp(16px,1.5vw,18px);line-height:1.6;box-shadow:0 20px 40px -24px rgba(2,36,64,.6)}
.ai-card .who{font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--blue-hi);display:block;margin-bottom:6px}
.ai-card mark{--c:#fff;background:transparent;color:var(--c);font-weight:500;border-radius:6px;padding:1px 3px;transition:background-color .25s ease,color .25s ease,opacity .25s ease}
.ai-card mark[data-src="hist"],.src[data-src="hist"]{--c:#96CFFF}.ai-card mark[data-src="maps"],.src[data-src="maps"]{--c:#D5C4FF}.ai-card mark[data-src="pms"],.src[data-src="pms"]{--c:#FFD214}.ai-card mark[data-src="kb"],.src[data-src="kb"]{--c:#0890FF}
.ai-card:has(mark.on) mark:not(.on){opacity:.45}
.ai-card mark.on{background:var(--c);color:var(--ink-on,#fff);box-shadow:0 0 0 2px var(--c)}
.ai-card mark[data-src="hist"],.ai-card mark[data-src="maps"],.ai-card mark[data-src="pms"]{--ink-on:#022440}
.src::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--c);margin-right:8px;vertical-align:0;box-shadow:0 0 0 1px rgba(2,36,64,.25)}
.srcs{display:flex;flex-wrap:wrap;gap:8px}
.src{font:500 13px/1 var(--f);padding:9px 14px;border-radius:999px;border:.5px solid var(--bluejay);background:rgba(8,144,255,.1);color:var(--midnight);cursor:pointer;transition:background-color .2s ease,color .2s ease,transform .12s var(--out)}
.src:active{transform:scale(.97)}
.src[aria-pressed="true"]{background:var(--midnight);color:var(--white);border-color:var(--midnight)}

/* rings */
.rings{display:grid;gap:28px;align-items:center;grid-template-columns:minmax(0,1fr)}
@media(min-width:560px){.rings{grid-template-columns:clamp(260px,26vw,320px) minmax(0,1fr);gap:clamp(28px,4vw,48px)}}
.rings svg{width:clamp(260px,26vw,320px);height:auto;aspect-ratio:1;max-width:100%;justify-self:center}
.ring-arc{transition:stroke-dashoffset 1.2s var(--out)}
.legend{display:grid;gap:16px}
.legend .row{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:baseline}
.legend .row .n{font-size:40px;font-weight:600;line-height:1}
.legend .row p{font-size:14px;grid-column:2}
.legend .sw{width:12px;height:12px;border-radius:4px;grid-row:1/3;align-self:center}

/* moments bento */
.bento{display:grid;gap:var(--gap);grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.bento{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}.bento .tall{grid-row:span 2}}
.shout{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;border-radius:20px;padding:20px 24px;background:var(--ocean);color:var(--white);margin-top:var(--gap)}
.shout h3{font-size:18px;font-weight:600;display:flex;gap:10px;align-items:center}
.shout h3 img{width:24px;height:24px;filter:brightness(0) invert(1)}
.shout p{font-size:15px;flex:1 1 320px}

/* answers vs actions */
.aa{display:grid;gap:var(--gap);grid-template-columns:minmax(0,1fr)}
@media(min-width:720px){.aa{grid-template-columns:1fr 1fr}}
.aa-col{border-radius:24px;padding:24px;display:flex;flex-direction:column;gap:12px}
.aa-col.ans{background:rgba(8,144,255,.1);border:1px solid rgba(8,144,255,.35)}
.aa-col.act{background:rgba(157,122,250,.14);border:1px solid rgba(157,122,250,.45)}
.aa-col h3{font-size:28px;font-weight:600}
.aa-col .k{font-size:12px;font-weight:500;color:var(--on-dark-2);margin-top:6px}
.aa-col .v{font-size:17px;font-weight:500}
.pill{align-self:flex-start;font-size:14px;padding:9px 16px;border-radius:18px 18px 6px 18px;transition:opacity .35s var(--out),transform .35s var(--out)}
.ans .pill{background:var(--bluejay)}
.act .pill{background:var(--violet);color:var(--black)}
.aa-col .pills{display:flex;flex-direction:column;gap:8px}
.js .pills.pre .pill{opacity:0;transform:translateX(-10px)}

/* donut */
.donut-wrap{display:grid;gap:24px;align-items:center;grid-template-columns:minmax(0,1fr)}
@media(min-width:640px){.donut-wrap{grid-template-columns:clamp(260px,26vw,320px) minmax(0,1fr);gap:clamp(28px,4vw,48px)}}
.donut{width:clamp(260px,26vw,320px);height:auto;aspect-ratio:1;max-width:100%;justify-self:center}
.donut circle{transition:stroke-dashoffset 1.1s var(--out)}
.donut text{fill:var(--white);font-family:var(--f)}

/* pill bar chart */
.seg-ctrl{display:inline-flex;padding:4px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid var(--line);margin-bottom:24px;position:relative}
.seg-ctrl button{position:relative;z-index:1;border:0;background:transparent;color:var(--on-dark-2);font:500 14px/1 var(--f);padding:10px 16px;white-space:nowrap;border-radius:999px;cursor:pointer;transition:color .2s ease}
.seg-ctrl button[aria-pressed="true"]{color:var(--black)}
.seg-ctrl{max-width:100%}
@media(max-width:520px){.seg-ctrl{display:flex;width:100%}.seg-ctrl button{flex:1 1 0;white-space:normal!important;line-height:1.25;padding:9px 10px}}
.seg-ctrl .thumb{position:absolute;top:4px;bottom:4px;border-radius:999px;background:var(--white);transition:transform .3s var(--io),width .3s var(--io)}
.bars{display:grid;gap:12px}
.brow{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:14px;align-items:center}
@media(max-width:520px){.brow{grid-template-columns:minmax(0,1fr)}.brow .bl{font-size:13px}}
.brow .bl{font-size:14px;line-height:1.25;color:var(--on-dark-2)}
.track{position:relative;height:30px;border-radius:999px;background:rgba(8,144,255,.1)}
.fill{position:absolute;inset:0 auto 0 0;border-radius:999px;background:var(--bluejay);width:calc(var(--v)*1%);transform-origin:0 50%;transition:transform .8s var(--out),width .5s var(--io),background-color .3s ease}
.js .bars.pre .fill{transform:scaleX(0)}
.brow .val{position:absolute;top:50%;transform:translateY(-50%);left:calc(var(--v)*1% + 10px);font-weight:600;font-size:15px;color:var(--blue-hi);transition:left .5s var(--io)}
.brow.em .fill{background:var(--violet)}
.brow.em .val{color:var(--lavender)}
.brow.em .bl{color:var(--white)}
.callout{display:flex;gap:16px;align-items:center;margin-top:24px;padding:16px 20px;border-radius:12px;background:var(--violet);color:var(--white)}
.callout .n{font-size:34px;font-weight:600;line-height:1}
.callout p{font-size:14px;line-height:1.3}

/* chatbots: trigger -> answers -> actions */
.flow3{display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
@media(min-width:860px){.flow3{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}}
.fcol{border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:12px;background:var(--white);border:1px solid rgba(8,144,255,.18)}
.fcol h3{font-size:20px;font-weight:600;color:var(--midnight);margin:0}
.fcol .q{font-size:15px;font-style:italic;color:var(--ink);padding:14px 16px;border-radius:14px;background:var(--ice)}
.fcol .r{font-size:14px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--lavender) 55%,var(--white))}
.fcol .x{font-size:14px;font-weight:500;padding:12px 14px;border-radius:14px;background:var(--sky);border:1px solid rgba(8,144,255,.25);display:flex;flex-direction:column;gap:8px}
.fcol .x .done{transition:opacity .4s var(--out),transform .4s var(--out)}
.js .flow3.pre .x .done{opacity:0;transform:scale(.9)}
.fcol.dim{opacity:.92}

/* orchestration scrolly */
.orch{display:grid;gap:var(--gap);grid-template-columns:minmax(0,1fr)}
@media(min-width:960px){.orch{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}.orch .diagram-wrap{position:sticky;top:96px;align-self:start}}
.steps{display:grid;gap:16px}
.step{border-radius:20px;padding:24px;background:var(--white);border:1px solid rgba(8,144,255,.18);cursor:pointer;transition:border-color .25s ease,box-shadow .25s ease,opacity .4s var(--out),transform .5s var(--out);opacity:.6}
@media(min-width:960px){.step{min-height:32vh;display:flex;flex-direction:column;justify-content:center}}
.step[aria-current="true"]{opacity:1;border-color:var(--bluejay);box-shadow:0 9px 18px rgba(8,144,255,.15)}
.step .sn{font-size:12px;font-weight:600;color:var(--bluejay);letter-spacing:.04em}
.step h3{font-size:22px;font-weight:600;color:var(--midnight);margin:4px 0 8px}
.step p{font-size:15px}
.step .thread{margin-top:14px}
.diagram{border-radius:24px;padding:20px;background:rgba(255,255,255,.8);border:1px solid rgba(8,144,255,.18);box-shadow:0 0 10px rgba(0,0,0,.06)}
.diagram svg{width:100%;height:auto;display:block}
.dg-node rect{transition:fill .3s ease,stroke .3s ease}
.dg-node text{font-family:var(--f);transition:fill .3s ease}
.dg-link{transition:stroke .3s ease,stroke-dashoffset .8s var(--out),opacity .3s ease}
.dg-status{display:flex;gap:10px;align-items:center;margin-top:14px;font-size:14px;font-weight:500;color:var(--midnight)}
.dg-status .dot{flex:none;width:10px;height:10px;border-radius:50%;background:var(--bluejay);box-shadow:0 0 0 4px rgba(8,144,255,.2)}
.story-split{grid-template-columns:minmax(0,1fr)}.story-split .ss-chat{display:grid;gap:16px;align-content:start;min-width:0}.story-split .ph{min-height:220px}.story-split .msg{max-width:88%;font-size:15px}@media(min-width:760px){.story-split{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:stretch;column-gap:clamp(32px,3.5vw,48px)}.story-split .ss-chat{align-content:center}}
.bento .tall:has(.funeral-ph){grid-template-rows:auto auto auto auto 1fr;align-content:stretch}.funeral-ph{min-height:200px;margin-top:4px}
.story-center .ss-chat{display:grid;gap:16px;width:min(100%,600px);margin-inline:auto}.story-center .msg{font-size:15px}
.work-one h3{margin-bottom:10px}.big-strip{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:var(--gap);padding:18px 24px;border-radius:20px;background:var(--white);border:1px solid rgba(8,144,255,.18)}
.big-strip .n{font-size:44px;font-weight:600;color:var(--bluejay);line-height:1}
.big-strip .meter{flex:1 1 200px;height:14px;border-radius:999px;background:rgba(157,122,250,.2);overflow:hidden}
.big-strip .meter i{display:block;height:100%;width:24%;background:var(--violet);border-radius:999px;transform-origin:0 50%;transition:transform 1s var(--out)}
.js .big-strip.pre .meter i{transform:scaleX(0)}

/* every team */
.teams{display:grid;gap:var(--gap);grid-template-columns:minmax(0,1fr)}
@media(min-width:960px){.teams{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}}
.depts{display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
@media(min-width:600px){.depts{grid-template-columns:1fr 1fr}}
.dept{border-radius:20px;padding:20px;background:var(--white);border:1px solid rgba(8,144,255,.18);display:flex;flex-direction:column;gap:10px;transition:opacity .45s var(--out),transform .45s var(--out)}
.dept h3{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:500;color:var(--midnight)}
.dept h3 b{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--bluejay);color:var(--white);font-size:12px;font-weight:600}
.dept p{font-size:14px}
.js .depts.pre .dept{opacity:0;transform:translateY(12px)}
.depts .dept:nth-child(2){transition-delay:.12s}.depts .dept:nth-child(3){transition-delay:.24s}.depts .dept:nth-child(4){transition-delay:.36s}
.call{border-radius:24px;padding:20px;background:var(--white);border:1px solid rgba(8,144,255,.18)}
.wave{display:flex;align-items:center;gap:3px;height:28px;margin-bottom:14px}
.wave i{width:3px;border-radius:2px;background:var(--bluejay);height:30%}
.chips-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}

/* payoff overview */
.pay{display:grid;gap:var(--gap)}
.pay a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 24px;align-items:center;padding:24px 28px;border-radius:24px;text-decoration:none;border:1px solid var(--line);background:linear-gradient(90deg,rgba(255,255,255,.07),rgba(255,255,255,.02));transition:transform .45s var(--out),opacity .5s var(--out),border-color .2s ease}
@media (hover:hover){.pay a:hover{transform:translateX(6px);border-color:rgba(255,255,255,.3)}}
.pay .k{font-size:clamp(20px,2.2vw,28px);font-weight:500;display:flex;align-items:center;gap:14px}
.pay .k img{width:36px;height:36px}
.pay .n{font-size:clamp(44px,6vw,84px);font-weight:600;line-height:1;letter-spacing:-.02em;text-align:right}
.pay .d{grid-column:1/-1;font-size:14px;color:var(--on-dark-2)}
@media(min-width:720px){.pay .d{grid-column:2;text-align:right}}
.sub-kicker{display:inline-flex;gap:8px;align-items:center}
.sub-kicker .kicker+.kicker{background:transparent}

/* clock arcs */
.clock-wrap{display:grid;gap:24px;align-items:center;grid-template-columns:minmax(0,1fr)}
@media(min-width:640px){.clock-wrap{grid-template-columns:clamp(280px,28vw,360px) minmax(0,1fr);gap:clamp(28px,4vw,48px)}}
.clock{width:clamp(280px,28vw,360px);height:auto;aspect-ratio:1;max-width:100%;justify-self:center}
.clock .arc{transition:stroke-dashoffset 1.3s var(--out)}

/* upsell columns */
.cols{display:grid;grid-template-columns:40px repeat(3,minmax(0,1fr));gap:12px;align-items:end;height:300px;margin-top:40px;position:relative}
.cols .axis{position:relative;height:100%;font-size:11px;color:var(--on-dark-2)}
.cols .axis span{position:absolute;right:0;transform:translateY(50%)}
.col{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.col .b{width:min(88px,80%);border-radius:14px 14px 4px 4px;background:var(--bluejay);height:calc(var(--v)/300*100%);transform-origin:50% 100%;transition:transform 1s var(--out);position:relative}
.col.em .b{background:var(--violet)}
.js .cols.pre .b{transform:scaleY(0)}
.col .val{position:absolute;bottom:calc(var(--v)/300*100% + 8px);font-size:clamp(18px,2vw,26px);font-weight:600}
.col.em .val{color:var(--lavender)}
.col-l{display:grid;grid-template-columns:40px repeat(3,minmax(0,1fr));gap:12px;margin-top:10px;font-size:12px;color:var(--on-dark-2);text-align:center}
.col-l b{display:block;color:var(--white);font-weight:500;font-size:13px}
.mini{display:grid;gap:18px;border-top:1px solid var(--line);padding-top:24px}
@media(min-width:720px){.mini{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mini .row{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center}
.mini .row img{width:44px;height:44px}
.mini .n{font-size:30px;font-weight:600;line-height:1}
.mini p{font-size:13px;color:var(--on-dark-2)}

/* speed race */
.race{display:grid;gap:18px}
.lane .lh{display:flex;justify-content:space-between;align-items:baseline;font-size:14px;font-weight:500;margin-bottom:8px}
.lane .lh b{font-size:28px;font-weight:600}
.lane .tr2{height:18px;border-radius:999px;background:rgba(8,144,255,.1);overflow:hidden}
.lane .tr2 i{display:block;height:100%;border-radius:999px;transform-origin:0 50%;transform:scaleX(1)}
.lane.ai .tr2 i{width:5%;background:var(--violet);transition:transform .5s var(--out)}
.lane.st .tr2 i{width:100%;background:var(--blue-soft);transition:transform 3.2s linear}
.js .race.pre .tr2 i{transform:scaleX(0)}
.race .chips{margin-top:4px}

/* stars */
.stars{display:flex;gap:4px;margin-top:10px}
.stars svg{width:22px;height:22px}
.quote{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;border-radius:20px;padding:16px;border:1px solid var(--line);background:rgba(255,255,255,.04)}
@media(min-width:560px){.quote{grid-template-columns:150px minmax(0,1fr)}}
.quote .ph{min-height:120px;border-radius:14px}
.quote .ph svg{display:none}
.quote blockquote{margin:0;font-size:15px;font-style:italic;line-height:1.5}
.quote cite{display:inline-block;margin-top:10px;font-size:12px;font-style:normal;font-weight:500;padding:4px 10px;border-radius:999px;border:1px solid var(--line)}

/* long conversations cards */
.lc{display:grid;gap:var(--gap);grid-template-columns:minmax(0,1fr)}
@media(min-width:720px){.lc{grid-template-columns:repeat(2,minmax(0,1fr))}}
.lc .story .ph{aspect-ratio:16/10;min-height:0}
.lc .foot{display:flex;gap:12px;font-size:12px;color:var(--on-dark-2);margin-top:auto}
.lc .story{grid-template-rows:auto auto 1fr auto}
.hl{color:var(--blue-hi);font-weight:500}

/* about */
.about{position:relative;padding-block:96px;overflow:hidden;isolation:isolate}
.about .g1{width:70vw;height:60vw;max-width:900px;max-height:700px;left:-15vw;top:-10vw;background:radial-gradient(circle,rgba(8,144,255,.35),transparent 62%)}
.feat{display:grid;gap:12px}
.feat div{display:flex;gap:18px;align-items:center;padding:20px 24px;border-radius:20px;background:rgba(255,255,255,.06);border:1px solid var(--line);font-size:clamp(17px,1.6vw,20px);font-weight:500}
.feat img{width:40px;height:40px;flex:none}
.cta-band{margin-top:56px;border-radius:32px;padding:clamp(28px,5vw,56px);background:linear-gradient(180deg,var(--navy),var(--midnight));border:1px solid var(--line);display:grid;gap:24px;text-align:center;justify-items:center}
.cta-band h2{font-size:clamp(26px,3.4vw,40px);font-weight:600;line-height:1.15;max-width:22ch}
.logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 24px;align-items:center;justify-items:center;width:100%;margin-top:8px}
.logos img{height:15px;width:auto;opacity:.9}
.logos img.fs{height:26px}
@media(min-width:900px){.logos{display:flex;justify-content:center;flex-wrap:wrap;gap:42px}.logos img{height:22px}.logos img.fs{height:38px}}

/* study */
.study{padding-block:80px}
.hbar{display:grid;grid-template-columns:72px minmax(0,1fr) 44px;gap:12px;align-items:center;font-size:14px;padding:6px 0}
.hbar .t{height:10px;border-radius:999px;background:rgba(8,144,255,.12);overflow:hidden}
.hbar .t i{display:block;height:100%;width:calc(var(--v)*1%*2);max-width:100%;background:var(--bluejay);border-radius:999px;transform-origin:0 50%;transition:transform .8s var(--out)}
.js .hbars.pre .t i{transform:scaleX(0)}
.hbar .v{text-align:right;font-weight:600}
.legal{font-size:12px;color:var(--on-dark-2);margin-top:32px;max-width:90ch}

/* footer */
footer{background:var(--midnight);padding-block:32px calc(32px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line)}
.foot-in{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;justify-content:space-between;font-size:14px}
.foot-in .contact{display:flex;flex-wrap:wrap;gap:8px 20px}
.foot-in .contact b{font-weight:600}
.foot-in img{height:24px;width:auto}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;z-index:60;background:var(--white);color:var(--black);font-size:14px;font-weight:500;padding:12px 18px;border-radius:999px;box-shadow:0 9px 18px rgba(0,0,0,.25);transition:opacity .2s ease,transform .25s var(--out);pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ================= v2: mesh backgrounds, glass, rollovers ================= */
.chapter{position:relative;isolation:isolate}
.chapter.on-light{background:var(--white)}
.mesh{position:sticky;top:0;display:block;width:100%;height:100vh;margin-bottom:-100vh;pointer-events:none;z-index:0}
@supports (height:100lvh){.mesh{height:100lvh;margin-bottom:-100lvh}}
.chapter>:not(.mesh):not(.sheet-mesh){position:relative;z-index:1}
.chapter::after{content:"";position:absolute;left:0;right:0;bottom:0;height:240px;z-index:0;pointer-events:none;background:linear-gradient(180deg,transparent,var(--black))}
.chapter.on-light::after{background:linear-gradient(180deg,rgba(255,255,255,0),var(--white))}
.no-mesh .chapter.dark{background:radial-gradient(90% 60% at 70% 100%,rgba(8,144,255,.45),transparent 70%),radial-gradient(60% 50% at 0% 0%,rgba(0,57,117,.6),transparent 70%),var(--black)}
.no-mesh .chapter.on-light{background:radial-gradient(70% 60% at 40% 100%,rgba(113,191,255,.45),transparent 70%),radial-gradient(60% 60% at 100% 80%,rgba(194,188,255,.5),transparent 70%),var(--white)}
.hero{background:transparent;border-radius:0;overflow:visible}

/* glass — after Figma GLASS (frost ~25, light angle 64°, 5% white fill) */
:is(.sum,.panel,.story,.pay a,.feat>div,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip,.aa-col,.gl){
  position:relative;border:0;-webkit-backdrop-filter:blur(25px) saturate(150%);backdrop-filter:blur(25px) saturate(150%)}
.dark :is(.sum,.panel,.story,.pay a,.feat>div,.quote,.aa-col,.gl){
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.02) 55%,rgba(255,255,255,.035));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 0 32px rgba(255,255,255,.035),0 24px 48px -24px rgba(0,0,0,.6)}
.dark .aa-col.ans{background:linear-gradient(180deg,rgba(8,144,255,.16),rgba(8,144,255,.05))}
.dark .aa-col.act{background:linear-gradient(180deg,rgba(157,122,250,.22),rgba(157,122,250,.07))}
.on-light :is(.panel,.story,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip){
  background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(255,255,255,.34));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 0 10px rgba(0,0,0,.05),0 18px 40px -24px rgba(6,44,105,.25)}
/* rim light: brightest top-left, faint return bottom-right, plus a cursor spotlight */
:is(.sum,.panel,.story,.pay a,.feat>div,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip,.aa-col,.gl)::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:radial-gradient(220px circle at var(--mx,-400px) var(--my,-400px),rgba(255,255,255,.85),transparent 70%),
    linear-gradient(154deg,rgba(255,255,255,.55),rgba(255,255,255,.12) 22%,rgba(255,255,255,.03) 45%,rgba(255,255,255,.03) 62%,rgba(157,180,255,.2) 85%,rgba(255,255,255,.32));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.on-light :is(.panel,.story,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip)::before{
  background:radial-gradient(220px circle at var(--mx,-400px) var(--my,-400px),rgba(8,144,255,.55),transparent 70%),
    linear-gradient(154deg,#fff,rgba(255,255,255,.7) 30%,rgba(8,144,255,.12) 60%,rgba(255,255,255,.9))}
/* sheen that follows the cursor */
:is(.sum,.panel,.story,.pay a,.feat>div,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip,.aa-col,.gl,.take)::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s ease;
  background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.09),transparent 42%)}
.on-light :is(.panel,.story,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip)::after{background:radial-gradient(520px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.7),transparent 42%)}
.take{position:relative}
.take::after{background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.14),transparent 45%)}
@media (hover:hover) and (pointer:fine){
  :is(.sum,.panel,.story,.pay a,.feat>div,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip,.aa-col,.gl,.take):hover::after{opacity:1}
  :is(.story,.quote,.fcol,.dept,.feat>div,.aa-col,.take){transition:transform .35s var(--out),opacity .5s var(--out),box-shadow .35s ease}
  :is(.story,.quote,.fcol,.dept,.feat>div,.aa-col,.take):hover{transform:translateY(-4px)}
  .dark :is(.story,.quote,.feat>div,.aa-col):hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 0 32px rgba(255,255,255,.05),0 30px 60px -24px rgba(8,144,255,.35)}
  .on-light :is(.story,.quote,.fcol,.dept):hover{box-shadow:inset 0 1px 0 #fff,0 0 10px rgba(0,0,0,.05),0 26px 50px -22px rgba(8,144,255,.35)}
  .feat>div img{transition:transform .35s var(--out)}
  .feat>div:hover img{transform:scale(1.1) rotate(-4deg)}
  .chip,.kicker,.inch a{transition:border-color .2s ease,background-color .2s ease,transform .2s var(--out)}
  .chip:hover{border-color:rgba(255,255,255,.7);transform:translateY(-1px)}
  .on-light .chip:hover{background:rgba(8,144,255,.18);border-color:var(--bluejay)}
  .inch a:hover{transform:translateX(4px)}
  .region{transition:background-color .2s ease}
  .region:not(.rh):hover{background:rgba(255,255,255,.05)}
  .story:hover .ph img,.quote:hover .ph img,.panel:hover .chart-ph img{transform:scale(1.04)}
  .panel:has(.chart-ph){transition:transform .35s var(--out),opacity .5s var(--out),box-shadow .35s ease}
  .panel:has(.chart-ph):hover{transform:translateY(-4px);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 0 32px rgba(255,255,255,.05),0 30px 60px -24px rgba(8,144,255,.35)}
  .stat .n{transition:transform .3s var(--out)}
  .stat:hover .n{transform:translateY(-3px)}
}
.ph img{transition:transform .6s var(--out)}
/* chart rollovers: focus one series, dim the rest */
.brow,.col,.sbar .seg,.hbar,.legend .row{transition:opacity .2s ease}
.brow .fill,.col .b{transition:transform .8s var(--out),width .5s var(--io),background-color .3s ease,filter .2s ease}
@media (hover:hover){
  .bars:hover .brow{opacity:.45}.bars .brow:hover{opacity:1}.brow:hover .fill{filter:brightness(1.15)}
  .cols:hover .col{opacity:.45}.cols .col:hover{opacity:1}.col:hover .b{filter:brightness(1.15)}
  .sbar:hover .seg{opacity:.5}.sbar .seg:hover{opacity:1}
  .hbars:hover .hbar{opacity:.45}.hbars .hbar:hover{opacity:1}
}
.legend .row{cursor:default;border-radius:12px}
[data-len]{transition:stroke-dashoffset 1.1s var(--out),opacity .2s ease,stroke-width .2s var(--out)}
.hl-on [data-len]{opacity:.22}.hl-on [data-len].hl{opacity:1}
.hl-on .legend .row{opacity:.4}.hl-on .legend .row.hl{opacity:1}
.region{grid-template-columns:64px 112px minmax(0,1fr)}
.region.rh{font-size:12px;font-weight:500;color:var(--on-dark-2);padding:0 0 8px;border-top:0}
.region.rh+.region{border-top:0}
/* p28 dial */
.dial-wrap{display:grid;gap:24px;align-items:center;grid-template-columns:minmax(0,1fr)}
@media(min-width:560px){.dial-wrap{grid-template-columns:clamp(260px,26vw,320px) minmax(0,1fr);gap:clamp(28px,4vw,48px)}}
.dial{width:clamp(260px,26vw,320px);height:auto;aspect-ratio:1;max-width:100%;justify-self:center}
.dial-stats{display:grid;gap:28px;align-content:center}.dial-stats .dial-n+.dial-n{padding-top:28px;border-top:1px solid var(--line)}
.dial circle{transition:opacity .25s ease}
.dial-n{display:grid;gap:4px}
.dial-n .n{font-size:clamp(48px,5.6vw,72px);font-weight:600;line-height:1}
.on-light .diagram{}

.dial-n span:last-child{font-size:16px;font-weight:500;color:var(--on-dark-2)}

/* ===== v3: single morphing mesh background ===== */
.mesh-fixed{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;display:block}
.chapter.dark{background:transparent}
.chapter.on-light{background:var(--white);border-radius:40px;margin-inline:clamp(0px,1.2vw,16px);box-shadow:0 0 0 1px rgba(255,255,255,.1),0 40px 90px -40px rgba(8,144,255,.45);overflow:clip}
.sheet-mesh{position:sticky;top:0;display:block;width:100%;height:100vh;margin-bottom:-100vh;pointer-events:none;z-index:0}
@supports (height:100lvh){.sheet-mesh{height:100lvh;margin-bottom:-100lvh}}
.no-mesh .sheet-mesh{display:none}
.chapter.on-light+.chapter.dark,.chapter.dark+.chapter.on-light{margin-top:24px}
.chapter::after{display:none}
.no-mesh .mesh-fixed{display:none}
body{background:var(--black)}
/* ===== v3: calmer glass light (sheen sits behind content) ===== */
:is(.sum,.panel,.story,.pay a,.feat>div,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip,.aa-col,.gl,.take){isolation:isolate}
:is(.sum,.panel,.story,.pay a,.feat>div,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip,.aa-col,.gl,.take)::after{z-index:-1;background:radial-gradient(440px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.05),transparent 45%)}
.on-light :is(.panel,.story,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip)::after{background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.28),transparent 45%)}
.take::after{background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.07),transparent 45%)}
:is(.sum,.panel,.story,.pay a,.feat>div,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip,.aa-col,.gl)::before{
  background:radial-gradient(200px circle at var(--mx,-400px) var(--my,-400px),rgba(255,255,255,.4),transparent 70%),
    linear-gradient(154deg,rgba(255,255,255,.5),rgba(255,255,255,.12) 22%,rgba(255,255,255,.03) 45%,rgba(255,255,255,.03) 62%,rgba(157,180,255,.18) 85%,rgba(255,255,255,.3))}
.on-light :is(.panel,.story,.quote,.fcol,.dept,.call,.diagram,.step,.big-strip)::before{
  background:radial-gradient(200px circle at var(--mx,-400px) var(--my,-400px),rgba(8,144,255,.22),transparent 70%),
    linear-gradient(154deg,#fff,rgba(255,255,255,.7) 30%,rgba(8,144,255,.1) 60%,rgba(255,255,255,.9))}
@media (hover:hover) and (pointer:fine){
  :is(.story,.quote,.fcol,.dept,.feat>div,.aa-col,.take):hover{transform:translateY(-3px)}
  .dark :is(.story,.quote,.feat>div,.aa-col):hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 0 32px rgba(255,255,255,.04),0 26px 50px -26px rgba(8,144,255,.25)}
  .on-light :is(.story,.quote,.fcol,.dept):hover{box-shadow:inset 0 1px 0 #fff,0 0 10px rgba(0,0,0,.05),0 22px 44px -26px rgba(8,144,255,.25)}
}
/* ===== v3: p19 / p20 diagrams ===== */
.dg-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.dg-head h3{margin:0}
.dg-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-inline:-4px;padding:4px}
.dgm{display:block;width:100%;height:auto;min-width:640px}
.dgm .colbg{fill:rgba(255,255,255,.4);stroke:rgba(255,255,255,.9);stroke-width:1}
.dgm .colh{fill:#000}
.dgm .nd rect{fill:rgba(213,196,255,.7);transition:fill .2s ease,opacity .2s ease}
.dgm .nd text{fill:#000;pointer-events:none}
.dgm .nd{cursor:default}
.dgm .ln{transition:stroke-dashoffset .5s var(--out),opacity .2s ease}
.dgm .seq{cursor:pointer;transition:opacity .2s ease;outline:none}
.dgm .seq .bd{transform-box:fill-box;transform-origin:center;transition:opacity .25s ease,transform .35s var(--out)}
.dgm .seq.wait .bd{opacity:0;transform:scale(.5)}
.dgm.iso .seq{opacity:.14}.dgm.iso .seq.hl{opacity:1}
.dgm .seq.hl .bd{transform:scale(1.15)}
.dgm20 .ln{transition:stroke-dashoffset .9s var(--out) var(--d,0s),opacity .2s ease}
.dgm20.iso .ln:not(.hl){opacity:.12}.dgm20.iso .nd:not(.hl) rect{opacity:.35}
.dgm20 .nd:hover rect{fill:#D5C4FF}
.dg-panel .big-strip{background:none!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;padding:16px 0 0;margin-top:20px;border-top:1px solid rgba(8,144,255,.15);border-radius:0;display:flex;align-items:center;gap:12px 16px}
.dg-panel .big-strip::before,.dg-panel .big-strip::after{display:none}
.dg-panel .big-strip .meter{flex:1 1 220px;height:44px;border-radius:12px;background:linear-gradient(90deg,rgba(213,196,255,.55),rgba(213,196,255,.9));overflow:visible;position:relative}
.dg-panel .big-strip .meter i{display:none}
.dg-panel .big-strip .n{background:var(--bluejay);color:#fff;font-size:30px;padding:6px 16px;border-radius:12px;margin-left:-28px;position:relative}
@media(max-width:600px){.dg-panel .big-strip .meter{display:none}.dg-panel .big-strip .n{margin-left:0}.dg-scroll{-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}}
.dg-panel .big-strip .bs-l{font-size:17px;font-weight:500;color:var(--midnight);flex:1 1 220px}
/* p20 steps + stage */
.stage-pill{display:inline-flex;align-self:flex-start;width:fit-content;font-size:15px;font-weight:500;color:#fff;padding:6px 16px;border-radius:999px;background:linear-gradient(135deg,var(--violet),var(--wink));margin-bottom:10px}
.step p{font-size:16px;color:var(--ink)}
.aw-t{font-size:20px;font-weight:600;color:var(--midnight);margin:0 0 12px}
.stage{position:relative;height:clamp(300px,46vh,440px)}
.stage .mock{position:absolute;inset:0;margin:auto;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;opacity:0;transform:translateY(14px) scale(.97);filter:blur(3px);transition:opacity .45s var(--out),transform .55s var(--out),filter .45s ease}
.stage .mock.on{opacity:1;transform:none;filter:none}
.stage-dots{display:flex;gap:6px;justify-content:center;margin-top:14px}
.stage-dots i{width:22px;height:4px;border-radius:4px;background:rgba(8,144,255,.2);transition:background-color .3s ease,width .3s var(--out)}
.stage-dots i.on{background:var(--violet);width:36px}
.step-mock{display:none;max-width:min(100%,360px);margin:16px auto 0}
@media(max-width:959px){.orch .diagram-wrap{display:none}.step-mock{display:block}.step{opacity:1}}

/* ===== v4: layout + spacing pass ===== */
.f-body:not(.half){grid-template-columns:minmax(0,1fr)!important}
.f-body:not(.half)>.take,.f-body:not(.half) .take{order:2}
@media(min-width:900px){
  .take{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);column-gap:48px;row-gap:12px;align-items:start;padding:32px 36px}
  .take>.lbl,.take>h3{grid-column:1}
  .take>p{grid-column:2;grid-row:1/span 3;font-size:17px;line-height:1.6;align-self:center}
  .take>p+p{grid-row:auto}
}
.panel{padding:32px}
.panel h3{margin-bottom:24px}
.stack{gap:var(--gap)}
.opener{padding-block:clamp(96px,10vw,140px) clamp(48px,5vw,72px)}
.chapter.on-light{margin-block:32px}
.chapter.on-light .finding:last-child{padding-bottom:clamp(96px,10vw,140px)}
.story{padding:28px;gap:18px}
.bento,.lc,.two,.aa,.depts,.flow3{gap:var(--gap)}
.big-strip{margin-top:0}
.dg-panel{padding-bottom:28px}
/* p20 process row */
.process{padding:32px}
.prow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:end}
.pcol{display:flex;flex-direction:column;gap:16px;min-width:0}
.pmock{display:flex;align-items:flex-end;justify-content:center;min-height:200px;transition:opacity .4s var(--out),transform .5s var(--out),filter .4s ease}
.pmock img{max-width:100%;max-height:340px;width:auto;height:auto;filter:drop-shadow(0 10px 20px rgba(6,44,105,.12))}
.pbtn{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:10px;align-items:flex-start;padding:18px 18px 16px;border-radius:18px;background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 1px rgba(8,144,255,.14);transition:background-color .25s ease,box-shadow .25s ease,transform .25s var(--out);position:relative;overflow:hidden}
.pbtn:focus-visible{outline:2px solid var(--bluejay);outline-offset:3px}
.pbtn .stage-pill{margin:0;font-size:14px;padding:5px 14px}
.ptxt{font-size:14px;line-height:1.5;color:var(--ink)}
.pbar{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(157,122,250,.15)}
.pbar i{display:block;height:100%;background:linear-gradient(90deg,var(--violet),var(--bluejay));transform-origin:0 50%;transform:scaleX(0)}
.pcol:not(.on) .pmock{opacity:.4;transform:scale(.96);filter:saturate(.6)}
.pcol:not(.on) .pbtn .stage-pill{background:rgba(157,122,250,.35)}
.pcol.on .pbtn{background:#fff;box-shadow:inset 0 0 0 1px rgba(157,122,250,.5),0 14px 30px -18px rgba(51,4,173,.35)}
@media (hover:hover){.pbtn:hover{transform:translateY(-2px)}}
.pdots{display:none;gap:6px;justify-content:center;margin-top:16px}
.pdots i{width:22px;height:4px;border-radius:4px;background:rgba(8,144,255,.2);transition:background-color .3s ease,width .3s var(--out)}
.pdots i.on{background:var(--violet);width:36px}
@media(max-width:899px){
  .prow{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin-inline:-32px;padding:0 32px 8px;scrollbar-width:none}
  .prow::-webkit-scrollbar{display:none}
  .pcol{flex:0 0 78%;scroll-snap-align:center}
  .pcol:not(.on) .pmock{opacity:1;transform:none;filter:none}
  .pdots{display:flex}
  .process{padding:24px}
  .prow{margin-inline:-24px;padding-inline:24px}
}
@media(min-width:900px){.two>.take,.stack>.take{display:flex;flex-direction:column}.two>.take>p{font-size:15px}}
.depts{align-content:start;align-items:start}
.teams>.stack{display:flex}
.teams .depts{display:flex;flex-direction:column;align-items:stretch;gap:12px;width:100%}
.teams .dept{flex:1 1 auto;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:20px;align-items:center;padding:24px 28px}
.teams .dept .dn{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--bluejay);color:var(--white);font-size:15px;font-weight:600;align-self:start;margin-top:2px}
.teams .dept h3{font-size:clamp(20px,1.7vw,24px);font-weight:500;line-height:1.2;color:var(--midnight);display:block}
.teams .dept p{font-size:15px;line-height:1.55;margin-top:6px}

/* ===== v5: report gate ===== */
.gated{position:relative}
.gated.locked{overflow:hidden}
.gated.locked .gated-inner{max-height:min(1000px,calc(100vh + 260px));overflow:hidden;filter:blur(9px) saturate(.9);pointer-events:none;user-select:none;transform:translateZ(0)}
.gated-inner{transition:filter .7s var(--out)}
.gated::after{content:"";position:absolute;inset:auto 0 0 0;height:55%;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(0,0,0,.85) 70%,#000);transition:opacity .5s ease;z-index:2}
.gated:not(.locked)::after{opacity:0}
.gate{position:absolute;inset:clamp(48px,9vh,110px) var(--gut) auto;z-index:5;display:flex;justify-content:center;transition:opacity .45s var(--out),transform .5s var(--out)}
.gated:not(.locked) .gate{opacity:0;transform:translateY(16px) scale(.98);pointer-events:none}
.gated.unlocked .gate{display:none}
.gate-card{width:min(920px,100%);display:grid;grid-template-columns:minmax(0,1fr);gap:28px;padding:clamp(24px,4vw,40px);border-radius:28px;position:relative;
  background:linear-gradient(180deg,rgba(2,36,64,.78),rgba(6,44,105,.62));-webkit-backdrop-filter:blur(24px) saturate(150%);backdrop-filter:blur(24px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 40px 90px -30px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.1)}
@media(min-width:800px){.gate-card{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px}}
.gate-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;background:linear-gradient(154deg,rgba(255,255,255,.5),rgba(255,255,255,.08) 30%,rgba(255,255,255,0) 60%,rgba(157,180,255,.3));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.gate-info{display:grid;gap:14px;align-content:start}
.gate-info h2{font-size:clamp(26px,3vw,36px);font-weight:600;line-height:1.1;letter-spacing:-.02em}
.gate-info p{color:var(--on-dark-2);font-size:16px}
.gate-toc{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:2px}
.gate-toc li{display:flex;gap:14px;align-items:baseline;padding:9px 0;border-top:1px solid var(--line);font-size:14px;font-weight:500}
.gate-toc b{font-weight:500;color:var(--blue-hi);width:12px}
@media(max-width:799px){.gate-toc{display:none}}
.gate-form{align-self:center}
.gstep{display:grid;gap:10px}
.gstep label{font-size:13px;font-weight:500;color:var(--on-dark-2)}
.gstep input{font:400 16px/1.2 var(--f);color:var(--white);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);border-radius:14px;padding:15px 16px;width:100%;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}
.gstep input::placeholder{color:rgba(255,255,255,.45)}
.gstep input:focus{outline:none;border-color:var(--bluejay);background:rgba(255,255,255,.12);box-shadow:0 0 0 4px rgba(8,144,255,.25)}
.gstep input[aria-invalid="true"]{border-color:var(--lavender);box-shadow:0 0 0 4px rgba(157,122,250,.25)}
.gstep .btn{width:100%;margin-top:4px}
.gstep[hidden]{display:none!important}
.gerr{min-height:0;font-size:13px;color:var(--lavender)}
.gerr:empty{display:none}
.gsent{font-size:15px;color:var(--on-dark-2);margin-bottom:4px}
.gsent b{color:var(--white);font-weight:500;word-break:break-all}
.glinks{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:2px}
.glink{all:unset;cursor:pointer;font-size:13px;font-weight:500;color:var(--blue-hi)}
.glink:hover{text-decoration:underline;text-underline-offset:3px}
.glink:focus-visible{outline:2px solid var(--bluejay);outline-offset:3px;border-radius:4px}
.gtest{font-size:12px;color:var(--on-dark-2);border:1px dashed rgba(255,255,255,.3);border-radius:10px;padding:8px 12px;margin-top:6px}
.gtest b{color:var(--white);font-weight:500}
.gstep.enter{animation:gIn .35s var(--out)}
@keyframes gIn{from{opacity:0;transform:translateY(8px)}}
.shake{animation:gShake .4s var(--io)}
@keyframes gShake{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
.gate-card.nudge{animation:gNudge .6s var(--out)}
@keyframes gNudge{40%{box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 40px 90px -30px rgba(0,0,0,.8),0 0 0 2px var(--bluejay)}}
@media (prefers-reduced-motion:reduce){.shake,.gate-card.nudge,.gstep.enter{animation:none}}

/* ===== v6: centred single-card gate ===== */
.gate-card{width:min(520px,100%);display:flex!important;flex-direction:column;align-items:center;text-align:center;gap:16px;padding:clamp(28px,4vw,44px)}
.gate-card h2{font-size:clamp(24px,2.6vw,32px);font-weight:600;line-height:1.15;letter-spacing:-.02em;max-width:18ch}
.gform{width:100%;display:grid;gap:18px;margin-top:8px;text-align:left}
.gfield{display:grid;gap:8px}
.gfield label{font-size:13px;font-weight:500;color:var(--on-dark-2)}
.grow{display:flex;gap:10px}
.grow input{flex:1 1 auto;min-width:0;font:400 16px/1.2 var(--f);color:var(--white);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);border-radius:14px;padding:14px 16px;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}
.grow input::placeholder{color:rgba(255,255,255,.45)}
.grow input:focus{outline:none;border-color:var(--bluejay);background:rgba(255,255,255,.12);box-shadow:0 0 0 4px rgba(8,144,255,.25)}
.grow input[aria-invalid="true"]{border-color:var(--lavender);box-shadow:0 0 0 4px rgba(157,122,250,.25)}
.grow .btn{flex:none;height:auto;min-width:132px}
.gbtn-2{background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
@media (hover:hover){.gbtn-2:hover{background:rgba(255,255,255,.18);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}}
.gform{align-self:stretch;min-width:0}.gfield,.grow{min-width:0}
@media(max-width:480px){.grow{flex-direction:column}.grow input{width:100%;flex:none}.grow .btn{height:48px;width:100%}}
.gmsg{font-size:13px;color:var(--on-dark-2)}
.gmsg:empty{display:none}
.gmsg.err{color:var(--lavender)}
.gmsg.ok{color:var(--blue-hi)}
.gate-card .gtest{margin-top:4px}

/* ===== v7: gate tweaks + unlock flourish ===== */
.gate-card{width:min(640px,100%)!important}
.gate-card h2{font-size:clamp(28px,3.4vw,40px)!important;max-width:20ch}
.gate-card>*{transition:opacity .35s var(--out),transform .4s var(--out),filter .35s ease}
.gdone{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:14px;opacity:0;pointer-events:none}
.gcheck{width:88px;height:88px;fill:none;stroke-linecap:round;stroke-linejoin:round}
.gcheck circle{stroke:url(#none);stroke:var(--bluejay);stroke-width:2.5;stroke-dasharray:252;stroke-dashoffset:252;transform:rotate(-90deg);transform-origin:center}
.gcheck path{stroke:var(--white);stroke-width:4;stroke-dasharray:60;stroke-dashoffset:60}
.gdone-t{font-size:clamp(20px,2.2vw,26px);font-weight:600;letter-spacing:-.01em;opacity:0;transform:translateY(8px)}
.gate-card.success>*:not(.gdone){opacity:0;transform:translateY(-6px);filter:blur(4px)}
.gate-card.success .gdone{opacity:1}
.gate-card.success .gcheck circle{transition:stroke-dashoffset .7s var(--out);stroke-dashoffset:0}
.gate-card.success .gcheck path{transition:stroke-dashoffset .4s var(--out) .45s;stroke-dashoffset:0}
.gate-card.success .gdone-t{transition:opacity .4s var(--out) .6s,transform .5s var(--out) .6s;opacity:1;transform:none}
.gate-card.success{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 40px 90px -30px rgba(0,0,0,.8),0 0 0 1px rgba(8,144,255,.6),0 0 80px -10px rgba(8,144,255,.55);transition:box-shadow .6s ease}
.gburst{position:absolute;left:50%;top:var(--by,200px);width:240px;height:240px;margin:-120px 0 0 -120px;border-radius:50%;pointer-events:none;opacity:0;z-index:4;
  background:radial-gradient(circle,rgba(8,144,255,.35),rgba(157,122,250,.18) 45%,transparent 70%);box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.gate.burst .gburst{animation:gBurst 1.4s cubic-bezier(.16,1,.3,1) forwards}
@keyframes gBurst{0%{opacity:.9;transform:scale(.3)}100%{opacity:0;transform:scale(9)}}
.gated-inner{transition:filter 1s var(--out)}
.chap-tabs a.lit,.rail a.lit{background:var(--bluejay);color:var(--white);transition:background-color .2s ease,color .2s ease}
.gate{inset:calc(var(--rcta) + 88px) var(--gut) auto!important;transform:none}
.gated:not(.locked) .gate{transform:translateY(16px) scale(.98)!important}
.gated.locked .gated-inner{max-height:calc(var(--rcta) + 88px + 150px + 50vh + 24px)}

/* ===== v8: code field appears after email ===== */
.greveal{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .5s var(--out),opacity .35s ease .1s;margin-top:-18px}
.greveal>.gfield{overflow:hidden;min-height:0;padding:4px 4px 0;margin:-4px -4px 0}
.greveal.open{grid-template-rows:1fr;opacity:1;margin-top:0}
.gcode .gtest{justify-self:center;margin-top:8px}
@media (prefers-reduced-motion:reduce){.greveal{transition:none}}

/* ===== v9: layout pass ===== */
/* chapter openers: numeral | title + sub, then rule, then section links */
.opener-grid{grid-template-columns:auto minmax(0,1fr)!important;column-gap:clamp(24px,4vw,56px);row-gap:10px;align-items:end}
.opener-grid>div{display:contents}
.opener-grid .numeral{grid-column:1;grid-row:1/3;align-self:end}
.opener h2{grid-column:2;grid-row:1;border-top:0!important;padding-top:0!important;align-self:end}
.opener .sub{grid-column:2;grid-row:2;align-self:start;margin-top:0}
.opener-grid::after{content:"";grid-column:1/-1;grid-row:3;height:1px;margin-top:clamp(24px,3vw,40px);background:var(--line)}
.on-light .opener-grid::after{background:rgba(2,36,64,.15)}
.opener .inch{grid-column:1/-1;grid-row:4;flex-direction:row!important;flex-wrap:wrap;align-items:center;margin-top:16px}
@media(max-width:640px){.opener-grid{grid-template-columns:minmax(0,1fr)!important}.opener-grid .numeral{grid-row:1}.opener h2{grid-column:1;grid-row:2;margin-top:8px}.opener .sub{grid-column:1;grid-row:3}.opener-grid::after{grid-row:4}.opener .inch{grid-row:5}}
/* chat bubbles: natural widths, centred threads in wide panels */
.msg{max-width:min(82%,420px)}
.panel>.thread,.panel .thread[data-thread]{max-width:640px;margin-inline:auto;width:100%}
/* p20 process: calm hovers — fade + slight zoom only, no lift, no cursor glow */
.pbtn,.pbtn:hover{transform:none!important}
.pmock{transition:opacity .35s ease,transform .45s var(--out)!important;filter:none!important}
.pcol:not(.on) .pmock{opacity:.45;transform:scale(.97);filter:none}
.pcol.on .pmock{opacity:1;transform:scale(1)}
.process::after{display:none!important}
.process{--mx:-999px;--my:-999px}
/* about the study: header, three columns, legal */
.study-grid{display:grid;gap:40px}
.study-grid .f-head{max-width:900px}
.study-cols{display:grid;gap:var(--gap);grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.study-cols{grid-template-columns:repeat(3,minmax(0,1fr))}}
.study-cols .panel{height:100%}
.study .legal{margin-top:40px}

/* ===== v10: 24% split bar ===== */
.dg-panel .big-strip{flex-wrap:wrap;gap:16px 28px}
.split{flex:1 1 460px;display:flex;gap:6px;height:56px;min-width:0}
.split>span{border-radius:14px;transform-origin:0 50%;transition:transform .9s var(--out)}
.split .s76{flex:76;background:linear-gradient(90deg,rgba(213,196,255,.55),rgba(213,196,255,.95))}
.split .s24{flex:24;background:var(--bluejay);display:grid;place-items:center;transition-delay:.15s}
.split .s24 .n{background:none!important;padding:0!important;margin:0!important;color:#fff;font-size:clamp(20px,2.2vw,28px)!important;font-weight:600;line-height:1}
.js .split.pre>span{transform:scaleX(0)}
.dg-panel .big-strip .bs-l{flex:0 1 260px}
@media(max-width:600px){.split{flex-basis:100%;height:48px}.dg-panel .big-strip .bs-l{flex-basis:100%}}

/* v22 content update */
.hero-media{position:relative}
.hchat{position:absolute;right:clamp(12px,3%,28px);top:clamp(12px,4%,32px);width:min(64%,330px);display:flex;flex-direction:column;align-items:stretch;gap:8px;z-index:2;pointer-events:none}
.hb{position:relative;padding:11px 15px;border-radius:16px;font-size:clamp(11px,.95vw,13px);line-height:1.4;color:var(--white);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border:1px solid rgba(255,255,255,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 14px 34px -16px rgba(2,36,64,.55);text-shadow:0 1px 1px rgba(2,36,64,.18)}
.hb::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,rgba(255,255,255,.22),rgba(255,255,255,0) 55%);pointer-events:none}
.hb .who{display:block;font-weight:600;font-size:.92em;margin-bottom:3px}
.hb.g{background:rgba(8,144,255,.7);border-bottom-left-radius:4px;margin-right:16%}
.hb.a{background:rgba(157,122,250,.72);border-bottom-right-radius:4px;margin-left:16%}
.hst{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.hst li{display:inline-flex;align-items:center;gap:7px;font-size:clamp(10px,.8vw,11.5px);color:rgba(255,255,255,.95);padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.hst i{width:10px;height:10px;border-radius:50%;flex:none}
.hst .sp{border:2px solid rgba(255,255,255,.4);border-top-color:#fff}
.hst .ok{background:#2BC48A}
@media(min-width:900px){.hero-media{display:flex;align-items:center}.hero-media .ph{width:calc(100% - clamp(96px,8.5vw,128px))}.hchat{right:0;top:10%;width:clamp(240px,21vw,300px)}}
.hst .dots{width:14px;height:4px;border-radius:0;background:radial-gradient(circle,#fff 1.5px,transparent 2px) 0 0/5px 4px repeat-x}
.js .hchat>*{opacity:0;transform:translateY(8px);transition:opacity .5s var(--out),transform .5s var(--out)}
.js .hchat.on>*{opacity:1;transform:none}
.hchat.on>*:nth-child(2){transition-delay:.5s}.hchat.on>*:nth-child(3){transition-delay:1s}
@media (prefers-reduced-motion:no-preference){.hst .sp{animation:hspin 1s linear infinite}}
@keyframes hspin{to{transform:rotate(360deg)}}
@media(max-width:899px){.hero .ph{aspect-ratio:1/1!important}}@media(max-width:600px){.hero .ph{aspect-ratio:4/5!important}.hchat{width:74%;gap:6px}.hst{gap:4px}.hb{font-size:11px;padding:8px 11px}.hst li{font-size:10px;padding:3px 8px}}
.sum-pay{gap:6px}
.sum-pay .sp-list{display:grid;gap:0;margin-top:6px}
.sum-pay .sp-list>div{display:grid;padding:12px 0;border-top:1px solid var(--line)}
.sum-pay .sp-list>div:first-child{border-top:0;padding-top:4px}
.sum-pay .n{font-size:clamp(34px,3vw,44px);font-weight:600;line-height:1;letter-spacing:-.02em}
.sum-pay .up{font-size:11px;color:var(--on-dark-2);margin-bottom:2px}
.sum-pay .d{font-size:13px;color:var(--on-dark-2);margin-top:4px}
.upto{display:block;font-size:.3em;font-weight:500;letter-spacing:0;line-height:1.2;opacity:.85}
.callout .upto{display:inline;font-size:.55em;margin-right:4px}
.about-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:28px;padding:20px 24px;border-radius:20px;border:1px solid var(--line);background:rgba(255,255,255,.05)}
.about-cta p{font-size:18px;font-weight:600;flex:1 1 220px}

/* v27 */
.chart-ph{display:none;min-height:0;align-self:stretch}
@media(min-width:1000px){
 .donut-wrap:has(.chart-ph),.clock-wrap:has(.chart-ph),.dial-wrap:has(.chart-ph){grid-template-columns:clamp(260px,24vw,320px) minmax(0,auto) minmax(0,1fr)}
 .chart-ph{display:grid;place-items:center;min-height:220px;height:100%}
}
.glossy-stat{margin:0;align-self:stretch;flex-direction:column;align-items:flex-start;justify-content:center;border-radius:24px;padding:28px;position:relative;overflow:hidden;
 background:linear-gradient(145deg,rgba(8,144,255,.55),rgba(51,4,173,.35) 70%,rgba(157,122,250,.3));border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 0 40px rgba(255,255,255,.06),0 30px 60px -30px rgba(8,144,255,.5)}
.glossy-stat::before{content:"";position:absolute;inset:0;background:linear-gradient(170deg,rgba(255,255,255,.22),rgba(255,255,255,0) 45%);pointer-events:none}
.glossy-stat .n{font-size:clamp(56px,7vw,96px)}
@media(min-width:900px){.about .f-body.half{align-items:stretch!important}.about .feat{grid-template-rows:repeat(4,1fr)}.about .feat>div{height:100%}}

/* editing shortcut — remove before launch */
.dev-unlock{position:fixed;left:16px;bottom:16px;z-index:200;font:600 12px/1 var(--f);letter-spacing:.04em;padding:10px 14px;border-radius:999px;border:1px dashed #FFD214;background:rgba(2,36,64,.85);color:#FFD214;cursor:pointer;backdrop-filter:blur(8px)}
.dev-unlock:hover{background:#FFD214;color:#022440}

/* rail: hover/focus slides out chapter titles */
.rail{align-items:flex-end;padding:12px 8px;border-radius:22px;transition:background-color .35s var(--out),border-color .35s var(--out),box-shadow .35s var(--out)}
.rail a{width:auto;height:28px;display:flex;flex-direction:row-reverse;align-items:center;gap:0;border-radius:999px;background:transparent!important;padding:0}
.rail .rn{width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:50%;transition:background-color .2s ease,color .2s ease}
.rail a[aria-current="true"] .rn,.rail a.lit .rn{background:var(--bluejay);color:var(--white)}
.rail a[aria-current="true"],.rail a.lit{color:var(--on-dark-2)}
.rail .rl{display:block;max-width:0;overflow:hidden;white-space:nowrap;opacity:0;font-size:13px;font-weight:500;color:var(--on-dark-2);transform:translateX(8px);transition:max-width .45s var(--out),opacity .25s ease,transform .45s var(--out),margin .45s var(--out),color .2s ease}
.rail .tick{align-self:flex-end;margin-right:13.5px}
.rail:hover,.rail:focus-within{background:rgba(2,20,40,.82);border-color:rgba(255,255,255,.22);box-shadow:0 24px 60px -20px rgba(0,0,0,.6)}
.rail:hover .rl,.rail:focus-within .rl{max-width:260px;opacity:1;transform:none;margin:0 12px 0 10px}
.rail:hover a:nth-of-type(2) .rl{transition-delay:0s,.04s,0s,0s,0s}.rail:hover a:nth-of-type(3) .rl{transition-delay:0s,.08s,0s,0s,0s}.rail:hover a:nth-of-type(4) .rl{transition-delay:0s,.12s,0s,0s,0s}.rail:hover a:nth-of-type(5) .rl{transition-delay:0s,.16s,0s,0s,0s}
.rail a:hover .rl,.rail a:focus-visible .rl,.rail a[aria-current="true"] .rl{color:var(--white)}
.rail a:hover .rn{background:rgba(255,255,255,.12);color:var(--white)}
.rail a[aria-current="true"]:hover .rn{background:var(--bluejay)}
@media (prefers-reduced-motion:reduce){.rail .rl{transition:none}}

/* v38 content refresh */
.stats.stat-ics{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.stat-ics .stat{display:flex;align-items:center;gap:clamp(14px,1.6vw,22px);padding:clamp(18px,2vw,26px);border-radius:20px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.stat-ics .si{width:clamp(40px,4vw,58px);height:clamp(40px,4vw,58px);object-fit:contain;flex:none;opacity:.95}
.stat-ics .l{margin-top:4px}
@media(max-width:520px){.stats.stat-ics{grid-template-columns:minmax(0,1fr)}}
.pay a{grid-template-columns:minmax(0,1fr) auto clamp(64px,7vw,104px)!important;column-gap:clamp(20px,3vw,40px)!important}
.pay .k{grid-column:1;grid-row:1/span 2}
.pay .n{grid-column:2;grid-row:1}
.pay .d{grid-column:2!important;grid-row:2;text-align:right}
.pay img.pi{grid-column:3;grid-row:1/span 2;align-self:center;justify-self:center;width:clamp(48px,5vw,72px);height:clamp(48px,5vw,72px);object-fit:contain}
.pay img.pi.pi-gx{width:clamp(64px,7vw,104px);height:clamp(64px,7vw,104px)}
@media(max-width:719px){.pay a{grid-template-columns:minmax(0,1fr) auto!important}.pay .k{grid-row:1}.pay .n{grid-column:1/-1;grid-row:2;text-align:left}.pay .d{grid-column:1/-1!important;grid-row:3;text-align:left}.pay img.pi{grid-column:2;grid-row:1}}
.omni-h{display:flex;align-items:center;gap:18px;margin:36px 0 16px;font-size:clamp(22px,2.2vw,30px);font-weight:600}
.omni-h::before,.omni-h::after{content:"";flex:1;border-top:2px dotted rgba(255,255,255,.35)}
.omni{padding:22px 18px 16px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.omni-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:12px 6px;align-items:start}
.omni-row li{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;font-size:11px;line-height:1.25;color:var(--on-dark-2)}
.omni-row img{width:clamp(30px,3vw,42px);height:clamp(30px,3vw,42px);object-fit:contain;transition:transform .3s var(--out)}
.omni-row li:hover img{transform:translateY(-3px)}
.omni .note{text-align:center;margin-top:14px}
@media(max-width:719px){.omni-row{grid-template-columns:repeat(5,minmax(0,1fr));row-gap:18px}}
@media(max-width:420px){.omni-row{grid-template-columns:repeat(3,minmax(0,1fr))}}
.hl.hl-y{color:#FFD214;font-weight:600}
/* flow: trigger > answers > actions */
.flow3 .fcol{background:transparent;border:0;padding:0;gap:14px;box-shadow:none!important}
.flow3 .fcol::before,.flow3 .fcol::after{display:none}
.flow3 .fcol h3{display:flex;align-items:center;justify-content:center;gap:10px;font-size:clamp(20px,1.9vw,26px);min-height:40px}
.flow3 .fh{width:46px;height:30px;flex:none}
.flow3 .fh rect,.flow3 .fh circle{fill:rgba(8,144,255,.16)}
.flow3 .fh rect{stroke:rgba(8,144,255,.45);stroke-width:1}
.flow3 .fh circle{fill:var(--ocean);stroke:none}
.flow3 .fh rect.b2{fill:rgba(157,122,250,.22);stroke:rgba(157,122,250,.6)}
.flow3 .fh .ck{fill:none;stroke:var(--ocean);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.flow3 .fbox{flex:1;display:flex;flex-direction:column;gap:16px;padding:22px;border-radius:24px;border:1px solid rgba(255,255,255,.75);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 20px 40px -28px rgba(2,36,64,.35)}
.f-trig .fbox{background:linear-gradient(160deg,rgba(161,213,255,.55),rgba(239,249,254,.6))}
.f-ans .fbox{background:linear-gradient(160deg,rgba(213,196,255,.6),rgba(237,244,251,.55))}
.f-act .fbox{background:linear-gradient(160deg,rgba(213,196,255,.38),rgba(255,255,255,.55));justify-content:center}
.flow3 .fcol .q{font-style:normal;font-size:15px;line-height:1.5;color:var(--midnight);padding:16px 20px;border-radius:24px 24px 24px 4px;background:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.9);box-shadow:0 8px 20px -14px rgba(2,36,64,.4);margin-right:10%}
.flow3 .fcol .r{font-size:15px;line-height:1.5;color:var(--midnight);padding:16px 20px;border-radius:24px 24px 4px 24px;background:rgba(157,122,250,.28);border:1px solid rgba(255,255,255,.7);margin-left:6%}
.flow3 .fcol .x{background:none;border:0;padding:0;display:flex;flex-direction:column;align-items:stretch;gap:8px}
.flow3 .xp{display:block;text-align:center;font-size:16px;font-weight:600;color:#000;padding:16px 20px;border-radius:999px;background:var(--lavender);box-shadow:0 10px 24px -16px rgba(51,4,173,.5)}
.flow3 .ok{align-self:flex-end;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:#000;padding:4px 10px 4px 6px;border-radius:999px;background:#4ADE80;transition:opacity .4s var(--out),transform .4s var(--out)}
.flow3 .ok svg{width:14px;height:14px}
.js .flow3.pre .ok{opacity:0;transform:scale(.9)}

/* at a glance (v41) */
.glance .gl-grid{display:grid;gap:var(--gap);margin-top:clamp(40px,4.5vw,64px);grid-template-columns:minmax(0,1fr)}
@media(min-width:680px){.glance .gl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1180px){.glance .gl-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.gl{position:relative;display:flex;flex-direction:column;border-radius:28px;isolation:isolate;
 background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.025));backdrop-filter:blur(25px) saturate(1.2);-webkit-backdrop-filter:blur(25px) saturate(1.2);
 transition:transform .5s var(--out),box-shadow .5s var(--out),opacity .5s var(--out)}
.gl-vis{position:relative;height:clamp(230px,18vw,250px);display:grid;place-items:center;align-content:center;gap:14px;padding:24px 22px 18px;border-bottom:1px solid rgba(255,255,255,.08);border-radius:28px 28px 0 0;background:radial-gradient(120% 90% at 50% 0%,rgba(8,144,255,.16),transparent 70%)}
.gl-2 .gl-vis{background:radial-gradient(120% 90% at 50% 0%,rgba(102,186,255,.16),transparent 70%)}
.gl-3 .gl-vis{background:radial-gradient(120% 90% at 50% 0%,rgba(161,213,255,.14),transparent 70%)}
.gl-4 .gl-vis{background:radial-gradient(120% 90% at 50% 0%,rgba(157,122,250,.2),transparent 70%)}
.gl-t{padding:22px 24px 26px;display:grid;gap:10px;align-content:start;flex:1}
.gl-n{font-size:12px;font-weight:600;letter-spacing:.08em;color:var(--blue-hi);opacity:.85}
.gl-t h3{font-size:clamp(19px,1.5vw,22px);font-weight:600;line-height:1.2}
.gl-t p{font-size:14.5px;line-height:1.55;color:var(--on-dark-2)}
.gl-cap{font-size:12.5px;line-height:1.4;color:var(--on-dark-2);text-align:center;max-width:24ch}
@media (hover:hover){.gl:hover{transform:translateY(-6px);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 0 40px rgba(255,255,255,.05),0 40px 70px -30px rgba(8,144,255,.45)}}
.gd-wrap{position:relative;width:clamp(140px,11vw,160px);aspect-ratio:1}
.gd{width:100%;height:100%;overflow:visible}
.gd circle{fill:none;stroke-width:22}
.gd .trk{stroke:rgba(255,255,255,.07)}
.gd .seg{stroke-dasharray:var(--len) var(--C);stroke-dashoffset:0;transition:stroke-dashoffset 1.2s var(--out),opacity .3s ease,stroke-width .3s var(--out),filter .3s ease;cursor:pointer}
.gd .sb{transition-delay:.25s,0s,0s,0s}
.pre .gd .seg{stroke-dashoffset:var(--len)}
.gd-c{position:absolute;inset:0;display:grid;place-items:center;align-content:center;text-align:center;pointer-events:none}
.gd-c b{grid-area:1/1;font-size:clamp(30px,2.6vw,36px);font-weight:600;line-height:1;transition:opacity .3s ease,transform .3s var(--out)}
.gd-c span{grid-area:2/1;font-size:12px;color:var(--on-dark-2);margin-top:4px;transition:opacity .3s ease}
.gd-c b[data-v="a"]{color:var(--violet)}.gd-c b[data-v="b"]{color:var(--blue-hi)}
.gd-wrap:not([data-on="b"]) [data-v="b"],.gd-wrap[data-on="b"] [data-v="a"]{opacity:0;transform:translateY(4px)}
.gd-wrap[data-on="b"] .sa,.gd-wrap:not([data-on="b"]) .sb{opacity:.35}
.gd-wrap[data-on="b"] .sb,.gd-wrap:not([data-on="b"]) .sa{stroke-width:26;filter:drop-shadow(0 0 8px currentColor)}
.gl-keys{display:flex;gap:8px}
.gk{display:inline-flex;align-items:center;gap:7px;font:500 12px/1 var(--f);color:var(--on-dark-2);padding:7px 11px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);cursor:pointer;transition:background-color .2s ease,color .2s ease,border-color .2s ease}
.gk i{width:8px;height:8px;border-radius:50%}
.gk.on{color:var(--white);background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3)}
.gl-big{font-size:clamp(52px,4.6vw,64px);font-weight:600;line-height:1;letter-spacing:-.02em}
.gl-big small{font-size:.4em;margin:0 .18em;letter-spacing:0}
.gl-dots{display:grid;grid-template-columns:repeat(5,22px);gap:8px 10px}
.gl-dots i{display:block;width:22px;height:22px;transition:transform .45s var(--out) calc(var(--i)*70ms + .2s)}
.gl-dots svg{width:100%;height:100%;fill:rgba(255,255,255,.12);transition:fill .45s var(--out) calc(var(--i)*70ms + .2s)}
.gl-dots i.on svg{fill:var(--blue-hi)}
.pre .gl-dots i{transform:scale(.4)}
.pre .gl-dots i.on svg{fill:rgba(255,255,255,.12)}
@media (hover:hover){.gl-2:hover .gl-dots i{transition-delay:calc(var(--i)*40ms)}.gl-2:hover .gl-dots i.on{transform:translateY(-4px)}.gl-2:hover .gl-dots i.on svg{fill:#A1D5FF;transition-delay:calc(var(--i)*40ms)}}
.gl-pair{grid-template-columns:1fr 1fr;align-items:start;gap:10px;width:100%}
.gp{display:grid;justify-items:center;gap:10px}
.gr-wrap{position:relative;width:104px;aspect-ratio:1;display:grid;place-items:center}
.gr{position:absolute;inset:0;width:100%;height:100%}
.gr circle{fill:none;stroke-width:9}
.gr .trk{stroke:rgba(255,255,255,.08)}
.gr .seg{stroke-linecap:round;stroke-dasharray:var(--len) var(--C);transition:stroke-dashoffset 1.2s var(--out) .2s,filter .3s ease}
.pre .gr .seg{stroke-dashoffset:var(--len)}
@media (hover:hover){.gl-3:hover .gr .seg{filter:drop-shadow(0 0 6px #66BAFF)}}
.gr-wrap b,.gl-stars-wrap b{font-size:30px;font-weight:600;line-height:1}
.gl-stars-wrap{height:104px;display:grid;place-items:center;align-content:center;gap:10px}
.gl-stars{display:flex;gap:3px}
.gl-stars svg{width:17px;height:17px;fill:#FFD214;transition:transform .4s var(--out),opacity .4s ease}
.gl-stars svg:nth-child(2){transition-delay:.08s}.gl-stars svg:nth-child(3){transition-delay:.16s}.gl-stars svg:nth-child(4){transition-delay:.24s}.gl-stars svg:nth-child(5){transition-delay:.32s}
.pre .gl-stars svg{transform:scale(.3) rotate(-40deg);opacity:0}
@media (hover:hover){.gl-3:hover .gl-stars svg{transform:translateY(-3px) scale(1.12)}}
.gl-4 .gl-vis{grid-template-columns:auto minmax(0,1fr);place-items:stretch;align-items:stretch;gap:14px}
.gl-rev{display:grid;gap:6px;align-content:center}
.gl-rev .gl-cap{text-align:left;max-width:12ch}
.gl-num{font-size:clamp(40px,3.4vw,52px);font-weight:600;line-height:1}
.gl-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;align-items:end;min-height:160px}
.gc{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;gap:4px;cursor:default}
.gc i{display:block;width:100%;max-width:24px;height:calc(var(--v)/278*120px);min-height:6px;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,rgba(157,122,250,.8),rgba(157,122,250,.25));transform-origin:bottom;transition:transform .9s var(--out),background .3s ease,box-shadow .3s ease}
.gc.em i{background:linear-gradient(180deg,#C9B6FF,var(--violet))}
.gc:nth-child(2) i{transition-delay:.08s}.gc:nth-child(3) i{transition-delay:.16s}.gc:nth-child(4) i{transition-delay:.24s}
.pre .gc i{transform:scaleY(0)}
.gc b{font-size:10.5px;font-weight:600;color:var(--on-dark-2);transition:color .2s ease}
.gc.em b{color:var(--white)}
.gc span{font-size:9.5px;color:var(--on-dark-2);white-space:nowrap}
.gc:hover i{background:linear-gradient(180deg,#D5C4FF,var(--violet));box-shadow:0 0 18px rgba(157,122,250,.6)}
.gc:hover b{color:var(--white)}
@media (prefers-reduced-motion:reduce){.gl,.gd .seg,.gr .seg,.gl-dots i,.gl-dots svg,.gl-stars svg,.gc i{transition:none!important}}
.summary.summary-locked{padding-block:clamp(48px,6vw,88px) clamp(24px,3vw,48px)}

.gl-4 .gl-vis{grid-template-columns:minmax(0,1fr)!important;place-items:stretch!important;align-content:center!important;gap:16px!important}
.gl-4 .gl-rev{display:flex;align-items:center;gap:12px}
.gl-4 .gl-rev .gl-cap{max-width:16ch}
.gl-hb{display:grid;gap:9px}
.rb{display:grid;grid-template-columns:72px minmax(0,1fr) 40px;align-items:center;gap:8px;font-size:11px;color:var(--on-dark-2);cursor:default}
.rb i{height:9px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;display:block}
.rb u{display:block;height:100%;width:calc(var(--v)/278*100%);border-radius:inherit;background:linear-gradient(90deg,rgba(157,122,250,.35),rgba(157,122,250,.85));transform-origin:left;transition:transform .9s var(--out),box-shadow .3s ease,background .3s ease}
.rb.em u{background:linear-gradient(90deg,#7F5CF0,#C9B6FF)}
.rb:nth-child(2) u{transition-delay:.08s}.rb:nth-child(3) u{transition-delay:.16s}.rb:nth-child(4) u{transition-delay:.24s}
.pre .rb u{transform:scaleX(0)}
.rb b{text-align:right;font-weight:600}
.rb.em span,.rb.em b{color:var(--white)}
.rb:hover u{background:linear-gradient(90deg,#9D7AFA,#E2D7FF);box-shadow:0 0 14px rgba(157,122,250,.6)}
.rb:hover span,.rb:hover b{color:var(--white)}
.gk{white-space:nowrap;padding:7px 10px}

/* v42 glance refinements */
.gl{border-radius:24px!important;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02))!important;border:1px solid var(--line);backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transition:transform .45s var(--out),opacity .5s var(--out),border-color .2s ease!important}
@media (hover:hover){.gl:hover{transform:translateY(-4px)!important;border-color:rgba(255,255,255,.3);box-shadow:none!important}}
.gl-vis,.gl-2 .gl-vis,.gl-3 .gl-vis,.gl-4 .gl-vis{background:none!important;border-radius:24px 24px 0 0;height:clamp(200px,15vw,220px)}
.gl-t{padding:24px 28px 28px}
.gd-wrap[data-on="b"] .sb,.gd-wrap:not([data-on="b"]) .sa{filter:none!important;stroke-width:24}

.gl-3:hover .gr .seg{filter:none!important}
.gl-dots{grid-template-columns:repeat(5,18px);gap:10px 12px}
.gl-dots i{width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.12);transition:transform .45s var(--out) calc(var(--i)*70ms + .2s),background-color .45s var(--out) calc(var(--i)*70ms + .2s)}
.gl-dots i.on{background:var(--blue-hi)}
.pre .gl-dots i.on{background:rgba(255,255,255,.12)}
@media (hover:hover){.gl-2:hover .gl-dots i.on{background:#A1D5FF}}
.gl-pair .gp{align-content:center}
.gl-4 .gl-vis{gap:18px!important}
.gl-up{display:flex;align-items:center;justify-content:center;gap:10px}
.gl-up .ua{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(157,122,250,.18);color:var(--violet)}
.gl-up .ua svg,.gpr b svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.gl-props{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.gpr{display:grid;justify-items:center;gap:4px;padding:12px 6px;border-radius:14px;background:rgba(157,122,250,.12);border:1px solid rgba(157,122,250,.25);transition:transform .45s var(--out),opacity .45s var(--out),background-color .2s ease}
.gpr b{display:inline-flex;align-items:center;gap:2px;font-size:clamp(15px,1.3vw,18px);font-weight:600;color:#C9B6FF}
.gpr b svg{width:13px;height:13px}
.gpr span{font-size:11px;color:var(--on-dark-2);white-space:nowrap}
.gpr:nth-child(2){transition-delay:.1s}.gpr:nth-child(3){transition-delay:.2s}
.pre .gpr{opacity:0;transform:translateY(10px)}
.gl-up .ua{transition:transform .6s var(--out) .2s,opacity .6s var(--out) .2s}
.pre .gl-up .ua{transform:translateY(10px);opacity:0}
@media (hover:hover){.gpr:hover{background:rgba(157,122,250,.22);transform:translateY(-3px)}}

.gl-props{grid-template-columns:minmax(0,1fr)!important;gap:6px!important;width:100%}
.gpr{grid-template-columns:1fr auto;justify-items:stretch;align-items:center;padding:8px 14px!important;border-radius:999px!important}
.gpr span{grid-row:1;grid-column:1;font-size:12px;text-align:left}
.gpr b{grid-row:1;grid-column:2;font-size:14px}
.gl-4 .gl-vis{gap:12px!important}
.gl-vis,.gl-2 .gl-vis,.gl-3 .gl-vis,.gl-4 .gl-vis{height:clamp(220px,17vw,240px)}.gl-4 .gl-vis{padding:22px 22px 20px}

.gd-c span{display:block}
.gl-cap{font-size:13px;max-width:22ch}
.gl-duo{grid-template-columns:minmax(0,1fr)!important;place-items:stretch!important;align-content:center;gap:0!important;padding:18px 26px!important}
.gdu{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:16px;padding:14px 0}
.gdu+.gdu{border-top:1px solid rgba(255,255,255,.1)}
.gdu b{font-size:clamp(44px,3.8vw,54px);font-weight:600;line-height:1;letter-spacing:-.02em;min-width:2.3ch}
.gdu span{font-size:14px;line-height:1.35;color:var(--on-dark-2);display:grid;gap:6px}
.gdu .gl-stars{display:flex;gap:3px}
.gdu .gl-stars svg{width:14px;height:14px}
.gl-4 .gl-vis{gap:6px!important;align-content:center}
.gl-4 .gl-num{font-size:clamp(64px,5.6vw,84px);letter-spacing:-.03em}
.gl-up .ua{width:40px;height:40px}
.gl-up .ua svg{width:20px;height:20px}
.gdu b{width:1.95em;min-width:0!important}
.gdu{column-gap:12px}
.gdu span{white-space:normal}
.gl-4 .gl-vis{display:flex!important;flex-direction:column;align-items:center;justify-content:center}
.gl-4 .gl-cap{text-align:center!important;max-width:22ch!important;align-self:center}
.gl-4 .gl-up{justify-content:center}
.gl-one{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:10px!important}
.gl-one .gl-num{font-size:clamp(64px,5.6vw,84px);letter-spacing:-.03em}
.gl-one .gl-stars svg{width:20px;height:20px}
/* ===== v46: Emilia comment batch ===== */
/* chapter numerals: solid white on dark chapters */
.dark .numeral{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--white)}
/* chapter links: a contents row, not pills */
.opener .inch{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:0 clamp(20px,2.4vw,36px);margin-top:4px!important}
.opener-grid::after{display:none}
.inch li{display:flex;border-top:1px solid var(--line)}
.on-light .inch li{border-top-color:rgba(2,36,64,.16)}
.inch a,.on-light .inch a{flex:1;display:flex!important;align-items:flex-start;justify-content:space-between;gap:16px;padding:16px 0 6px!important;border:0!important;border-radius:0!important;background:none!important;font-size:15px!important;font-weight:500;line-height:1.35;color:inherit;transform:none!important;position:relative}
.inch a::before{content:"";position:absolute;left:0;top:-1px;height:2px;width:0;background:var(--blue-hi);transition:width .35s var(--out)}
.on-light .inch a::before{background:var(--bluejay)}
.inch a::after{content:"";flex:none;width:18px;height:18px;margin-top:1px;background:currentColor;opacity:.55;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .3s var(--out),opacity .2s ease}
@media (hover:hover){.inch a:hover::before{width:100%}.inch a:hover::after{transform:translateY(3px);opacity:1}.dark .inch a:hover{color:var(--white)}}
/* at a glance: 2x2, horizontal cards */
@media(min-width:900px){
 .glance .gl-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .gl{flex-direction:row!important;align-items:stretch}
 .gl-vis,.gl-2 .gl-vis,.gl-3 .gl-vis,.gl-4 .gl-vis{flex:0 0 42%;height:auto!important;min-height:230px;border-bottom:0!important;border-right:1px solid rgba(255,255,255,.08);border-radius:24px 0 0 24px!important}
 .gl-t{align-content:center;padding:28px 32px!important}
}
/* Real Guest Story badge icon */
.badge::before{content:"";flex:none;width:12px;height:12px;background:currentColor;-webkit-mask:url(https://resources.canarytechnologies.com/rs/753-LTW-752/images/ai-report-26-badge.svg) center/contain no-repeat;mask:url(https://resources.canarytechnologies.com/rs/753-LTW-752/images/ai-report-26-badge.svg) center/contain no-repeat}
/* regional module icons */
.region{grid-template-columns:64px 112px minmax(0,1fr) 56px!important;align-items:center!important}
.region .ri{display:flex;justify-content:center}
.region .ri img{height:72px;width:auto;transition:transform .4s var(--out)}
@media (hover:hover){.region:hover .ri img{transform:translateY(-3px)}}
@media(max-width:480px){.region{grid-template-columns:52px 64px minmax(0,1fr) 40px!important;gap:10px}.region .ri img{height:56px}}
/* translation subtext: gradient + sparkle */
.msg .tr{position:relative;display:block;width:fit-content;max-width:100%;padding-left:16px;opacity:1;font-style:italic;-webkit-background-clip:text;background-clip:text;color:transparent}
.msg.g .tr{background-image:linear-gradient(90deg,#9D7AFA,#FFB428)}
.msg.a .tr{background-image:linear-gradient(90deg,#CCBDF6,#FFD214)}
.msg .tr::before{content:"";position:absolute;left:0;top:1px;width:10px;height:15px;background:url(https://resources.canarytechnologies.com/rs/753-LTW-752/images/ai-report-26-spark.svg) center/contain no-repeat}
/* in-stay bar: labels at each segment's edge, dotted connectors */
.sbar-l{margin-top:4px!important}
#stay .sbar-l span{position:relative;padding-top:28px}
#stay .sbar-l span::before{content:"";position:absolute;top:2px;left:20px;height:20px;border-left:2px dotted rgba(255,255,255,.5)}
.on-light .sbar-l span::before{border-left-color:rgba(2,36,64,.35)}
#stay .sbar-l span:last-child::before{left:auto;right:20px}
/* ch3: stories inside answers / actions columns */
.aa-col .aa-story{margin-top:auto;padding:18px;border-radius:18px}
.aa-col .aa-story .msg{font-size:14px}
.aa-col>div:has(+.aa-story){margin-bottom:8px}
/* ch3: stories connected to 35% / 65% */
.ax-grid{display:grid;gap:20px;margin-top:24px;grid-template-columns:minmax(0,1fr)}
.ax-mid{display:grid;justify-items:center;gap:8px}
.ax .donut{width:100%;max-width:260px}
.ax-leg{display:flex!important;justify-content:space-between;width:100%;gap:16px}
.ax-leg .row{display:flex!important;flex-direction:column;gap:2px;position:relative}
.ax-leg .row .n{font-size:clamp(30px,2.6vw,40px)}
.ax-leg .row p{font-size:14px}
.ax-leg .rb{align-items:flex-end;text-align:right}
.dark .ax-s.ans{background:linear-gradient(180deg,rgba(102,186,255,.2),rgba(102,186,255,.05))!important}
.dark .ax-s.act{background:linear-gradient(180deg,rgba(157,122,250,.26),rgba(157,122,250,.07))!important}
.ax-s.ans::before{border-color:rgba(102,186,255,.55)!important}
.ax-s.act::before{border-color:rgba(157,122,250,.6)!important}
.ax-s{padding:20px;display:grid;gap:12px;align-content:start}
.ax-s .msg{font-size:14px}
@media(min-width:1000px){
 .ax-grid{grid-template-columns:minmax(0,1fr) minmax(220px,270px) minmax(0,1fr);column-gap:40px;align-items:end}
 .ax-s{align-self:end}
 .ax-leg .row::after{content:"";position:absolute;top:58%;width:30px;border-top:2px dotted}
 .ax-leg .ra::after{right:calc(100% + 10px);border-color:#66BAFF}
 .ax-leg .rb::after{left:calc(100% + 10px);border-color:#9D7AFA}
}
/* ch3: pies */
.pie-wrap{display:grid;gap:28px;align-items:center;grid-template-columns:minmax(0,1fr)}
.pie-wrap .pie{order:-1;width:min(100%,340px);height:auto;justify-self:center}
@media(min-width:760px){.pie-wrap{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,3vw,44px)}.pie-wrap .pie{order:0;width:100%;max-width:400px}}
.pie-l h3{margin-bottom:18px}
.lg-c{gap:6px!important}
.lg-c .row{grid-template-columns:12px minmax(0,1fr) auto!important;align-items:center!important;gap:12px!important;padding:6px 8px;margin-inline:-8px}
.lg-c .sw{grid-row:auto!important;border-radius:50%!important;box-shadow:0 0 0 1px rgba(255,255,255,.28)}
.lg-c .row p{grid-column:auto!important;font-size:13.5px;line-height:1.35;color:var(--on-dark-2)}
.lg-c .row .v{font-size:14px;font-weight:600}
.pie text.pl{font-size:15px;font-weight:600;fill:var(--white)}
.pie [data-len]{transition:stroke-dashoffset 1.1s var(--out),opacity .2s ease}
.hl-on .pie .seg:not(.hl){opacity:.3}
.callout.cb{background:var(--bluejay);margin-top:20px}
.ph-todo{min-height:220px;border:1px dashed rgba(255,255,255,.3);background:rgba(255,255,255,.04)}
/* ch4: trigger / answers / actions boxed together */
.flow3{padding:clamp(18px,2.4vw,32px);border-radius:28px;background:rgba(255,255,255,.38);border:1px solid rgba(255,255,255,.85);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:inset 0 1px 0 #fff,0 24px 50px -30px rgba(8,144,255,.35)}
@media(min-width:860px){
 .flow3 .fcol{position:relative}
 .flow3 .f-trig::after,.flow3 .f-ans::after{content:"";position:absolute;z-index:2;inset:auto;top:50%;right:calc(var(--gap)/-2 - 13px);width:26px;height:26px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230890FF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center/14px no-repeat;box-shadow:0 4px 12px -4px rgba(8,144,255,.4);display:block!important;opacity:1!important;bottom:auto;left:auto;transform:translateY(-50%);pointer-events:none}
}
/* ch4: work behind one request + diagram in one box */
.orch{display:grid;gap:24px;grid-template-columns:minmax(0,1fr)}
.orch-t h3{margin-bottom:10px}
.orch-t p{font-size:15px;line-height:1.6}
@media(min-width:1180px){.orch{grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:40px;align-items:center}.orch-t{padding-right:36px;border-right:1px solid rgba(8,144,255,.18);align-self:stretch;display:flex;flex-direction:column;justify-content:center}}
.orch-d{min-width:0}
/* ch4: smoother sequence */
.dgm19 .ln{transition:stroke-dashoffset 1.1s cubic-bezier(.65,0,.35,1),opacity .3s ease}
.dgm19 .seq .bd{transition:opacity .5s ease,transform .6s var(--out)}
/* ch4: process columns stay full strength; hover lifts */
.pcol:not(.on) .pmock,.pcol .pmock{opacity:1!important;transform:none;filter:none!important}
.pmock img{filter:drop-shadow(0 14px 26px rgba(6,44,105,.2))}
@media (hover:hover){.pcol .pmock{transition:transform .45s var(--out)!important}.pcol:hover .pmock{transform:translateY(-8px)!important}.pcol:hover .pmock img{filter:drop-shadow(0 22px 34px rgba(6,44,105,.28))}}
/* ch5 revenue: takeaway on the right, stats under the clock */
@media(min-width:960px){.rev-side .f-body{grid-template-columns:minmax(0,7fr) minmax(0,5fr)!important;align-items:stretch}.rev-side .take{order:0!important;display:flex!important;flex-direction:column;justify-content:center}}
.cw-stack{grid-template-columns:minmax(0,1fr)!important;justify-items:center}
.cw-stack .clock{width:min(100%,320px)}
.cw-stack .legend{grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:20px;border-top:1px solid var(--line);padding-top:20px}
/* ch5 upsells: building chart */
.bchart{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;margin-top:72px;padding-bottom:52px}
.bc-axis{position:relative;font-size:11px;color:var(--on-dark-2)}
.bc-axis span{position:absolute;right:0;transform:translateY(-50%)}
.bc-plot{position:relative;aspect-ratio:643/268}
.bc-plot>i{position:absolute;left:0;right:0;height:1px;background:rgba(255,255,255,.12)}
.bc-svg{position:absolute;left:4.51%;width:89.27%;top:0;height:100%}
.bc-svg svg{display:block;width:100%;height:100%;overflow:visible}
.bc-svg svg [fill="#0C538E"]{fill:#7CC4FF}
.bc-svg svg [stroke="#0C538E"]{stroke:#7CC4FF}
.bc-svg svg [fill="#D5C4FF"],.bc-svg svg [fill="#96CFFF"],.bc-svg svg [fill="#0890FF"]{transform-box:fill-box;transform-origin:50% 100%;transition:transform 1.2s var(--out)}
.bc-svg svg [fill="#96CFFF"]{transition-delay:.12s}.bc-svg svg [fill="#0890FF"]{transition-delay:.24s}
.js .bchart.pre .bc-svg svg [fill="#D5C4FF"],.js .bchart.pre .bc-svg svg [fill="#96CFFF"],.js .bchart.pre .bc-svg svg [fill="#0890FF"]{transform:scaleY(0)}
.bc-plot .bv{position:absolute;transform:translateX(-50%);font-size:clamp(18px,2.1vw,30px);font-weight:600;line-height:1;white-space:nowrap}
.bc-plot .bl{position:absolute;top:calc(100% + 12px);transform:translateX(-50%);text-align:center;font-size:12px;color:var(--on-dark-2);white-space:nowrap}
.bc-plot .bl b{display:block;color:var(--white);font-weight:500;font-size:13px}
@media (hover:hover){.bc-svg svg{transition:filter .3s ease}.bchart:hover .bc-svg svg{filter:brightness(1.08)}}
/* vertically centred callouts */
.callout{align-items:center}
.callout .n{display:flex;align-items:baseline;gap:4px;white-space:nowrap}
.callout p{margin:0}
.callout .upto{margin:0}
/* ch5 speed: Banff photo with the story on it */
.sp-story{min-height:300px;display:flex;align-items:flex-end;align-self:stretch}
.sp-story img{z-index:0}
.sp-story::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,12,28,0) 30%,rgba(0,12,28,.72))}
.sp-ov{position:relative;z-index:2;display:grid;gap:12px;padding:20px;width:100%}
.sp-ov .meta{color:var(--white)}
.sp-ov .msg{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:rgba(255,255,255,.18)!important}
.dial-wrap:has(.sp-story){grid-template-columns:minmax(0,1fr)}
@media(min-width:560px){.dial-wrap:has(.sp-story){grid-template-columns:clamp(240px,24vw,300px) minmax(0,1fr)}.sp-story{grid-column:1/-1}}
@media(min-width:1100px){.dial-wrap:has(.sp-story){grid-template-columns:clamp(240px,22vw,300px) minmax(0,auto) minmax(0,1fr)}.sp-story{grid-column:auto}}
/* about: partner logos */
.logo-strip{margin-top:clamp(40px,5vw,64px);padding:22px clamp(20px,3vw,40px);border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.05);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
@media(max-width:899px){.logo-strip{border-radius:24px}}
.logo-strip .logos{margin-top:0}
@media(min-width:900px){.logo-strip .logos{justify-content:space-between;gap:24px}}
/* disclaimer full width */
.legal{max-width:none!important}

.opener .inch{align-items:start!important}
#stay .sbar>.seg:nth-child(1),#stay .sbar-l>span:nth-child(1){flex:0 0 calc((100% - 12px)*.24)!important}
#stay .sbar>.seg:nth-child(2),#stay .sbar-l>span:nth-child(2){flex:0 0 calc((100% - 12px)*.68)!important}
#stay .sbar>.seg:nth-child(3),#stay .sbar-l>span:nth-child(3){flex:0 0 calc((100% - 12px)*.08)!important}
#stay .sbar-l>span:nth-child(3){display:flex;justify-content:flex-end;overflow:visible}
.dark .aa{padding:clamp(14px,1.8vw,22px);border-radius:32px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid var(--line);gap:clamp(14px,1.6vw,20px)!important}
.ax .donut{transform:scaleX(-1)}
.lg-c{max-width:440px}
.sp-ov .meta{font-size:12px;color:rgba(255,255,255,.9)}
.sp-ov .badge{background:rgba(255,255,255,.92);color:var(--ocean)}
.sp-story::before{background:linear-gradient(180deg,rgba(0,12,28,0) 25%,rgba(0,12,28,.8))}

.sp-ov .meta{flex-wrap:wrap;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.sp-ov .badge{text-shadow:none}
@media(max-width:599px){.sp-story{min-height:340px}.bc-plot .bl{font-size:10px;top:calc(100% + 8px)}.bc-plot .bl b{font-size:11px}.bchart{gap:6px;grid-template-columns:30px minmax(0,1fr);margin-top:56px;padding-bottom:40px}.bc-axis{font-size:10px}}

/* ===== v47: chapter title cards ===== */
.opener{padding-block:clamp(56px,7vw,104px) clamp(40px,5vw,72px)!important;overflow:visible}
.op-card{position:relative;isolation:isolate;overflow:hidden;border-radius:clamp(24px,2.6vw,40px);min-height:clamp(540px,76vh,780px);padding:clamp(28px,4.4vw,72px)!important;align-content:end;color:var(--white);background:#04101f;box-shadow:0 50px 100px -50px rgba(0,0,0,.7)}
.op-card::before{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;pointer-events:none;
 background:linear-gradient(0deg,rgba(2,10,22,.9) 0%,rgba(2,10,22,.62) 34%,rgba(2,10,22,.18) 64%,rgba(2,10,22,.05) 100%),linear-gradient(90deg,rgba(2,10,22,.45),rgba(2,10,22,0) 60%)}
.op-card::after{content:"";position:absolute;inset:0;z-index:3;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),inset 0 1px 0 rgba(255,255,255,.22)}
.op-card>*,.op-card h2,.op-card .sub,.op-card .inch{position:relative;z-index:2}
.op-card>.op-bg{position:absolute;inset:0;z-index:0;margin:0;overflow:hidden}
.op-bg img{position:absolute;left:0;top:-8%;width:100%;height:116%;object-fit:cover;transform:translate3d(0,var(--py,0px),0) scale(1);transition:transform 1.8s var(--out),opacity 1.2s ease;will-change:transform}
.js .op-card.pre .op-bg img{transform:translate3d(0,var(--py,0px),0) scale(1.1);opacity:.4}
.op-noimg .op-bg{background:linear-gradient(135deg,#062c69,#03162e 55%,#1a0d4d)}
#ch3 .op-bg img{object-position:50% 60%}
.op-card .numeral,.on-light .op-card .numeral{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;color:var(--white)!important;text-shadow:0 10px 40px rgba(0,0,0,.25)}
.op-card h2,.on-light .op-card h2{color:var(--white)!important;text-shadow:0 2px 24px rgba(0,0,0,.25)}
.op-card .sub,.on-light .op-card .sub{color:rgba(255,255,255,.82)!important}
.op-card .inch,.on-light .op-card .inch{color:var(--white)}
.op-card .inch li,.on-light .op-card .inch li{border-top:1px solid rgba(255,255,255,.28)!important}
.op-card .inch a,.on-light .op-card .inch a{color:var(--white)!important;padding:14px 0!important;align-items:center!important}
.op-card .inch a::before,.on-light .op-card .inch a::before{background:var(--white)!important}
.op-card .inch{margin-top:clamp(20px,2.6vw,36px)!important}
/* arrows point right */
.inch a::after{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat!important;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat!important;margin-top:0!important;opacity:.75}
@media (hover:hover){.inch a:hover::after{transform:translateX(4px)!important;opacity:1}}
@media(max-width:640px){.op-card{min-height:520px}.op-card .numeral{font-size:120px}}
@media (prefers-reduced-motion:reduce){.op-bg img{transition:none!important;transform:none!important}}

/* v48: full-bleed title cards */
.opener>.wrap{max-width:none;padding-inline:0}
.op-card{margin-inline:clamp(0px,1.2vw,16px);border-radius:40px!important;min-height:clamp(560px,84vh,880px)!important;
 padding-inline:max(var(--gut),calc((100% - var(--max))/2 + var(--gut)))!important}
.chapter.on-light .opener{padding-top:0!important}
.chapter.on-light .op-card{margin-inline:0}
@media(max-width:640px){.op-card{border-radius:28px!important}}

/* v49: title card spacing + Figma p4 stacking */
.opener{padding-bottom:calc(clamp(40px,5vw,72px)*.75)!important}
.chapter.on-light{margin-bottom:clamp(0px,1.2vw,16px)!important}
.chapter.on-light+.chapter.dark{margin-top:0!important}
.chapter.on-light+.chapter.dark .opener{padding-top:0!important}
.op-card{min-height:clamp(620px,92vh,980px)!important;padding:clamp(32px,5.6vw,88px)!important;
 grid-template-columns:minmax(0,1fr)!important;row-gap:0!important;align-content:end}
.op-card .numeral{grid-column:1!important;grid-row:1!important;justify-self:start;align-self:end;position:relative;font-size:clamp(120px,16vw,240px)!important;line-height:.78;padding-bottom:clamp(24px,2.6vw,40px);margin-bottom:clamp(28px,3vw,44px)}
.op-card .numeral::after{content:"";position:absolute;left:0;bottom:0;width:clamp(140px,15vw,240px);height:1px;background:rgba(255,255,255,.55)}
.op-card h2{grid-column:1!important;grid-row:2!important;max-width:24ch;text-wrap:balance;font-size:clamp(40px,5.2vw,80px)!important;line-height:1.08}
.op-card .sub{grid-column:1!important;grid-row:3!important;margin-top:clamp(16px,1.8vw,26px)!important;font-weight:600!important;color:var(--white)!important;font-size:clamp(16px,1.4vw,20px)!important}
.op-card .inch{grid-column:1!important;grid-row:4!important}
@media(max-width:640px){.op-card{min-height:560px!important;padding:28px!important}}

/* v50 */
.op-card .numeral::after{display:none!important}
.op-card .numeral{font-size:clamp(140px,19vw,290px)!important;padding-bottom:0!important;margin-bottom:clamp(20px,2.4vw,36px)!important}
.op-card h2{font-size:clamp(34px,4.5vw,68px)!important}
.chapter.on-light{margin-bottom:calc(clamp(0px,1.2vw,16px)*3)!important}
.op-card{padding-left:clamp(36px,6.7vw,104px)!important}
@media(max-width:640px){.op-card{padding-left:28px!important}.op-card .numeral{font-size:140px!important}}

/* v51 */
.op-card .inch{margin-top:clamp(32px,3.6vw,52px)!important}
.rail{right:calc(clamp(0px,1.2vw,16px)*2)!important}

/* ===== v52: Isaac comment batch ===== */
.legal{max-width:900px!important}
.sp-ov .meta{display:flex;align-items:center;gap:8px 12px}
.glossy-stat{transition:transform .35s var(--out),box-shadow .35s ease,filter .35s ease}
@media (hover:hover){.glossy-stat:hover{transform:translateY(-4px);filter:brightness(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 0 40px rgba(255,255,255,.08),0 36px 70px -30px rgba(8,144,255,.6)}}
/* callout: single shared baseline */
.callout{align-items:baseline!important}
.callout .n{display:inline-flex;align-items:baseline;line-height:1}
.callout .upto{line-height:1}
.callout p{line-height:1.3}
/* upsell buildings: smaller */
.bchart{max-width:620px;margin-inline:auto;margin-top:64px}
/* revenue: stats beside the clock, takeaway matches panel height */
.cw-stack{justify-items:stretch}
@media(min-width:640px){.cw-stack{grid-template-columns:clamp(220px,22vw,280px) minmax(0,1fr)!important;align-items:center}.cw-stack .legend{grid-template-columns:minmax(0,1fr)!important;border-top:0;padding-top:0;gap:24px}}
.cw-stack .clock{width:100%}
.rev-side .f-body>.panel,.rev-side .f-body>.take{align-self:stretch!important;height:auto}
/* orchestrate mock larger */
.pcol[data-step="2"] .pmock img{max-height:none;width:112%;max-width:112%}
/* process buttons: centred, glassy, no progress line */
.pbtn{align-items:center!important;text-align:center;background:rgba(255,255,255,.32)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7),inset 0 1px 0 rgba(255,255,255,.9)!important}
.pcol.on .pbtn{background:rgba(255,255,255,.62)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.95),0 14px 30px -18px rgba(51,4,173,.3)!important}
.pbar{display:none!important}
/* flow3: no arrows */
.flow3 .f-trig::after,.flow3 .f-ans::after{display:none!important}
/* pies: bigger key dots, full-width stat */
.lg-c .sw{width:18px!important;height:18px!important}
.lg-c .row{grid-template-columns:18px minmax(0,1fr) auto!important}
.legend .sw{width:16px;height:16px;border-radius:50%}
.pie-full{grid-column:1/-1;margin-top:4px!important}
.pie .seg{transition:opacity .2s ease}
.pie .mk{transition:stroke-dashoffset 1.3s var(--out)}
/* wifi story: square image */
#breakdown .story-split .ph-todo{aspect-ratio:1/1;min-height:0;height:auto}
@media(min-width:900px){#breakdown .story-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;align-items:center}}
/* equal-height guest stories */
@media(min-width:720px){.aa{grid-template-rows:repeat(6,auto)}.aa-col{display:grid!important;grid-row:span 6;grid-template-rows:subgrid;row-gap:12px}}
.ax-s{align-self:stretch!important}
/* personalization bubble breathing room */
.ai-card{margin:20px 0 12px}
/* region icons +15% */
.region .ri img{height:83px}
.region{grid-template-columns:64px 112px minmax(0,1fr) 64px!important}
.aa-col .aa-story{margin-top:0!important;align-self:stretch}
.callout{gap:12px!important}
@media(max-width:600px){.callout{align-items:center!important}}

/* ===== v53 ===== */
#breakdown .story-split .ph-wifi{aspect-ratio:5/4;min-height:0;height:auto}
.pie-wrap{row-gap:24px!important;padding-top:16px}
.pie-full{margin-top:8px!important}
.ax-grid{align-items:end!important}
.ax-s{align-self:end!important}
.mini .row{align-items:start!important}
.mini .row img{margin-top:2px}
.bchart{max-width:none!important;margin-inline:0}
.bc-plot .bv{font-size:clamp(16px,1.7vw,24px)!important}
.cw-stack .clock{max-width:340px}
@media(min-width:640px){.cw-stack{grid-template-columns:clamp(260px,26vw,340px) minmax(0,1fr)!important}}
.rev-side .f-body>.panel{padding-block:clamp(32px,3vw,44px)}
.pcol[data-step="2"] .pmock img{width:104%!important;max-width:104%!important}
.pbtn .stage-pill{align-self:center!important}
@media(min-width:900px){.prow{grid-template-rows:auto auto;align-items:stretch!important}.pcol{display:grid!important;grid-row:span 2;grid-template-rows:subgrid;row-gap:16px}.pcol .pmock{align-self:end}.pcol .pbtn{height:100%;justify-content:center}}
.flow3 .xp{font-size:15px;padding:16px 14px;white-space:nowrap}
@media(max-width:1100px){.flow3 .xp{white-space:normal}}
/* regional module: cleaner header + bigger counts */
.region.rh{font-size:11px!important;font-weight:600!important;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5)!important;padding:4px 0 12px!important;border-bottom:1px solid var(--line)}
.region .c{font-size:clamp(40px,3.6vw,52px)!important;font-weight:600;letter-spacing:-.02em}
.region .r{font-size:18px}
.region .langs{font-size:15px}

.bc-plot{aspect-ratio:auto!important;height:clamp(220px,19vw,268px)}
.bc-b{position:absolute;top:0;height:100%;transform:translateX(-50%)}
.bc-b svg{display:block;height:100%;width:auto;overflow:hidden}
.bc-b svg [fill="#0C538E"]{fill:#7CC4FF}.bc-b svg [stroke="#0C538E"]{stroke:#7CC4FF}
.bc-b svg [fill="#D5C4FF"],.bc-b svg [fill="#96CFFF"],.bc-b svg [fill="#0890FF"]{transform-box:fill-box;transform-origin:50% 100%;transition:transform 1.2s var(--out)}
.bc-b svg [fill="#96CFFF"]{transition-delay:.12s}.bc-b svg [fill="#0890FF"]{transition-delay:.24s}
.js .bchart.pre .bc-b svg [fill="#D5C4FF"],.js .bchart.pre .bc-b svg [fill="#96CFFF"],.js .bchart.pre .bc-b svg [fill="#0890FF"]{transform:scaleY(0)}
@media (hover:hover){.bc-b{transition:transform .35s var(--out)}.bc-b:hover{transform:translateX(-50%) translateY(-4px)}}
@media(max-width:599px){.bc-plot{height:170px}}
.region{grid-template-columns:72px 170px minmax(0,1fr) 64px!important}
.region.rh span{white-space:nowrap}
@media(max-width:480px){.region{grid-template-columns:52px 64px minmax(0,1fr) 40px!important}.region.rh span{white-space:normal}.region .c{font-size:34px!important}}
@media(max-width:599px){.bc-plot{height:clamp(110px,34vw,150px)!important}.bc-plot .bv{font-size:14px!important}}
@media(max-width:480px){.region{grid-template-columns:48px 48px minmax(0,1fr) 30px!important;gap:10px}.region .ri img{height:56px}.region .langs{font-size:13.5px}.region.rh span:nth-child(2){font-size:9px}}

/* ===== v54 ===== */
.bchart{grid-template-columns:minmax(0,1fr)!important}
.bc-plot>i{background:rgba(255,255,255,.25)!important}
.pie .seg{transition:opacity .25s ease,transform .3s var(--out);transform-box:view-box;transform-origin:120px 120px}
.hl-on .pie .seg.hl{transform:scale(1.03)}
.lg-c .row{cursor:pointer;border-radius:10px;transition:background-color .2s ease,opacity .2s ease}
.hl-on .lg-c .row{opacity:.45}.hl-on .lg-c .row.hl{opacity:1;background:rgba(255,255,255,.06)}
.pie-wrap{padding-top:0!important}
.pie-l .lg-c{margin-top:16px}
.pie-wrap .pie{margin-top:16px}
.pcol .pbtn{justify-content:flex-start!important}
.ax-s .meta{flex-direction:column;align-items:flex-start!important;gap:8px!important}
.hl-on .pie .mk{opacity:1!important}
.hl-on .pie .seg:not(.hl){opacity:.3!important}
.hl-on .pie .seg:not(.hl){opacity:.18!important}
.hl-on .pie .seg.hl{transform:scale(1.04);filter:brightness(1.35) drop-shadow(0 0 1px rgba(255,255,255,.6))}
.pie-h{margin:0 0 4px}
.pie-l .lg-c{margin-top:0!important}
.pie-wrap .pie{margin-top:0!important}
.hero-grid{padding-top:81px!important}
@media(min-width:900px){.hero-grid{padding-top:101px!important}}
#glance{padding-top:43px!important}
@media(max-width:640px){#glance{padding-top:24px!important}}
#languages .panel:has(.regions){overflow:hidden}
#languages .region{margin-inline:-32px;padding-inline:32px}
#languages .panel:has(.regions){padding-bottom:0}
/* v61 regions */
#languages .region.rh{padding:4px 32px 12px!important}
#languages .region:not(.rh){padding-block:26px}
#languages .region>span:nth-child(2){text-align:center;justify-self:stretch}
#languages .region>span:nth-child(3){text-align:left}
#languages .region .ri img{height:112px}
#languages .region{grid-template-columns:72px 170px minmax(0,1fr) 84px!important;column-gap:16px}
@media(max-width:480px){#languages .region{grid-template-columns:44px 52px minmax(0,1fr) 40px!important;column-gap:10px;padding-inline:32px;margin-inline:-32px}#languages .region.rh{padding-inline:32px!important}#languages .region:not(.rh){padding-block:18px}#languages .region .ri img{height:68px}}
/* v62 study bars */
.study-cols .panel:has(.hbars){display:flex;flex-direction:column}
.study-cols .hbars{flex:1;display:flex;flex-direction:column;justify-content:space-between;margin-top:20px;gap:10px}
.study-cols .hbar{font-size:15px;padding:0}
.study-cols .hbar .t{height:18px}
.study-cols .hbar .v{font-size:15px}
.study-cols .panel:has(.hbar[style*="--v:38"]) .hbars{justify-content:space-evenly;gap:32px}
.study-cols .panel:has(.hbar[style*="--v:38"]) .hbar span:first-child{font-size:16px}
.study-cols .panel:has(.hbar[style*="--v:38"]) .hbar .v{font-size:22px}
.study-cols .panel:has(.hbar[style*="--v:38"]) .hbar{margin-top:0!important;row-gap:12px}

/* ===== v63: hero chat motion ===== */
.hst li{background:rgba(2,20,40,.34)!important;border-color:rgba(255,255,255,.28)!important}
.hst .dots{display:inline-flex;align-items:center;justify-content:space-between;width:14px;height:6px;background:none!important}
.hst .dots b{width:3px;height:3px;border-radius:50%;background:#fff;display:block}
.hst .ok{position:relative}
@media (prefers-reduced-motion:no-preference){
 .js .hchat>*,.js .hchat .hst li{transition:none}
 .js .hchat .hb{opacity:0;transform:translateY(14px) scale(.94);filter:blur(4px)}
 .js .hchat .hb.g{transform-origin:0 100%}.js .hchat .hb.a{transform-origin:100% 100%}
 .js .hchat .hst{opacity:1!important;transform:none!important}
 .js .hchat .hst li{opacity:0;transform:translateX(18px)}
 .js .hchat.on .hb{opacity:1;transform:none;filter:none;transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1),filter .7s ease}
 .js .hchat.on .hst li{opacity:1;transform:none;transition:opacity .55s cubic-bezier(.22,1,.36,1),transform .65s cubic-bezier(.22,1,.36,1)}
 /* continuous */
 .hchat.live .hst .ok::after{content:"";position:absolute;inset:0;border-radius:50%;background:#2BC48A;animation:hping 2.4s cubic-bezier(.22,1,.36,1) infinite}
 .hchat.live .hst .dots b{animation:hdot 1.2s ease-in-out infinite}
 .hchat.live .hst .dots b:nth-child(2){animation-delay:.15s}
 .hchat.live .hst .dots b:nth-child(3){animation-delay:.3s}
}
@keyframes hfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes hbump{0%,76%,100%{transform:translateX(0)}84%{transform:translateX(-7px)}92%{transform:translateX(1px)}}
@keyframes hping{0%{transform:scale(1);opacity:.6}100%{transform:scale(2.6);opacity:0}}
@keyframes hdot{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-2.5px);opacity:1}}

/* ===== v64: sequenced action moments ===== */
.hst .ok{display:grid;place-items:center}
.hst .ok svg{width:10px;height:10px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.hst .ok svg path{stroke-dasharray:8;stroke-dashoffset:0}
@media (prefers-reduced-motion:no-preference){
 .hchat.on .hst li:nth-child(1){transition-delay:.85s}
 .hchat.on .hst li:nth-child(2){transition-delay:1.75s}
 .hchat.on .hst li:nth-child(3){transition-delay:2.65s}
 .hchat.on .hb.a{transition-delay:3.55s}
 /* arrival moments (one-off, different from resting loops) */
 .hchat.on .hst li:nth-child(1){animation:hring .9s cubic-bezier(.22,1,.36,1) 1s both}
 .hchat.on .hst li:nth-child(2){animation:hring .9s cubic-bezier(.22,1,.36,1) 1.9s both}
 .hchat.on .hst li:nth-child(3){animation:hring .9s cubic-bezier(.22,1,.36,1) 2.8s both}
 .hchat.on .hst .sp{animation:hspin .45s linear 3 .95s,hspin 1.1s linear 2.3s infinite;scale:1}
 .hchat.on .hst .ok{animation:hpop .5s cubic-bezier(.34,1.56,.64,1) 1.9s both}
 .hchat.on .hst .ok svg path{animation:htick .45s cubic-bezier(.65,0,.35,1) 2.15s both}
 .hchat.on .hst .dots b{animation:hdotin .4s cubic-bezier(.34,1.56,.64,1) both}
 .hchat.on .hst .dots b:nth-child(1){animation-delay:2.85s}
 .hchat.on .hst .dots b:nth-child(2){animation-delay:2.97s}
 .hchat.on .hst .dots b:nth-child(3){animation-delay:3.09s}
 /* resting loops */
 .hchat.live .hst li{animation:hbump 11s cubic-bezier(.45,0,.2,1) infinite}
 .hchat.live .hst li:nth-child(2){animation-delay:.18s}
 .hchat.live .hst li:nth-child(3){animation-delay:.36s}
 .hchat.live .hst .dots b{animation:hdot 1.3s ease-in-out infinite}
 .hchat.live .hst .dots b:nth-child(2){animation-delay:.15s}
 .hchat.live .hst .dots b:nth-child(3){animation-delay:.3s}
}
@keyframes hbump{0%,86%,100%{transform:translateX(0)}91%{transform:translateX(-3px)}96%{transform:translateX(.5px)}}
@keyframes hring{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}100%{box-shadow:0 0 0 7px rgba(255,255,255,0)}}
@keyframes hpop{0%{scale:.2}100%{scale:1}}
@keyframes htick{from{stroke-dashoffset:8}to{stroke-dashoffset:0}}
@keyframes hdotin{from{scale:0;opacity:0}to{scale:1;opacity:.5}}
.hst .ok{isolation:isolate}.hst .ok::after{z-index:-1}
.bc-b svg [fill="#0C538E"]{fill:#fff!important}.bc-b svg [stroke="#0C538E"]{stroke:#fff!important}
/* ===== v71: floating pill nav (matches side rail) ===== */
.bar{background:none!important;border:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;padding:12px var(--gut) 0;pointer-events:none}
.bar .bar-in{pointer-events:auto;position:relative;overflow:hidden;max-width:calc(var(--max) - 2*var(--gut));margin-inline:auto;height:60px;padding:0 10px 0 24px;border-radius:999px;border:1px solid var(--line);background:rgba(2,14,30,.8);backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3);box-shadow:0 18px 40px -24px rgba(0,0,0,.7);transition:background-color .35s var(--out),border-color .35s var(--out)}
.bar .bar-in:hover{background:rgba(2,14,30,.88);border-color:rgba(255,255,255,.22)}
.bar .logo{height:32px!important}
.bar .progress{bottom:0;left:0;right:0}
@media(max-width:640px){.bar{padding:10px 12px 0}.bar .bar-in{height:56px;padding:0 8px 0 18px}.bar .logo{height:28px!important}}
/* ===== v72: wider pill nav, full chapter names ===== */
.bar .bar-in{max-width:none!important;width:calc((100vw + min(100vw,var(--max)) - 2*var(--gut))/2);margin-inline:auto}
.bar{padding-inline:0!important}
.chap-tabs{gap:2px!important;margin-inline:auto}
.chap-tabs a{padding:8px 14px!important;white-space:nowrap}
.progress{transition:transform .25s linear}
@media(max-width:1279px){.chap-tabs{display:none!important}.bar-actions{margin-left:auto!important}.menu-btn{display:inline-flex!important}}
@media(max-width:640px){.bar .bar-in{width:calc(100vw - 24px)}}
/* v73 */
.menu-btn,.sheet .close{display:inline-flex;align-items:center;justify-content:center;line-height:1;padding-top:1px}
.sheet .close{display:flex!important;height:44px}
.sheet-in{padding-top:12px}
/* v74: roomier mobile chapter sheet */
.sheet-in{padding:32px 28px calc(28px + env(safe-area-inset-bottom,0px))!important}
.sheet li a{padding:20px 4px!important;gap:20px!important;font-size:18px!important;line-height:1.3}
.sheet li:first-child a{padding-top:8px!important}
.sheet .close{margin-top:28px!important;height:52px}
/* v76 */
.pay .upto{font-size:14px;font-weight:400;opacity:1;color:var(--on-dark-2);margin-bottom:4px}
.hl{font-weight:600}
/* ===== v77: top bar only below desktop; desktop uses side rail + hero logo ===== */
.chap-tabs{display:none!important}
.menu-btn{display:inline-flex!important}
.bar-actions{margin-left:auto!important}
.hero-logo{display:none}
@media(min-width:1360px){
 .bar{display:none!important}
 html{scroll-padding-top:24px}
 .hero-logo{display:block;height:40px;width:auto;margin-bottom:clamp(40px,4vw,64px)}
}
/* v78: legend hover = bold, colour unchanged (all charts) */
.legend .row.hl{color:inherit;font-weight:inherit}
.legend .row.hl p{font-weight:600}
.legend .row.hl p b{font-weight:700}
/* v85: 65% vs. 35% */
.gl-1 .gl-vis{gap:14px!important}
.gl-1 .gd-wrap{width:clamp(120px,9.5vw,138px)}
.gd-wrap .seg{opacity:1}
.gd-wrap[data-on=""] .seg{opacity:1!important;stroke-width:22!important;filter:none!important}
.gd-wrap[data-on="a"] .sa,.gd-wrap[data-on="b"] .sb{opacity:1!important;stroke-width:26!important}
.gd-wrap[data-on="a"] .sb,.gd-wrap[data-on="b"] .sa{opacity:.3!important;stroke-width:22!important}
.gd-vs{display:flex;align-items:center;gap:10px}
.gd-vs i{font-style:normal;font-size:14px;color:var(--on-dark-2);align-self:flex-start;margin-top:10px}
.gk{all:unset;cursor:pointer;display:grid;justify-items:center;gap:2px;transition:opacity .3s ease}
.gk b{font-size:clamp(30px,2.6vw,38px);font-weight:600;line-height:1;letter-spacing:-.02em}
.gk span{font-size:12px;color:var(--on-dark-2)}
.gk.ka b{color:var(--violet)}.gk.kb b{color:var(--blue-hi)}
.gd-vs:has(.gk.on) .gk:not(.on){opacity:.4}
.gk:focus-visible{outline:2px solid var(--blue-hi);outline-offset:4px;border-radius:6px}
.gd-vs .gk,.gd-vs .gk.on,.gd-vs .gk:hover{background:none!important;box-shadow:none!important;border:0!important;padding:0!important}
/* ===== Marketo forms inside the gate (Marketo's own styles are stripped, then themed to match) ===== */
.gform-mkto{width:100%;margin-top:8px;text-align:left;min-width:0}
.gform-mkto .gnote{font-size:14px;color:var(--on-dark-2);margin:0 0 10px}
.gform-mkto .gnote b{color:var(--white);font-weight:500;word-break:break-all}
.gform-mkto .mktoForm{display:flex!important;flex-wrap:wrap;align-items:flex-end;gap:10px;width:100%!important;padding:0!important;font:inherit!important;color:inherit!important;position:relative}
.gform-mkto .mktoForm *{box-sizing:border-box}
.gform-mkto .mktoFormRow{flex:1 1 240px;min-width:0;margin:0!important}
.gform-mkto .mktoFormRow:has(input[type=hidden]){display:none!important}
.gform-mkto .mktoFormCol,.gform-mkto .mktoFieldWrap{width:100%!important;margin:0!important;float:none!important;position:relative}
.gform-mkto .mktoOffset,.gform-mkto .mktoGutter,.gform-mkto .mktoClear,.gform-mkto .mktoAsterix{display:none!important}
.gform-mkto .mktoLabel{display:block!important;width:auto!important;float:none!important;font-size:13px;font-weight:500;color:var(--on-dark-2);margin:0 0 8px!important;padding:0!important}
.gform-mkto .mktoField:not([type=hidden]){display:block;width:100%!important;font:400 16px/1.2 var(--f)!important;color:var(--white)!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.22)!important;border-radius:14px!important;padding:14px 16px!important;height:auto!important;box-shadow:none;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}
.gform-mkto .mktoField::placeholder{color:rgba(255,255,255,.45)}
.gform-mkto .mktoField:focus{outline:none;border-color:var(--bluejay)!important;background:rgba(255,255,255,.12)!important;box-shadow:0 0 0 4px rgba(8,144,255,.25)!important}
.gform-mkto .mktoField.mktoInvalid{border-color:var(--lavender)!important;box-shadow:0 0 0 4px rgba(157,122,250,.25)!important}
.gform-mkto .mktoButtonRow{flex:none;margin:0!important;display:block}
.gform-mkto .mktoButtonWrap{margin:0!important}
.gform-mkto .mktoButton{display:inline-flex;align-items:center;justify-content:center;height:50px;min-width:140px;padding:0 24px!important;border-radius:999px!important;border:0!important;background:var(--bluejay)!important;background-image:none!important;color:var(--white)!important;font:500 15px/1 var(--f)!important;cursor:pointer;box-shadow:none!important;text-shadow:none!important;transition:background-color .15s ease,transform .12s var(--out)}
@media (hover:hover){.gform-mkto .mktoButton:hover{background:var(--ocean)!important;transform:translateY(-1px)}}
.gform-mkto .mktoButton[disabled]{opacity:.6;cursor:progress}
.gform-mkto .mktoError{position:static!important;margin-top:8px;right:auto!important;bottom:auto!important}
.gform-mkto .mktoErrorArrowWrap{display:none!important}
.gform-mkto .mktoErrorMsg{display:block;max-width:none!important;background:none!important;border:0!important;box-shadow:none!important;text-shadow:none!important;padding:0!important;margin:0!important;color:var(--lavender)!important;font:500 13px/1.4 var(--f)!important}
.gform-mkto .glinks{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:12px}
@media(min-width:561px){.gform-mkto .mktoForm{align-items:flex-start}.gform-mkto .mktoButtonRow{margin-top:27px!important}}
@media(max-width:560px){.gform-mkto .mktoButtonRow,.gform-mkto .mktoButton{width:100%}}
.gform-mkto .gin{animation:gIn .35s var(--out)}

.gform-mkto .gnote{text-align:center}
.gform-mkto .glinks{justify-content:center;gap:8px 28px}
/* decoy shown under the blur while locked */
.decoy p,.decoy h2,.decoy h3{color:inherit}
/* multi-field forms (Form 2185: first/last, email/company): Marketo's two-column rows side by side */
.gform-mkto .mktoField{margin:0!important}
.gform-mkto .mktoField::placeholder{font-family:var(--f)!important}
.gform-mkto .mktoLabel:empty{display:none!important}
.gform-mkto .mktoFormRow:has(> .mktoFormCol + .mktoFormCol){flex:1 1 100%;display:flex!important;gap:10px}
.gform-mkto .mktoFormRow:has(> .mktoFormCol + .mktoFormCol) > .mktoFormCol{flex:1 1 0;min-width:0;width:auto!important}
.gform-mkto .mktoForm:has(.mktoFormCol + .mktoFormCol) .mktoButtonRow{flex:1 1 100%;margin-top:6px!important}
.gform-mkto .mktoForm:has(.mktoFormCol + .mktoFormCol) .mktoButton{width:100%}
@media(max-width:560px){.gform-mkto .mktoFormRow:has(> .mktoFormCol + .mktoFormCol){flex-direction:column}}