.story-track{position:relative;background:#f7f4ed}.story-track.is-live{height:420svh}
.story-stage{position:relative;height:100svh;overflow:hidden;background:#f7f4ed;color:#30352d}.is-live .story-stage{position:sticky;top:0}
.story-art{position:absolute;inset:0}.story-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--pos,80%) 50%;opacity:0;will-change:opacity,transform}
.story-pencil{opacity:1}
.story-model{filter:drop-shadow(0 30px 40px #6d5b3a33)}
.story-copy{position:absolute;z-index:4;left:var(--gutter,72px);top:15%;max-width:42%;transition:opacity .3s}
.story-kicker{font-size:9px;letter-spacing:.09em;color:#616c59;display:block;margin-bottom:34px}
.story-copy h1,.story-final h2{font-size:clamp(54px,6.3vw,100px);letter-spacing:-.065em;line-height:.99;font-weight:500}
.story-copy h1 em,.story-final h2 em{font-style:normal;color:#b83d27}
.story-copy p,.story-final p{font-size:14px;line-height:1.8;color:#4f5946;margin-top:26px;max-width:36ch}
.story-cta{display:inline-flex;justify-content:space-between;align-items:center;gap:30px;border-bottom:1px solid #536348;padding:13px 0;font-size:11px;margin-top:22px;color:#304226}.story-cta span{font-size:23px}
.story-final{position:absolute;z-index:4;left:0;right:0;bottom:0;padding:90px var(--gutter,72px) 96px;display:grid;grid-template-columns:auto 1fr;align-items:end;gap:6vw;background:linear-gradient(0deg,#f7f4eded 0%,#f7f4edc0 55%,transparent 100%);opacity:0;pointer-events:none;transform:translateY(18px);transition:opacity .45s,transform .45s}
.story-final h2{font-size:clamp(40px,4.6vw,76px)}.story-final p{margin:0 0 6px;max-width:30ch}.story-final .story-cta{margin:0;grid-column:2;justify-self:start}
.story-track[data-step="4"] .story-final{opacity:1;pointer-events:auto;transform:none}.story-track[data-step="4"] .story-copy{opacity:0;pointer-events:none}
.story-navigation{position:absolute;bottom:0;left:var(--gutter,72px);right:var(--gutter,72px);display:flex;justify-content:space-between;align-items:center;gap:30px;border-top:1px solid #b7bcaa;padding:20px 0 25px;z-index:5;background:#f7f4edd9}
.story-label{font-size:7px;letter-spacing:.08em;color:#617052}.story-navigation>div{display:flex;gap:27px}
.story-navigation button{font-size:10px;background:none;border:0;color:#6c7660;padding:8px 0;min-width:70px;display:flex;flex-direction:column;gap:13px;cursor:pointer;text-align:left}
.story-navigation i{height:2px;width:100%;background:#cdd0c1}.story-navigation button[aria-pressed=true]{color:#a53523}.story-navigation button[aria-pressed=true] i{background:#bd412d}
.story-navigation>a{font-size:9px}.story-note{position:absolute;right:24px;top:20%;font-size:6px;letter-spacing:.12em;writing-mode:vertical-rl;color:#7b826e;z-index:4}
.story-navigation button:focus-visible,.story-copy a:focus-visible,.story-final a:focus-visible{outline:2px solid #a53523;outline-offset:5px}
@media(max-width:849px){.story-track.is-live{height:380svh}.story-art{top:auto;height:56svh;bottom:64px;inset-inline:0}.story-frame{object-position:var(--pos-m,78%) 50%}.story-copy{top:9%;max-width:92%;right:24px}.story-copy h1{font-size:clamp(44px,11vw,70px)}.story-copy p{font-size:12px;max-width:30ch;margin-top:18px}.story-kicker{font-size:8px;margin-bottom:22px}.story-final{bottom:64px;padding:70px 24px 24px;grid-template-columns:1fr;gap:12px}.story-final h2{font-size:clamp(34px,9vw,52px)}.story-final .story-cta{grid-column:1}.story-navigation{flex-wrap:wrap;padding:12px 0;gap:8px}.story-navigation>div{order:3;width:100%;justify-content:space-between;gap:10px}.story-navigation button{flex:1;min-width:0;font-size:9px}.story-label,.story-note{display:none}.story-track[data-step="4"] .story-copy{display:none}}
@media(prefers-reduced-motion:reduce){.story-track.is-live{height:100svh}.story-track.is-live .story-stage{position:relative}.story-frame{opacity:0!important;transform:none!important}.story-maker{opacity:1!important}.story-final{opacity:1;transform:none;transition:none}.story-copy{display:none}.story-navigation>div{display:none}}
.story-copy:before{content:'';position:absolute;inset:-50px -90px -40px -90px;z-index:-1;background:radial-gradient(ellipse at 40% 50%,#f7f4edf2 50%,#f7f4ed00 78%);pointer-events:none}
.story-final{background:linear-gradient(0deg,#f7f4ed 0%,#f7f4edf2 38%,#f7f4ed00 100%);padding-top:130px}
.story-maker{transform-origin:50% 0}
@media(max-width:849px){.story-copy .story-cta{display:none}.story-copy:before{display:none}.story-final{top:8%;bottom:auto;padding:0 24px;background:none;grid-template-columns:1fr;align-content:start}.story-final p{margin:6px 0 0;max-width:34ch}.story-final h2{font-size:clamp(40px,11vw,60px)}}
.story-living{position:absolute;inset:0;opacity:0;pointer-events:none}.story-living canvas{width:100%;height:100%;display:block}.story-final{left:var(--gutter);right:auto;top:15%;bottom:auto;padding:0;display:block;background:none;max-width:38%;opacity:var(--final-opacity,0);transform:none;transition:none}.story-final:before{content:'';position:absolute;inset:-60px -100px -60px -90px;z-index:-1;background:radial-gradient(ellipse,#f7f4edf2 45%,transparent 76%)}.story-final h2{font-size:clamp(54px,6.3vw,100px)}.story-final p{margin-top:26px}.story-final .story-cta{margin-top:22px}.story-track[data-step="4"] .story-final{opacity:var(--final-opacity,1)}.story-copy{transition:opacity .2s ease-out}.story-track[data-step="4"] .story-copy{opacity:calc(1 - var(--final-opacity,1))}@media(max-width:849px){.story-final{left:24px;right:24px;top:9%;max-width:92%}.story-final:before{display:none}.story-final h2{font-size:clamp(44px,11vw,70px)}.story-final p{font-size:12px;margin-top:18px}.story-final .story-cta{margin-top:15px}.story-art{height:56svh}.story-living{inset:0}}@media(prefers-reduced-motion:reduce){.story-pencil,.story-painting{opacity:0!important}.story-model{opacity:1!important}.story-final{opacity:1}.story-living{opacity:1!important}}
.story-stage{perspective:1400px}.story-art{transform:rotateY(var(--ending-angle,0deg)) rotateX(var(--ending-tilt,0deg)) scale(var(--ending-zoom,1));transform-origin:72% 50%;will-change:transform}@media(max-width:849px){.story-art{transform:rotateY(calc(var(--ending-angle,0deg)*.5)) rotateX(calc(var(--ending-tilt,0deg)*.5)) scale(var(--ending-zoom,1));transform-origin:55% 50%}}@media(prefers-reduced-motion:reduce){.story-art{transform:none!important}}
.story-art{transform:none!important;will-change:auto}.painted-walkers{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0}
.story-video-layer{position:absolute;inset:0;opacity:0;pointer-events:none}.story-video-layer video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--pos,80%) 50%;pointer-events:none}.story-motion-control{position:absolute;right:var(--gutter);top:22px;z-index:6;border:1px solid #929d84;background:#f7f4ede8;color:#3b4a31;font-size:10px;padding:11px 15px;cursor:pointer}.story-motion-control:focus-visible{outline:2px solid #a53523;outline-offset:4px}@media(max-width:849px){.story-video-layer video{object-position:var(--pos-m,78%) 50%}.story-motion-control{top:auto;bottom:calc(64px + 56svh + 10px);right:24px;padding:8px 12px;font-size:9px}}@media(prefers-reduced-motion:reduce){.story-video-layer{display:none!important}.story-motion-control{display:none!important}}
.story-track.is-live{height:460svh}.story-future{opacity:0}.story-final h2{font-size:clamp(48px,5.6vw,87px)}@media(max-width:849px){.story-track.is-live{height:420svh}.story-final h2{font-size:clamp(40px,10vw,64px)}}@media(prefers-reduced-motion:reduce){.story-track.is-live{height:100svh}.story-frame.story-model{opacity:0!important}.story-frame.story-future{opacity:1!important;transform:none!important;mask-image:none!important}}

.story-environment-only{mask-image:url("/assets/future-environment-mask.svg");mask-size:cover;mask-position:80% 50%;mask-repeat:no-repeat;-webkit-mask-image:url("/assets/future-environment-mask.svg");-webkit-mask-size:cover;-webkit-mask-position:80% 50%;-webkit-mask-repeat:no-repeat}@media(max-width:849px){.story-environment-only{mask-position:78% 50%;-webkit-mask-position:78% 50%}}

/* Fade copy independently from the artwork, without a discrete mobile text cut. */
.story-track .story-copy,.story-track[data-step="4"] .story-copy{display:block;opacity:var(--copy-opacity,1);transition:none}
.story-frame.story-future{mask-image:none;-webkit-mask-image:none;clip-path:none;transform:none}
@media(prefers-reduced-motion:reduce){.story-track .story-copy,.story-track[data-step="4"] .story-copy{display:none}.story-track .story-final{opacity:1}}