/* Loaded only above the existing mobile breakpoint. */
.desktop-only[hidden]{display:grid!important}
body:has(.desktop-hero) header{opacity:1;visibility:visible;pointer-events:auto}
.desktop-hero{position:relative;background:#f9f8eb;color:#111;grid-template-columns:minmax(0,39fr) minmax(0,61fr);align-items:center;gap:1.5vw;padding:150px max(4vw,30px) 90px;min-height:min(960px,100svh);overflow:hidden}
.desktop-hero-copy{position:relative;z-index:2;max-width:610px}
.desktop-hero h1{font-size:clamp(42px,4.5vw,84px);font-weight:600;line-height:1.04;letter-spacing:-.065em}
.desktop-hero .eyebrow{color:#335e4e;margin-bottom:24px}
.desktop-intro{font-size:clamp(14px,1.1vw,19px);line-height:1.7;margin-top:28px;max-width:490px}
.desktop-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.desktop-actions .button{gap:16px;background:#161b1b;color:#fff;min-height:52px;font-size:12px}
.desktop-actions .ghost{background:transparent;color:#171c1a;border:1px solid #57645c}
.growth-ecosystem{position:relative;min-width:0;margin:0 -4vw 0 -1vw;aspect-ratio:16/11;align-self:center}
.growth-ecosystem picture,.growth-ecosystem video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.growth-ecosystem img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.growth-ecosystem video{opacity:0;mix-blend-mode:multiply;pointer-events:none}
.growth-ecosystem video.ready{opacity:1}
.ecosystem-labels{position:absolute;bottom:2%;left:7%;right:8%;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;font-size:12px;color:#2d4c40}
.ecosystem-labels span+span:before{content:'→';margin-right:22px;color:#6a887a}
.loop-toggle{position:absolute;bottom:-30px;right:8%;border:0;background:transparent;color:#335e4e;font-size:11px;text-decoration:underline;text-underline-offset:4px;padding:10px}
.desktop-hero-next{position:absolute;bottom:22px;left:4vw;right:4vw;border-top:1px solid #18291e25;padding-top:16px;display:flex;justify-content:space-between;font-size:11px;letter-spacing:.08em;color:#375548}
#visual-intro{border-top:1px solid #97c5b42b}
#film-stage{display:grid;grid-template-columns:40% 60%;align-items:center}
.desktop-process{position:relative;z-index:3;padding:70px 0 50px 5vw;max-width:560px;align-content:center}
.desktop-process h2{font-size:clamp(36px,3.8vw,64px)}
.desktop-process>p:not(.eyebrow){margin:24px 0;color:var(--muted);font-size:16px;max-width:380px}
.desktop-process ol{padding:0;list-style:none;counter-reset:process;margin:0}
.desktop-process li{counter-increment:process;position:relative;padding:18px 0 18px 34px;border-top:1px solid #97c5b425}
.desktop-process li:before{content:'0' counter(process);position:absolute;left:0;top:19px;color:var(--mint);font-size:10px}
.desktop-process strong{display:block;font-size:14px;font-weight:500}
.desktop-process li span{display:block;font-size:12px;color:var(--muted);line-height:1.7;margin-top:4px;max-width:350px}
#film-stage .film-poster,#film-canvas{left:42%;top:14%;width:58%;height:72%;transform:none;object-fit:contain}
#film-stage .film-poster img{object-fit:contain;transform:none}
#film-stage .scroll-cue{left:72%;bottom:5%}
.home-title,.home-title+.hero-actions{display:none}
@media(max-width:1050px){.desktop-hero{grid-template-columns:42% 58%;padding-top:130px}.desktop-hero h1{font-size:44px}.desktop-intro{font-size:14px}.desktop-actions .button{padding:12px 15px;min-height:46px}.desktop-process{padding-left:4vw}.desktop-process>p:not(.eyebrow){font-size:14px}.desktop-process li{padding-block:12px}.desktop-process li:before{top:14px}}
@media(prefers-reduced-motion:reduce){#film-stage{min-height:720px;height:auto}.growth-ecosystem video{display:none}}
/* Blend the scene into the hero instead of presenting a rectangular player. */
.desktop-hero-copy,.desktop-process{font-family:Arial,sans-serif;font-style:normal}
.growth-ecosystem{aspect-ratio:16/9}
.growth-ecosystem picture,.growth-ecosystem video{mask-image:linear-gradient(to right,transparent,#000 7%,#000 94%,transparent),linear-gradient(to bottom,transparent,#000 9%,#000 91%,transparent);mask-composite:intersect}
.ecosystem-labels{bottom:-40px}

/* Balanced, borderless desktop Growth Machine section. */
#film-stage{grid-template-columns:1fr 1fr}
.desktop-process{width:100%;max-width:none;padding:100px 4vw 80px 6vw}
.desktop-process h2{font-size:clamp(36px,3.6vw,60px)}
.desktop-process>p:not(.eyebrow){max-width:440px}
.desktop-process li span{max-width:420px}
#film-stage .film-poster,#film-canvas{left:50%;top:50%;width:48%;height:auto;aspect-ratio:1600/894;transform:translateY(-50%);object-fit:contain;mask-image:radial-gradient(ellipse at center,#000 42%,transparent 72%);-webkit-mask-image:radial-gradient(ellipse at center,#000 42%,transparent 72%)}
#film-stage .film-poster img{display:block;width:100%;height:100%;object-fit:contain}
#film-stage .scroll-cue{display:none}
@media(max-width:1050px){.desktop-process{padding:100px 3vw 60px 4vw}.desktop-process li{padding-block:12px}}

/* Desktop process is now a compact text section; retain the mobile story. */
#visual-intro{height:auto!important}
#film-stage{position:relative;height:auto;min-height:0;display:block}
#film-stage .film-poster,#film-stage #film-canvas{display:none}
.desktop-process{max-width:1240px;margin-inline:auto;padding:90px 6vw;grid-template-columns:1fr 1fr;column-gap:6vw}
.desktop-process .eyebrow,.desktop-process h2,.desktop-process>p{grid-column:1}
.desktop-process ol{grid-column:2;grid-row:1/4;align-self:center}
.desktop-process>p:not(.eyebrow){margin-bottom:0}

/* A continuous, readable process section across screen sizes. */
#film-stage{background:#f9f8eb;color:#17241f}
.desktop-process{display:grid!important;grid-template-columns:1fr;gap:0;padding:80px 6vw 90px;max-width:1360px}
.desktop-process .eyebrow,.desktop-process h2,.desktop-process>p{grid-column:auto}
.desktop-process .eyebrow{color:#335e4e;margin-bottom:18px}
.desktop-process h2{font-size:clamp(36px,4vw,60px);line-height:1.08}
.desktop-process h2 br{display:none}
.desktop-process h2 em{margin-left:.18em;color:#335e4e}
.desktop-process>p:not(.eyebrow){max-width:620px;color:#52645a;margin:22px 0 38px;line-height:1.7}
.desktop-process ol{grid-column:auto;grid-row:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.desktop-process li{padding:26px 0 0;border-top:1px solid #aab8ab}
.desktop-process li:before{position:static;display:block;color:#335e4e;font-size:12px;margin-bottom:20px}
.desktop-process strong{font-size:18px;line-height:1.4}
.desktop-process li span{font-size:14px;color:#52645a;max-width:none;margin-top:12px}
#film-stage .mobile-story-copy{display:none!important}
@media(max-width:760px){
 .desktop-hero{grid-template-columns:1fr;gap:22px;padding:110px 24px 75px;min-height:0}
 .desktop-hero-copy{max-width:560px}
 .desktop-hero h1{font-size:clamp(40px,10vw,64px);line-height:1.06}
 .desktop-hero .eyebrow{font-size:10px;margin-bottom:20px}
 .desktop-intro{font-size:15px;margin-top:22px;max-width:100%}
 .desktop-actions{gap:10px;margin-top:24px}
 .desktop-actions .button{font-size:11px;padding:13px 16px;min-height:48px}
 .growth-ecosystem{width:calc(100% + 32px);margin:8px -16px 34px;aspect-ratio:16/9}
 .ecosystem-labels{bottom:-26px;left:0;right:0;gap:8px;font-size:10px}
 .ecosystem-labels span+span:before{margin-right:8px}
 .desktop-hero-next{left:24px;right:24px;font-size:10px}
 #film-stage{height:auto;min-height:0}
 .desktop-process{padding:56px 24px}
 .desktop-process h2{font-size:36px}
 .desktop-process ol{grid-template-columns:1fr;gap:24px}
 .desktop-process li{padding:22px 0 0}
 .desktop-process li:before{margin-bottom:12px}
 .desktop-process>p:not(.eyebrow){font-size:15px;margin-bottom:30px}
}

/* Never blend moving cards with a second, static copy of the scene. */
.growth-ecosystem{isolation:isolate}
.growth-ecosystem:has(video.ready) picture{visibility:hidden}