/* Section four is outside the original pinned timeline. All rules stay local. */
.experience{height:calc(200svh + max(320svh,1984px))}
@media(max-aspect-ratio:1/1){.experience{height:520svh}}
.ways{pointer-events:none;position:relative;height:200svh;margin-top:-200svh;z-index:1;background:transparent;color:#eee6d9;--ways-ease:cubic-bezier(.2,.6,.3,1)}
.ways-stage{position:sticky;top:0;height:100svh;min-height:680px;isolation:isolate;overflow:hidden;perspective:1500px}
.ways-camera{position:absolute;inset:0;transform-origin:50% 50%;will-change:transform;z-index:0}
.ways-art,.ways-edges{position:absolute;left:50%;top:50%;width:max(100%,184.6154svh);height:auto;min-height:100%;max-width:none;transform:translate(-50%,-50%);object-fit:cover}
.ways-veil{position:absolute;inset:0;z-index:0;background:#090504;opacity:var(--ways-veil,1)}
.ways-edges{pointer-events:none;opacity:var(--ways-edges,0)}
.ways-art{opacity:var(--ways-body,1)}
.ways-layout{opacity:var(--ways-copy,1)}
.ways-shade{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:var(--ways-body,1);background:radial-gradient(ellipse 43% 52% at 54% 55%,#050301eb 15%,#050301d9 48%,#05030199 69%,#05030133 86%,transparent 100%),linear-gradient(#090504 0%,#09050466 3%,transparent 12%,transparent 93%,#09050477 100%)}
.ways-layout{position:absolute;width:max(100%,184.6154svh);aspect-ratio:1704/923;left:50%;top:50%;transform:translate(-50%,-50%);container-type:inline-size;z-index:3}
.ways-intro{position:absolute;top:9.4%;left:25%;width:50%;text-align:center}
.ways h2,.ways h3,.ways p{margin:0;font-weight:400}
.ways h2 span{display:block}
.ways-title-gold{font-size:3.75cqw;line-height:1.12;letter-spacing:.035em;font-weight:300;background:linear-gradient(105deg,#a97839,#efd499 36%,#fff0c9 55%,#c99549 86%);background-clip:text;-webkit-background-clip:text;color:transparent}
.ways-title-small{margin-top:.25cqw;font-size:1.83cqw;line-height:1.4;letter-spacing:.34em;color:#ede9e0}
.ways-intro p{margin-top:.85cqw;font-size:1.12cqw;line-height:1.45;color:#e0dcd6}
.ways-story{position:absolute;top:36.8%;width:20.1%;text-shadow:0 1px 14px #000b}
.ways-custom{left:30.15%}.ways-hits{left:56.1%;width:21%}
.ways-story h3{font-size:1.18cqw;letter-spacing:.19em;line-height:1.4;color:#f0dca3}
.ways-story p{margin-top:.95cqw;font-size:1.02cqw;line-height:1.5;color:#ddd8cf}
.ways-story ul{list-style:none;padding:0;margin:2.15cqw 0 0;display:grid;gap:1.05cqw}
.ways-story li{position:relative;padding-left:3.45cqw;font-size:.88cqw;line-height:1.46;letter-spacing:.015em;color:#eee9df}
.ways-story li::before{content:'—';position:absolute;left:0;top:-.13em;color:#dabc77;font-size:1.4em;font-weight:300}
.ways-stage>.global-dust{z-index:2;opacity:var(--ways-dust,1)}
/* Portrait tablets and phones share the directed camera sequence. */
@media(max-aspect-ratio:1/1),(max-width:1100px){
 .ways{height:360svh}
 .ways-stage{position:sticky;top:0;height:100svh;min-height:0}
 .ways-camera{transform:none}
 .ways-art,.ways-edges{top:0;left:0;width:auto;height:100%;min-height:0;transform:translate3d(var(--ways-pan,0px),0,0);will-change:transform}
 .ways-layout{inset:0;width:100%;height:100%;aspect-ratio:auto;transform:none;container-type:normal}
 .ways-intro{top:18%;left:6%;width:88%}
 .ways-title-gold{font-size:clamp(32px,8.5vw,64px);letter-spacing:.015em}
 .ways-title-small{margin-top:12px;font-size:clamp(12px,3.3vw,25px);line-height:1.65;letter-spacing:.22em}
 .ways-intro p{margin:24px auto 0;max-width:400px;font-size:clamp(14px,3.65vw,20px);line-height:1.6}
 .ways-story{left:7%;top:auto;bottom:max(7svh,env(safe-area-inset-bottom));width:86%;max-width:520px;margin:0 auto;right:7%}
 .ways-story h3{font-size:clamp(17px,4.6vw,26px);letter-spacing:.17em;line-height:1.4}
 .ways-story p{margin-top:17px;font-size:clamp(14px,3.65vw,19px);line-height:1.5;max-width:490px}
 .ways-story ul{margin-top:24px;gap:13px}
 .ways-story li{font-size:clamp(11px,2.85vw,15px);line-height:1.45;padding-left:27px;letter-spacing:.025em}
 .ways-shade{background:linear-gradient(#090504 0%,#09050444 7%,transparent 18%,transparent 30%,#09050466 43%,#090504e6 63%,#090504ed 100%)}
 .ways[data-enhanced] .ways-shade{opacity:calc(var(--ways-shade,.35) * var(--ways-body,1))}
 .ways [data-visible="false"]{pointer-events:none;user-select:none}
 .ways[data-enhanced] .ways-intro{opacity:var(--ways-intro,1)}
 .ways[data-enhanced] .ways-custom{opacity:var(--ways-custom,0)}
 .ways[data-enhanced] .ways-hits{opacity:var(--ways-hits,0)}
 /* Before JS (or without it), every paragraph stays readable in document order. */
 .ways:not([data-enhanced]){height:auto;margin-top:0}
 .ways:not([data-enhanced]) .ways-stage{height:auto;position:relative}
 .ways:not([data-enhanced]) .ways-layout{position:relative;height:auto}
 .ways:not([data-enhanced]) .ways-intro,.ways:not([data-enhanced]) .ways-story{position:relative;inset:auto;width:86%;margin:0 auto;padding:64px 0}
}
@media(max-aspect-ratio:1/1) and (min-width:600px){
 .ways-story{bottom:9svh}.ways-story ul{gap:18px;margin-top:30px}
 .ways-intro{top:17%}
}
@media(max-width:1100px) and (max-height:730px){
 .ways-story{bottom:4svh}.ways-story p{font-size:13px;line-height:1.4;margin-top:12px}.ways-story ul{margin-top:16px;gap:9px}
}
@media(prefers-reduced-motion:reduce){
 .experience{height:calc(100svh + max(320svh,1984px))}
 .ways{height:auto;margin-top:0}
 .ways-stage{position:relative}
 .ways-edges{display:none}
 .ways-art,.ways-layout,.ways-veil{opacity:1!important}
 .ways-camera,.ways-art{will-change:auto;transform:none!important}
 .ways-art{left:50%;transform:translate(-50%,-50%)!important}
 .ways-stage>.global-dust{display:none}
}
@media(prefers-reduced-motion:reduce) and (max-aspect-ratio:1/1), (prefers-reduced-motion:reduce) and (max-width:1100px){
 .ways,.ways[data-enhanced]{height:auto;margin-top:0}
 .ways .ways-stage{height:auto;min-height:100svh;position:relative}
 .ways .ways-layout{position:relative;height:auto}
 .ways .ways-intro,.ways .ways-story{position:relative;inset:auto;opacity:1!important;width:86%;margin:0 auto;padding:50px 0}
 .ways .ways-art{height:100svh;top:0;transform:translateX(-50%)!important}
 .ways .ways-shade{opacity:1!important;background:linear-gradient(#09050488,#090504ee 70svh,#090504 100svh)}
}

@media(prefers-reduced-motion:reduce) and (max-aspect-ratio:1/1){.experience{height:420svh}}