/* Zweli scroll stories. Static HTML remains readable without JavaScript. */
:root{--story-ease:cubic-bezier(.22,.61,.36,1);--story-header:82px}
.service-story{padding:0;background:var(--paper-dim);position:relative}
.story-stage{max-width:1440px;margin:auto;padding:76px 48px}
.story-topline{display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-text)}
.story-motion-toggle{background:transparent;border:1px solid var(--line);padding:10px 14px;border-radius:4px;font:inherit;letter-spacing:.08em;color:var(--ink);min-height:44px;cursor:pointer}
.story-topline,.story-footer{position:relative;z-index:20}
.story-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:center;margin:48px 0}
.story-panel{padding:0;margin-bottom:34px}
.story-panel .kicker{font-size:.7rem;text-transform:uppercase;letter-spacing:.16em;color:var(--accent-text);font-weight:700}
.story-panel h2{font-size:clamp(2.8rem,5.4vw,5.5rem);line-height:1.04;max-width:11ch;text-wrap:balance}
.story-panel p:not(.kicker){font-size:1rem;line-height:1.8;max-width:40ch}
.story-panel .btn{margin-top:12px}
.story-visual{position:relative;min-width:0;perspective:1100px;pointer-events:none}
.story-photo{margin:0 0 24px;border-radius:12px;background:var(--paper);border:5px solid var(--paper);box-shadow:0 28px 55px rgba(40,31,22,.17);position:relative}
.story-photo .img-panel{--ar:16/10;box-shadow:none;border-radius:7px;overflow:hidden}
.story-photo img:not(.atlas-image){position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.story-photo img.travel-photo{object-position:center 30%}
.story-photo figcaption{font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;padding:12px 15px;color:var(--accent-text)}
.story-footer{display:flex;justify-content:space-between;align-items:center;gap:24px}
.story-chapters{display:none;gap:8px;flex-wrap:wrap}
.story-ready .story-chapters{display:flex}
.story-chapters button{border:0;background:transparent;color:var(--ink-soft);font:inherit;font-size:.72rem;letter-spacing:.06em;cursor:pointer;padding:12px 14px;min-height:44px;border-bottom:2px solid transparent}
.story-chapters button[aria-current="step"]{color:var(--accent-text);border-bottom-color:var(--accent-text);font-weight:700}
.story-scroll-note{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin:0}
.story-track{height:2px;background:var(--line);margin-top:20px;overflow:hidden}
.story-track span{display:block;height:100%;background:var(--accent-text);transform:scaleX(0);transform-origin:left}
/* Only opt into pinning after the controller has initialized. */
.service-story.is-scrubbed{height:330svh}
.is-scrubbed .story-stage{position:sticky;top:var(--story-header);height:calc(100svh - var(--story-header));min-height:600px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}
.is-scrubbed .story-layout{flex:1;margin:24px 0;min-height:0}
.is-scrubbed .story-copy{position:relative;height:390px}
.is-scrubbed .story-panel{position:absolute;inset:0;margin:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;will-change:transform,opacity}
.is-scrubbed .story-panel[inert]{pointer-events:none}
.is-scrubbed .story-visual{height:100%;min-height:300px;transform-style:preserve-3d}
.is-scrubbed .story-photo{position:absolute;left:8%;top:50%;width:84%;margin:0;transform-style:preserve-3d;backface-visibility:hidden;will-change:transform,opacity}
.is-scrubbed .story-photo::after{content:"";position:absolute;inset:-5px;border:1px solid rgba(103,82,58,.2);border-radius:12px;transform:translateZ(-6px);pointer-events:none}
.story-motion-toggle:active,.story-chapters button:active,.btn:active{transform:scale(.98)}
.motion-reveal{transition:opacity 650ms var(--story-ease),transform 800ms var(--story-ease);transition-delay:var(--reveal-delay,0ms)}
.motion-reveal.is-waiting{opacity:0;transform:translateY(26px)}
.motion-reveal.is-waiting:focus-within{opacity:1;transform:none}
.motion-reveal .img-panel{transition:clip-path 850ms var(--story-ease);clip-path:inset(0 round 10px)}
.motion-reveal.is-waiting .img-panel{clip-path:inset(8% 3% 8% 3% round 18px)}
.motion-image{transition:clip-path 850ms var(--story-ease);clip-path:inset(0 round 10px)}
.motion-image.is-waiting{clip-path:inset(10% 4% 10% 4% round 18px)}
.hero-figure{perspective:1100px}
.hero-depth{transform:rotateY(var(--hero-y,0deg)) rotateX(var(--hero-x,0deg));transition:transform 700ms var(--story-ease)}
.motion-paused .motion-reveal,.motion-paused .motion-reveal .img-panel,.motion-paused .hero-depth,.motion-paused .trip-offer-poster{transition:none!important;transform:none!important;clip-path:none!important;opacity:1!important}
@media(hover:hover) and (pointer:fine){.story-motion-toggle:hover{background:var(--paper)}.story-chapters button:hover{color:var(--accent-text)}.trip-offer-poster{transition:transform 650ms var(--story-ease)}.trip-offer a:hover .trip-offer-poster{transform:scale(1.015)}}
@media(max-width:900px){.story-stage{padding:30px 24px}.story-layout{gap:24px}.is-scrubbed .story-copy{height:330px}.story-panel h2{font-size:clamp(2.7rem,5.5vw,4rem)}.story-scroll-note{display:none}}
@media(max-width:640px){.story-stage{padding:24px 18px}.story-topline{font-size:.58rem;letter-spacing:.1em}.story-motion-toggle{font-size:.58rem;padding:8px 10px}.story-layout{grid-template-columns:1fr;gap:12px;margin:30px 0}.story-panel h2{font-size:2.3rem;max-width:15ch}.story-panel p:not(.kicker){font-size:.88rem;line-height:1.6;margin-bottom:10px}.service-story.is-scrubbed{height:290svh}.is-scrubbed .story-stage{min-height:620px}.is-scrubbed .story-layout{grid-template-rows:1fr 1fr;margin:12px 0;gap:0}.is-scrubbed .story-copy{height:280px}.is-scrubbed .story-visual{min-height:220px}.is-scrubbed .story-photo{left:10%;width:80%}.story-photo figcaption{padding:7px 10px;font-size:.58rem}.story-chapters{width:100%;justify-content:space-between;gap:0}.story-chapters button{font-size:.65rem;padding:10px 7px}.story-track{margin-top:8px}}
@media(max-height:700px) and (min-width:641px){.is-scrubbed .story-stage{padding:22px 40px;min-height:0}.is-scrubbed .story-copy{height:330px}.story-panel h2{font-size:3.6rem}.story-panel p:not(.kicker){font-size:.88rem}.is-scrubbed .story-photo{width:80%;left:10%}}
@media(prefers-reduced-motion:reduce){.motion-reveal,.motion-reveal .img-panel,.motion-image,.hero-depth,.trip-offer-poster{transition:none!important;transform:none!important;clip-path:none!important;opacity:1!important}.story-track,.story-scroll-note{display:none}}
@media print{.service-story{display:none}.motion-reveal{opacity:1!important;transform:none!important}.motion-image{clip-path:none!important}}
