@font-face{font-family:Geist;src:url('/fonts.gstatic.com/s/geist/v4/gyByhwUxId8gMHweElSvO5Tc.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:"Bricolage Grotesque";src:url('/fonts.gstatic.com/s/bricolagegrotesque/v9/3y9U6as8bTXq_nANBjzKo3IeZx8z6up5BeSl5jBNz_19PpbpMXuECpwUxJBOm_OJWiaaD30YfKfjZZoLvSniyMgvs-wJDtw.woff2') format('woff2');font-style:normal;font-weight:200 800;font-display:swap}
@font-face{font-family:"Kode Mono";src:url('/fonts.gstatic.com/s/kodemono/v4/A2BLn5pb0QgtVEPFnlYkkaoBgw4qv9odq6uy9D-TaOW2A3k.woff2') format('woff2');font-style:normal;font-weight:400 700;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible Mono";src:url('/fonts.gstatic.com/s/atkinsonhyperlegiblemono/v8/tssNAoFBci4C4gvhPXrt3wjT1MqSzhA4t7IIcncBiyihrK15gZ4k_SaZLteSCiMa.woff2') format('woff2');font-style:normal;font-weight:400 500;font-display:swap}
@font-face{font-family:Inter;src:url('/plastic/assets/fonts/Inter-Regular-latin.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url('/plastic/assets/fonts/Inter-Medium-latin.woff2') format('woff2');font-style:normal;font-weight:500 600;font-display:swap}
:root{--paper:#f7f7f4;--ink:#090909;--green:#159447;--mint:#dcece6;--line:#d8d8d3;--muted:#777772;--shell:min(1380px,calc(100vw - 64px));--ease:cubic-bezier(.22,1,.36,1);--font-display:"Bricolage Grotesque",Arial,sans-serif;--font-body:Geist,Arial,sans-serif;--font-eyebrow:"Kode Mono",monospace;--font-control:"Atkinson Hyperlegible Mono",monospace;--font-nav:Inter,Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Geist,Arial,sans-serif;font-size:16px;line-height:1.35;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
img{display:block;max-width:100%}
.shell{width:var(--shell);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:10px;z-index:1000;background:#fff;padding:12px 18px;border-radius:99px;transform:translateY(-150%);transition:.2s}.skip-link:focus{transform:none}
.site-header{position:fixed;z-index:100;top:0;left:0;right:0;height:74px;display:flex;align-items:center;padding:0 28px;border-bottom:1px solid rgba(0,0,0,.08);background:rgba(247,247,244,.9);backdrop-filter:blur(18px);transition:transform .45s var(--ease),background .3s}
.site-header.is-hidden{transform:translateY(-100%)}
.brand{display:inline-flex;align-items:center;gap:9px;font-size:15px;font-weight:700;letter-spacing:-.03em;white-space:nowrap}
.brand-mark{position:relative;width:21px;height:23px;display:inline-block;transform:rotate(45deg)}
.brand-mark i{position:absolute;width:11px;height:21px;background:currentColor;border-radius:8px 8px 2px 8px}.brand-mark i:first-child{left:0;top:0}.brand-mark i:last-child{right:0;bottom:0;transform:rotate(180deg)}
.desktop-nav{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:26px;font-family:var(--font-nav);font-size:14px}
.desktop-nav a,.header-actions a{transition:opacity .2s}.desktop-nav a:hover,.header-actions a:hover{opacity:.5}
.nav-label{color:#999;margin-right:10px}
.header-actions{margin-left:auto;display:flex;align-items:center;gap:24px;font-size:14px}
.ask-link{color:#0c8f43}
.pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;min-height:46px;padding:0 24px;font-weight:600;transition:transform .25s var(--ease),background .25s,color .25s}.pill:hover{transform:translateY(-2px)}
.pill-dark{min-height:40px;padding-inline:24px;background:#050505;color:#fff}
.pill-light{background:#fff;color:#080808}
.menu-button{display:none;margin-left:auto;width:46px;height:46px;border:0;border-radius:50%;background:#080808;cursor:pointer;position:relative;z-index:2}.menu-button i{display:block;width:17px;height:1px;background:#fff;margin:5px auto;transition:.3s}
.menu-button[aria-expanded=true] i:first-of-type{transform:translateY(3px) rotate(45deg)}.menu-button[aria-expanded=true] i:last-of-type{transform:translateY(-3px) rotate(-45deg)}
.mobile-menu{position:fixed;inset:0;background:#0a0a0a;color:#fff;padding:110px 24px 28px;z-index:1}.mobile-menu-inner{display:flex;flex-direction:column;height:100%}.mobile-menu p{text-transform:uppercase;color:#777;font-size:12px;letter-spacing:.12em}.mobile-menu a{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #262626;padding:20px 0;font-size:clamp(28px,9vw,48px);letter-spacing:-.05em}.mobile-menu a:nth-last-child(2){margin-top:auto}
.hero{position:relative;min-height:980px;padding:140px 0 80px;overflow:hidden;background:radial-gradient(circle at 50% 46%,#fff 0,#fbfbf8 36%,var(--paper) 72%)}
.hero-grid{position:relative;min-height:760px;display:grid;grid-template-columns:1fr 1.25fr .78fr;grid-template-rows:auto 1fr;align-items:start}
.hero h1{grid-column:1;margin:14px 0 0;font-family:var(--font-display);font-size:clamp(42px,4.25vw,72px);font-weight:600;line-height:1.02;letter-spacing:-.045em;position:relative;z-index:3}
.hero-copy{grid-column:3;margin-top:18px;padding-left:35px;border-left:1px solid var(--line);font-size:16px;line-height:1.2;position:relative;z-index:3}.hero-copy strong{font-size:18px;letter-spacing:-.035em}.hero-copy p{margin-top:16px;color:#84847e;font-size:13px}.hero-copy em{font-style:normal;color:var(--green);font-weight:600}
.hero-person{position:absolute;width:min(38vw,540px);left:50%;top:80px;transform:translateX(-50%);z-index:1;overflow:hidden;mask-image:linear-gradient(#000 75%,transparent)}.hero-person img{width:100%;aspect-ratio:.85;object-fit:cover;object-position:50% 26%;filter:saturate(.82)}
.call-pill{position:absolute;z-index:5;left:50%;top:390px;transform:translateX(-50%);background:#050505;color:#fff;border-radius:999px;width:180px;height:47px;display:grid;place-items:center;font-size:14px;font-weight:600;box-shadow:0 12px 30px rgba(0,0,0,.22);transition:.3s var(--ease)}.call-pill:hover{width:194px}
.hero-device{position:absolute;z-index:2;width:min(70vw,900px);left:50%;top:420px;transform:translateX(-50%);border-radius:30px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.16);border:8px solid #fff;background:#fff}.hero-device img{width:100%;aspect-ratio:1.78;object-fit:cover}
.scroll-cue{position:absolute;bottom:24px;left:50%;height:64px;width:1px;background:#cacac5}.scroll-cue span{position:absolute;top:0;left:-2px;width:5px;height:5px;background:var(--green);border-radius:50%;animation:scrollCue 2s ease-in-out infinite}
@keyframes scrollCue{0%{transform:translateY(0)}70%,100%{transform:translateY(59px)}}
.section-dark{background:#080808;color:#fff}
.manifesto{position:relative;padding:150px 0 0;overflow:hidden}
.manifesto-grid{display:grid;grid-template-columns:1fr 3fr;column-gap:50px}.eyebrow{text-transform:uppercase;font-size:11px;font-weight:650;letter-spacing:.15em;color:#858580;margin:0}
.manifesto h2{grid-column:2;margin:0;max-width:1080px;font-size:clamp(65px,8.6vw,144px);font-weight:480;letter-spacing:-.075em;line-height:.86}.manifesto h2 span,.shift h2 span,.impact h2 span{color:var(--green)}
.manifesto-copy{grid-column:2;margin:75px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:60px;max-width:820px;font-size:20px;color:#9e9e98}.manifesto-copy p{margin:0}.manifesto .pill{grid-column:2;margin-top:46px;justify-self:start;gap:35px}.manifesto .pill span{color:#777;font-weight:450}
.ticker{margin-top:140px;border-top:1px solid #292929;border-bottom:1px solid #292929;white-space:nowrap;overflow:hidden}.ticker div{width:max-content;font-size:clamp(76px,11vw,176px);font-weight:470;letter-spacing:-.06em;line-height:1;padding:35px 0;animation:ticker 24s linear infinite;color:#e9e9e5}
@keyframes ticker{to{transform:translateX(-50%)}}
.operations{padding:140px 0;background:#efefeb;min-height:1000px}
.operations-head{display:grid;grid-template-columns:1fr 2fr auto;align-items:start}.operations-head h2{grid-column:2;margin:0;font-size:clamp(60px,7.6vw,126px);font-weight:480;letter-spacing:-.07em;line-height:.88}.operations-head h2 span{color:#a1a19b}.slide-count{font-size:13px;color:#777}.slide-count b{color:#111;font-size:20px}
.operation-stage{position:relative;margin-top:90px;min-height:655px;background:#fafaf7;border:1px solid #d7d7d1;border-radius:28px;overflow:hidden}
.operation-slide{position:absolute;inset:0 0 70px;display:grid;grid-template-columns:.85fr 1.15fr;opacity:0;visibility:hidden;transform:translateX(40px);transition:opacity .55s var(--ease),transform .55s var(--ease),visibility .55s}.operation-slide.is-active{opacity:1;visibility:visible;transform:none}
.operation-copy{padding:60px;display:flex;flex-direction:column;border-right:1px solid #ddd}.number{font-size:12px;color:#888}.operation-copy h3{font-size:clamp(38px,4vw,68px);line-height:.96;letter-spacing:-.06em;font-weight:500;margin:36px 0 18px}.operation-copy .lede{font-size:18px;color:#555;margin:0}.detail{margin:auto 0 25px;padding-top:24px;border-top:1px solid #ddd}.detail h4{font-size:17px;margin:0 0 8px}.detail p{color:#6d6d68;margin:0;max-width:520px}.text-link{font-weight:600;display:inline-flex;gap:18px;align-items:center}.text-link span{color:var(--green)}
.operation-visual{margin:30px;border-radius:20px;background:#0b0b0b;color:#fff;overflow:hidden;position:relative;min-height:460px}.visual-price{padding:55px;display:flex;flex-direction:column;justify-content:center}.live-badge{font-size:11px;letter-spacing:.15em;color:#b5b5ae}.live-badge i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#20bc5c;margin-right:8px;box-shadow:0 0 0 7px rgba(32,188,92,.12)}.visual-price>strong{font-size:clamp(78px,9vw,145px);letter-spacing:-.075em;line-height:1;margin-top:35px}.visual-price>strong span{font-size:18px;color:#777;letter-spacing:0}.visual-price>p{color:#999}.chart-bars{height:115px;display:flex;align-items:end;gap:12px;margin-top:15px;border-bottom:1px solid #333}.chart-bars i{flex:1;background:var(--green);border-radius:3px 3px 0 0;opacity:.8}.chart-bars i:nth-child(1){height:22%}.chart-bars i:nth-child(2){height:38%}.chart-bars i:nth-child(3){height:30%}.chart-bars i:nth-child(4){height:62%}.chart-bars i:nth-child(5){height:55%}.chart-bars i:nth-child(6){height:73%}.chart-bars i:nth-child(7){height:68%}.chart-bars i:nth-child(8){height:92%}.mini-row{display:flex;justify-content:space-between;margin-top:22px;color:#777}.mini-row b{color:#fff}
.image-visual{background:#121212;display:grid;place-items:center}.image-visual img{width:100%;height:100%;object-fit:cover}.image-visual.contain img{object-fit:contain;padding:55px}.record-visual{display:flex;flex-direction:column;justify-content:center;padding:45px;background:#111}.record{display:flex;justify-content:space-between;align-items:center;background:#f4f4f0;color:#111;padding:25px 28px;margin:-1px 0;border:1px solid #d4d4ce;border-radius:14px;transform:rotate(-1deg)}.record:nth-child(even){transform:rotate(1deg)}.record b{color:var(--green)}
.carousel-controls{position:absolute;bottom:0;left:0;right:0;height:70px;border-top:1px solid #ddd;display:flex;align-items:center;gap:20px;padding:0 24px}.carousel-controls button{border:1px solid #ccc;background:transparent;width:42px;height:42px;border-radius:50%;cursor:pointer;transition:.2s}.carousel-controls button:hover{background:#111;color:#fff;border-color:#111}.progress{height:2px;background:#ddd;flex:1}.progress i{display:block;width:25%;height:100%;background:#111;transition:transform .5s var(--ease)}
.shift{padding:160px 0}.shift-heading{display:grid;grid-template-columns:1fr 2fr;gap:50px}.shift-heading h2{grid-column:2;margin:0;font-size:clamp(68px,9vw,148px);font-weight:480;line-height:.87;letter-spacing:-.075em}.shift-heading>p:last-child{grid-column:2;max-width:570px;color:#999;font-size:20px;margin-top:45px}
.feature-grid{margin-top:100px;display:grid;grid-template-columns:1fr 1fr;gap:14px}.feature-card{min-height:540px;background:#141414;border:1px solid #292929;border-radius:20px;padding:32px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.feature-wide{grid-column:1/-1;min-height:600px}.feature-index{font:12px/1 monospace;color:#777}.feature-card div>p{color:var(--green);text-transform:uppercase;font-size:11px;letter-spacing:.16em}.feature-card h3{font-size:clamp(42px,5vw,80px);line-height:.93;letter-spacing:-.06em;font-weight:480;margin:12px 0}.feature-card div>span{color:#777}.card-orbit{position:absolute;right:5%;top:50%;width:42%;aspect-ratio:1;border:1px solid #333;border-radius:50%;transform:translateY(-50%);animation:rotate 20s linear infinite}.card-orbit:before,.card-orbit:after{content:"";position:absolute;inset:16%;border:1px solid #333;border-radius:50%}.card-orbit:after{inset:34%}.card-orbit i{position:absolute;width:22px;height:22px;background:var(--green);border-radius:50%}.card-orbit i:nth-child(1){left:50%;top:-11px}.card-orbit i:nth-child(2){left:8%;bottom:18%}.card-orbit i:nth-child(3){right:3%;bottom:25%}@keyframes rotate{to{transform:translateY(-50%) rotate(360deg)}}
.route-line{height:2px!important;background:#333;margin:100px 10px 50px;position:relative}.route-line i{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--green);top:-5px}.route-line i:last-child{right:0}.route-line b{position:absolute;width:42%;height:2px;background:var(--green);animation:route 3s ease-in-out infinite}@keyframes route{0%{left:0;width:0}50%{left:0;width:100%}100%{left:100%;width:0}}
.document-stack{position:absolute!important;right:-5%;top:15%;width:62%;height:60%}.document-stack i{position:absolute;inset:0;background:#f1f1ec;border:1px solid #aaa;border-radius:15px;transform:rotate(-8deg)}.document-stack i:nth-child(2){transform:rotate(-2deg);inset:6%}.document-stack i:nth-child(3){transform:rotate(5deg);inset:12%;background:linear-gradient(#fff 12%,#d4d4ce 12% 13%,#fff 13% 24%,#d4d4ce 24% 25%,#fff 25%)}
.press{padding:125px 0;background:#f4f4f0;border-bottom:1px solid var(--line);overflow:hidden}.press h2{font-size:clamp(70px,9vw,145px);font-weight:480;letter-spacing:-.075em;margin:0}.press-track{margin-top:100px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}.press-track>div{display:flex;align-items:center;width:max-content;animation:press 28s linear infinite}.press-track a,.press-track span{width:320px;height:170px;display:grid;place-items:center;text-align:center;border-right:1px solid var(--line);font-size:28px;font-weight:650;line-height:.9}.press-track a:nth-child(2),.press-track span:nth-child(6){font-size:50px;font-weight:500}.press-track a:nth-child(4),.press-track span:nth-child(8){font-family:Georgia,serif;font-size:47px}.press-track a:hover{background:#fff}@keyframes press{to{transform:translateX(-50%)}}
.impact{padding:150px 0 120px}.impact-intro{display:grid;grid-template-columns:1fr 2fr;gap:50px}.impact h2{grid-column:2;margin:0;font-size:clamp(66px,8.5vw,140px);line-height:.87;letter-spacing:-.075em;font-weight:480}.impact-intro>p:last-child{grid-column:2;font-size:21px;color:#777;margin-top:36px}.stats-grid{margin-top:100px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.stats-grid article{padding:45px 28px 60px;border-right:1px solid var(--line)}.stats-grid article:last-child{border-right:0}.stats-grid strong{display:block;font-size:clamp(52px,5.2vw,84px);font-weight:500;letter-spacing:-.07em}.stats-grid h3{font-size:21px;margin:8px 0 45px}.stats-grid p{color:#777;font-size:14px;max-width:230px}
.site-footer{background:#080808;color:#fff;padding:150px 0 35px}.footer-cta{display:grid;grid-template-columns:1fr 2fr;gap:50px}.footer-cta h2{grid-column:2;font-size:clamp(76px,10vw,164px);line-height:.84;letter-spacing:-.08em;font-weight:470;margin:0}.footer-cta>p:nth-of-type(2){grid-column:2;color:#8a8a84;max-width:520px;font-size:19px;margin-top:40px}.footer-call{grid-column:2;justify-self:start;margin-top:20px;gap:45px;min-width:300px}.footer-call b{font-weight:450;color:#777}.footer-bottom{margin-top:180px;padding-top:35px;border-top:1px solid #2d2d2d;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:end}.brand-light{color:#fff}.footer-bottom>p{color:#8a8a84;margin:0}.legal{text-align:right;color:#777;font-size:12px}.legal a{margin-left:14px;color:#aaa}.legal a:hover{text-decoration:underline}
.reveal{opacity:0;transform:translateY(38px);transition:opacity .85s var(--ease),transform .85s var(--ease)}.reveal.in-view{opacity:1;transform:none}
:focus-visible{outline:2px solid var(--green);outline-offset:4px}
html[data-view="mobile"]{--shell:calc(100vw - 40px)}:where(html[data-view="mobile"]) .desktop-nav, :where(html[data-view="mobile"]) .header-actions{display:none}:where(html[data-menu="drawer"]) .menu-button{display:block}:where(html[data-view="mobile"]) .hero{min-height:880px}:where(html[data-view="mobile"]) .hero-grid{grid-template-columns:1.2fr .8fr}:where(html[data-view="mobile"]) .hero h1{grid-column:1}:where(html[data-view="mobile"]) .hero-copy{grid-column:2}:where(html[data-view="mobile"]) .hero-person{width:480px;top:140px}:where(html[data-view="mobile"]) .hero-device{top:480px;width:88vw}:where(html[data-view="mobile"]) .call-pill{top:440px}:where(html[data-view="mobile"]) .manifesto-grid, :where(html[data-view="mobile"]) .shift-heading, :where(html[data-view="mobile"]) .impact-intro, :where(html[data-view="mobile"]) .footer-cta{grid-template-columns:1fr}:where(html[data-view="mobile"]) .manifesto h2, :where(html[data-view="mobile"]) .manifesto-copy, :where(html[data-view="mobile"]) .manifesto .pill, :where(html[data-view="mobile"]) .shift-heading h2, :where(html[data-view="mobile"]) .shift-heading>p:last-child, :where(html[data-view="mobile"]) .impact h2, :where(html[data-view="mobile"]) .impact-intro>p:last-child, :where(html[data-view="mobile"]) .footer-cta h2, :where(html[data-view="mobile"]) .footer-cta>p:nth-of-type(2), :where(html[data-view="mobile"]) .footer-call{grid-column:1}:where(html[data-view="mobile"]) .manifesto h2, :where(html[data-view="mobile"]) .shift-heading h2, :where(html[data-view="mobile"]) .impact h2, :where(html[data-view="mobile"]) .footer-cta h2{margin-top:40px}:where(html[data-view="mobile"]) .operations-head{grid-template-columns:1fr auto}:where(html[data-view="mobile"]) .operations-head h2{grid-column:1/-1;margin-top:38px}:where(html[data-view="mobile"]) .operation-slide{grid-template-columns:1fr 1fr}:where(html[data-view="mobile"]) .operation-copy{padding:38px}:where(html[data-view="mobile"]) .stats-grid{grid-template-columns:1fr 1fr}:where(html[data-view="mobile"]) .stats-grid article:nth-child(2){border-right:0}:where(html[data-view="mobile"]) .stats-grid article:nth-child(-n+2){border-bottom:1px solid var(--line)}
html[data-view="mobile"]{--shell:calc(100vw - 32px)}:where(html[data-view="mobile"]) .site-header{height:66px;padding:0 16px}:where(html[data-view="mobile"]) .hero{padding-top:105px;min-height:720px}:where(html[data-view="mobile"]) .hero-grid{display:block;min-height:590px}:where(html[data-view="mobile"]) .hero h1{font-size:49px}:where(html[data-view="mobile"]) .hero-copy{position:absolute;right:0;top:0;width:43%;font-size:11px;padding-left:16px}:where(html[data-view="mobile"]) .hero-copy strong{font-size:12px}:where(html[data-view="mobile"]) .hero-copy p{font-size:9px}:where(html[data-view="mobile"]) .hero-person{top:165px;width:300px}:where(html[data-view="mobile"]) .hero-device{top:365px;width:94vw;border-width:4px;border-radius:16px}:where(html[data-view="mobile"]) .call-pill{top:340px;width:135px;height:40px;font-size:12px}:where(html[data-view="mobile"]) .scroll-cue{height:44px}:where(html[data-view="mobile"]) .manifesto{padding-top:100px}:where(html[data-view="mobile"]) .manifesto h2{font-size:62px}:where(html[data-view="mobile"]) .manifesto-copy{grid-template-columns:1fr;gap:18px;margin-top:45px;font-size:16px}:where(html[data-view="mobile"]) .manifesto .pill{width:100%;justify-content:space-between}:where(html[data-view="mobile"]) .ticker{margin-top:85px}:where(html[data-view="mobile"]) .operations{padding:95px 0}:where(html[data-view="mobile"]) .operations-head h2{font-size:59px}:where(html[data-view="mobile"]) .operation-stage{margin-top:55px;min-height:950px}:where(html[data-view="mobile"]) .operation-slide{grid-template-columns:1fr;grid-template-rows:auto 1fr;bottom:70px}:where(html[data-view="mobile"]) .operation-copy{padding:28px;border-right:0;border-bottom:1px solid #ddd}:where(html[data-view="mobile"]) .operation-copy h3{font-size:44px;margin-top:24px}:where(html[data-view="mobile"]) .detail{margin-top:38px}:where(html[data-view="mobile"]) .operation-visual{min-height:350px;margin:14px}:where(html[data-view="mobile"]) .visual-price{padding:30px}:where(html[data-view="mobile"]) .visual-price>strong{font-size:72px}:where(html[data-view="mobile"]) .feature-grid{grid-template-columns:1fr}:where(html[data-view="mobile"]) .feature-wide{grid-column:auto}:where(html[data-view="mobile"]) .feature-card, :where(html[data-view="mobile"]) .feature-wide{min-height:500px}:where(html[data-view="mobile"]) .card-orbit{width:76%;right:-24%;top:36%}:where(html[data-view="mobile"]) .document-stack{width:85%;right:-30%;top:24%}:where(html[data-view="mobile"]) .press{padding:90px 0}:where(html[data-view="mobile"]) .press h2{font-size:70px}:where(html[data-view="mobile"]) .press-track{margin-top:60px}:where(html[data-view="mobile"]) .press-track a, :where(html[data-view="mobile"]) .press-track span{width:240px;height:135px}:where(html[data-view="mobile"]) .impact{padding:95px 0}:where(html[data-view="mobile"]) .impact h2{font-size:61px}:where(html[data-view="mobile"]) .stats-grid{grid-template-columns:1fr}:where(html[data-view="mobile"]) .stats-grid article{border-right:0!important;border-bottom:1px solid var(--line)}:where(html[data-view="mobile"]) .stats-grid article:last-child{border-bottom:0}:where(html[data-view="mobile"]) .site-footer{padding-top:100px}:where(html[data-view="mobile"]) .footer-cta h2{font-size:70px}:where(html[data-view="mobile"]) .footer-call{width:100%;justify-content:space-between}:where(html[data-view="mobile"]) .footer-bottom{margin-top:110px;grid-template-columns:1fr;gap:38px}:where(html[data-view="mobile"]) .legal{text-align:left;display:flex;flex-wrap:wrap;gap:12px}:where(html[data-view="mobile"]) .legal a{margin:0}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}
.hero-person video{width:100%;aspect-ratio:1.9;object-fit:cover;object-position:center;filter:saturate(.82);mix-blend-mode:multiply}
.brand-image{display:block;width:164px;height:auto}
.meet{height:854px;background:#f7f7f4;color:#090909;overflow:hidden}
.meet-inner{position:relative;width:min(1000px,calc(100vw - 48px));height:100%;margin:0 auto;padding-top:105px;text-align:center}
.meet-kicker{margin:0 0 20px;font-family:var(--font-eyebrow);font-size:13px;font-weight:500;letter-spacing:-.6px;color:#74746f;text-transform:uppercase}
.meet h2{margin:0;font-family:var(--font-display);font-size:53px;line-height:1.05;letter-spacing:-.036em;font-weight:600}
.meet-line{position:relative;width:1px;height:90px;margin:14px auto;background:#cacac4}
.meet-line i{position:absolute;left:-3px;width:7px;height:7px;border-radius:50%;background:#008b5c}.meet-line i:first-child{top:0}.meet-line i:last-child{bottom:0}
.founder-card{width:880px;height:288px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;padding:10px;border-radius:27px;background:#e8e8e3;box-shadow:0 1px 0 rgba(0,0,0,.08)}
.founder-photo,.founder-terminal{border-radius:18px;overflow:hidden}
.founder-photo{position:relative;background:#fff;display:flex;align-items:flex-end;justify-content:center}
.founder-photo img,.founder-video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.founder-video{background:#fff}
.founder-play{position:absolute;z-index:2;left:50%;top:50%;display:inline-flex;align-items:center;gap:10px;height:46px;padding:0 20px 0 12px;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:linear-gradient(100deg,rgba(120,120,120,.5),rgba(35,35,35,.58));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font-size:15px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;box-shadow:0 12px 30px rgba(0,0,0,.24);transform:translate(-50%,-50%);cursor:pointer;transition:opacity .22s ease,transform .22s ease,background .22s ease}.founder-play__icon{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fff;color:#141414}
.founder-play__icon svg{width:16px;height:16px;margin-left:1px}.founder-play:hover{transform:translate(-50%,-50%) scale(1.05)}.founder-play:focus-visible{outline:2px solid #00573f;outline-offset:4px}.founder-play:disabled{cursor:wait;opacity:.65}
.founder-photo.is-playing .founder-play{opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.86)}
.founder-terminal{background:#191919;color:#fff;border:1px solid #080808;box-shadow:inset 0 0 0 4px #282828;text-align:left;padding:37px 32px 24px;display:flex;flex-direction:column;justify-content:space-between;font-family:var(--font-eyebrow)}
.founder-terminal p{margin:0;font-size:16px;color:#e8e8e2;white-space:nowrap}.founder-terminal p i{display:inline-block;width:2px;height:18px;background:#deded8;margin-left:3px;vertical-align:-3px;animation:cursorBlink .8s steps(1) infinite}
.founder-terminal strong{font-size:14px;font-weight:400;white-space:nowrap;color:#e7e7e1}
.meet-line-top{height:160px}
.meet-line-bottom{height:90px;margin-top:38px}
@keyframes cursorBlink{50%{opacity:0}}

/* Live-site reference geometry: the opening composition stays narrow and centered. */

:where(html[data-view="mobile"]) .meet{height:720px}:where(html[data-view="mobile"]) .meet-inner{padding-top:75px}:where(html[data-view="mobile"]) .meet h2{font-size:34px}:where(html[data-view="mobile"]) .meet-line{height:65px}:where(html[data-view="mobile"]) .founder-card{width:100%;height:360px;grid-template-columns:1fr;grid-template-rows:1fr 1fr}:where(html[data-view="mobile"]) .founder-terminal{padding:24px 20px}:where(html[data-view="mobile"]) .founder-terminal p{font-size:13px}:where(html[data-view="mobile"]) .founder-terminal strong{font-size:11px;white-space:normal}:where(html[data-view="mobile"]) .meet-line-bottom{display:none}

/* Operations — measured against the live 1280px tablet composition. */
.operations{padding:0;background:#f7f7f4;min-height:1209px;overflow:visible}
.flow-heading{height:120px;width:100%;display:grid;place-items:center;position:relative;transform:translateY(-98px);margin-bottom:-98px}
.flow-heading h2{width:min(760px,calc(100vw - 40px));margin:0;text-align:center;font-family:var(--font-display);font-size:44px;line-height:1.05;letter-spacing:-.036em;font-weight:600}
.flow-heading h2 span{color:#dcdcd7;transition:color .5s var(--ease)}.flow-heading h2.in-view span{animation:flowWord 1.05s var(--ease) forwards}.flow-heading h2.in-view span:nth-child(2){animation-delay:.11s}.flow-heading h2.in-view span:nth-child(3){animation-delay:.22s}.flow-heading h2.in-view span:nth-child(4){animation-delay:.33s}.flow-heading h2.in-view span:nth-child(5){animation-delay:.44s}.flow-heading h2.in-view span:nth-child(6){animation-delay:.55s}@keyframes flowWord{0%{color:#dcdcd7}45%{color:#a51c30}100%{color:#090909}}
.system-block{height:1209px;padding-top:41px;border-bottom:1px solid #deded8}
.system-tablet{width:800px;height:1161px;margin:0 auto;background:#e9e9e4;border-radius:27px;padding:10px;overflow:hidden}
.system-tabs{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 3px 0 13px}
.system-tab-label{display:flex;align-items:center;gap:10px;font-family:var(--font-eyebrow)}.system-tab-label b{border:1px solid #009565;color:#006c4a;border-radius:3px;padding:2px 5px;font-size:11px}.system-tab-label span{font-size:14px;letter-spacing:.05em}
.system-arrows{display:flex;gap:7px}.system-arrows button{width:40px;height:40px;border:0;border-radius:7px;background:#090909;color:#fff;cursor:pointer}.system-arrows button:disabled{background:#bdbdb8;color:#f3f3ef;cursor:not-allowed}
.system-content{height:1089px;background:#f8f8f5;border-radius:19px;overflow:hidden;padding-top:10px}
.system-video{height:590px;background:#171717;position:relative;overflow:hidden}.system-video video{width:100%;height:100%;object-fit:cover;display:block}
.system-video-caption{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:454px;height:190px;border-radius:18px;background:rgba(16,16,16,.86);backdrop-filter:blur(12px);display:flex;align-items:flex-start;justify-content:space-between;padding:28px;color:#fff;font-family:monospace}.system-video-caption span{font-size:14px}.system-video-caption i{width:2px;height:132px;background:#d8d8d2;opacity:.65}
.system-video>.operation-background{width:100%;height:100%;object-fit:cover;display:block;background:#000}.system-video>img[hidden]{display:none}
.system-video video[hidden],.system-video .sell-status[hidden],.system-video .operation-overlay[hidden]{display:none!important}
.operation-overlay{position:absolute;left:50%;top:50%;height:auto;object-fit:contain;pointer-events:none;transform:translate(-50%,-50%);filter:drop-shadow(0 18px 25px rgba(0,0,0,.15));will-change:transform,opacity}
.operation-overlay--procure{width:min(58%,466px)}
.operation-overlay--dispose{width:min(50%,405px)}
.operation-overlay--refurbish{width:min(38%,305px);max-height:92%}
.operation-overlay.is-entering{animation:operationOverlayIn .38s cubic-bezier(.22,1,.36,1) both}
@keyframes operationOverlayIn{from{opacity:0;transform:translate(-50%,-46%) scale(.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.sell-status{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:466px;font-family:Geist,Arial,sans-serif;filter:drop-shadow(0 18px 26px rgba(0,0,0,.18))}
.order-status{height:100px;padding:14px 17px;display:grid;grid-template-columns:22px 1fr auto;gap:8px;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.8);border-radius:17px 17px 11px 11px;color:#343434}.order-status>i{width:18px;height:18px;border:1px solid #c4c4bf;border-radius:50%;margin-top:2px}.order-status div{display:flex;flex-direction:column;align-items:flex-start}.order-status strong{font-size:17px;line-height:1}.order-status b{font-size:17px;line-height:1.1;font-weight:500}.order-status span{font-size:12px;color:#22a75a;background:#ddf4e4;border-radius:4px;padding:3px 12px;margin-top:7px}.order-status time{font-size:11px;color:#aaa}
.next-command{height:74px;margin:0 9px;padding:9px 9px 9px 16px;background:rgba(18,18,18,.9);backdrop-filter:blur(12px);border:1px solid #555;border-radius:10px 10px 17px 17px;color:#fff;display:flex;align-items:center;gap:11px}.clipboard-icon{font-size:16px;color:#ddd}.next-command code{font:14px/1 var(--font-eyebrow);flex:1}.next-command code i{display:inline-block;width:1px;height:18px;background:#eee;vertical-align:-4px;margin-left:3px;animation:cursorBlink .8s steps(1) infinite}.next-command button{width:48px;height:48px;border:0;border-radius:10px;background:#fff;color:#111;font-size:21px;cursor:pointer;transition:transform .2s var(--ease)}.next-command button:hover{transform:scale(.96)}
.system-content.is-changing{opacity:.2;transform:scale(.992)}.system-content{transition:opacity .2s ease,transform .2s ease}
.desktop-operation-tabs{display:none}
.system-copy{height:471px;margin-top:8px;padding:38px;background:#f8f8f5}
.system-copy-head{min-height:168px;display:grid;grid-template-columns:1fr auto;gap:28px;border-bottom:1px solid #d8d8d2}.system-copy-head h3{font-family:var(--font-display);font-size:44px;line-height:1.08;letter-spacing:-.04em;font-weight:600;margin:0 0 12px;max-width:550px}.system-copy-head p{margin:0;color:#676762;font-size:15px}.system-copy-head .op-cta>a{font-size:13px;font-weight:600;white-space:nowrap}.system-copy-head .op-cta>a span{color:#fff;margin-left:6px}
.op-cta{position:relative;display:inline-flex}
.system-copy-head .op-cta{align-self:end;justify-self:end;margin-bottom:30px}
.system-copy-head .op-cta>a{margin-bottom:0}
.op-cta>a[role="button"]{cursor:pointer}
.op-cta>a span{display:inline-flex;align-items:center}
.op-cta>a span svg{width:12px;height:12px;display:block}
.op-cta.is-open>a span{transform:rotate(180deg)}
.op-cta-menu{position:absolute;top:calc(100% + 11px);left:0;min-width:238px;background:#fff;border:1px solid #e7e7e1;border-radius:20px;padding:8px;box-shadow:0 20px 46px rgba(15,15,15,.16);display:flex;flex-direction:column;z-index:40;opacity:0;transform:translateY(-6px);transition:opacity .15s ease,transform .15s ease;pointer-events:none}
.op-cta-menu[hidden]{display:none}
.op-cta.is-open .op-cta-menu{opacity:1;transform:none;pointer-events:auto}
.op-cta-menu::before{content:"";position:absolute;top:-7px;left:var(--cta-tail,34px);transform:translateX(-50%) rotate(45deg);width:14px;height:14px;background:#fff;border-left:1px solid #e7e7e1;border-top:1px solid #e7e7e1;border-radius:4px 0 0 0}
.op-cta-menu .op-cta-menu__item{position:relative;display:flex;align-items:center;gap:15px;padding:13px 16px;border-radius:14px;text-decoration:none;background:transparent;white-space:nowrap}
.op-cta-menu .op-cta-menu__item:hover,.op-cta-menu .op-cta-menu__item:focus-visible{background:#f1f1ec;outline:none}
.op-cta-menu__icon{flex:0 0 26px;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center}
.op-cta-menu__icon svg{width:100%;height:100%}
.op-cta-menu__label{flex:1;font-size:16px;font-weight:600;letter-spacing:-.02em;color:#0b0b0b}
.op-cta-menu__chev{display:inline-flex;color:#111}
.op-cta-menu__chev svg{width:16px;height:16px}
.op-cta-menu__item--metal .op-cta-menu__icon{color:#1a8a68}
.op-cta-menu__item--plastic .op-cta-menu__icon{color:#1d6fd8}
.op-cta-menu__item--electronics .op-cta-menu__icon{color:#e8731b}
.system-detail{min-height:80px;padding:18px 0;display:grid;grid-template-columns:205px 1fr;gap:26px;border-bottom:1px solid #d8d8d2}.system-detail h4{font-size:14px;margin:0}.system-detail p{font-size:13px;line-height:1.35;color:#696964;margin:0}
:where(html[data-view="mobile"]) .operations{min-height:1050px}:where(html[data-view="mobile"]) .flow-heading{transform:translateY(-45px);margin-bottom:-45px;height:90px}:where(html[data-view="mobile"]) .flow-heading h2{font-size:31px}:where(html[data-view="mobile"]) .system-block{height:1005px;padding-top:25px}:where(html[data-view="mobile"]) .system-tablet{width:calc(100vw - 24px);height:980px;border-radius:20px;padding:7px}:where(html[data-view="mobile"]) .system-tabs{height:55px}:where(html[data-view="mobile"]) .system-content{height:911px}:where(html[data-view="mobile"]) .system-video{height:390px}:where(html[data-view="mobile"]) .system-video-caption{width:80%;height:135px}:where(html[data-view="mobile"]) .system-video-caption i{height:80px}:where(html[data-view="mobile"]) .system-copy{height:521px;padding:24px 20px}:where(html[data-view="mobile"]) .system-copy-head{grid-template-columns:1fr;gap:10px}:where(html[data-view="mobile"]) .system-copy-head h3{font-size:35px}:where(html[data-view="mobile"]) .system-copy-head .op-cta{align-self:start;justify-self:start;margin:0 0 18px}:where(html[data-view="mobile"]) .system-detail{grid-template-columns:1fr;gap:8px}


  :where(html[data-view="desktop"]) .operations{min-height:820px}
  :where(html[data-view="desktop"]) .flow-heading{height:106px;transform:none;margin:0}
  :where(html[data-view="desktop"]) .flow-heading h2{font-size:32px;width:auto}
  :where(html[data-view="desktop"]) .system-block{height:714px;padding-top:0;border-bottom:0}
  :where(html[data-view="desktop"]) .desktop-operation-tabs{width:724px;height:43px;margin:0 auto 34px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
  :where(html[data-view="desktop"]) .desktop-operation-tabs button{height:43px;border:0;border-bottom:2px solid #d8d8d3;background:transparent;font:13px/1 monospace;color:#999;display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;transition:.2s}
  :where(html[data-view="desktop"]) .desktop-operation-tabs button b{width:16px;height:16px;border:1px solid #aaa;border-radius:4px;font-size:10px;display:grid;place-items:center;font-weight:400}
  :where(html[data-view="desktop"]) .desktop-operation-tabs button[aria-selected=true]{border-bottom:2px solid #007c59;color:#111}
  :where(html[data-view="desktop"]) .desktop-operation-tabs button[aria-selected=true] b{border-color:#008b63;color:#006d4d}
  :where(html[data-view="desktop"]) .system-tablet{width:1152px;height:540px;padding:8px;border-radius:29px;background:#e8e8e4}
  :where(html[data-view="desktop"]) .system-tabs{display:none}
  :where(html[data-view="desktop"]) .system-content{height:524px;padding:0;display:grid;grid-template-columns:390px 1fr;gap:8px;background:transparent;border-radius:21px;overflow:visible}
  :where(html[data-view="desktop"]) .system-video{grid-column:2;grid-row:1;width:auto;height:524px;border-radius:20px;overflow:hidden}
  :where(html[data-view="desktop"]) .system-copy{grid-column:1;grid-row:1;width:auto;height:524px;margin:0;padding:31px 30px 28px;background:#fff;border:1px solid #bdbdb8;border-radius:20px;display:flex;flex-direction:column}
  :where(html[data-view="desktop"]) .system-copy-head{display:block;min-height:0;border:0}
  :where(html[data-view="desktop"]) .operation-mode-icon{display:block;width:24px;height:24px;margin-bottom:16px;object-fit:contain}
  :where(html[data-view="desktop"]) .system-copy-head h3{font-size:22px;line-height:1.08;letter-spacing:-.035em;max-width:250px;margin:0 0 12px}
  :where(html[data-view="desktop"]) .system-copy-head p{font:13px/1.35 monospace;color:#006d51;max-width:265px;margin-bottom:21px}
  :where(html[data-view="desktop"]) .system-copy-head .op-cta>a{display:inline-flex;align-items:center;background:#050505;color:#fff;border-radius:999px;padding:0 16px;height:29px;margin:0;font-size:11px;width:max-content}
  :where(html[data-view="desktop"]) .system-copy-head .op-cta{align-self:auto;justify-self:auto;margin:0;margin-bottom:21px}
  :where(html[data-view="desktop"]) .system-detail{display:block;min-height:0;padding:18px 0;border-bottom:1px solid #ddd}
  :where(html[data-view="desktop"]) .system-detail:first-of-type{margin-top:auto}
  :where(html[data-view="desktop"]) .system-detail:last-child{border-bottom:0;padding-bottom:0}
  :where(html[data-view="desktop"]) .system-detail h4{font-size:11px;margin:0 0 10px}
  :where(html[data-view="desktop"]) .system-detail p{font-size:11px;line-height:1.3;max-width:290px}
  :where(html[data-view="desktop"]) .sell-status{width:378px}
  :where(html[data-view="desktop"]) .order-status{height:80px;padding:11px 13px}:where(html[data-view="desktop"]) .order-status strong, :where(html[data-view="desktop"]) .order-status b{font-size:14px}:where(html[data-view="desktop"]) .order-status span{font-size:10px;margin-top:4px}:where(html[data-view="desktop"]) .next-command{height:59px;padding:7px 7px 7px 12px}:where(html[data-view="desktop"]) .next-command button{width:40px;height:40px}:where(html[data-view="desktop"]) .next-command code{font-size:12px}
  :where(html[data-view="desktop"]) .operation-overlay--procure{width:354px}
  :where(html[data-view="desktop"]) .operation-overlay--dispose{width:360px}
  :where(html[data-view="desktop"]) .operation-overlay--refurbish{width:298px;max-height:500px}


@media(prefers-reduced-motion:reduce){.operation-overlay.is-entering{animation:none}}

/* Today’s Reality — measured from the live desktop section. */
.reality-intro{height:480px;background:#f7f7f4;position:relative;display:grid;grid-template-rows:112px 1fr 112px;overflow:hidden}
.reality-intro-copy{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.reality-intro h2{margin:0;font-family:"Bricolage Grotesque",Arial,sans-serif;font-size:43px;font-weight:500;line-height:1.1;letter-spacing:-.045em}
.reality-intro p{margin:25px 0 0;font:500 16px/1.3 Geist,Arial,sans-serif;color:rgba(0,0,0,.56)}
.reality-intro p strong,.reality-intro p span{color:#292929}
.reality-connector{position:relative;width:1px;height:100%;justify-self:center;background:#d3d3ce}
.reality-connector i{position:absolute;left:50%;width:4px;height:4px;border-radius:50%;background:#007b57;transform:translateX(-50%)}
.reality-connector i:first-child{top:0}.reality-connector i:last-child{bottom:0}
.reality-connector-top{align-self:end;height:70px}.reality-connector-bottom{align-self:start;height:70px}
.reality-story{height:208vh;min-height:1500px;background:#f8f8f6;position:relative}
.reality-sticky{height:100vh;position:sticky;top:0;overflow:hidden;background:#f7f7f4}
.reality-video{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;background:#f7f7f4;-webkit-mask-image:linear-gradient(0deg,rgba(0,0,0,0) 4%,#000 19%,#000 89.17%,rgba(0,0,0,0) 97.43%);mask-image:linear-gradient(0deg,rgba(0,0,0,0) 4%,#000 19%,#000 89.17%,rgba(0,0,0,0) 97.43%)}
.reality-terminal{position:absolute;z-index:2;left:50%;bottom:62px;transform:translateX(-50%);width:621px;height:100px;padding:10px;border:5px solid #050505;border-radius:14px;background:#1d1d1d;color:#f4f4ef;box-shadow:0 22px 34px rgba(0,0,0,.25);font-family:var(--font-eyebrow)}
.reality-type{height:39px;padding:5px 8px;font-size:12px;display:flex;align-items:flex-start}.reality-type i{display:inline-block;width:1px;height:14px;background:#fff;margin-left:3px;animation:cursorBlink .78s steps(1) infinite}
.reality-terminal-bottom{height:31px;display:flex;align-items:center;gap:8px}.reality-terminal-bottom>strong{padding-left:8px;font-size:11px;letter-spacing:.01em;flex:1;color:#d7dfda}.reality-progress-current{color:#fff;font-weight:500}.reality-progress-total{color:rgba(255,255,255,.45);font-weight:400}.reality-restart{min-width:44px;min-height:44px;border:0;background:transparent;color:#fff;font:500 15px/1 var(--font-control);text-decoration:underline;cursor:pointer;padding:8px}
.reality-arrows{display:flex;gap:6px}.reality-arrows button{width:46px;height:32px;border:0;border-radius:6px;background:#f0e8d8;color:#111;font-size:17px;cursor:pointer;box-shadow:0 3px 8px rgba(0,0,0,.28)}.reality-arrows button:disabled{background:#8f8d88;color:#353535;cursor:default}.reality-story.is-switching .reality-video{opacity:.25}.reality-video{transition:opacity .22s ease}
:where(html[data-view="mobile"]) .reality-intro{height:430px;grid-template-rows:95px 1fr 95px}:where(html[data-view="mobile"]) .reality-intro h2{font-size:34px}:where(html[data-view="mobile"]) .reality-intro p{font-size:13px}:where(html[data-view="mobile"]) .reality-story{min-height:1250px}:where(html[data-view="mobile"]) .reality-terminal{width:min(454px,calc(100vw - 32px));height:96px;bottom:38px;padding:8px}:where(html[data-view="mobile"]) .reality-type{height:42px}:where(html[data-view="mobile"]) .reality-arrows button{width:38px}
:where(html[data-view="mobile"]) .reality-intro{height:370px;grid-template-rows:75px 1fr 75px;padding:0 18px}:where(html[data-view="mobile"]) .reality-intro h2{font-size:30px}:where(html[data-view="mobile"]) .reality-intro p{font-size:12px;max-width:330px}:where(html[data-view="mobile"]) .reality-story{height:180vh;min-height:1100px}:where(html[data-view="mobile"]) .reality-video{object-position:center center}:where(html[data-view="mobile"]) .reality-terminal{bottom:24px;border-width:4px}:where(html[data-view="mobile"]) .reality-terminal-bottom>strong{font-size:9px}:where(html[data-view="mobile"]) .reality-restart{font-size:9px}:where(html[data-view="mobile"]) .reality-arrows button{width:34px;height:30px}

/* The Shift — measured from the live 1710px desktop layout. */
.shift-live{height:3398px;background:#f8f8f6;color:#000;position:relative;overflow:hidden}
.shift-live-heading{width:900px;height:311px;margin:33px auto 0;display:flex;flex-direction:column;align-items:center;text-align:center}
.shift-mark{display:block;width:23px;height:21px;margin:0 0 37px;object-fit:contain;transform-origin:50% 50%;animation:shiftMarkSpin 3.2s linear infinite;will-change:transform}
@keyframes shiftMarkSpin{to{transform:rotate(360deg)}}
.shift-live-heading h2{margin:0;font:500 43px/1.1 "Bricolage Grotesque",Arial,sans-serif;letter-spacing:-.045em}
.shift-with{margin:37px 0 0;color:#00573f;font:500 17px/1.3 "Bricolage Grotesque",Arial,sans-serif}
.shift-promise{margin:12px 0 0;color:rgba(0,0,0,.56);font:500 16px/1.3 Geist,Arial,sans-serif}.shift-promise strong{color:#1b1b1b}
.shift-story{height:2843px;position:relative}
.shift-paper-video{display:block;width:100%;height:978px;object-fit:cover;background:#f8f8f6}
.shift-panels{position:relative;z-index:2;width:100%;margin-top:-232px;padding-bottom:260px;background:linear-gradient(to bottom,transparent 0,transparent 158px,#050505 158px,#050505 100%)}
.shift-panel{width:1180px;height:545px;margin:0 auto;display:grid;grid-template-columns:405px 767px;gap:8px;border-radius:28px;overflow:hidden;position:relative}
.shift-panel-copy{height:545px;padding:38px;background:#1f1f1f;border:1px solid #484848;border-radius:28px;color:#fff;display:flex;flex-direction:column;justify-content:space-between}
.shift-panel-copy h3{margin:0;font:500 26px/1.2 "Bricolage Grotesque",Arial,sans-serif;letter-spacing:-.025em}
.shift-panel-tag{margin:10px 0 0;color:#d9e8e2;font:500 16px/1.3 "Kode Mono",monospace}
.shift-panel-detail h4{margin:0 0 12px;color:#fff;font:600 11px/1.25 Geist,Arial,sans-serif}.shift-panel-detail p{margin:0;color:rgba(255,255,255,.48);font:500 13px/1.4 Geist,Arial,sans-serif}
.shift-panel-media{height:545px;border-radius:28px;overflow:hidden;position:relative;background:#030708}.shift-panel-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.shift-overlay{position:absolute;z-index:2;left:21.6%;width:56.8%;height:auto}.shift-overlay-trust{top:16.5%}.shift-overlay-records{top:23.3%}
.shift-overlay-logistics{position:absolute;z-index:2;left:21.6%;top:15.3%;width:56.8%;display:flex;flex-direction:column;gap:46px}.shift-overlay-logistics img{width:100%;height:auto}
.shift-panel-rails{width:1180px;height:101px;margin:0 auto;position:relative;background:#050505}.shift-panel-rails i{position:absolute;top:32px;width:1px;height:37px;background:#315b50}.shift-panel-rails i:before,.shift-panel-rails i:after{content:"";position:absolute;left:50%;width:5px;height:5px;border-radius:50%;background:#006f51;transform:translateX(-50%)}.shift-panel-rails i:before{top:0}.shift-panel-rails i:after{bottom:0}.shift-panel-rails i:first-child{left:17%}.shift-panel-rails i:last-child{left:67%}
.shift-end-connector{width:1px;height:160px;margin:0 auto;position:absolute;bottom:50px;left:50%;background:#d2d2cc}.shift-end-connector i{position:absolute;left:50%;width:4px;height:4px;border-radius:50%;background:#007b57;transform:translateX(-50%)}.shift-end-connector i:first-child{top:0}.shift-end-connector i:last-child{bottom:0}
.page-bottom-button{position:fixed;z-index:80;right:24px;bottom:24px;width:48px;height:48px;border:0;border-radius:50%;background:#16160f;color:#fff;font-size:23px;cursor:pointer;box-shadow:0 10px 24px rgba(0,0,0,.18);opacity:0;pointer-events:none;transform:translateY(12px);transition:.25s var(--ease)}.page-bottom-button.is-visible{opacity:1;pointer-events:auto;transform:none}.page-bottom-button:hover{transform:translateY(2px)}
.reality-arrows button.is-final{background:#d83d48;color:#fff;box-shadow:inset 0 0 0 1px #fff,0 3px 8px rgba(0,0,0,.28)}
:where(html[data-view="mobile"]) .shift-live{height:auto;min-height:2900px}:where(html[data-view="mobile"]) .shift-live-heading{width:min(900px,calc(100vw - 40px));height:280px;margin-top:28px}:where(html[data-view="mobile"]) .shift-live-heading h2{font-size:34px}:where(html[data-view="mobile"]) .shift-with{font-size:14px;margin-top:27px}:where(html[data-view="mobile"]) .shift-promise{font-size:13px}:where(html[data-view="mobile"]) .shift-story{height:auto}:where(html[data-view="mobile"]) .shift-paper-video{height:720px}:where(html[data-view="mobile"]) .shift-panels{margin-top:-170px;padding:0 20px 210px}:where(html[data-view="mobile"]) .shift-panel, :where(html[data-view="mobile"]) .shift-panel-rails{width:min(100%,980px)}:where(html[data-view="mobile"]) .shift-panel{height:500px;grid-template-columns:36% 64%;gap:7px}:where(html[data-view="mobile"]) .shift-panel-copy, :where(html[data-view="mobile"]) .shift-panel-media{height:500px}:where(html[data-view="mobile"]) .shift-panel-copy{padding:30px}:where(html[data-view="mobile"]) .shift-panel-copy h3{font-size:23px}:where(html[data-view="mobile"]) .shift-panel-tag{font-size:13px}:where(html[data-view="mobile"]) .shift-panel-detail p{font-size:11px}:where(html[data-view="mobile"]) .shift-panel-rails{height:85px}:where(html[data-view="mobile"]) .shift-panel-rails i{top:25px;height:35px}:where(html[data-view="mobile"]) .shift-end-connector{height:120px}
:where(html[data-view="mobile"]) .shift-live-heading{height:270px;margin-top:22px}:where(html[data-view="mobile"]) .shift-mark{margin-bottom:28px}:where(html[data-view="mobile"]) .shift-live-heading h2{font-size:29px}:where(html[data-view="mobile"]) .shift-paper-video{height:520px;object-position:center}:where(html[data-view="mobile"]) .shift-panels{margin-top:-90px;padding:0 12px 150px;background:linear-gradient(to bottom,transparent 0,transparent 70px,#050505 70px,#050505 100%)}:where(html[data-view="mobile"]) .shift-panel{height:auto;display:flex;flex-direction:column;gap:7px;border-radius:22px}:where(html[data-view="mobile"]) .shift-panel-copy{width:100%;height:370px;border-radius:22px;padding:26px}:where(html[data-view="mobile"]) .shift-panel-media{width:100%;height:390px;border-radius:22px}:where(html[data-view="mobile"]) .shift-panel-copy h3{font-size:25px}:where(html[data-view="mobile"]) .shift-panel-tag{font-size:14px}:where(html[data-view="mobile"]) .shift-panel-detail p{font-size:12px}:where(html[data-view="mobile"]) .shift-panel-rails{height:80px}:where(html[data-view="mobile"]) .shift-panel-rails i:first-child{left:25%}:where(html[data-view="mobile"]) .shift-panel-rails i:last-child{left:75%}:where(html[data-view="mobile"]) .page-bottom-button{right:14px;bottom:14px;width:44px;height:44px}:where(html[data-view="mobile"]) .shift-end-connector{display:none}

/* Pixel transition and Featured In — copied from the measured live module. */
.shift-end-connector{display:block;width:1180px;height:101px;position:absolute;left:50%;bottom:370px;transform:translateX(-50%);margin:0;background:transparent}
.shift-end-connector i{position:absolute;top:32px;width:1px;height:37px;background:#315b50;transform:none}.shift-end-connector i:before,.shift-end-connector i:after{content:"";position:absolute;left:50%;width:5px;height:5px;border-radius:50%;background:#006f51;transform:translateX(-50%)}.shift-end-connector i:before{top:0}.shift-end-connector i:after{bottom:0}.shift-end-connector i:first-child{left:17%}.shift-end-connector i:last-child{left:67%}
.pixel-transition{position:absolute;z-index:4;left:0;right:0;bottom:0;width:100%;height:calc(100vw / 8);max-height:211px;display:grid;grid-template-columns:repeat(32,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));background:#fafafa;overflow:hidden;transform:translateZ(0)}.pixel-transition i{display:block;min-width:0;min-height:0;background:transparent}.pixel-transition i.is-black{background:#050505;opacity:0;transition:opacity .4s cubic-bezier(.34,1.15,.64,1);will-change:opacity}.pixel-transition[data-stage="1"] i.is-black[data-reveal-step="1"],.pixel-transition[data-stage="2"] i.is-black[data-reveal-step="1"],.pixel-transition[data-stage="2"] i.is-black[data-reveal-step="2"],.pixel-transition[data-stage="3"] i.is-black[data-reveal-step="1"],.pixel-transition[data-stage="3"] i.is-black[data-reveal-step="2"],.pixel-transition[data-stage="3"] i.is-black[data-reveal-step="3"],.pixel-transition[data-stage="4"] i.is-black{opacity:1}
/* The black backdrop above the dissolve is painted by .shift-panels' hard-stop
   gradient, whose bottom edge is fixed by padding-bottom. The strip's top edge
   is min(12.5vw,211px) up from the section floor. Nothing tied those two
   numbers together, so at some viewport widths they missed each other and a
   band of the section's #f8f8f6 showed through between the black and the first
   pixel row. This band is anchored to the strip's top edge instead, so the
   black always runs into the pixels no matter how wide the window is. z-index 1
   keeps it above the section's own background but under .shift-panels (2) and
   the strip (4), so the panel cards and the dissolve still paint over it. */
.shift-live::after{content:"";position:absolute;left:0;right:0;bottom:min(12.5vw,211px);height:280px;background:#050505;z-index:1;pointer-events:none}
.featured-live{height:441px!important;padding:110px 0 100px!important;background:#fafafa!important;color:#16160f;overflow:hidden!important;border-bottom:0!important}
.featured-head{width:720px;height:48px;margin:0 auto;text-align:center}.featured-live h2{margin:0!important;font:600 44px/1.08 "Bricolage Grotesque",Arial,sans-serif!important;letter-spacing:-.045em!important;color:#16160f}
.featured-marquee{width:100%;height:132px;margin-top:52px;overflow:hidden}
.featured-track{height:132px;width:max-content;display:flex;animation:featuredMarquee 44s linear infinite;will-change:transform}
.featured-marquee:hover .featured-track{animation-play-state:paused}
.featured-card{position:relative;flex:0 0 auto;width:248px;height:132px;margin-right:24px;display:flex;align-items:center;justify-content:center;background:#fff;border:1.5px solid rgba(0,0,0,.07);border-radius:20px;box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.03);transition:transform .25s,box-shadow .25s,border-color .25s}
.featured-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.1);border-color:rgba(0,0,0,.12)}
.featured-share{position:absolute;right:13px;top:13px;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#f2f2ee;color:#6f6f66;font:14px/1 Arial,sans-serif;transition:background .2s,color .2s}.featured-card:hover .featured-share{background:#1b8b3a;color:#fff}
.featured-logo{display:flex;align-items:center;justify-content:center;gap:10px;padding:0 22px}
.featured-forbes{font:700 37px/1 Georgia,"Times New Roman",serif;color:#16160f;letter-spacing:-.5px}
.featured-google{gap:0;font:500 33px/1 Arial,Helvetica,sans-serif;letter-spacing:-1.5px}.featured-google b{font-weight:500}.featured-google b:nth-child(1),.featured-google b:nth-child(4){color:#4285f4}.featured-google b:nth-child(2),.featured-google b:nth-child(6){color:#ea4335}.featured-google b:nth-child(3){color:#fbbc05}.featured-google b:nth-child(5){color:#34a853}
.featured-harvard{gap:8px}.featured-harvard i{width:1px;height:38px;background:#d9d9d9;margin:0 2px 0 -2px}.featured-harvard>div{display:flex;flex-direction:column;text-align:left;font-family:Arial,Helvetica,sans-serif;line-height:1.05}.featured-harvard b,.featured-harvard strong{font-size:17px;font-weight:800;letter-spacing:-.3px}.featured-harvard b{color:#a51c30}.featured-harvard strong{color:#16160f}
.featured-wef{gap:0;flex-direction:column;text-align:center;font-family:Arial,Helvetica,sans-serif;color:#16160f;line-height:1.2}.featured-wef b{font-size:13px;font-weight:600;letter-spacing:2.4px}.featured-wef svg{margin-top:3px}
.featured-connector{height:90px;background:#fafafa;display:flex;flex-direction:column;align-items:center;overflow:hidden}.featured-connector span{display:block;flex:0 0 9px;width:9px;border-radius:50%;background:#00573f}.featured-connector i{display:block;flex:0 0 60px;width:1px;background:rgba(0,0,0,.18)}
@keyframes featuredMarquee{to{transform:translateX(-1088px)}}
@media(prefers-reduced-motion:reduce){.featured-track{animation:none}}
:where(html[data-view="mobile"]) .shift-end-connector{width:min(100%,980px)}:where(html[data-view="mobile"]) .pixel-transition{height:12.5vw}:where(html[data-view="mobile"]) .featured-live{height:390px!important;padding:90px 0 80px!important}:where(html[data-view="mobile"]) .featured-live h2{font-size:36px!important}:where(html[data-view="mobile"]) .featured-head{width:100%;height:39px}:where(html[data-view="mobile"]) .featured-marquee{margin-top:45px}:where(html[data-view="mobile"]) .featured-card{width:224px;margin-right:20px}
:where(html[data-view="mobile"]) .shift-end-connector{display:none}:where(html[data-view="mobile"]) .featured-live{height:330px!important;padding:70px 0 60px!important}:where(html[data-view="mobile"]) .featured-live h2{font-size:31px!important}:where(html[data-view="mobile"]) .featured-head{height:34px}:where(html[data-view="mobile"]) .featured-marquee{height:112px;margin-top:42px}:where(html[data-view="mobile"]) .featured-track{height:112px}:where(html[data-view="mobile"]) .featured-card{width:205px;height:112px;margin-right:16px;border-radius:16px}:where(html[data-view="mobile"]) .featured-forbes{font-size:31px}:where(html[data-view="mobile"]) .featured-google{font-size:28px}:where(html[data-view="mobile"]) .featured-harvard{transform:scale(.86)}:where(html[data-view="mobile"]) .featured-wef{transform:scale(.9)}

/* Live reference: Impact, final CTA and footer */
.impact-live{height:613px!important;padding:96px 24px 104px!important;background:#fafafa!important;color:#16160f}
.impact-live-inner{width:1200px;height:413px;margin:0 auto}
.impact-live-head{width:720px;height:122px;margin:0 auto;text-align:center}
.impact-live-eyebrow{height:18px;margin:0;color:#9b9b92;font:600 13px/18px var(--font-nav);letter-spacing:2.08px}
.impact-live h2{margin:14px 0 0!important;color:#16160f;font:600 44px/47.52px "Bricolage Grotesque",Arial,sans-serif!important;letter-spacing:-1.584px!important;white-space:nowrap}
.impact-live h2 span,.impact-live h2 .word-reveal{color:#16160f}
.impact-live-sub{margin:15px 0 0;color:#6f6f66;font:400 18px/27px Geist,Arial,sans-serif}
.impact-live-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;width:1200px;height:235px;margin-top:56px}
.impact-live-card{height:235px;padding:30px 26px;background:#fff;border:1.5px solid rgba(0,0,0,.055);border-radius:20px;box-shadow:0 1px 2px rgba(0,0,0,.04);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease)}
.impact-live-card:hover{transform:translateY(-4px);border-color:rgba(0,0,0,.1);box-shadow:0 14px 34px rgba(0,0,0,.08)}
.impact-live-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;background:#f1f1ea;color:#16160f;font:600 22px/1 Geist,Arial,sans-serif}
.impact-live-icon svg{width:24px;height:24px}.impact-live-rupee{font-size:22px;font-weight:700}
.impact-live-card h3{margin:21px 0 8px;color:#16160f;font:700 20px/24px Geist,Arial,sans-serif;white-space:nowrap}.impact-live-card--states h3{white-space:normal}
.impact-live-card p{margin:0;color:#6f6f66;font:400 15px/23.25px Geist,Arial,sans-serif}
.impact-footer-connector{position:relative;width:1200px;height:126px;margin:0 auto;background:#fafafa;box-shadow:0 0 0 100vmax #fafafa;clip-path:inset(0 -100vmax)}
.impact-footer-connector i{position:absolute;left:50%;top:17px;width:1px;height:92px;background:rgba(0,0,0,.18);transform:translateX(-50%)}
.impact-footer-connector span{position:absolute;left:50%;width:6px;height:6px;border-radius:50%;background:#00573f;transform:translateX(-50%)}
.impact-footer-connector span:first-child{top:16px}.impact-footer-connector span:last-child{bottom:16px}
.site-footer-live{position:relative;height:940px!important;padding:0!important;background:#000!important;color:#fff;overflow:hidden}
.footer-live-visual{position:relative;width:100%;height:620px;overflow:hidden}
.footer-live-visual>img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 50%}
.footer-live-visual:before,.footer-live-visual:after{content:"";position:absolute;z-index:1;inset:0;pointer-events:none}
.footer-live-visual:before{background:linear-gradient(to bottom,#fafafa 0%,rgba(250,250,250,.98) 7%,rgba(250,250,250,.78) 16%,rgba(250,250,250,.34) 27%,rgba(250,250,250,0) 40%)}
.footer-live-visual:after{background:linear-gradient(to bottom,rgba(0,0,0,0) 57%,rgba(0,0,0,.03) 66%,rgba(0,0,0,.45) 82%,#000 100%)}
.footer-live-cta{position:absolute;z-index:2;top:40px;left:40px;right:40px;text-align:center;color:#000}
.footer-live-cta h2{width:760px;margin:0 auto;font:600 53px/58.3px var(--font-display);letter-spacing:-1.908px}
.footer-live-cta>p{margin:24px 0 0;color:#111;font:500 16px/20.8px Geist,Arial,sans-serif}
.footer-live-call{position:relative;display:block;width:200px;height:50px;margin:32px auto 0;border-radius:200px;background:#000;color:#fff;overflow:hidden;font:400 17px/50px Geist,Arial,sans-serif;box-shadow:0 8px 20px rgba(0,0,0,.18)}
.footer-live-call span,.footer-live-call b{position:absolute;left:0;width:100%;height:50px;font-weight:400;transition:transform .42s var(--ease)}
.footer-live-call span{top:0}.footer-live-call b{top:50px}.footer-live-call:hover span,.footer-live-call:focus-visible span{transform:translateY(-50px)}.footer-live-call:hover b,.footer-live-call:focus-visible b{transform:translateY(-50px)}


  :where(html[data-view="desktop"]) .footer-live-cta{top:46px}
  :where(html[data-view="desktop"]) .footer-live-cta h2{width:auto;white-space:nowrap}
  :where(html[data-view="desktop"]) .footer-live-cta>p{margin-top:18px;white-space:nowrap}
  :where(html[data-view="desktop"]) .footer-live-call{margin-top:28px}

.footer-live-bottom{position:relative;height:320px;background:#000}
.footer-live-bottom:before,.footer-live-bottom:after{content:"";position:absolute;bottom:0;width:1px;height:74px;background:rgba(255,255,255,.12)}
.footer-live-bottom:before{left:calc(50% - 512px)}.footer-live-bottom:after{left:calc(50% + 512px)}
.footer-live-inner{width:1200px;height:100%;margin:0 auto;padding:64px 56px 0}
.footer-live-statement p{margin:0;font:600 42px/46px var(--font-display);letter-spacing:-1.52px;color:#fff}
.footer-live-statement p:nth-child(2){color:rgba(255,255,255,.48)}
.footer-live-legal{width:230px;margin:70px 0 0;color:#848484;font:500 14px/16.8px Inter,Arial,sans-serif;letter-spacing:-.14px}
.footer-live-legal a{color:inherit;text-decoration:underline;text-underline-offset:2px;opacity:.7;transition:opacity .15s}.footer-live-legal a:hover{opacity:1}
:where(html[data-view="mobile"]) .impact-live-inner, :where(html[data-view="mobile"]) .impact-live-grid, :where(html[data-view="mobile"]) .impact-footer-connector{width:min(100%,1060px)}:where(html[data-view="mobile"]) .impact-live-grid{gap:18px}:where(html[data-view="mobile"]) .impact-live-card{padding:27px 22px}:where(html[data-view="mobile"]) .impact-live-card h3{font-size:18px}:where(html[data-view="mobile"]) .footer-live-inner{width:min(100%,1060px)}:where(html[data-view="mobile"]) .footer-live-bottom:before{left:calc(50% - 470px)}:where(html[data-view="mobile"]) .footer-live-bottom:after{left:calc(50% + 470px)}
:where(html[data-view="mobile"]) .impact-live{height:auto!important;padding:80px 24px 90px!important}:where(html[data-view="mobile"]) .impact-live-inner{height:auto}:where(html[data-view="mobile"]) .impact-live-head{width:100%;height:auto}:where(html[data-view="mobile"]) .impact-live h2{font-size:36px!important;line-height:1.08!important;white-space:normal}:where(html[data-view="mobile"]) .impact-live-grid{height:auto;grid-template-columns:1fr 1fr;margin-top:48px}:where(html[data-view="mobile"]) .impact-live-card{height:220px}:where(html[data-view="mobile"]) .footer-live-cta h2{width:auto;font-size:45px;line-height:1.05}:where(html[data-view="mobile"]) .footer-live-inner{padding-inline:36px}:where(html[data-view="mobile"]) .footer-live-statement p{font-size:35px;line-height:1.1}:where(html[data-view="mobile"]) .footer-live-bottom:before, :where(html[data-view="mobile"]) .footer-live-bottom:after{display:none}
:where(html[data-view="mobile"]) .impact-live-grid{grid-template-columns:1fr}:where(html[data-view="mobile"]) .impact-live-card{height:auto;min-height:210px}:where(html[data-view="mobile"]) .impact-footer-connector{width:100%}:where(html[data-view="mobile"]) .site-footer-live{height:960px!important}:where(html[data-view="mobile"]) .footer-live-visual{height:660px}:where(html[data-view="mobile"]) .footer-live-cta{top:34px;left:20px;right:20px}:where(html[data-view="mobile"]) .footer-live-cta h2{font-size:38px}:where(html[data-view="mobile"]) .footer-live-cta>p{font-size:14px}:where(html[data-view="mobile"]) .footer-live-bottom{height:300px}:where(html[data-view="mobile"]) .footer-live-inner{padding:52px 24px 0}:where(html[data-view="mobile"]) .footer-live-statement p{font-size:29px}:where(html[data-view="mobile"]) .footer-live-legal{margin-top:58px}

/* 2026-08-06 fidelity pass: live desktop geometry, choreography and flow modal */
.header-flow-button{border:0;background:transparent;padding:0;cursor:pointer;color:inherit;font:inherit}
.header-actions .header-flow-button{transition:opacity .2s}.header-actions .header-flow-button:hover{opacity:.5}
.header-actions .header-flow-button.pill-dark{padding:0 24px}.header-actions .header-flow-button.pill-dark:hover{opacity:1}
.mobile-menu button{display:flex;width:100%;justify-content:space-between;align-items:center;border:0;border-bottom:1px solid #262626;padding:20px 0;background:transparent;color:inherit;font-size:clamp(28px,9vw,48px);letter-spacing:-.05em;text-align:left;cursor:pointer}.mobile-menu button:first-of-type{margin-top:auto}
.call-pill{overflow:hidden}.call-pill span,.call-pill b{position:absolute;inset:0;display:grid;place-items:center;font-weight:600;transition:transform .42s var(--ease)}.call-pill b{transform:translateY(100%);font-size:13px}.call-pill:hover span,.call-pill:focus-visible span{transform:translateY(-100%)}.call-pill:hover b,.call-pill:focus-visible b{transform:none}.call-pill:hover{width:200px}
.hero-side{display:none}


  :where(html[data-view="desktop"]) .hero{height:1549px;min-height:1549px;padding-top:77px;background:#f7f7f4}
  :where(html[data-view="desktop"]) .hero-grid{width:100%;min-height:1472px;display:block}
  :where(html[data-view="desktop"]) .hero h1{position:absolute;left:28px;top:90px;width:360px;margin:0;font-size:63px}
  :where(html[data-view="desktop"]) .hero-copy{position:absolute;right:40px;top:96px;width:270px;margin:0}
  :where(html[data-view="desktop"]) .hero-person{display:block;left:50%;top:0;width:1319px;height:620px;transform:translateX(-50%);mask-image:linear-gradient(#000 82%,transparent 100%);overflow:hidden}
  :where(html[data-view="desktop"]) .hero-person video{width:100%;height:100%;aspect-ratio:auto;object-fit:contain;filter:none;mix-blend-mode:normal}
  :where(html[data-view="desktop"]) .hero-side{display:block;position:absolute;top:426px;width:1143px;height:715px;z-index:1;overflow:hidden;mask-image:linear-gradient(transparent 0,#000 16%,#000 78%,transparent 100%);opacity:.9}
  :where(html[data-view="desktop"]) .hero-side video{width:100%;height:100%;object-fit:cover}
  :where(html[data-view="desktop"]) .hero-side-left{left:calc(50% - 1714px)}:where(html[data-view="desktop"]) .hero-side-right{left:calc(50% + 571px)}
  :where(html[data-view="desktop"]) .hero-device{top:497px;width:1143px;height:573px;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:hidden}
  :where(html[data-view="desktop"]) .hero-device img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
  :where(html[data-view="desktop"]) .call-pill{top:470px}
  :where(html[data-view="desktop"]) .scroll-cue{top:0;bottom:auto}
  :where(html[data-view="desktop"]) .meet{height:917px}:where(html[data-view="desktop"]) .meet-inner{padding-top:160px}
  :where(html[data-view="desktop"]) .operations{min-height:750px}:where(html[data-view="desktop"]) .flow-heading{height:100px}:where(html[data-view="desktop"]) .system-block{height:650px}
  :where(html[data-view="desktop"]) .reality-story{height:2946px;min-height:2946px}


.next-command code{display:flex;align-items:center}.next-command [data-op-command]{white-space:pre}

.shift-live{--shift-progress:0}
.shift-paper-video{transform:translate3d(0,calc(var(--shift-progress) * -170px),0) scale(calc(1 + var(--shift-progress) * .035));transform-origin:center bottom;will-change:transform}
.shift-panel{opacity:calc(.12 + var(--panel-visible,0) * .88);transform:translate3d(0,calc((1 - var(--panel-visible,0)) * 72px),0) scale(calc(.96 + var(--panel-visible,0) * .04));will-change:transform,opacity}
.shift-panel-media .shift-panel-bg{transform:translate3d(0,calc((.5 - var(--panel-progress,0)) * 46px),0) scale(1.1);will-change:transform}
.shift-overlay,.shift-overlay-logistics{transform:translate3d(0,calc((.5 - var(--panel-progress,0)) * -32px),0);will-change:transform}

.word-reveal{display:inline-block;opacity:.001;filter:blur(8px);transform:translateY(12px);transition:opacity .65s cubic-bezier(.2,.7,.2,1),filter .65s cubic-bezier(.2,.7,.2,1),transform .65s cubic-bezier(.2,.7,.2,1)}
.word-reveal.is-visible{opacity:1;filter:blur(0);transform:none}
.impact-live-card.motion-card{opacity:0;transform:translateY(22px);transition:opacity .6s cubic-bezier(.16,.84,.44,1),transform .6s cubic-bezier(.16,.84,.44,1),box-shadow .28s,border-color .28s}
.impact-live-card.motion-card.is-visible{opacity:1;transform:none}.impact-live-card.motion-card.is-visible:hover{transform:translateY(-4px)}
@keyframes featuredMarquee{to{transform:translateX(-50%)}}
.featured-track{animation-name:featuredMarquee}.impact-live-card{transition-duration:.28s}

.flow-modal[hidden]{display:none}.flow-modal{position:fixed;inset:0;z-index:500;display:grid;place-items:center;padding:22px}.flow-modal-backdrop{position:absolute;inset:0;background:rgba(4,4,4,.78);backdrop-filter:blur(15px);animation:modalFade .28s ease both}.flow-modal-panel{position:relative;width:min(760px,100%);max-height:calc(100vh - 44px);overflow:auto;padding:48px;border:1px solid rgba(255,255,255,.18);border-radius:28px;background:#f7f7f4;color:#111;box-shadow:0 30px 90px rgba(0,0,0,.45);animation:modalRise .42s var(--ease) both;outline:none}.flow-modal-close{position:absolute;right:19px;top:19px;width:44px;height:44px;border:1px solid #d3d3cd;border-radius:50%;background:#fff;font-size:27px;line-height:1;cursor:pointer}.flow-modal-eyebrow{margin:0 0 12px;color:#007554;font:600 12px/1 "Kode Mono",monospace;letter-spacing:.14em}.flow-modal-panel h2{margin:0;font:500 52px/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.05em}.flow-modal-intro{max-width:480px;margin:18px 0 34px;color:#6b6b65}.flow-form{display:grid;grid-template-columns:1fr;gap:18px}.flow-form label{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:650}.flow-form label .flow-opt{color:#92928c;font-weight:400}.flow-form input,.flow-form select{width:100%;height:50px;padding:0 14px;border:1px solid #cecec8;border-radius:10px;background:#fff;color:#111;outline:none}.flow-form input:focus,.flow-form select:focus{border-color:#007554;box-shadow:0 0 0 3px rgba(0,117,84,.12)}.flow-form [aria-invalid=true]{border-color:#c93640}.flow-form-error{grid-column:1/-1;min-height:18px;margin:0;color:#b7222d;font-size:12px}.flow-form-submit{grid-column:1/-1;height:52px;border:0;border-radius:999px;background:#050505;color:#fff;cursor:pointer}.flow-form-submit span{margin-left:14px}.flow-modal-success{text-align:center;padding:80px 20px}.flow-modal-success>span{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 22px;border-radius:50%;background:#007554;color:#fff;font-size:28px}.flow-modal-success>p:first-of-type{font:600 12px/1 "Kode Mono",monospace;color:#007554;letter-spacing:.12em}.flow-modal-success>p:last-of-type{color:#6b6b65}.flow-modal-success button{min-width:170px;height:48px;margin-top:22px;border:0;border-radius:99px;background:#050505;color:#fff;cursor:pointer}@keyframes modalFade{from{opacity:0}}@keyframes modalRise{from{opacity:0;transform:translateY(26px) scale(.975)}}
/* Transact modal — reference UI */
.flow-modal-panel{width:min(468px,100%);padding:40px 36px;background:#fff}
.flow-modal-eyebrow,.flow-modal-panel h2,.flow-modal-intro{text-align:center}
.flow-modal-panel h2{font-size:34px;line-height:1.05}
.flow-modal-intro{max-width:320px;margin:14px auto 30px}
.flow-form .flow-label{font-size:12px;font-weight:650;color:#111}
.flow-form .flow-req{color:#e5484d;font-weight:700;margin-left:1px}
.flow-form .flow-phone{display:flex;gap:8px}
.flow-form .flow-phone-cc{display:flex;align-items:center;justify-content:center;flex:0 0 auto;height:50px;padding:0 14px;border:1px solid #cecec8;border-radius:10px;background:#f2f2ee;font-weight:600;color:#111}
.flow-form .flow-phone input{flex:1;min-width:0}
.flow-role{border:0;margin:0;padding:0;min-width:0}
.flow-role .flow-label{display:block;margin-bottom:8px}
.flow-role-options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.flow-form .flow-role-option{position:relative;flex-direction:row;align-items:center;justify-content:center;gap:0;height:50px;border:1px solid #cecec8;border-radius:10px;background:#fff;font-size:14px;font-weight:600;cursor:pointer}
.flow-form .flow-role-option input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.flow-form .flow-role-option:has(input:checked){border-color:#050505;background:#050505;color:#fff}
.flow-form .flow-role-option:has(input:focus-visible){box-shadow:0 0 0 3px rgba(0,117,84,.18)}
html[data-menu="drawer"] .mobile-menu .mobile-menu-actions button[data-flow-open="transact"]{flex:1;width:100%;border:1px solid #050505;background:#050505;color:#fff}
body.modal-open{overflow:hidden}
:where(html[data-view="mobile"]) .flow-modal{padding:0}:where(html[data-view="mobile"]) .flow-modal-panel{width:100%;height:100%;max-height:none;border-radius:0;padding:72px 22px 28px}:where(html[data-view="mobile"]) .flow-modal-panel h2{font-size:30px}:where(html[data-view="mobile"]) .flow-form{grid-template-columns:1fr}:where(html[data-view="mobile"]) .flow-form-error, :where(html[data-view="mobile"]) .flow-form-submit{grid-column:1}
@media(prefers-reduced-motion:reduce){.word-reveal,.impact-live-card.motion-card{opacity:1;filter:none;transform:none}.shift-mark{animation:none!important}.shift-paper-video,.shift-panel,.shift-panel-bg,.shift-overlay,.shift-overlay-logistics{transform:none!important}.pixel-transition i.is-black{opacity:1!important;transition:none!important}.flow-modal-backdrop,.flow-modal-panel{animation:none}.hero h1,.hero-copy strong,.hero-copy p{animation:none!important;opacity:1;filter:none;transform:none}}

/* Hero/nav screenshot calibration — exact live layer ratios */
.pill-outline{min-height:36px;padding:0 22px;border:1px solid #111;background:transparent;color:#111}
.ask-link{display:inline-flex;align-items:center;gap:7px;color:#111}.ask-mark{font-size:18px;line-height:1;color:#111}
.hero-device-frame,.hero-device-dashboard-shell{position:absolute;display:block;max-width:none}
.hero-device-dashboard{display:block;max-width:none}
/* Hero intro reveal — staggered fade-up matching live (heading, then bold, then subtext) */
@keyframes heroFadeUp{from{opacity:0;transform:translateY(20px);filter:blur(7px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
.hero h1{animation:heroFadeUp .75s var(--ease) both}
.hero-copy strong{animation:heroFadeUp .75s var(--ease) .14s both}
.hero-copy p{animation:heroFadeUp .75s var(--ease) .34s both}


  :where(html[data-view="desktop"]) .site-header{height:58px;padding:0 14px;background:rgba(250,250,250,.96);backdrop-filter:blur(16px)}
  :where(html[data-view="desktop"]) .brand-image{width:194px}
  :where(html[data-view="desktop"]) .desktop-nav{gap:47px;font-size:14px}
  :where(html[data-view="desktop"]) .nav-label{position:relative;margin-right:34px;color:#777}
  :where(html[data-view="desktop"]) .nav-label:after{content:"";position:absolute;right:-41px;top:50%;width:1px;height:20px;background:#d8d8d3;transform:translateY(-50%)}
  :where(html[data-view="desktop"]) .header-actions{gap:8px;font-size:14px}
  :where(html[data-view="desktop"]) .header-actions .ask-link{margin-right:7px;padding-right:15px;border-right:1px solid #d8d8d3}
  :where(html[data-view="desktop"]) .header-actions .header-flow-button.pill-dark{width:64px;min-height:36px;padding:0;background:#050505;color:#fff}
  :where(html[data-view="desktop"]) .header-actions .header-flow-button.pill-outline{width:64px;min-height:36px;padding:0}
  :where(html[data-view="desktop"]) .hero h1{left:calc(50% - 528px);top:83px;width:490px;margin:0;font-size:58px;line-height:1.1;letter-spacing:-.05em;color:#000}
  :where(html[data-view="desktop"]) .hero-copy{right:calc(50% - 570px);top:99px;width:318px;margin:0;padding:0 34px;border-left:1px solid #cfcfca;border-right:1px solid #cfcfca;font-size:14px;line-height:1.25}
  :where(html[data-view="desktop"]) .hero-copy strong{display:block;font-size:23px;line-height:1.2;letter-spacing:-.035em}
  :where(html[data-view="desktop"]) .hero-copy p{font-size:15px;line-height:1.4;font-weight:500;color:rgba(0,0,0,.56)}
  :where(html[data-view="desktop"]) .hero-copy em{color:#00573f;font-weight:500}
  :where(html[data-view="desktop"]) .hero-person video{filter:saturate(.82) brightness(1.035) contrast(.94);mix-blend-mode:normal}
  :where(html[data-view="desktop"]) .call-pill{top:565px}
  :where(html[data-view="desktop"]) .hero-device{top:497px;width:1143px;height:925px;overflow:visible}
  :where(html[data-view="desktop"]) .hero-device-frame{left:0;top:0;z-index:0;width:1143px!important;height:573px!important;aspect-ratio:auto!important;object-fit:fill!important}
  :where(html[data-view="desktop"]) .hero-device-dashboard-shell{left:3.45px;top:103.69px;z-index:1;width:1136px;height:831.3px;padding:10px;border-radius:48px;background:rgba(204,204,204,.2);box-sizing:border-box}
  :where(html[data-view="desktop"]) .hero-device-dashboard{position:static;width:1116px!important;height:811.3px!important;border-radius:40px;aspect-ratio:auto!important;object-fit:cover!important}


@media(min-width:1800px){
  .hero h1{left:calc(50% - 528px);top:84px;width:420px;font-size:48px;line-height:1.18;letter-spacing:-.048em}
  .hero-copy{right:calc(50% - 570px);top:85px;width:318px;height:198px;padding:13px 34px 0}
  .call-pill{width:200px;height:50px}
}

/* Live connector motion: line grows from its centre while the dots travel to both ends. */
.section-pin{--pin-inset:17px;position:relative;background:transparent!important;opacity:1!important}
.section-pin::before{content:"";position:absolute;left:50%;top:var(--pin-inset);bottom:var(--pin-inset);width:1px;background:rgba(0,0,0,.18);transform:translateX(-50%) scaleY(.01);transform-origin:center;transition:transform .72s cubic-bezier(.22,1,.36,1);will-change:transform}
.section-pin>i{position:absolute!important;left:50%!important;top:50%!important;bottom:auto!important;display:block!important;flex:none!important;width:6px!important;height:6px!important;border:0!important;border-radius:50%!important;background:#00573f!important;box-shadow:none!important;opacity:1!important;transform:translate(-50%,-50%);transition:top .72s cubic-bezier(.22,1,.36,1),transform .72s cubic-bezier(.22,1,.36,1);will-change:top,transform}
.section-pin.is-drawn::before{transform:translateX(-50%) scaleY(1)}
.section-pin.is-drawn>i:first-child{top:calc(var(--pin-inset) - 1px)!important}
.section-pin.is-drawn>i:last-child{top:calc(100% - var(--pin-inset) - 5px)!important}
.scroll-cue.section-pin{position:absolute;z-index:3;top:0;bottom:auto;left:50%;width:1px;height:126px;margin:0;transform:translateX(-50%);background:transparent}
.meet-line{width:1px;background:transparent}.meet-line-top{height:126px;margin:48px auto 0}.meet-line-bottom{height:126px;margin-top:2px}
.reality-connector.section-pin{--pin-inset:1px;background:transparent}.featured-connector.section-pin{--pin-inset:35px;background:#fafafa!important}.impact-footer-connector.section-pin{--pin-inset:17px;background:#fafafa!important}

/* Live heading motion: a character-level grey -> red -> black travelling sweep. */
.meet-char{color:rgba(0,0,0,.12);transition:color .3s linear;will-change:color}
.meet-title-animated .meet-char{animation:meetCharacterTravel .68s linear both;animation-delay:calc(var(--char-index) * 14ms)}
@keyframes meetCharacterTravel{0%,12%{color:rgba(0,0,0,.12)}42%,64%{color:#d64045}100%{color:#000}}
@media(prefers-reduced-motion:reduce){.section-pin::before{transform:translateX(-50%) scaleY(1);transition:none}.section-pin>i{transition:none}.section-pin>i:first-child{top:calc(var(--pin-inset) - 1px)!important}.section-pin>i:last-child{top:calc(100% - var(--pin-inset) - 5px)!important}.meet-char{color:#000!important;animation:none!important;transition:none}.founder-play{transition:none}}

/* Responsive fidelity pass: Framer's source breakpoints are phone < 810px,
   tablet 810-1439px and desktop >= 1440px. Keep this block last so every
   responsive surface uses the same geometry contract. */



  html[data-view="mobile"]{--shell:calc(100vw - 32px)}
  :where(html[data-view="mobile"]) .site-header{height:44px;padding:0 12px;background:rgba(250,250,250,.97)}:where(html[data-view="mobile"]) .brand-image{width:148px}:where(html[data-view="mobile"]) .desktop-nav, :where(html[data-view="mobile"]) .header-actions{display:none}:where(html[data-menu="drawer"]) .menu-button{display:block;width:36px;height:36px;border-radius:0;background:transparent}:where(html[data-menu="drawer"]) .menu-button i{width:16px;background:#777}
  :where(html[data-menu="drawer"]) .mobile-menu{padding:72px 18px 20px}:where(html[data-menu="drawer"]) .mobile-menu a, :where(html[data-menu="drawer"]) .mobile-menu button{min-height:52px;font-size:32px}
  :where(html[data-view="mobile"]) .hero{height:900px;min-height:900px;padding:72px 0 0;background:#f7f7f4}:where(html[data-view="mobile"]) .hero-grid{display:block;width:100%;min-height:800px}
  :where(html[data-view="mobile"]) .hero h1{width:calc(100% - 40px);margin:0 20px;font-size:clamp(28px,8.3vw,43px);line-height:1.02;letter-spacing:-.055em}:where(html[data-view="mobile"]) .hero-copy{position:relative;top:auto;right:auto;width:calc(100% - 40px);margin:18px 20px 0;padding:0;border:0}:where(html[data-view="mobile"]) .hero-copy strong{font-size:13px;line-height:1.15}:where(html[data-view="mobile"]) .hero-copy p{margin-top:9px;font-size:10px;line-height:1.25}
  :where(html[data-view="mobile"]) .hero-side{display:none}:where(html[data-view="mobile"]) .hero-person{left:auto;right:-18px;top:150px;width:min(64vw,300px);height:330px;transform:none;mask-image:linear-gradient(#000 76%,transparent)}:where(html[data-view="mobile"]) .hero-person video{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center}
  :where(html[data-view="mobile"]) .call-pill{left:20px;top:265px;transform:none;width:142px;height:40px;font-size:11px}:where(html[data-view="mobile"]) .call-pill:hover{width:154px}
  :where(html[data-view="mobile"]) .hero-device{left:50%;top:475px;width:calc(100vw - 24px);height:400px;transform:translateX(-50%);border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}:where(html[data-view="mobile"]) .hero-device-frame{left:0;top:0;width:100%!important;height:auto!important}:where(html[data-view="mobile"]) .hero-device-dashboard-shell{left:.3%;top:17.3%;width:99.4%;height:auto;aspect-ratio:1.376;padding:4px;border-radius:21px;background:rgba(204,204,204,.2)}:where(html[data-view="mobile"]) .hero-device-dashboard{width:100%!important;height:100%!important;border-radius:18px;object-fit:cover}:where(html[data-view="mobile"]) .scroll-cue.section-pin{height:82px}
  :where(html[data-view="mobile"]) .meet{height:auto;min-height:790px}:where(html[data-view="mobile"]) .meet-inner{width:calc(100vw - 24px);padding-top:80px}:where(html[data-view="mobile"]) .meet h2{font-size:clamp(28px,8vw,38px);line-height:1.06}:where(html[data-view="mobile"]) .meet-line-top{height:75px;margin-top:24px}:where(html[data-view="mobile"]) .founder-card{width:100%;height:520px;grid-template-columns:1fr;grid-template-rows:285px 235px}:where(html[data-view="mobile"]) .founder-photo, :where(html[data-view="mobile"]) .founder-terminal{min-width:0}:where(html[data-view="mobile"]) .founder-photo video{width:100%;height:100%;object-fit:cover}:where(html[data-view="mobile"]) .founder-play{height:42px;font-size:14px;padding:0 16px 0 10px}:where(html[data-view="mobile"]) .founder-terminal{padding:26px 22px}:where(html[data-view="mobile"]) .founder-terminal p{font-size:13px}:where(html[data-view="mobile"]) .founder-terminal strong{font-size:11px;white-space:normal}:where(html[data-view="mobile"]) .meet-line-bottom{display:none}
  :where(html[data-view="mobile"]) .operations{min-height:1120px}:where(html[data-view="mobile"]) .flow-heading{height:105px;transform:none;margin:0}:where(html[data-view="mobile"]) .flow-heading h2{width:calc(100vw - 32px);font-size:30px}:where(html[data-view="mobile"]) .system-block{height:1015px;padding-top:12px;border:0}:where(html[data-view="mobile"]) .desktop-operation-tabs{display:none}:where(html[data-view="mobile"]) .system-tablet{width:calc(100vw - 16px);height:995px;padding:6px;border-radius:18px}:where(html[data-view="mobile"]) .system-tabs{height:52px;padding-inline:8px}:where(html[data-view="mobile"]) .system-content{height:931px;padding-top:6px;border-radius:14px}:where(html[data-view="mobile"]) .system-video{height:405px}:where(html[data-view="mobile"]) .sell-status{width:min(88%,390px)}:where(html[data-view="mobile"]) .order-status{height:86px;padding:12px}:where(html[data-view="mobile"]) .order-status strong, :where(html[data-view="mobile"]) .order-status b{font-size:14px}:where(html[data-view="mobile"]) .next-command{height:60px}:where(html[data-view="mobile"]) .next-command button{width:42px;height:42px}:where(html[data-view="mobile"]) .operation-overlay--procure{width:68%}:where(html[data-view="mobile"]) .operation-overlay--dispose{width:62%}:where(html[data-view="mobile"]) .operation-overlay--refurbish{width:52%}:where(html[data-view="mobile"]) .system-copy{height:520px;margin-top:6px;padding:22px 18px}:where(html[data-view="mobile"]) .system-copy-head{min-height:220px;grid-template-columns:1fr;gap:8px}:where(html[data-view="mobile"]) .system-copy-head h3{font-size:32px}:where(html[data-view="mobile"]) .system-copy-head .op-cta{align-self:start;justify-self:start;margin:0 0 14px}:where(html[data-view="mobile"]) .system-detail{min-height:126px;grid-template-columns:1fr;gap:6px;padding:14px 0}
  :where(html[data-view="mobile"]) .reality-intro{height:380px;grid-template-rows:78px 1fr 78px;padding:0 18px}:where(html[data-view="mobile"]) .reality-intro h2{font-size:29px}:where(html[data-view="mobile"]) .reality-story{height:180vh;min-height:1080px}:where(html[data-view="mobile"]) .reality-video{object-position:center center}:where(html[data-view="mobile"]) .reality-terminal{bottom:22px;width:calc(100vw - 24px);height:98px;border-width:4px;padding:7px}:where(html[data-view="mobile"]) .reality-type{height:43px}:where(html[data-view="mobile"]) .reality-terminal-bottom>strong{font-size:8px}:where(html[data-view="mobile"]) .reality-restart{font-size:9px}:where(html[data-view="mobile"]) .reality-arrows button{width:34px;height:30px}
  :where(html[data-view="mobile"]) .shift-live{height:auto;min-height:2750px}:where(html[data-view="mobile"]) .shift-live-heading{width:calc(100vw - 32px);height:270px;margin-top:22px}:where(html[data-view="mobile"]) .shift-live-heading h2{font-size:29px}:where(html[data-view="mobile"]) .shift-paper-video{height:520px;object-position:center}:where(html[data-view="mobile"]) .shift-panels{margin-top:-90px;padding:0 12px 150px}:where(html[data-view="mobile"]) .shift-panel{width:100%;height:auto;display:flex;flex-direction:column;gap:7px;border-radius:22px}:where(html[data-view="mobile"]) .shift-panel-copy{width:100%;height:370px;border-radius:22px;padding:26px}:where(html[data-view="mobile"]) .shift-panel-media{width:100%;height:390px;border-radius:22px}:where(html[data-view="mobile"]) .shift-panel-rails{width:100%;height:80px}:where(html[data-view="mobile"]) .shift-end-connector{display:none}
  :where(html[data-view="mobile"]) .pixel-transition{height:12.5vw}:where(html[data-view="mobile"]) .featured-live{height:330px!important;padding:70px 0 60px!important}:where(html[data-view="mobile"]) .featured-live h2{font-size:31px!important}:where(html[data-view="mobile"]) .featured-head{width:100%;height:34px}:where(html[data-view="mobile"]) .featured-marquee, :where(html[data-view="mobile"]) .featured-track{height:112px}:where(html[data-view="mobile"]) .featured-marquee{margin-top:42px}:where(html[data-view="mobile"]) .featured-card{width:205px;height:112px;margin-right:16px;border-radius:16px}
  :where(html[data-view="mobile"]) .featured-connector{height:84px}:where(html[data-view="mobile"]) .impact-live{height:auto!important;padding:74px 16px 82px!important}:where(html[data-view="mobile"]) .impact-live-inner, :where(html[data-view="mobile"]) .impact-live-head, :where(html[data-view="mobile"]) .impact-live-grid{width:100%;height:auto}:where(html[data-view="mobile"]) .impact-live h2{font-size:34px!important;line-height:1.08!important;white-space:normal}:where(html[data-view="mobile"]) .impact-live-sub{font-size:15px}:where(html[data-view="mobile"]) .impact-live-grid{grid-template-columns:1fr;gap:14px;margin-top:42px}:where(html[data-view="mobile"]) .impact-live-card{height:auto;min-height:205px}:where(html[data-view="mobile"]) .impact-footer-connector{width:100%}
  :where(html[data-view="mobile"]) .site-footer-live{height:960px!important}:where(html[data-view="mobile"]) .footer-live-visual{height:660px}:where(html[data-view="mobile"]) .footer-live-visual>img{object-position:center}:where(html[data-view="mobile"]) .footer-live-cta{top:34px;left:20px;right:20px}:where(html[data-view="mobile"]) .footer-live-cta h2{width:auto;font-size:38px;line-height:1.04}:where(html[data-view="mobile"]) .footer-live-cta>p{font-size:14px}:where(html[data-view="mobile"]) .footer-live-call{width:180px;height:46px;line-height:46px}:where(html[data-view="mobile"]) .footer-live-bottom{height:300px}:where(html[data-view="mobile"]) .footer-live-inner{width:100%;padding:52px 24px 0}:where(html[data-view="mobile"]) .footer-live-statement p{font-size:29px;line-height:1.08}:where(html[data-view="mobile"]) .footer-live-legal{margin-top:58px}:where(html[data-view="mobile"]) .footer-live-bottom:before, :where(html[data-view="mobile"]) .footer-live-bottom:after{display:none}
  :where(html[data-view="mobile"]) .flow-modal{padding:0}:where(html[data-view="mobile"]) .flow-modal-panel{width:100%;height:100%;max-height:none;border-radius:0;padding:72px 22px 28px}:where(html[data-view="mobile"]) .flow-form{grid-template-columns:1fr}:where(html[data-view="mobile"]) .flow-form-error, :where(html[data-view="mobile"]) .flow-form-submit{grid-column:1}


/* Pixel 8a calibration — measured from the supplied 1080 × 2400 captures
   (approximately 412 CSS px wide). */

  :where(html[data-view="mobile"]) .site-header{height:58px;padding:0 16px}:where(html[data-view="mobile"]) .brand-image{width:min(215px,58vw)}:where(html[data-menu="drawer"]) .menu-button{width:44px;height:44px}:where(html[data-menu="drawer"]) .menu-button i{width:20px;margin-block:6px}

  :where(html[data-view="mobile"]) .hero{height:1160px;min-height:1160px;padding-top:106px}:where(html[data-view="mobile"]) .hero-grid{min-height:1050px}
  :where(html[data-view="mobile"]) .hero h1{width:calc(100% - 64px);margin-inline:32px;font-size:clamp(28px,7.3vw,35px);line-height:1.08;letter-spacing:-.045em}
  :where(html[data-view="mobile"]) .hero-copy{width:calc(100% - 64px);margin:30px 32px 0}:where(html[data-view="mobile"]) .hero-copy strong{font-size:17px;line-height:1.22}:where(html[data-view="mobile"]) .hero-copy p{margin-top:14px;font-size:14px;line-height:1.32}
  :where(html[data-view="mobile"]) .call-pill{left:32px;top:300px;width:220px;height:52px;font-size:16px;box-shadow:0 14px 25px rgba(0,0,0,.25)}:where(html[data-view="mobile"]) .call-pill:hover{width:220px}
  :where(html[data-view="mobile"]) .hero-person{top:370px;right:-9%;width:104vw;height:490px}:where(html[data-view="mobile"]) .hero-person video{object-fit:cover;object-position:52% center}
  :where(html[data-view="mobile"]) .hero-device{top:785px;width:calc(100vw - 28px);height:350px}:where(html[data-view="mobile"]) .hero-device-dashboard-shell{padding:4px;border-radius:22px}:where(html[data-view="mobile"]) .hero-device-dashboard{border-radius:18px}

  :where(html[data-view="mobile"]) .meet{min-height:1030px}:where(html[data-view="mobile"]) .meet-inner{width:calc(100vw - 32px);padding-top:132px}:where(html[data-view="mobile"]) .meet h2{font-size:clamp(29px,7.4vw,35px);line-height:1.12;letter-spacing:-.045em}
  :where(html[data-view="mobile"]) .meet-line-top{height:96px;margin-top:44px}:where(html[data-view="mobile"]) .founder-card{height:480px;grid-template-rows:248px 232px;border-radius:25px;padding:10px;gap:8px;background:#e9e9e4}:where(html[data-view="mobile"]) .founder-photo, :where(html[data-view="mobile"]) .founder-terminal{border-radius:20px}:where(html[data-view="mobile"]) .founder-terminal{padding:30px 28px;border:5px solid #050505}:where(html[data-view="mobile"]) .founder-terminal p{font-size:14px}:where(html[data-view="mobile"]) .founder-terminal strong{font-size:11px}

  :where(html[data-view="mobile"]) .operations{min-height:1280px}:where(html[data-view="mobile"]) .flow-heading{height:210px;padding:44px 24px 20px}:where(html[data-view="mobile"]) .flow-heading h2{font-size:30px;line-height:1.12}
  :where(html[data-view="mobile"]) .system-block{height:1070px;padding-top:0}:where(html[data-view="mobile"]) .system-tablet{width:calc(100vw - 32px);height:1050px;padding:10px;border-radius:26px}:where(html[data-view="mobile"]) .system-tabs{height:72px;padding:0 6px}:where(html[data-view="mobile"]) .system-tab-label{gap:12px}:where(html[data-view="mobile"]) .system-tab-label b{font-size:13px;padding:3px 6px}:where(html[data-view="mobile"]) .system-tab-label span{font-size:15px}:where(html[data-view="mobile"]) .system-arrows button{width:44px;height:44px}
  :where(html[data-view="mobile"]) .system-content{height:958px;padding:0;background:transparent;overflow:visible}:where(html[data-view="mobile"]) .system-video{height:330px;border-radius:22px}:where(html[data-view="mobile"]) .sell-status{width:80%}:where(html[data-view="mobile"]) .order-status{height:92px;border-radius:14px}:where(html[data-view="mobile"]) .next-command{height:64px;border-radius:10px 10px 16px 16px}:where(html[data-view="mobile"]) .system-copy{height:620px;margin-top:8px;padding:44px 38px;background:#fff;border-radius:22px}:where(html[data-view="mobile"]) .system-copy-head{min-height:310px}:where(html[data-view="mobile"]) .system-copy-head h3{font-size:30px;line-height:1.12}:where(html[data-view="mobile"]) .system-copy-head p{font-size:15px}:where(html[data-view="mobile"]) .system-copy-head .op-cta>a{min-height:44px;width:max-content;padding-inline:22px;border-radius:999px;background:#050505;color:#fff;display:flex;align-items:center}:where(html[data-view="mobile"]) .system-detail{min-height:132px;padding:20px 0}:where(html[data-view="mobile"]) .system-detail h4{font-size:14px}:where(html[data-view="mobile"]) .system-detail p{font-size:14px;line-height:1.42}

  :where(html[data-view="mobile"]) .reality-intro{height:355px;grid-template-rows:70px 1fr 70px}:where(html[data-view="mobile"]) .reality-intro-copy{align-self:start;padding-top:30px}:where(html[data-view="mobile"]) .reality-intro h2{font-size:30px;line-height:1.1}:where(html[data-view="mobile"]) .reality-intro p{display:none}
  :where(html[data-view="mobile"]) .reality-story{height:145vh;min-height:1030px;padding-top:82px}:where(html[data-view="mobile"]) .reality-sticky{top:76px;width:calc(100vw - 32px);height:570px;margin:0 auto;padding:10px;display:grid;grid-template-rows:315px 227px;gap:8px;background:#e9e9e4;border-radius:28px;overflow:hidden}:where(html[data-view="mobile"]) .reality-video{width:100%;height:100%;border-radius:22px;object-fit:cover;object-position:center;mask-image:none;-webkit-mask-image:none}:where(html[data-view="mobile"]) .reality-terminal{position:relative;left:auto;bottom:auto;transform:none;width:100%;height:100%;padding:16px 14px;border:5px solid #050505;border-radius:23px;box-shadow:none}:where(html[data-view="mobile"]) .reality-type{height:125px;padding:7px;font-size:15px}:where(html[data-view="mobile"]) .reality-terminal-bottom{height:56px}:where(html[data-view="mobile"]) .reality-terminal-bottom>strong{font-size:12px}:where(html[data-view="mobile"]) .reality-arrows button{width:44px;height:44px;font-size:20px}

  :where(html[data-view="mobile"]) .shift-live-heading{height:420px;margin-top:36px;padding-top:28px}:where(html[data-view="mobile"]) .shift-mark{width:24px;height:23px;margin-bottom:38px}:where(html[data-view="mobile"]) .shift-live-heading h2{font-size:31px;line-height:1.1}:where(html[data-view="mobile"]) .shift-with{margin-top:30px;font-size:17px}:where(html[data-view="mobile"]) .shift-promise{max-width:360px;margin-top:22px;font-size:14px;line-height:1.42}
  :where(html[data-view="mobile"]) .shift-paper-video{height:680px;object-position:center}:where(html[data-view="mobile"]) .shift-panels{margin-top:-126px;padding:0 16px 170px;background:linear-gradient(to bottom,transparent 0,transparent 96px,#050505 96px,#050505 100%)}
  :where(html[data-view="mobile"]) .shift-panel{width:100%;display:flex;flex-direction:column;gap:8px;border-radius:28px}:where(html[data-view="mobile"]) .shift-panel-media{order:1;width:100%;height:330px;border-radius:25px}:where(html[data-view="mobile"]) .shift-panel-copy{order:2;width:100%;height:auto;justify-content:flex-start;gap:24px;padding:40px 36px;border-radius:25px}:where(html[data-view="mobile"]) .shift-panel-detail{padding-top:24px;border-top:1px solid rgba(255,255,255,.14)}:where(html[data-view="mobile"]) .shift-panel-copy h3{font-size:28px;line-height:1.16}:where(html[data-view="mobile"]) .shift-panel-tag{margin-top:20px;font-size:17px;line-height:1.4}:where(html[data-view="mobile"]) .shift-panel-detail h4{font-size:15px;margin-bottom:16px}:where(html[data-view="mobile"]) .shift-panel-detail p{font-size:14px;line-height:1.45}:where(html[data-view="mobile"]) .shift-panel-rails{height:96px}:where(html[data-view="mobile"]) .shift-panel-rails i{top:29px;height:38px}:where(html[data-view="mobile"]) .shift-panel-rails i:first-child{left:50%}:where(html[data-view="mobile"]) .shift-panel-rails i:last-child{display:none}:where(html[data-view="mobile"]) .shift-overlay, :where(html[data-view="mobile"]) .shift-overlay-logistics{width:72%;left:14%}:where(html[data-view="mobile"]) .shift-overlay-logistics{gap:26px}
  :where(html[data-view="mobile"]) .page-bottom-button{right:16px;bottom:18px;width:48px;height:48px}

  :where(html[data-view="mobile"]) .featured-live{padding-top:78px!important}:where(html[data-view="mobile"]) .featured-connector{height:91px}:where(html[data-view="mobile"]) .impact-live{padding-top:82px!important}:where(html[data-view="mobile"]) .site-footer-live{height:980px!important}:where(html[data-view="mobile"]) .footer-live-visual{height:680px}:where(html[data-view="mobile"]) .footer-live-cta{top:38px}


/* Mobile hero seam fix: remove the mismatched paper panel, prevent the mint
   frame from crossing the portrait, and reserve the full dashboard height. */

  :where(html[data-view="mobile"]) .hero{height:1280px;min-height:1280px;background:#fafbf9}
  :where(html[data-view="mobile"]) .hero-grid{min-height:1170px;background:#fafbf9}
  :where(html[data-view="mobile"]) .hero-person{z-index:1;left:0;right:auto;top:350px;width:100vw;height:530px;aspect-ratio:auto;transform:none;background:transparent;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 82%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 82%,transparent 100%)}
  :where(html[data-view="mobile"]) .hero-person video{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:61% center;filter:saturate(.82) brightness(1.035) contrast(.94);mix-blend-mode:normal}
  :where(html[data-view="mobile"]) .hero-device{z-index:3;top:790px;height:390px;background:transparent;overflow:visible}
  :where(html[data-view="mobile"]) .hero-device-frame{display:none}
  :where(html[data-view="mobile"]) .hero-device-dashboard-shell{left:0;top:0;width:100%;height:auto;aspect-ratio:1.376;padding:5px;background:rgba(204,204,204,.2);border-radius:23px;box-shadow:0 18px 36px rgba(0,0,0,.13)}
  :where(html[data-view="mobile"]) .hero-device-dashboard{display:block;width:100%!important;height:100%!important;border-radius:19px;object-fit:cover}


/* Mobile footer: a single white → photograph → black composition. */

  :where(html[data-view="mobile"]) .site-footer-live{height:1030px!important;background:#000!important;overflow:hidden}
  :where(html[data-view="mobile"]) .footer-live-visual{height:730px;background:#000;isolation:isolate;overflow:hidden}
  :where(html[data-view="mobile"]) .footer-live-visual>img{z-index:0;width:100%;height:100%;object-fit:cover;object-position:50% 48%;transform:scale(1.02);transform-origin:center}
  :where(html[data-view="mobile"]) .footer-live-visual:before, :where(html[data-view="mobile"]) .footer-live-visual:after{inset:-1px;z-index:1}
  :where(html[data-view="mobile"]) .footer-live-visual:before{background:linear-gradient(to bottom,#fafafa 0%,rgba(250,250,250,.99) 8%,rgba(250,250,250,.86) 16%,rgba(250,250,250,.48) 25%,rgba(250,250,250,0) 37%)}
  :where(html[data-view="mobile"]) .footer-live-visual:after{background:linear-gradient(to bottom,rgba(0,0,0,0) 43%,rgba(0,0,0,.08) 55%,rgba(0,0,0,.4) 69%,rgba(0,0,0,.82) 84%,#000 100%)}
  :where(html[data-view="mobile"]) .footer-live-cta{z-index:2;top:28px;left:22px;right:22px}
  :where(html[data-view="mobile"]) .footer-live-cta h2{width:auto;margin:0;font-size:clamp(23px,6vw,27px);line-height:1.05;letter-spacing:-1px;white-space:nowrap}
  :where(html[data-view="mobile"]) .footer-live-cta>p{max-width:none;margin:14px auto 0;font-size:clamp(11px,3.1vw,13px);line-height:1.35;color:#858585;white-space:nowrap}
  :where(html[data-view="mobile"]) .footer-live-call{width:180px;height:46px;margin-top:22px;font-size:15px;line-height:46px;box-shadow:0 12px 25px rgba(0,0,0,.22)}
  :where(html[data-view="mobile"]) .footer-live-call span, :where(html[data-view="mobile"]) .footer-live-call b{height:46px}:where(html[data-view="mobile"]) .footer-live-call b{top:46px}:where(html[data-view="mobile"]) .footer-live-call:hover span, :where(html[data-view="mobile"]) .footer-live-call:focus-visible span{transform:translateY(-46px)}:where(html[data-view="mobile"]) .footer-live-call:hover b, :where(html[data-view="mobile"]) .footer-live-call:focus-visible b{transform:translateY(-46px)}
  :where(html[data-view="mobile"]) .footer-live-bottom{height:301px;margin-top:-1px;background:#000}
  :where(html[data-view="mobile"]) .footer-live-inner{height:100%;padding:42px 24px 0}
  :where(html[data-view="mobile"]) .footer-live-statement p{font-size:29px;line-height:1.08}
  :where(html[data-view="mobile"]) .footer-live-legal{margin-top:56px}


/* Production connector system — consistent line, dot, spacing and reveal. */
.shift-mark{width:24px;height:24px;aspect-ratio:1;object-fit:contain;transform-origin:50% 50%;backface-visibility:hidden}
.story-shift-connector{width:100%;height:112px;background:#f8f8f6}
.story-shift-connector.section-pin{--pin-inset:17px}


  :where(html[data-view="mobile"]) .section-pin{--pin-inset:9px}
  :where(html[data-view="mobile"]) .section-pin::before{width:1px;background:rgba(0,0,0,.2)}
  :where(html[data-view="mobile"]) .section-pin>i{width:6px!important;height:6px!important;background:#006f51!important}
  :where(html[data-view="mobile"]) .scroll-cue.section-pin{height:96px}
  :where(html[data-view="mobile"]) .meet-line-top{display:block;height:96px;margin:44px auto 0}
  :where(html[data-view="mobile"]) .meet-line-bottom{display:block;height:96px;margin:38px auto 0}
  :where(html[data-view="mobile"]) .reality-connector-top, :where(html[data-view="mobile"]) .reality-connector-bottom{height:84px}
  :where(html[data-view="mobile"]) .story-shift-connector{height:104px;background:#f8f8f6}
  :where(html[data-view="mobile"]) .featured-connector.section-pin{height:106px;--pin-inset:16px}
  :where(html[data-view="mobile"]) .impact-footer-connector.section-pin{height:126px;--pin-inset:17px}

  :where(html[data-view="mobile"]) .shift-panel-rails{height:96px;position:relative;background:#050505}
  :where(html[data-view="mobile"]) .shift-panel-rails i:first-child{display:block;left:50%;top:29px;width:1px;height:38px;background:#315b50;transform:translateX(-50%) scaleY(.01);transform-origin:center;transition:transform .72s cubic-bezier(.22,1,.36,1)}
  :where(html[data-view="mobile"]) .shift-panel-rails i:first-child:before, :where(html[data-view="mobile"]) .shift-panel-rails i:first-child:after{width:6px;height:6px;background:#006f51}
  :where(html[data-view="mobile"]) .shift-panel-rails.is-drawn i:first-child{transform:translateX(-50%) scaleY(1)}
  :where(html[data-view="mobile"]) .shift-panel-rails i:last-child{display:none}


/* Final responsive refinement: viewport-safe menu and consistent section rhythm. */

  :where(html[data-menu="drawer"]) body.menu-open{overflow:hidden;overscroll-behavior:none}
  :where(html[data-menu="drawer"]) body.menu-open .site-header{transform:none;background:#080808;border-bottom-color:#252525;backdrop-filter:none;-webkit-backdrop-filter:none}
  :where(html[data-menu="drawer"]) body.menu-open .brand-image{filter:invert(1)}
  :where(html[data-menu="drawer"]) body.menu-open .menu-button{z-index:103}
  :where(html[data-menu="drawer"]) body.menu-open .menu-button i{position:absolute;left:50%;top:50%;width:20px;margin:0;background:#fff;transform-origin:center}
  :where(html[data-menu="drawer"]) body.menu-open .menu-button i:first-of-type{transform:translate(-50%,-50%) rotate(45deg)}
  :where(html[data-menu="drawer"]) body.menu-open .menu-button i:last-of-type{transform:translate(-50%,-50%) rotate(-45deg)}
  :where(html[data-menu="drawer"]) .mobile-menu{position:fixed;inset:0;width:100vw;height:100dvh;min-height:100vh;box-sizing:border-box;z-index:99;padding:92px 24px 28px;background:#080808;color:#fff;overflow-y:auto;overscroll-behavior:contain}
  :where(html[data-menu="drawer"]) .mobile-menu-inner{width:min(100%,720px);height:100%;min-height:520px;margin:0 auto;display:flex;flex-direction:column}
  :where(html[data-menu="drawer"]) .mobile-menu p{position:static;margin:0 0 10px;text-transform:uppercase;color:#8b8b8b;font-size:11px;line-height:1.2;letter-spacing:.14em}
  :where(html[data-menu="drawer"]) .mobile-menu a, :where(html[data-menu="drawer"]) .mobile-menu button{flex:0 0 auto;min-height:62px;margin:0;padding:14px 0;border:0;border-bottom:1px solid #343434;background:transparent;color:#fff;font-size:clamp(31px,7vw,46px);line-height:1.05;letter-spacing:-.045em;text-decoration:none}
  :where(html[data-menu="drawer"]) .mobile-menu a span, :where(html[data-menu="drawer"]) .mobile-menu button span{font-size:.65em;color:#bdbdbd}
  :where(html[data-menu="drawer"]) .mobile-menu button:first-of-type{margin-top:auto}



  :where(html[data-menu="drawer"]) .mobile-menu{padding:82px 20px max(22px,env(safe-area-inset-bottom))}
  :where(html[data-menu="drawer"]) .mobile-menu-inner{min-height:500px}
  :where(html[data-menu="drawer"]) .mobile-menu a, :where(html[data-menu="drawer"]) .mobile-menu button{min-height:58px;padding:12px 0;font-size:clamp(30px,8vw,38px)}

  :where(html[data-view="mobile"]) .reality-intro{height:390px;grid-template-rows:96px 1fr 96px;padding:0 18px;overflow:hidden}
  :where(html[data-view="mobile"]) .reality-connector-top, :where(html[data-view="mobile"]) .reality-connector-bottom{height:96px;align-self:stretch}
  :where(html[data-view="mobile"]) .reality-intro-copy{align-self:center;justify-self:stretch;padding:0}
  :where(html[data-view="mobile"]) .reality-intro h2{margin:0 auto;max-width:380px}
  :where(html[data-view="mobile"]) .reality-story{padding-top:48px}

  :where(html[data-view="mobile"]) .scroll-cue.section-pin, :where(html[data-view="mobile"]) .meet-line-top, :where(html[data-view="mobile"]) .meet-line-bottom, :where(html[data-view="mobile"]) .reality-connector-top, :where(html[data-view="mobile"]) .reality-connector-bottom{height:96px}
  :where(html[data-view="mobile"]) .story-shift-connector{height:104px}
  :where(html[data-view="mobile"]) .featured-connector.section-pin{height:106px;--pin-inset:16px}
  :where(html[data-view="mobile"]) .impact-footer-connector.section-pin{height:112px;--pin-inset:14px}



  :where(html[data-view="desktop"]) .scroll-cue.section-pin, :where(html[data-view="desktop"]) .meet-line-top, :where(html[data-view="desktop"]) .meet-line-bottom, :where(html[data-view="desktop"]) .story-shift-connector{height:126px}
  :where(html[data-view="desktop"]) .reality-intro{height:336px;grid-template-rows:78px 1fr 78px}
  :where(html[data-view="desktop"]) .reality-connector-top, :where(html[data-view="desktop"]) .reality-connector-bottom{height:78px;align-self:stretch}
  :where(html[data-view="desktop"]) .reality-connector-top{transform:translateY(7px)}
  :where(html[data-view="desktop"]) .featured-connector.section-pin{height:110px;--pin-inset:18px}
  :where(html[data-view="desktop"]) .impact-footer-connector.section-pin{height:126px;--pin-inset:17px}




/* Final type-role locks: these intentionally follow all responsive rules. */
.hero h1{font-family:var(--font-display);font-weight:600;line-height:1.02;letter-spacing:-.045em}
.meet h2,.flow-heading h2{font-family:var(--font-display);font-weight:600;line-height:1.05;letter-spacing:-.036em}
.system-copy-head h3{font-family:var(--font-display);font-weight:600;line-height:1.08;letter-spacing:-.04em}
.footer-live-cta h2,.footer-live-statement p{font-family:var(--font-display);font-weight:600}
.meet-kicker,.system-tab-label,.founder-terminal,.reality-terminal,.next-command code{font-family:var(--font-eyebrow)}
.reality-restart{min-width:44px;min-height:44px;font:500 15px/1 var(--font-control)}
.impact-live-eyebrow,.desktop-nav{font-family:var(--font-nav)}

/* Audited typography roles: hero support copy and impact metrics. */
.hero-copy strong{
  font-family:var(--font-display);
  font-weight:600;
}
.hero-copy p{
  font-family:var(--font-body);
  font-weight:400;
  letter-spacing:-.01em;
}
.hero-copy em{
  font-family:var(--font-body);
  font-weight:500;
}
.impact-live-card h3{
  font-family:var(--font-display);
  font-weight:600;
  letter-spacing:-.025em;
}
.impact-live-card p{
  font-family:var(--font-body);
  font-weight:400;
  letter-spacing:-.008em;
}

/* translateY(-50%) must be repeated in every state here: `transform` replaces
   the whole list, so a bare scaleY() would drop the centering from
   .nav-label:after and leave the rule sitting 10px (half its height) low. */
@keyframes home-nav-rule-draw{to{transform:translateY(-50%) scaleY(1)}}
.desktop-nav>span::after{transform:translateY(-50%) scaleY(0);transform-origin:top center;animation:home-nav-rule-draw .65s cubic-bezier(.22,1,.36,1) .18s forwards}
@media (prefers-reduced-motion:reduce){.desktop-nav>span::after{animation:none;transform:translateY(-50%)}}

html{-webkit-text-size-adjust:100%}

/* Header/drawer token scope. Left ungated: these are custom properties only,
   they paint nothing on their own, and the drawer needs them to resolve in the
   desktop tier too now that the burger appears below 880px. */

  .site-header, .mobile-menu{
    --bg:#FAFAFA;--paper-1:#FAFAF8;--paper-2:#F6F5F3;--paper-3:#F1F1EA;
    --ink:#0A0A0A;--ink-warm:#16160F;--ink-2:#1C1C1C;--black:#000;--white:#fff;
    --muted:#6F6F66;--muted-2:#9A9A9A;--muted-3:#9B9B92;--footer-muted:#848484;
    --ink-56:rgba(0,0,0,.56);--ink-60:rgba(0,0,0,.60);--line:#E5E5EA;
    --green:#1B8B3A;--green-deep:#00573F;--mint:#D9E8E2;--green-tint:#E5F4EA;
    --crimson:#A51C30;--crimson-2:#D64045;--band:#16160F;--band-2:#0A0A0A;
    --white-56:rgba(255,255,255,.56);--white-20:rgba(255,255,255,.2);--white-12:rgba(255,255,255,.12);
    --cta-bg:#000;--cta-text:#fff;
    --font-display:"Bricolage Grotesque",system-ui,sans-serif;
    --font-body:"Geist","Inter",system-ui,sans-serif;
    --font-mono:"Kode Mono",ui-monospace,monospace;
    --font-overline:"Inter",system-ui,sans-serif;
    --fs-body:16px;--fs-small:clamp(12px,1vw,13px);--fs-eyebrow:13px;
    --ease:cubic-bezier(.22,1,.36,1);--dur:.7s;--dur-fast:.35s;
    box-sizing:border-box;
  }

  :where(html[data-view="mobile"]) .site-header{
    position:fixed;inset:0 0 auto 0;z-index:100;
    display:flex;align-items:center;justify-content:space-between;gap:1rem;
    height:64px;padding:0 16px;
    border-bottom:1px solid rgba(0,0,0,.12);
    background:rgba(250,250,250,.97);
    transition:transform .45s var(--ease),background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),backdrop-filter var(--dur-fast) var(--ease);
  }
  :where(html[data-view="mobile"]) .brand-image{width:min(213px,calc(100vw - 92px));height:auto}
  :where(html[data-menu="drawer"]) .menu-button{
    position:relative;z-index:103;display:grid;place-content:center;
    flex:0 0 44px;width:44px;height:44px;margin-left:auto;padding:0;
    border:0;border-radius:0;background:transparent;color:var(--ink);
    cursor:pointer;-webkit-tap-highlight-color:transparent;
  }
  :where(html[data-menu="drawer"]) .menu-button i{
    display:block;width:20px;height:1px;margin:3px 0;background:currentColor;
    transition:transform 220ms var(--ease),background-color 180ms ease;
  }
  :where(html[data-menu="drawer"]) .menu-button:focus-visible{outline:2px solid var(--green);outline-offset:-4px}
  :where(html[data-menu="drawer"]) body.menu-open .site-header{height:64px;padding:0 16px;background:var(--band);border-bottom-color:var(--white-12)}
  :where(html[data-menu="drawer"]) body.menu-open .menu-button{color:var(--white)}
  :where(html[data-menu="drawer"]) body.menu-open .menu-button i{width:20px;margin:0;background:currentColor}

  :where(html[data-menu="drawer"]) .mobile-menu{
    position:fixed;inset:0;z-index:99;width:100vw;height:100dvh;min-height:100vh;
    padding:calc(64px + 24px) 20px max(24px,env(safe-area-inset-bottom));
    overflow-y:auto;overscroll-behavior:contain;
    background:var(--band);color:var(--white);
    font-family:var(--font-body);font-size:var(--fs-body);font-weight:400;line-height:1.5;
    -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;
  }
  :where(html[data-menu="drawer"]) .mobile-menu-inner{
    width:min(100%,720px);min-height:calc(100dvh - 112px);height:auto;
    margin:0 auto;display:flex;flex-direction:column;
  }
  :where(html[data-menu="drawer"]) .mobile-menu p{
    margin:0 0 8px;color:var(--white-56);
    font:500 var(--fs-eyebrow)/1.2 var(--font-overline);
    letter-spacing:-.6px;text-transform:uppercase;
  }
  :where(html[data-menu="drawer"]) .mobile-menu a, :where(html[data-menu="drawer"]) .mobile-menu button{
    min-height:56px;margin:0;padding:13px 0;
    display:flex;align-items:center;justify-content:space-between;
    border:0;border-bottom:1px solid var(--white-20);border-radius:0;
    background:transparent;color:var(--white);
    font:600 clamp(28px,8vw,38px)/1.05 var(--font-display);
    letter-spacing:-.036em;text-align:left;text-decoration:none;cursor:pointer;
  }
  :where(html[data-menu="drawer"]) .mobile-menu a span, :where(html[data-menu="drawer"]) .mobile-menu button span{color:var(--white-56);font:400 20px/1 var(--font-body)}
  :where(html[data-menu="drawer"]) .mobile-menu a:focus-visible, :where(html[data-menu="drawer"]) .mobile-menu button:focus-visible{outline:2px solid var(--green);outline-offset:3px}
  :where(html[data-menu="drawer"]) .mobile-menu button[data-flow-open="buy"]{
    min-height:52px;margin-top:auto;padding:0 22px;
    border:1px solid var(--white);border-radius:999px;
    background:var(--white);color:var(--black);
    font:500 16px/1 var(--font-overline);letter-spacing:0;
  }
  :where(html[data-menu="drawer"]) .mobile-menu button[data-flow-open="sell"]{
    min-height:52px;margin-top:12px;padding:0 22px;
    border:1px solid var(--white-56);border-radius:999px;
    background:transparent;color:var(--white);
    font:500 16px/1 var(--font-overline);letter-spacing:0;
  }
  :where(html[data-menu="drawer"]) .mobile-menu button[data-flow-open] span{font-size:16px}


@media (prefers-reduced-motion:reduce){
  .site-header,.menu-button i{transition:none!important}
}

/* Reference-matched mobile drawer: light, compact and aligned to the header.
   Runs to 1439.98px so tablet gets the same light drawer as phone (the desktop
   nav only takes over at 1440px, which is also where .menu-button hides). */

  :where(html[data-menu="drawer"]) body.menu-open .site-header{
    background:var(--bg);
    border-bottom-color:rgba(0,0,0,.12);
  }
  :where(html[data-menu="drawer"]) body.menu-open .brand-image{filter:none}
  :where(html[data-menu="drawer"]) body.menu-open .menu-button{color:var(--muted)}
  :where(html[data-menu="drawer"]) body.menu-open .menu-button i{background:currentColor}

  :where(html[data-menu="drawer"]) .mobile-menu{
    inset:64px 0 0;
    width:100%;
    height:calc(100dvh - 64px);
    min-height:0;
    padding:34px 17px max(32px,env(safe-area-inset-bottom));
    background:var(--bg);
    color:var(--ink);
    animation:mobile-menu-enter 220ms var(--ease) both;
  }
  :where(html[data-menu="drawer"]) .mobile-menu-inner{
    width:100%;
    min-height:0;
    height:auto;
    margin:0;
    display:block;
  }
  :where(html[data-menu="drawer"]) .mobile-menu p{
    display:flex;
    align-items:center;
    height:28px;
    margin:0 0 23px 8px;
    color:var(--muted);
    font:400 16px/1.25 var(--font-body);
    letter-spacing:0;
    text-transform:none;
  }
  :where(html[data-menu="drawer"]) .mobile-menu p::after{
    content:"";
    width:1px;
    height:20px;
    margin-left:92px;
    background:rgba(0,0,0,.18);
  }
  :where(html[data-menu="drawer"]) .mobile-menu a:not(.mobile-menu-ask){
    min-height:40px;
    padding:8px;
    justify-content:flex-start;
    border:0;
    color:var(--muted);
    font:400 16px/1.25 var(--font-body);
    letter-spacing:0;
  }
  :where(html[data-menu="drawer"]) .mobile-menu .mobile-menu-ask{
    min-height:44px;
    margin-top:3px;
    padding:10px 0;
    justify-content:flex-start;
    gap:11px;
    border:0;
    color:var(--ink);
    font:400 16px/1.25 var(--font-body);
    letter-spacing:0;
  }
  :where(html[data-menu="drawer"]) .mobile-ask-mark{flex:0 0 20px;width:20px;height:20px}
  :where(html[data-menu="drawer"]) .mobile-menu .mobile-menu-ask span{
    color:inherit;
    font:inherit;
  }
  :where(html[data-menu="drawer"]) .mobile-menu-actions{
    display:flex;
    align-items:center;
    gap:9px;
    margin-top:22px;
  }
  :where(html[data-menu="drawer"]) .mobile-menu .mobile-menu-actions button[data-flow-open]{
    flex:0 0 auto;
    width:auto;
    min-width:72px;
    min-height:44px;
    height:44px;
    margin:0;
    padding:0 20px;
    justify-content:center;
    border-radius:999px;
    font:500 16px/1 var(--font-body);
    letter-spacing:0;
    text-align:center;
  }
  :where(html[data-menu="drawer"]) .mobile-menu .mobile-menu-actions button[data-flow-open="buy"]{
    border:1px solid var(--black);
    background:var(--black);
    color:var(--white);
  }
  :where(html[data-menu="drawer"]) .mobile-menu .mobile-menu-actions button[data-flow-open="sell"]{
    border:1px solid var(--muted-2);
    background:transparent;
    color:var(--ink);
  }
  :where(html[data-menu="drawer"]) .mobile-menu a:hover, :where(html[data-menu="drawer"]) .mobile-menu a:active{color:var(--ink)}
  :where(html[data-menu="drawer"]) .mobile-menu .mobile-menu-actions button:active{opacity:.72}


@keyframes mobile-menu-enter{
  from{opacity:0;transform:translateY(-6px)}
  to{opacity:1;transform:none}
}

@media (prefers-reduced-motion:reduce){
  .mobile-menu{animation:none!important}
}

/* ===== Footer: category nav + social row + live-matched CTA (2026-08-07) ===== */
.footer-live-nav{display:flex;flex-direction:column;gap:8px}
.footer-live-nav a{width:fit-content;color:rgba(255,255,255,.6);font:500 15px/1.6 var(--font-body);text-decoration:none;transition:color .15s}
.footer-live-nav a.is-current,.footer-live-nav a:hover{color:#fff}
.footer-live-social-row{display:flex;align-items:center;gap:28px}
.footer-live-socials{display:flex;align-items:center;gap:20px}
.footer-live-socials a{display:inline-flex;color:rgba(255,255,255,.55);transition:color .15s}
.footer-live-socials a:hover{color:#fff}
.footer-live-socials svg{width:17px;height:17px;fill:currentColor;display:block}

  :where(html[data-view="desktop"]) .footer-live-cta h2{font-weight:500;letter-spacing:-2.65px;white-space:nowrap;width:auto;margin:0 auto}
  :where(html[data-view="desktop"]) .footer-live-cta>p{color:rgb(153,153,153);font-weight:500}
  :where(html[data-view="desktop"]) .footer-live-statement p{font-weight:500}
  :where(html[data-view="desktop"]) .footer-live-statement p:nth-child(2){color:rgba(255,255,255,.48)}
  :where(html[data-view="desktop"]) .site-footer-live{height:1030px!important}
  :where(html[data-view="desktop"]) .footer-live-bottom{height:410px}
  :where(html[data-view="desktop"]) .footer-live-inner{padding-top:60px}
  :where(html[data-view="desktop"]) .footer-live-nav{margin-top:34px}
  :where(html[data-view="desktop"]) .footer-live-social-row{margin-top:42px}
  :where(html[data-view="desktop"]) .footer-live-social-row .footer-live-legal{width:auto;margin:0;white-space:nowrap}


/* Final CTA/footer geometry mirrors the supplied Plastic page reference. */

  :where(html[data-view="desktop"]) .footer-live-bottom{height:410px;background:#000}
  :where(html[data-view="desktop"]) .footer-live-bottom:before, :where(html[data-view="desktop"]) .footer-live-bottom:after{display:none}
  :where(html[data-view="desktop"]) .footer-live-inner{width:100%;max-width:none;margin:0;padding:60px clamp(24px,4.5vw,88px) 0}
  :where(html[data-view="desktop"]) .footer-live-statement p{font:500 30px/37.5px var(--font-display);letter-spacing:-.03em}
  :where(html[data-view="desktop"]) .footer-live-nav{margin-top:28px;gap:13.6px}
  :where(html[data-view="desktop"]) .footer-live-nav a{font:500 14px/1.2 var(--font-body)}
  :where(html[data-view="desktop"]) .footer-live-social-row{margin-top:28px;gap:24px}
  :where(html[data-view="desktop"]) .footer-live-socials{gap:16px}
  :where(html[data-view="desktop"]) .footer-live-socials svg{width:18px;height:18px}
  :where(html[data-view="desktop"]) .footer-live-legal{width:auto;margin:0;white-space:nowrap;font:500 13px/1.2 var(--font-body);letter-spacing:0}

.footer-live-legal span:last-of-type,.footer-live-legal a[href="/privacy-policy/"]{display:none}

/* ============================================================
   FINAL CTA + FOOTER — ported verbatim from the plastic build
   (plastic/index.html + styles/sections.css). Token values
   resolved inline: --grid-margin, --white-56, --fs-hero/--fs-h2.
   ============================================================ */
.final-cta{
  position:relative;
  background-image:url("/assets/img/footer-facility.webp");
  background-size:cover;
  background-position:center;
  aspect-ratio:1296/645;
  min-height:35rem;
  /* Without this the aspect-ratio resolves against min-height instead of the
     containing block (35rem x 1296/645 = 1125px) and the section overflows any
     viewport narrower than 1125px. Capping the width lets min-height simply
     letterbox the photo, which background-size:cover already handles. */
  max-width:100%;
}
/* photo's own bottom third fades to black so it flows into the footer */
.final-cta::after{
  content:"";position:absolute;inset:auto 0 0 0;height:34%;
  background:linear-gradient(180deg,rgba(2,2,2,0) 0%,rgba(2,2,2,.55) 45%,rgba(2,2,2,.92) 80%,#020202 100%);
  pointer-events:none;
}
/* light page background eases into the photo at the top */
.final-cta::before{
  content:"";position:absolute;inset:-2px 0 auto 0;height:20%;
  background:linear-gradient(180deg,#fafafa 0%,rgba(250,250,250,.75) 35%,rgba(250,250,250,.28) 70%,rgba(250,250,250,0) 100%);
  pointer-events:none;
}
/* heading/sub/button centred inside the photo's sky band (top 35%) */
.final-cta__content{
  position:absolute;inset:0 0 auto 0;height:35%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1.25rem;text-align:center;padding:0 clamp(1.25rem,4.5vw,5.5rem);
  z-index:2;
}
.final-cta .title-hero{
  margin:0;color:#000;max-width:22ch;
  font-family:var(--font-display);font-weight:600;font-size:38px;
  letter-spacing:-.045em;line-height:1.02;text-wrap:balance;
}
.final-cta .sub{
  margin:0;color:#0a0a0a;max-width:40rem;
  font-family:var(--font-body);font-size:17px;line-height:1.5;
}
.final-cta .cta-row{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center}
/* Call Now pill with 3D rotateX flip to the phone number */
.final-cta .btn{
  display:inline-flex;flex-flow:row;place-content:center;align-items:center;gap:12px;
  height:50px;padding:0 22px;width:min-content;border-radius:999px;
  font-family:var(--font-body);font-weight:500;font-size:15px;line-height:1.3;
  cursor:pointer;text-decoration:none;white-space:nowrap;
}
.final-cta .btn--primary{background:#000;color:#fff;border:1px solid #000;transition:background .35s var(--ease),border-color .35s var(--ease)}
.final-cta .btn--primary:hover{background:#2c2c2c;border-color:#2c2c2c}
.btn-flip{perspective:420px}
.btn-flip__inner{display:grid;transform-style:preserve-3d;transition:transform .5s var(--ease)}
.btn-flip__face{grid-area:1/1;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.btn-flip__face--alt{transform:rotateX(180deg)}
.btn-flip:hover .btn-flip__inner,.btn-flip:focus-visible .btn-flip__inner{transform:rotateX(180deg)}

.rk-footer{position:relative;color:#fff;background:#020202}
.rk-footer .footer-content{
  min-height:22vh;display:flex;align-items:flex-end;
  padding:2.5rem clamp(1.25rem,4.5vw,5.5rem) 2rem;
}
.rk-footer .footer-tagline{
  margin:0;font-family:var(--font-display);font-weight:500;font-size:30px;
  letter-spacing:-.03em;line-height:1.25;color:#fff;text-align:left;
}
.rk-footer .footer-tagline .muted{color:rgba(255,255,255,.56)}
.rk-footer .footer-links{
  display:flex;flex-direction:column;align-items:flex-start;gap:.85rem;
  padding:1.75rem clamp(1.25rem,4.5vw,5.5rem);
}
.rk-footer .footer-links a{
  color:rgba(255,255,255,.56);font-family:var(--font-body);font-size:14px;font-weight:500;
  text-decoration:none;transition:color .35s;
}
.rk-footer .footer-links a:hover{color:#fff}
.rk-footer .footer-legal{
  display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem;justify-content:flex-start;
  padding:0 clamp(1.25rem,4.5vw,5.5rem) 1.5rem;
  color:rgba(255,255,255,.56);font-family:var(--font-body);font-size:13px;text-align:left;
}
.rk-footer .footer-legal a{color:rgba(255,255,255,.56);text-decoration:underline;text-underline-offset:2px;transition:color .35s}
.rk-footer .footer-legal a:hover{color:#00573F}
.rk-footer .footer-legal__text{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}
/* .page-bottom-button is fixed at right:16px and is 48px wide. With only one
   legal link the row stopped well short of it, but adding Privacy Policy pushed
   the row far enough right that the button covered the tail of it — clipped to
   read "Privacy Polic" and, worse, the last few pixels hit-tested to the button
   instead of the link. Reserve the button's lane so the row wraps instead. */
:where(html[data-view="mobile"]) .rk-footer .footer-legal__text{padding-right:64px}
.rk-footer .footer-legal__item{display:inline-flex;align-items:center;gap:.6rem}
.rk-footer .footer-social{display:flex;align-items:center;gap:1rem;order:-1}
.rk-footer .footer-social a{color:rgba(255,255,255,.56);line-height:0;transition:color .35s}
.rk-footer .footer-social a:hover{color:#fff}
.rk-footer .footer-social svg{width:18px;height:18px;display:block}

  :where(html[data-view="mobile"]) .final-cta{aspect-ratio:auto;min-height:30rem}
  :where(html[data-view="mobile"]) .final-cta__content{gap:.5rem;padding:0 1.5rem}
  :where(html[data-view="mobile"]) .final-cta .title-hero{font-size:clamp(1.4rem,5.5vw,1.7rem);line-height:1.15}
  :where(html[data-view="mobile"]) .final-cta .sub{font-size:13px;line-height:1.35}
  :where(html[data-view="mobile"]) .rk-footer .footer-links{gap:1.25rem 1.5rem}

@media(prefers-reduced-motion:reduce){.btn-flip__inner{transition:none}}
/* Desktop: "Call Now" buttons act as Transact — label swap (behavior handled in home.js) */
.call-pill .call-pill__pc{display:none}
.btn-flip__pc{display:none}
.final-cta .sub-pc{display:none}
:where(html[data-view="desktop"]) .call-pill>span:not(.call-pill__pc),:where(html[data-view="desktop"]) .call-pill>b{display:none}
:where(html[data-view="desktop"]) .call-pill .call-pill__pc{display:grid;transform:none;transition:none}
:where(html[data-view="desktop"]) .call-pill:hover .call-pill__pc,:where(html[data-view="desktop"]) .call-pill:focus-visible .call-pill__pc{transform:none}
:where(html[data-view="desktop"]) .call-pill:hover{width:180px}
:where(html[data-view="desktop"]) .btn-flip .btn-flip__inner{display:none}
:where(html[data-view="desktop"]) .btn-flip .btn-flip__pc{display:flex;align-items:center;justify-content:center}
:where(html[data-view="desktop"]) .final-cta .sub-mobile{display:none}
:where(html[data-view="desktop"]) .final-cta .sub-pc{display:inline}

/* ─── Desktop down-scale ────────────────────────────────────────────────────
   The desktop composition is a fixed-pixel canvas roughly 1200px wide, built
   from absolutely-positioned layers on fixed section heights. When the CSS
   viewport is narrower than that — an iPad, a small laptop, a resized window,
   or any browser zoom level — each self-contained section scales down
   proportionally instead of reflowing, so the desktop layout is preserved
   exactly at every width rather than switching to a different design.

   --z is supplied by the inline script in index.html and is clamped to 1 at
   1240px and above, so nothing changes at all for a normal desktop. Without
   JS it falls back to 1 (the layout simply stops scaling).

   `zoom` is used rather than `transform:scale()` because it participates in
   layout: section heights, document height and getBoundingClientRect() all
   stay consistent, which the scroll-driven animations in home.js depend on.

   .meet, .reality-intro, .reality-story, .featured-live and the footer are
   deliberately excluded — they are already fluid, and .reality-sticky is a
   100vh sticky viewport that zoom would shrink away from the screen edges. */
html[data-view="desktop"] .hero,
html[data-view="desktop"] .operations,
html[data-view="desktop"] .shift-live,
html[data-view="desktop"] .impact-live,
html[data-view="desktop"] .impact-footer-connector{
  zoom:var(--z,1);
}

/* Inter, pointed at the same two files /plastic/ already ships. Without these
   the nav silently fell back to Arial and the two headers could never match.
   Shared path rather than a second copy, so the browser reuses the cached font
   when moving between the pages. */
@font-face{
  font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;
  src:url("/plastic/assets/fonts/Inter-Regular-latin.woff2") format("woff2");
}
@font-face{
  font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;
  src:url("/plastic/assets/fonts/Inter-Medium-latin.woff2") format("woff2");
}

/* ─── Header: shared geometry with /plastic/ ────────────────────────────────
   .desktop-nav is absolutely centred, so it cannot shrink or push its
   neighbours — below a certain width it slides underneath the brand on one
   side and the actions on the other. /plastic/ solves this by swapping the
   centred nav for the burger before they can meet, and this reproduces that,
   holding the nav down to 880px.

   Geometry only: the 64px bar, 16px gutter, .12 hairline, 213px logo, 36px nav
   gap and Inter 16px/400 all match /plastic/ exactly, and the 64px/16px/.12
   values are already what the phone header uses, so all three now agree.
   Colour and scroll behaviour are deliberately NOT copied — this header stays
   light with the black logo and keeps its hide-on-scroll-down.

   The header is intentionally outside the --z down-scale above: /plastic/'s bar
   does not scale either, and a shrinking fixed bar would read as a bug. */
html[data-view="desktop"] .site-header{
  height:64px;
  padding:0 16px;
  border-bottom:1px solid rgba(0,0,0,.12);
}
html[data-view="desktop"] .brand-image{width:213px;height:auto}
html[data-view="desktop"] .desktop-nav{
  gap:36px;
  font-family:"Inter",var(--font-body),system-ui,sans-serif;
  font-size:16px;
  font-weight:400;
}
/* "Categories" keeps its hairline centred in the 72px it shares with Plastic,
   matching the <li class="nav-divider"> /plastic/ uses for the same job. */
html[data-view="desktop"] .nav-label{margin-right:37px}
html[data-view="desktop"] .nav-label:after{right:-36.5px;height:20px;background:#d8d8d3}
/* Buy / Sell sized to /plastic/'s .btn--sm (39px tall, 20px side padding)
   instead of the old fixed 64px width, and to its 15px/500 label. */
html[data-view="desktop"] .header-actions .header-flow-button.pill-dark,
html[data-view="desktop"] .header-actions .header-flow-button.pill-outline{
  width:auto;
  height:34px;
  min-height:34px;
  padding:0 14px;
  border-radius:999px;
  font-size:13px;
  font-weight:500;
}
/* /plastic/'s .btn--primary carries a 1px border the same colour as its fill,
   so Buy measures 68.9px like Sell rather than 66.9px. Invisible, but it is
   what keeps the actions run at 235.9px. */
html[data-view="desktop"] .header-actions .header-flow-button.pill-dark{
  border:1px solid #050505;
}
/* Each nav item carries /plastic/'s 6px 8px padding — without it the cluster
   measures 401.6px against its 466.6px and the two headers never line up. */
html[data-view="desktop"] .desktop-nav > a,
html[data-view="desktop"] .desktop-nav > .nav-label{padding:6px 8px}
/* Ask matched to /plastic/'s .btn--ask, and its trailing hairline rebuilt as a
   1px x 20px rule in the gap (it was a full-height border-right) so the run
   totals the same 235.9px: 73.1 + 8 + 1 + 8 + 68.9 + 8 + 68.9. */
html[data-view="desktop"] .ask-link{
  position:relative;
  height:39px;
  margin-right:9px;
  padding:0 10px;
  border-right:0;
  gap:8px;
  font-size:15px;
  font-weight:500;
}
html[data-view="desktop"] .ask-link:after{
  content:"";position:absolute;right:-8.5px;top:50%;
  width:1px;height:20px;background:#d8d8d3;transform:translateY(-50%);
}

/* Full nav ⇄ drawer. data-menu is set by the inline script in index.html:
   "drawer" for a phone or a desktop narrower than NAV_MIN, "full" otherwise.
   Using the flag rather than a bare media query keeps a phone in landscape
   (wider than NAV_MIN) on the drawer, where it belongs.

   NAV_MIN is 1024 — /plastic/'s own breakpoint. It is not a preference: with
   the matched metrics the centred nav is 466.6px and the actions 235.9px, so
   the right-hand gap is (viewport / 2) - 485.2 and reaches zero at 970px.
   Anything below ~1000 overlaps by construction. */
:where(html[data-menu="drawer"]) .desktop-nav{display:none}
:where(html[data-menu="full"]) .menu-button{display:none}
/* Ask / Buy / Sell stay alongside the burger, exactly as on /plastic/. */
html[data-view="desktop"][data-menu="drawer"] .header-actions{display:flex}
html[data-view="desktop"][data-menu="drawer"] .menu-button{margin-left:12px}

/* ─── Drawer: /plastic/'s panel, verbatim ───────────────────────────────────
   Measured off /plastic/ at 605px: 96px/4.5vw/32px padding, a 22.4px flex
   column, Bricolage Grotesque 25.6px/500 at -.03em, "Categories" at half
   opacity, and Buy/Sell stacked as 50px pills. It slides down over .5s from
   translateY(-100%) — home.js swapped the `hidden` toggle for .is-open so the
   transform actually has something to animate from. */
/* The closed state is deliberately UNGATED. home.js drops the `hidden`
   attribute at init so the panel has something to animate from, which makes
   CSS solely responsible for parking it off-screen — and that has to hold in
   every tier, not only where the burger exists. Gating this on
   data-menu="drawer" is what let the panel paint full-screen on desktop.
   Nothing tier-scoped may set transform/visibility on .mobile-menu, or it
   would outrank .is-open (0,2,0) and pin the drawer shut. */
.mobile-menu{transform:translateY(-100%);visibility:hidden}
.mobile-menu.is-open{transform:none;visibility:visible}
/* Belt and braces: it can never paint at a width where the burger is not
   reachable, even if a class goes stale. */
html[data-menu="full"] .mobile-menu{display:none}

html[data-menu="drawer"] .mobile-menu{
  position:fixed;inset:0;z-index:90;
  width:100%;height:100dvh;min-height:100vh;box-sizing:border-box;
  padding:96px 4.5vw 32px;
  background:var(--bg);
  overflow-y:auto;overscroll-behavior:contain;
  /* visibility is discrete: it flips to visible instantly on open and waits
     for the slide to finish on close, so the panel is never focusable while
     parked off-screen. */
  transition:transform .5s cubic-bezier(.22,1,.36,1),visibility .5s cubic-bezier(.22,1,.36,1);
  animation:none;
}
html[data-menu="drawer"] .mobile-menu-inner{
  width:100%;height:auto;min-height:0;margin:0;
  display:flex;flex-direction:column;align-items:flex-start;gap:22.4px;
}
/* Categories, the three categories and Ask all share one type role. */
html[data-menu="drawer"] .mobile-menu p,
html[data-menu="drawer"] .mobile-menu a{
  display:block;
  min-height:0;margin:0;padding:0;border:0;
  font-family:var(--font-display);
  font-size:1.6rem;font-weight:500;line-height:1.2;letter-spacing:-.03em;
  color:var(--ink);text-transform:none;text-decoration:none;
}
html[data-menu="drawer"] .mobile-menu p{opacity:.5;cursor:default}
/* This 1px x 20px rule belongs to the desktop nav; it was bleeding into the
   drawer as a stray line beside "Categories". */
html[data-menu="drawer"] .mobile-menu p:after{content:none}
/* Ask carries the ChatGPT mark in the drawer too. The generic drawer-link rule
   above sets display:block, which strands the icon beside the label — this pair
   has to be flex for the gap and centring the rules at the top of the file
   already assume. */
html[data-menu="drawer"] .mobile-menu a.mobile-menu-ask{display:flex;align-items:center;gap:11px}
html[data-menu="drawer"] .mobile-ask-mark{flex:0 0 20px;width:20px;height:20px}
html[data-menu="drawer"] .mobile-menu-ask span{font:inherit;color:inherit}

html[data-menu="drawer"] .mobile-menu-actions{
  width:auto;margin:0;
  display:flex;flex-direction:column;align-items:flex-start;gap:22.4px;
}
/* Matches the existing (0,3,1) `.mobile-menu .mobile-menu-actions
   button[data-flow-open]` rule above, so these have to carry the same shape to
   win on source order rather than lose on specificity. */
html[data-menu="drawer"] .mobile-menu .mobile-menu-actions button[data-flow-open]{
  width:auto;height:50px;min-height:0;margin:0;padding:0 22px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;
  font-family:var(--font-body);font-size:15px;font-weight:500;line-height:1;
  letter-spacing:normal;
}
html[data-menu="drawer"] .mobile-menu .mobile-menu-actions button[data-flow-open="buy"]{
  background:var(--cta-bg);color:var(--cta-text);border:1px solid var(--cta-bg);
}
html[data-menu="drawer"] .mobile-menu .mobile-menu-actions button[data-flow-open="sell"]{
  background:var(--white);color:var(--ink);border:1px solid var(--black);
}

/* Drawer action pills — brought in line with the category pages' drawer
   (site-nav.css), which is the reference layout. Two separate faults made the
   landing drawer render these differently:

   1. Partners is an <a class="pill">, not a <button>, so the sizing rule above
      (button[data-flow-open] only) never reached it — it came out 31px tall
      instead of 50.
   2. The transact button carries `flex:1` from the earlier drawer rule. Inside
      a column flex container flex-basis governs the HEIGHT, so `flex-basis:0%`
      beat `height:50px` and collapsed the button to 17px. Resetting flex to
      `0 0 auto` lets the declared height stand.

   Selector shape is kept identical to the rule above so this wins on source
   order rather than losing on specificity. */
html[data-menu="drawer"] .mobile-menu .mobile-menu-actions .pill,
html[data-menu="drawer"] .mobile-menu .mobile-menu-actions button[data-flow-open]{
  flex:0 0 auto;
  width:auto;height:50px;min-height:0;margin:0;padding:0 22px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;
  font-family:var(--font-body);font-size:15px;font-weight:500;line-height:1;
  letter-spacing:normal;
}
html[data-menu="drawer"] .mobile-menu .mobile-menu-actions .pill-outline{
  background:var(--white);color:#0A0A0A;border:1px solid #000;
}
html[data-menu="drawer"] .mobile-menu .mobile-menu-actions button[data-flow-open="transact"]{
  flex:0 0 auto;width:auto;background:#000;color:#fff;border:1px solid #000;
}

/* Burger → X, matching /plastic/: 22 x 1.5px bars on a 5px grid gap, the
   middle one fading while the outer two rotate ±45°, all over .35s. */
html[data-menu="drawer"] .menu-button{
  display:grid;place-items:center;gap:5px;
  width:44px;height:44px;padding:0;
  /* align-content must be stretch, not center. /plastic/ leaves it at its
     initial value, so its three rows stretch to fill the 44px button
     ((44 - 2*5) / 3 = 11.33px each) and the bars sit 14.8px apart. An earlier
     rule here sets place-content:center, which collapses each row to the 1.5px
     bar and bunches them 5px apart — that is the whole visual difference. */
  align-content:stretch;
}
html[data-menu="drawer"] .menu-button i{
  position:static;
  width:22px;height:1.5px;margin:0;
  background:currentColor;
  /* /plastic/ specifies no timing function, so this is the default ease. */
  transition:transform .35s,opacity .35s,background .35s;
}
html[data-menu="drawer"] body.menu-open .menu-button i{position:static;width:22px;margin:0}
/* Open state is ink on the light panel, as on /plastic/ — the rule this
   overrides used --muted, and an earlier one used --white (invisible here). */
html[data-menu="drawer"] body.menu-open .menu-button{color:var(--ink)}
html[data-menu="drawer"] body.menu-open .menu-button i:nth-of-type(1){transform:translateY(6.5px) rotate(45deg)}
html[data-menu="drawer"] body.menu-open .menu-button i:nth-of-type(2){opacity:0}
html[data-menu="drawer"] body.menu-open .menu-button i:nth-of-type(3){transform:translateY(-6.5px) rotate(-45deg)}

@media (prefers-reduced-motion:reduce){
  html[data-menu="drawer"] .mobile-menu{transition:none}
  html[data-menu="drawer"] .menu-button i{transition:none}
}

