/* Approved floating artwork: no video box, studio floor or clipped objects. */
.story-hero{background:#fafcfa;overflow:visible;--story-header:84px;--story-viewport:760px;--story-progress:0}
.story-shell{display:grid;grid-template-columns:.95fr 1.05fr;gap:10px 34px;align-items:center;padding-block:38px 34px}
.story-shell .intro-copy{min-width:0;position:relative;z-index:1;padding-block:20px}.story-scroll-cue{display:flex;align-items:center;gap:10px;color:#7d9188;font-size:12px;margin-top:28px}.story-scroll-cue>span{font-size:21px;color:#00855f}
.story-stage{min-width:0;position:relative;width:100%;justify-self:center}
.story-artwork{position:relative;width:100%;max-width:600px;aspect-ratio:1;margin:auto;isolation:isolate;mask-image:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent),linear-gradient(to bottom,transparent,#000 7%,#000 93%,transparent);mask-composite:intersect;-webkit-mask-image:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent),linear-gradient(to bottom,transparent,#000 7%,#000 93%,transparent);-webkit-mask-composite:source-in}
.story-artwork img,.story-artwork video{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.story-artwork video{position:absolute;inset:0;opacity:0;pointer-events:none}.story-artwork[data-video-ready] video{opacity:1}.story-artwork[data-video-ready] img{opacity:0}
.story-caption{text-align:center;margin:4px auto 0;max-width:450px;min-height:48px}.story-caption [data-story-title]{font-size:16px;font-weight:650;letter-spacing:-.02em;color:#244d3b}.story-caption [data-story-description]{font-size:12px;color:#6f8580;margin-top:5px;line-height:1.5}
.story-journey{grid-column:1/-1;display:flex;align-items:center;gap:25px;padding-top:13px}.story-rail{list-style:none;margin:0;padding:0;display:flex;gap:0;max-width:660px;flex:1}.story-rail li{position:relative;flex:1}.story-rail li:not(:last-child):after{content:'';height:1px;background:#d3e3da;position:absolute;top:16px;left:41px;right:0}.story-rail a{display:inline-flex;align-items:center;gap:9px;position:relative;z-index:1;color:#71877c;font-size:12px;line-height:1.6}.story-rail a>span{display:grid;place-items:center;background:#edf7f1;border:1px solid #d4e9dc;color:#71a98b;border-radius:50%;width:34px;height:34px;font-size:10px;font-weight:600}.story-rail a[aria-current="step"]{color:#006c49;font-weight:650}.story-rail a[aria-current="step"]>span{background:#00865e;border-color:#00865e;color:#fff}.story-rail a:hover{color:#006d4d}.story-rail a:focus-visible{outline:2px solid #00865e;outline-offset:5px;border-radius:4px}.story-foot-hint{font-size:11px;color:#859b8d;margin-left:auto}.story-skip{font-size:11px;white-space:nowrap;font-weight:550;color:#006e4c}.story-skip:hover{text-decoration:underline;text-underline-offset:4px}
/* A readable final hold precedes the sticky section's release. */
.story-hero[data-pinned]{height:calc(var(--story-viewport) + var(--story-distance))}
.story-hero[data-pinned] .story-shell{position:sticky;top:var(--story-header);height:var(--story-viewport);grid-template-rows:minmax(0,1fr) auto;padding-block:14px 25px}
.story-hero[data-pinned] .story-artwork{width:min(100%,calc(var(--story-viewport) - 145px))}
.story-hero[data-pinned] .story-scroll-cue>span{display:inline}
@media(max-width:1100px){.story-shell{gap:15px 20px}.story-caption [data-story-title]{font-size:14px}.story-caption [data-story-description]{font-size:11px}.story-journey{gap:18px}.story-foot-hint{display:none}.story-rail{max-width:590px}}
@media(max-width:899px){.story-shell{grid-template-columns:1fr;padding-block:35px;gap:18px}.story-shell .intro-copy{padding:0}.story-stage{max-width:590px;margin-inline:auto}.story-artwork{max-width:520px}.story-scroll-cue{margin-top:22px}.story-scroll-cue>span{display:none}.story-journey{flex-wrap:wrap;gap:18px;padding-top:6px}.story-rail{flex-basis:100%;max-width:none}.story-rail a{font-size:11px}.story-skip{margin-left:auto}.story-foot-hint{display:block;margin-left:0}.story-caption{min-height:0}.story-caption [data-story-description]{font-size:12px}}
@media(max-width:480px){.story-shell{padding-block:32px}.story-scroll-cue{font-size:11px}.story-rail a{flex-direction:column;gap:7px;font-size:11px}.story-rail li{text-align:center}.story-rail li:not(:last-child):after{left:calc(50% + 18px);right:calc(-50% + 18px)}.story-rail a>span{width:32px;height:32px}.story-caption [data-story-title]{font-size:15px}.story-caption [data-story-description]{font-size:11px}.story-foot-hint,.story-skip{font-size:10px}}
@media(prefers-reduced-motion:reduce){.story-artwork video{display:none}.story-artwork[data-video-ready] img{opacity:1}}

/* Fit the complete pinned journey on phones, including their browser chrome. */
@media(max-width:899px){
 .story-hero[data-pinned] .story-shell{grid-template-rows:auto minmax(0,1fr) auto;gap:8px;padding-block:12px;align-items:center}
 .story-hero[data-pinned] .intro-copy{padding:0}
 .story-hero[data-pinned] h1{font-size:clamp(28px,7.6vw,40px);line-height:1.04}
 .story-hero[data-pinned] .section-label{font-size:9px;margin-bottom:8px}
 .story-hero[data-pinned] .intro-description{font-size:12px;line-height:1.5;margin-top:10px}
 .story-hero[data-pinned] .intro-description br{display:none}
 .story-hero[data-pinned] .intro-actions{gap:8px;margin-top:12px}
 .story-hero[data-pinned] .intro-actions .button{padding:10px 12px;min-height:38px;font-size:11px}
 .story-hero[data-pinned] .story-scroll-cue{display:none}
 .story-hero[data-pinned] .story-stage{height:100%;min-height:0;display:flex;flex-direction:column;justify-content:center}
 .story-hero[data-pinned] .story-artwork{width:min(100%,calc(var(--story-viewport) - 320px));min-height:0;flex-shrink:1}
 .story-hero[data-pinned] .story-caption{margin-top:4px;min-height:42px}
 .story-hero[data-pinned] .story-caption [data-story-description]{font-size:10px}
 .story-hero[data-pinned] .story-journey{display:block;padding-top:0}
 .story-hero[data-pinned] .story-rail a{flex-direction:row;gap:6px;font-size:10px}
 .story-hero[data-pinned] .story-rail a>span{width:26px;height:26px}
 .story-hero[data-pinned] .story-rail li:not(:last-child):after{top:13px;left:calc(50% + 32px);right:calc(-50% + 32px)}
 .story-hero[data-pinned] .story-foot-hint,.story-hero[data-pinned] .story-skip{display:none}
}
@media(max-width:899px) and (max-height:520px){
 .story-hero[data-pinned] .story-shell{grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr) auto;gap:8px 16px}
 .story-hero[data-pinned] h1{font-size:26px}
 .story-hero[data-pinned] .intro-description{font-size:11px}
 .story-hero[data-pinned] .intro-actions .secondary{display:none}
 .story-hero[data-pinned] .story-artwork{width:min(100%,calc(var(--story-viewport) - 120px))}
}