/* Three visual chapters, advancing with native page scroll. */
.hero-scene>picture,.mark-photograph>picture{display:block;width:100%;height:100%}
.hero-scene>picture>img,.mark-photograph>picture>img{width:100%;height:100%;object-fit:cover}
.journey{background:var(--stone);position:relative}
.journey-sticky{padding:72px 5%}
.journey-heading h2{max-width:14ch;font-size:clamp(38px,4vw,58px)}
.journey-heading h2 em{color:var(--flame)}
.journey-nav{display:none;gap:18px;margin-top:28px}
.journey-nav button{display:flex;align-items:center;gap:7px;padding:10px 0;min-height:44px;border-bottom:1px solid #b9a795;font-size:12px}
.journey-nav button span{font-size:10px;color:var(--muted)}
.journey-nav button[aria-current=step]{border-color:var(--flame);color:var(--flame)}
.journey-frames{display:grid;gap:64px;margin-top:44px}
.journey-frame{display:grid;grid-template-columns:1fr 1.35fr;align-items:center;gap:7%}
.journey-copy h3{font-size:clamp(28px,3vw,42px);max-width:16ch;margin-bottom:18px}
.journey-copy p{font-size:14px;line-height:1.8;color:var(--muted);max-width:38ch}
.journey-photo{position:relative;margin:0;aspect-ratio:3/2;overflow:hidden;background:#d9c5b1}
.journey-photo>picture,.journey-photo>picture>img{display:block;width:100%;height:100%}
.journey-photo>picture>img{object-fit:cover}
.thought-cloud{position:absolute;left:51%;top:0%;width:44%;height:60%;isolation:isolate}
.thought-cloud::before,.thought-cloud::after{content:'';position:absolute;background:#fffaf3;border-radius:50%;z-index:-1}
.thought-cloud::before{width:11%;height:13%;left:-6%;bottom:30%}
.thought-cloud::after{width:6%;height:7%;left:-15%;bottom:24%}
.thought-look{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;padding:12% 8% 5%;background:#dfccae;opacity:0;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cellipse cx='50' cy='59' rx='47' ry='36'/%3E%3Ccircle cx='25' cy='36' r='21'/%3E%3Ccircle cx='47' cy='27' r='24'/%3E%3Ccircle cx='72' cy='35' r='23'/%3E%3Ccircle cx='83' cy='55' r='17'/%3E%3C/svg%3E");mask-size:100% 100%;mask-repeat:no-repeat;transition:opacity .4s ease}
.thought-look.is-active{opacity:1}
.journey.is-scroll-story{height:320svh}
.is-scroll-story .journey-sticky{position:sticky;top:0;height:100svh;padding:0;overflow:hidden}
.is-scroll-story .journey-heading{position:absolute;left:5%;top:9%;width:33%;z-index:3}
.is-scroll-story .journey-nav{display:flex}
.is-scroll-story .journey-frames{display:block;margin:0}
.is-scroll-story .journey-frame{position:absolute;inset:0;display:block;opacity:0;visibility:hidden;transform:translateY(36px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1),visibility .7s}
.is-scroll-story .journey-frame.is-active{opacity:1;visibility:visible;transform:translateY(0)}
.is-scroll-story .journey-copy{position:absolute;left:5%;bottom:10%;width:32%}
.is-scroll-story .journey-photo{position:absolute;left:43%;right:4%;top:50%;bottom:auto;aspect-ratio:3/2;transform:translateY(-50%)}
.is-scroll-story .journey-photo>picture>img{object-position:center}
.is-scroll-story .journey-frame:first-child .journey-photo>picture>img{object-position:35% center}
.journey-skip{position:absolute;bottom:24px;left:5%;font-size:11px;text-decoration:underline;text-underline-offset:4px;z-index:3}
.journey-skip svg{width:14px;height:14px;vertical-align:middle;margin-left:8px}
.wardrobe-transformation{display:grid;grid-template-columns:.7fr 1.3fr;gap:5%;align-items:start;padding:80px 5%}
.wardrobe-transformation .base-intro{padding-top:12px}
.wardrobe-transformation h2{font-size:clamp(34px,3.5vw,50px)}
.wardrobe-transformation .base-explanation{grid-column:1;max-width:40ch}
.wardrobe-transformation .base-explanation p{font-size:14px;line-height:1.8}
.wardrobe-transformation .base-explanation .button{margin-top:24px}
.wardrobe-comparison{grid-column:2;grid-row:1/3;min-width:0;--before:40%}
.wardrobe-pictures{position:relative;aspect-ratio:3/2;overflow:hidden;background:#deccaf}
.wardrobe-pictures picture,.wardrobe-pictures picture img{display:block;width:100%;height:100%}
.wardrobe-pictures img{object-fit:cover}
.wardrobe-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--before)) 0 0)}
.wardrobe-emblem{position:absolute;top:10.5%;left:57.8%;transform:translateX(-50%);width:1.4%!important;height:2.6%!important;object-fit:contain!important;mix-blend-mode:multiply}
.comparison-line{position:absolute;left:var(--before);top:0;bottom:0;width:2px;background:var(--paper);pointer-events:none;transform:translateX(-1px);opacity:var(--divider-opacity,1)}
.comparison-line::after{content:'';position:absolute;top:48%;left:-5px;width:12px;height:34px;border:1px solid var(--ink);background:var(--paper);border-radius:6px}
.comparison-controls{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;margin-top:12px}
.comparison-controls button{font-size:12px;min-height:44px;padding:8px 0}
.comparison-controls button[aria-pressed=true]{color:var(--flame);text-decoration:underline;text-underline-offset:4px}
.comparison-controls input{width:100%;accent-color:var(--flame);min-height:44px;margin:0;cursor:ew-resize}
.comparison-hint{text-align:center;font-size:11px;color:var(--muted)}
.wardrobe-colours{font-size:11px;line-height:1.8;color:var(--muted);margin-top:16px;text-align:center}
@media(max-width:1050px) and (min-width:761px){.journey-nav{gap:10px}.journey-nav button{font-size:11px}.journey-heading h2{font-size:42px}.journey-copy h3{font-size:32px}}
@media(max-width:760px){
 .journey-sticky{padding:44px 24px}.journey-heading h2{font-size:36px;max-width:18ch}.journey-heading br{display:none}
 .journey-frames{gap:42px;margin-top:32px}.journey-frame{display:flex;flex-direction:column-reverse;gap:22px;align-items:stretch}.journey-photo{width:100%}.journey-copy h3{font-size:31px;margin-bottom:10px}.journey-copy p{font-size:13px;line-height:1.7}
 .is-scroll-story .journey-heading{left:24px;top:24px;right:24px;width:auto}.is-scroll-story .journey-heading h2{font-size:34px;max-width:18ch}.journey-nav{margin-top:12px;gap:22px}.journey-nav button{font-size:12px}
 .is-scroll-story .journey-photo{left:0;right:0;top:205px;bottom:auto;height:auto;aspect-ratio:3/2;transform:none}
 .is-scroll-story .journey-copy{left:24px;right:24px;top:calc(205px + (100vw - 15px)*2/3 + 32px);bottom:auto;width:auto}.is-scroll-story .journey-copy h3{font-size:32px;max-width:23ch}.is-scroll-story .journey-copy p{max-width:42ch}
 .journey-skip{left:24px;bottom:24px}
 .wardrobe-transformation{display:flex;flex-direction:column;gap:26px;padding:48px 24px}.wardrobe-transformation .base-intro{padding:0}.wardrobe-transformation h2{font-size:38px}.wardrobe-comparison{width:calc(100% + 48px);margin-inline:-24px;order:1}.wardrobe-transformation .base-explanation{order:2}.comparison-controls{margin:8px 24px 0}.comparison-hint,.wardrobe-colours{padding-inline:24px}.wardrobe-colours{font-size:10px;margin-top:10px}
}
@media(prefers-reduced-motion:reduce){.journey-frame,.thought-look{transition:none}.journey-skip{display:none}}

/* Wardrobe reveal follows scroll in both directions, without a range control. */
.wardrobe-transformation{display:block;padding:0;--before:100%}.wardrobe-sticky{padding:70px 5%;display:grid;grid-template-columns:.7fr 1.3fr;gap:28px 5%;align-content:center}.wardrobe-transformation .wardrobe-comparison{--before:inherit}.wardrobe-transformation.is-scroll-wardrobe{height:240svh}.is-scroll-wardrobe .wardrobe-sticky{position:sticky;top:0;height:100svh}.comparison-line::after{display:none}.wardrobe-transformation:not(.is-scroll-wardrobe) .wardrobe-pictures{aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:12px}.wardrobe-transformation:not(.is-scroll-wardrobe) .wardrobe-before{position:relative;clip-path:none;grid-column:1;grid-row:1}.wardrobe-transformation:not(.is-scroll-wardrobe) .wardrobe-pictures>picture{grid-column:2}.wardrobe-transformation:not(.is-scroll-wardrobe) .comparison-line{display:none}.wardrobe-transformation:not(.is-scroll-wardrobe) .wardrobe-emblem{left:79%;top:10.5%;width:.7%!important}.wardrobe-transformation .base-explanation p{margin-top:12px}
@media(max-width:760px){.wardrobe-transformation{padding:0}.wardrobe-sticky{display:flex;flex-direction:column;justify-content:center;gap:22px;padding:32px 24px}.wardrobe-transformation .base-intro{width:100%}.wardrobe-transformation h2{font-size:34px}.wardrobe-transformation .base-explanation p{font-size:12px;line-height:1.6;margin-top:10px}.wardrobe-transformation .base-explanation .button{margin-top:14px;font-size:12px;min-height:44px;padding:12px 18px}.wardrobe-comparison{flex-shrink:0}.wardrobe-transformation:not(.is-scroll-wardrobe) .wardrobe-pictures{display:flex;flex-direction:column-reverse}.wardrobe-transformation:not(.is-scroll-wardrobe) .wardrobe-emblem{left:57.8%;top:55.5%;width:1.4%!important;height:1.3%!important}}
