.intro{padding:88px 0 40px}
.intro .lead{margin-top:24px;max-width:620px;color:var(--body)}
.story{position:relative}
.stage{position:sticky;top:80px;height:calc(100vh - 80px);min-height:560px;display:grid;grid-template-columns:400px 1fr;gap:48px;align-items:center;max-width:1440px;margin:0 auto;padding:0 80px}
.slist{position:relative;padding-left:28px}
.slist .rail{position:absolute;left:4px;top:10px;bottom:10px;width:1px;background:var(--line)}
.slist .fill{position:absolute;left:4px;top:10px;width:1px;background:var(--ink);height:0}
.slist .pulse{position:absolute;left:-1px;top:10px;width:11px;height:11px;margin-top:-5px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 6px rgba(210,254,69,.3)}
.st{padding:14px 0;border-top:1px solid var(--line)}
.st:first-of-type{border-top:0}
.st .row{display:flex;gap:14px;align-items:baseline}
.st .n{font-family:"Archivo Narrow",sans-serif;font-weight:500;font-size:12px;letter-spacing:1.6px;color:var(--muted);width:22px}
.st .nm{font-weight:600;font-size:22px;letter-spacing:-.3px;line-height:1.25;color:var(--muted);transition:color .4s}
.st .more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease),opacity .5s var(--ease),filter .6s var(--ease);opacity:0;filter:blur(6px)}
.st .more > div{overflow:hidden;padding-left:36px}
.st .fact{margin-top:8px;color:var(--olive)}
.st .line{margin-top:8px;color:var(--body);font-size:16px;line-height:1.55}
.st.on .nm{color:var(--ink)}
.st.on .n{color:var(--olive)}
.st.on .more{grid-template-rows:1fr;opacity:1;filter:none}
.scene{position:relative;height:100%;max-height:760px;width:100%}
.scene canvas{position:absolute;inset:0;width:100%;height:100%}
.tag{position:absolute;right:0;bottom:24px;color:var(--muted)}
.after{padding:80px 0 120px;border-top:1px solid var(--line);background:var(--white)}
.after p{max-width:640px;color:var(--body);margin-top:14px}
.cmp{display:flex;gap:10px;margin-top:28px;flex-wrap:wrap}
.cmp a{border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-size:14px}
.cmp a[aria-current]{background:var(--lime);border-color:var(--lime)}
.stage.wide{grid-template-columns:1fr;grid-template-rows:auto 1fr;gap:8px;align-items:stretch;padding-top:26px;padding-bottom:16px}
.wide .slist{display:grid;grid-template-columns:repeat(5,1fr);padding:24px 0 0 0}
.wide .slist .rail{left:0;right:0;top:0;bottom:auto;width:auto;height:1px}
.wide .slist .fill{left:0;top:0;height:1px;width:0}
.wide .slist .pulse{top:0;left:0;margin-left:-5px}
.wide .st{border-top:0;padding:0 24px 0 0}
.wide .st .more{display:none}
.wide .detail{display:flex;gap:28px;align-items:baseline;margin-top:14px;min-height:30px}
.wide .detail .fact{color:var(--olive);white-space:nowrap}
.wide .detail .line{color:var(--body);font-size:17px;transition:opacity .4s var(--ease),filter .4s var(--ease)}
.wide .detail.swap .line,.wide .detail.swap .fact{opacity:0;filter:blur(6px)}
@media (max-width:1100px){.stage{grid-template-columns:1fr;padding:24px;gap:16px}.scene{height:380px}}

/* concepts E and F · shared stage */
.intro .accent{color:var(--olive)}
.story{height:760vh}
.stage{grid-template-columns:1fr;grid-template-rows:auto 1fr;gap:28px;align-items:stretch;padding-top:28px;padding-bottom:28px}
.rail{position:relative;list-style:none;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);padding-top:16px}
.rail .rfill{position:absolute;left:0;top:-1px;height:2px;width:0;background:var(--ink)}
.rail .rfill::after{content:"";position:absolute;right:-5px;top:-4.5px;width:11px;height:11px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 6px rgba(210,254,69,.3)}
.rail li{display:flex;gap:12px;align-items:baseline;font-weight:600;font-size:20px;letter-spacing:-.3px;color:var(--muted);transition:color .4s}
.rail li .mono{color:var(--muted)}
.rail li.on{color:var(--ink)}
.rail li.on .mono{color:var(--olive)}
.rail li.done{color:var(--body)}
.detail{display:flex;gap:28px;align-items:baseline;margin-top:14px;min-height:28px}
.detail .fact{color:var(--olive);white-space:nowrap}
.detail .line{color:var(--body);font-size:17px}
.detail .fact,.detail .line{transition:opacity .35s var(--ease),filter .35s var(--ease)}
.detail.swap .fact,.detail.swap .line{opacity:0;filter:blur(6px)}
.muted{color:var(--muted)}
.olive{color:var(--olive)}
@media (max-width:1100px){.rail li{font-size:15px;flex-direction:column;gap:2px}.detail{flex-direction:column;gap:4px}}
@media (prefers-reduced-motion:reduce){.story *{transition:none!important}}

/* concept E · one screen that changes */
.cols{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:48px;align-items:start;min-height:0}
.screen{background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:0 22px 50px -32px rgba(15,16,19,.35);overflow:hidden}
.sh{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding:20px 24px 18px;border-bottom:1px solid var(--line)}
.mode{font-weight:600;font-size:26px;letter-spacing:-.6px;margin-top:4px;transition:opacity .3s,filter .3s}
.mode.swap{opacity:0;filter:blur(5px)}
.metric{display:grid;grid-template-columns:auto auto;column-gap:10px;align-items:baseline;text-align:right;justify-items:end}
.metric b{font-weight:600;font-size:54px;letter-spacing:-2px;line-height:1;font-variant-numeric:tabular-nums;grid-row:span 2}
.metric .mono{color:var(--muted);align-self:end;justify-self:start}
.metric .msub{font-size:13px;color:var(--olive);justify-self:start;max-width:170px;text-align:left;line-height:1.3}
.metric.drop b{color:var(--olive)}
.thead{display:grid;grid-template-columns:1.2fr 1.4fr 70px 168px;gap:14px;padding:10px 24px;color:var(--muted);border-bottom:1px solid var(--line);background:var(--card)}
.rows{display:grid}
.r{display:grid;grid-template-columns:1.2fr 1.4fr 70px 168px;gap:14px;align-items:center;padding:13px 24px;border-bottom:1px solid var(--line);transition:opacity .5s var(--ease),transform .5s var(--ease),filter .5s var(--ease),background .5s}
.r.hide{opacity:0;transform:translateY(8px);filter:blur(4px)}
.r.flash{background:#f6fde0}
.r .nm b{display:block;font-weight:600;font-size:15px}
.r .nm span{font-size:13px;color:var(--muted)}
.r .sys{font-size:14px;color:var(--body);display:flex;flex-direction:column;gap:3px;align-items:flex-start}
.rec{position:relative;display:inline-grid;font-size:13px}
.rec > *{grid-area:1/1;transition:opacity .4s,filter .4s,transform .45s var(--ease);white-space:nowrap}
.rec s{color:#a2552f;text-decoration:none;font-style:italic}
.rec em{font-style:normal;font-weight:600;background:var(--lime);border-radius:999px;padding:1px 9px;opacity:0;filter:blur(4px);transform:translateY(4px);justify-self:start}
.r.joined .rec s{opacity:0;filter:blur(4px)}
.r.joined .rec em{opacity:1;filter:none;transform:none}
.r .tm{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}
.r .tm.zero{color:var(--muted);font-weight:500}
.stchip{justify-self:start;display:inline-flex;align-items:center;gap:7px;font-size:13px;padding:4px 11px;border-radius:999px;white-space:nowrap;background:var(--chip);color:var(--body);transition:background .4s,color .4s,border-color .4s}
.stchip i{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.5}
.stchip.plan{background:transparent;border:1px solid var(--line);color:var(--ink)}
.stchip.appr{background:transparent;border:1.5px solid var(--olive);color:var(--olive);font-weight:600}
.stchip.live{background:var(--dark);color:var(--on-dark)}
.stchip.live i,.stchip.ok i{background:var(--lime);opacity:1;box-shadow:0 0 0 3px rgba(210,254,69,.3)}
.stchip.ok{background:var(--lime);color:var(--ink);font-weight:600}
.stchip.ok i{background:var(--ink);box-shadow:none}
.sf{display:flex;justify-content:space-between;align-items:center;padding:14px 24px;min-height:52px}
.note{display:inline-flex;align-items:center;gap:10px;font-size:14.5px;font-weight:600;transition:opacity .4s,filter .4s}
.note i{width:9px;height:9px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 5px rgba(210,254,69,.3)}
.note.off{opacity:0;filter:blur(4px)}
.ledger{display:grid;gap:12px;padding-top:4px}
.lh{color:var(--muted);padding-bottom:8px;border-bottom:1px solid var(--line)}
.lh + ul{margin-bottom:18px}
.ledger ul{list-style:none;display:grid;gap:9px}
.ledger li{font-size:14.5px;line-height:1.45;color:var(--body);display:flex;gap:10px;transition:opacity .5s var(--ease),filter .5s var(--ease),transform .5s var(--ease)}
.ledger li.off{opacity:0;filter:blur(4px);transform:translateX(10px)}
.have li .mono{color:var(--olive);padding-top:3px}
.have li.new{color:var(--ink);font-weight:600}
.paid li{display:block;padding-left:18px;position:relative}
.paid li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:var(--ink)}
.paid li:first-child::before{background:transparent;border:1.5px solid var(--ink);width:4px;height:4px}
.paid b{font-weight:600;color:var(--ink)}
@media (max-width:1100px){.cols{grid-template-columns:1fr}.thead,.r{grid-template-columns:1.2fr 1.2fr 56px 140px;padding-left:14px;padding-right:14px}.ledger{display:none}}


/* concept G · step card + the screen that proves it */
.story{height:600vh}
.cols{grid-template-columns:minmax(0,470px) minmax(0,1fr);gap:56px}
.cards{position:relative;height:100%;min-height:560px}
.card{position:absolute;inset:0 0 auto 0;will-change:transform,opacity,filter}
.ce{display:flex;justify-content:space-between;color:var(--muted)}
.ce b{color:var(--olive);font-weight:600;margin-right:6px}
.ch{font-weight:600;font-size:clamp(30px,2.6vw,38px);line-height:1.08;letter-spacing:-1px;margin-top:10px}
.ch .olive{display:block}
.cg{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:26px;padding-top:18px;border-top:1px solid var(--line)}
.cl{color:var(--muted);margin-bottom:10px}
.cg ul{list-style:none;display:grid;gap:10px}
.cg li{font-size:15px;line-height:1.45;padding-left:18px;position:relative;color:var(--body)}
.do li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:1.5px;background:var(--ink)}
.get li{color:var(--ink);font-weight:500}
.get li::before{content:"";position:absolute;left:0;top:6px;width:9px;height:9px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(210,254,69,.3)}
.cost{display:flex;gap:14px;align-items:baseline;margin-top:24px;padding:14px 16px;border-radius:10px;background:var(--white);border:1px solid var(--line);font-size:15px;font-weight:600}
.cost .mono{color:var(--olive);white-space:nowrap;font-weight:500}
.mode{min-height:34px}
@media (max-width:1100px){.cols{grid-template-columns:1fr}.cards{min-height:520px}.screen{display:none}}
/* the phase bar: its own band so it never gets lost under the content */
.stage{gap:36px}
.phases{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:6px;background:var(--white);border:1px solid var(--line);border-radius:16px;box-shadow:0 14px 34px -26px rgba(15,16,19,.35)}
.phases li{position:relative;display:flex;align-items:center;gap:12px;padding:12px 16px 14px;border-radius:11px;color:var(--muted);overflow:hidden;transition:background .45s var(--ease),color .45s var(--ease)}
.phases .pn{width:28px;height:28px;flex:none;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);color:var(--muted);transition:all .45s var(--ease)}
.phases .pt{display:grid;line-height:1.25;min-width:0}
.phases .pt b{font-weight:600;font-size:17px;letter-spacing:-.2px}
.phases .pt span{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phases .pbar{position:absolute;left:16px;right:16px;bottom:6px;height:2px;border-radius:2px;background:transparent}
.phases .pbar i{position:absolute;inset:0;border-radius:2px;background:var(--lime);transform-origin:0 50%;transform:scaleX(0)}
.phases li.done{color:var(--ink)}
.phases li.done .pn{background:var(--chip);border-color:var(--chip);color:var(--olive)}
.phases li.done .pbar i{background:var(--olive);opacity:.35}
.phases li.on{background:var(--dark);color:var(--on-dark)}
.phases li.on .pn{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.phases li.on .pt span{color:var(--on-dark-soft)}
.phases li.on .pbar{background:rgba(255,255,255,.12)}
@media (max-width:1100px){.phases .pt span{display:none}.phases li{padding:10px}.phases .pt b{font-size:14px}}
.ce{display:none}
.ch{margin-top:0}
/* more room between the phase bar and the step */
.stage{gap:52px}
/* industry tabs along the top of the screen */
.inds{display:flex;gap:4px;padding:8px 10px 0;border-bottom:1px solid var(--line);background:var(--card);overflow-x:auto}
.inds button{font-size:13.5px;font-weight:500;padding:8px 14px 10px;border-radius:9px 9px 0 0;color:var(--muted);position:relative;white-space:nowrap;transition:color .25s,background .25s}
.inds button:hover{color:var(--ink)}
.inds button[aria-selected="true"]{color:var(--ink);font-weight:600;background:var(--white);box-shadow:0 1px 0 var(--white),0 0 0 1px var(--line)}
.inds button[aria-selected="true"]::after{content:"";position:absolute;left:14px;right:14px;top:0;height:2px;border-radius:2px;background:var(--lime)}
.inds button:focus-visible{outline:2px solid var(--olive);outline-offset:-2px}
.screen .sh,.screen .rows,.screen .sf{transition:opacity .22s var(--ease),filter .22s var(--ease)}
.screen.swapping .sh,.screen.swapping .rows,.screen.swapping .sf{opacity:0;filter:blur(4px)}
.r{padding-top:10px;padding-bottom:10px}
.sh{padding-top:16px;padding-bottom:14px}
/* after the story */
.gx{padding:120px 0}
.gx-white{background:var(--white)}
.gx-two{display:grid;grid-template-columns:minmax(0,480px) minmax(0,1fr);gap:80px;align-items:start}
.gx-head .h2{margin-top:16px}
.gx-lead{margin-top:20px;color:var(--body);max-width:520px}
.lime{color:var(--lime)}
.gx-rv{opacity:0;transform:translateY(16px);filter:blur(8px);transition:opacity .8s var(--ease),transform .9s var(--ease),filter .8s var(--ease)}
.gx-rv.in{opacity:1;transform:none;filter:none}
/* discovery sizes */
.gx-tbl{border-top:1px solid var(--line)}
.gx-tr{display:grid;grid-template-columns:130px 1fr 1fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--line);font-size:16px;align-items:baseline}
.gx-sub{margin:72px 0 18px}
.gx-four{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.gx-card{display:grid;gap:8px;align-content:start;padding:24px;border:1px solid var(--line);border-radius:var(--r-card);background:var(--card)}
.gx-card b{font-weight:600;font-size:19px;letter-spacing:-.2px}
.gx-card p{font-size:15px;color:var(--body);line-height:1.5}
.gx-notes{display:flex;gap:40px;flex-wrap:wrap;margin-top:24px}
.gx-notes p,.gx-note{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--muted)}
.gx-notes i,.gx-note i{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 4px rgba(210,254,69,.3);flex:none}
/* toolkit */
.gx-kit{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:56px;border-top:1px solid var(--ink)}
.gx-kit li{display:grid;gap:8px;align-content:start;padding:22px 22px 28px 0;border-bottom:1px solid var(--line)}
.gx-kit li:nth-child(n+6){padding-top:26px}
.gx-kit .label{color:var(--olive)}
.gx-kit b{font-weight:600;font-size:17px;letter-spacing:-.2px}
.gx-kit p{font-size:14.5px;color:var(--body);line-height:1.5}
.gx-kit .gx-key b{display:inline-flex;align-items:center;gap:8px}
.gx-kit .gx-key b::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 4px rgba(210,254,69,.3)}
/* dark band */
.gx-dark{background:var(--dark);color:var(--on-dark)}
.gx-soft{color:var(--on-dark-soft)}
.gx-dark .h2{margin-top:16px;color:var(--on-dark)}
.gx-gov{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:32px}
.gx-gov li{font-size:14.5px;padding:7px 14px;border-radius:999px;border:1px solid var(--line-dark);color:var(--on-dark)}
.gx-dark .gx-note{margin-top:24px;color:var(--on-dark-soft)}
.gx-prom{list-style:none;margin-top:18px;border-top:1px solid var(--line-dark)}
.gx-prom li{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:baseline;padding:20px 0;border-bottom:1px solid var(--line-dark);font-weight:600;font-size:21px;letter-spacing:-.3px;line-height:1.3}
.gx-prom .label{color:var(--lime)}
/* faq */
.gx-ask{display:inline-block;margin-top:28px}
.gx-faq{border-top:1px solid var(--line)}
.gx-faq details{border-bottom:1px solid var(--line)}
.gx-faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:44px 1fr 20px;gap:12px;align-items:baseline;padding:22px 0;font-weight:600;font-size:19px;letter-spacing:-.2px}
.gx-faq summary::-webkit-details-marker{display:none}
.gx-faq summary .label{color:var(--muted)}
.gx-faq summary::after{content:"+";font-weight:400;font-size:22px;color:var(--muted);transition:transform .3s var(--ease)}
.gx-faq details[open] summary::after{transform:rotate(45deg);color:var(--ink)}
.gx-faq details[open] summary .label{color:var(--olive)}
.gx-faq details p{padding:0 32px 24px 56px;color:var(--body);max-width:640px}
.gx-faq summary:focus-visible{outline:2px solid var(--olive);outline-offset:4px;border-radius:4px}
/* page end */
.gx-end{padding:110px 0 64px}
.gx-pe{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;padding:48px;border-radius:var(--r-panel);background:var(--white);border:1px solid var(--line)}
.gx-pe .h2{margin-top:14px}
.gx-pe p{margin-top:16px;color:var(--body);max-width:520px}
.gx-cmp{display:flex;gap:20px;align-items:center;margin-top:48px;flex-wrap:wrap}
.gx-cmp .cmp{margin-top:0}
@media (max-width:1100px){.gx{padding:80px 0}.gx-two{grid-template-columns:1fr;gap:40px}.gx-four{grid-template-columns:1fr 1fr}.gx-kit{grid-template-columns:1fr 1fr}.gx-pe{flex-direction:column;align-items:flex-start;padding:32px}}