/* Primitives → semantic journey tokens → component bindings. */
:root {
 --journey-primitive-ink:#15131c;
 --journey-primitive-ivory:#fffdf9;
 --journey-primitive-glass:rgba(21,19,28,.54);
 --journey-primitive-space:1rem;
 --journey-primitive-travel:1250svh;
 --journey-primitive-small:.65rem;
 --journey-primitive-title:clamp(2.15rem,6vw,5.4rem);
 --journey-color-surface:var(--journey-primitive-ink);
 --journey-color-copy:var(--journey-primitive-ivory);
 --journey-color-overlay:var(--journey-primitive-glass);
 --journey-space-unit:var(--journey-primitive-space);
 --journey-scroll-height:var(--journey-primitive-travel);
 --journey-text-label:var(--journey-primitive-small);
 --journey-text-title:var(--journey-primitive-title);
 --journey-primitive-hook:clamp(1.05rem,1.6vw,1.4rem);
 --journey-primitive-logo:clamp(150px,24vw,250px);
 --journey-primitive-shade-mobile:linear-gradient(0deg,rgba(21,19,28,.96),rgba(21,19,28,.45) 42%,transparent 80%),linear-gradient(90deg,rgba(21,19,28,.3),transparent 70%);
 --journey-primitive-shade-wide:linear-gradient(90deg,rgba(21,19,28,.88),rgba(21,19,28,.3) 48%,transparent 80%),linear-gradient(0deg,rgba(21,19,28,.75),transparent 25%);
 --journey-primitive-finale:rgba(21,19,28,.78);
 --journey-type-hook:var(--journey-primitive-hook);
 --journey-logo-size:var(--journey-primitive-logo);
 --journey-shade-mobile:var(--journey-primitive-shade-mobile);
 --journey-shade-wide:var(--journey-primitive-shade-wide);
 --journey-shade-finale:var(--journey-primitive-finale);

}
.story{--journey-finale:0;background:var(--journey-color-surface);color:var(--journey-color-copy)}
.journey-film,.journey-vignette,.journey-label{display:none}
.story .scene-hook{color:var(--journey-color-copy);font-size:var(--journey-type-hook);line-height:1.55;max-width:34ch}
.story .scene-copy h3{font-size:var(--journey-text-title);line-height:1.04;max-width:12ch;letter-spacing:var(--tracking-display)}
.story .scene-brand{font-size:var(--text-small);margin-top:var(--spacing-medium);opacity:.75}
.journey-finale{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--spacing-large);padding:var(--spacing-section) var(--spacing-gutter);overflow:hidden;isolation:isolate}
.journey-signature{width:var(--journey-logo-size);height:auto;object-fit:contain}
.journey-finale .button{max-width:100%;text-align:center;font-size:var(--text-small);z-index:2}
.journey-mosaic{position:absolute;inset:0;z-index:-1;opacity:.3;display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-medium)}
.journey-mosaic img{width:100%;height:100%;object-fit:cover}
.motion-enabled .story{height:var(--journey-scroll-height)}
.motion-enabled .story-stage{height:100svh;min-height:420px;background:var(--journey-color-surface)}
.motion-enabled .journey-film{display:block;position:absolute;inset:0;z-index:0}
.journey-film>img,.journey-film>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% center}
.journey-film>canvas{opacity:0}.journey-film>canvas.ready{opacity:1}
.motion-enabled .journey-vignette{display:block;position:absolute;inset:0;z-index:1;pointer-events:none;background:var(--journey-shade-mobile)}
.motion-enabled .story-scene{z-index:2;align-items:end;padding:7rem var(--spacing-gutter) 8.5rem;pointer-events:none;overflow:visible}
.motion-enabled .story .scene-media,.motion-enabled .story .scene-shade{display:none}
.motion-enabled .story .scene-copy{max-width:36rem}
.motion-enabled .journey-label{display:flex;position:absolute;top:6.8rem;left:var(--spacing-gutter);right:var(--spacing-gutter);justify-content:space-between;z-index:4;font-size:var(--journey-text-label);letter-spacing:.12em;gap:var(--journey-space-unit);pointer-events:none}
.journey-label span{opacity:.6;text-align:right}
.motion-enabled .story-steps{bottom:1.7rem;gap:var(--journey-space-unit)}
.motion-enabled .story-steps button{min-height:44px;font-size:var(--journey-text-label)}
.motion-enabled .journey-finale{position:absolute;inset:0;z-index:5;opacity:0;background:var(--journey-shade-finale);padding-bottom:7rem;pointer-events:none}
.motion-enabled .journey-finale:not([inert]){pointer-events:auto}
.motion-enabled .journey-mosaic{inset:17% -15%;gap:var(--spacing-large);opacity:.4;transform:rotate(-7deg)}
.motion-enabled .journey-mosaic img{border-radius:var(--radius-card)}
.motion-enabled .journey-finale .journey-signature{filter:drop-shadow(0 8px 25px rgba(0,0,0,.5))}
@media(min-width:700px){
 .motion-enabled .story-scene{align-items:center;padding-bottom:5rem}
 .motion-enabled .journey-vignette{background:var(--journey-shade-wide)}
 .motion-enabled .journey-label{top:8rem}
 .motion-enabled .journey-mosaic{inset:13% 6%;grid-template-columns:1fr 1fr;gap:3rem 22rem}
}
@media(max-height:650px){
 .motion-enabled .journey-label{top:5rem}
 .story .scene-copy h3{font-size:clamp(1.8rem,4vw,3rem)}
 .motion-enabled .story-scene{padding-top:6rem;padding-bottom:6rem}
 .story .scene-hook{font-size:1rem}.story .scene-brand{margin-top:.5rem}
 .journey-signature{width:120px}.journey-finale{gap:1rem}
}
@media print{.journey-film,.journey-vignette,.journey-label,.story-steps{display:none!important}.motion-enabled .story{height:auto}.motion-enabled .story-stage{height:auto;position:relative}.motion-enabled .story-scene{position:relative;opacity:1!important;min-height:80vh}.motion-enabled .story .scene-media{display:block}.scene-copy{opacity:1!important;transform:none!important}.motion-enabled .journey-finale{position:relative;opacity:1!important}.letter{opacity:1!important;transform:none!important}}

@media(max-width:699px){.motion-enabled .story-steps{bottom:3.6rem}.journey-label{line-height:1.4}.journey-label span{max-width:9ch}.journey-film>img[data-key=production]{object-position:49% center}}

.journey-film>.journey-mobile-film,.journey-film>.journey-mobile-join{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;opacity:0}
.journey-film>.journey-mobile-film.ready{opacity:1}
body:not(.motion-enabled) .journey-mobile-film,body:not(.motion-enabled) .journey-mobile-join{display:none}

/* Native looping video, independent from the scroll timeline. */
.hero-media>.ambient-loop,.journey-film>.ambient-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;pointer-events:none}
.hero-media>.ambient-loop{object-position:68% center}
.hero-media>.ambient-loop.ready,.journey-film>.ambient-loop.ready{opacity:1}
body:not(.motion-enabled) .ambient-loop{display:none}
@media(prefers-reduced-motion:reduce){.ambient-loop{display:none!important}}