/* METRO / exact supplied film, controlled by native scroll. No body locking.
   Geometry is reserved before the first paint. Motion changes transforms/opacity only. */
.hero.metro-hero{--metro-distance:2600px;--metro-dwell:500px;min-height:600px;height:100svh;background:#30261e;color:#f0e9df;position:relative}
.hero.metro-hero .metro-stage{height:100svh;min-height:600px;position:relative!important;overflow:clip;isolation:isolate;background:#30261e}
.metro-media,.metro-poster,.metro-video,.metro-scrim{position:absolute;inset:0;width:100%;height:100%;}
.metro-media{z-index:0;overflow:hidden}.metro-poster{object-fit:cover;object-position:60% 50%;max-width:none}
.metro-video{object-fit:cover;object-position:center;opacity:0;max-width:none;pointer-events:none}
.metro-scrim{z-index:1;pointer-events:none;background:linear-gradient(180deg,#18120cc7,transparent 38%,#18120ccf),linear-gradient(90deg,#17100b25,transparent 55%)}
.metro-intro{position:absolute;z-index:2;inset-inline:var(--pad);top:31%;text-align:center;transform-origin:center}
.metro-intro>.eyebrow{font-size:10px;letter-spacing:.23em;margin-bottom:28px}
.hero.metro-hero h1{font-size:clamp(68px,14.25vw,260px);letter-spacing:-.07em;line-height:.9;margin:0 0 25px;padding-inline:.04em;font-weight:900;white-space:nowrap;width:100%;direction:ltr}
.metro-deck{font-size:clamp(14px,1.35vw,21px);letter-spacing:.005em;max-width:45em;margin:0 auto;line-height:1.5}
.metro-ending{position:absolute;z-index:2;inset-inline:var(--pad);bottom:19%;text-align:center;}
.metro-ending .eyebrow{font-size:8px;letter-spacing:.16em;margin-bottom:18px}
.metro-ending h2{font-size:clamp(26px,3.3vw,54px);font-weight:500;line-height:1.12;letter-spacing:-.045em;max-width:880px;margin:0 auto;text-wrap:balance}
.metro-ending h2 strong{font-weight:850;color:#dbc5a8}
.metro-console{position:absolute;z-index:4;bottom:max(28px,env(safe-area-inset-bottom));inset-inline:var(--pad);display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center;}
.metro-console a,.metro-console button{font-size:10px;letter-spacing:.04em;line-height:1.4;min-height:44px;display:inline-flex;align-items:center;gap:13px;color:#f0e9df;padding:10px 0;}
.metro-replay{justify-self:start}.metro-skip{justify-self:end}.metro-console .metro-icon{font-size:21px;letter-spacing:0}.metro-cue{display:flex;align-items:center;gap:15px;font-size:8px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;text-align:center}
.metro-cue>i{display:block;height:32px;width:1px;background:#f0e9df88;transform-origin:top;flex-shrink:0}
.metro-progress{position:absolute;bottom:0;inset-inline:0;height:2px;z-index:5;background:#dfc7a329;overflow:hidden}
.metro-progress>i{display:block;width:100%;height:100%;background:#dac5a7;transform-origin:left;transform:scaleX(0)}
[dir=rtl] .metro-progress>i{transform-origin:right}
.metro-status{position:absolute;z-index:6;inset-inline:var(--pad);top:111px;display:flex;align-items:center;justify-content:center;gap:12px;font-size:10px;text-align:center;color:#e6d3ba;line-height:1.5}
.metro-status:empty{display:none}.metro-status [data-metro-message]{padding:7px 12px;background:#211a14e8;border:1px solid #d3bfa035;border-radius:3px;max-width:520px}
.metro-tools{position:absolute;top:152px;inset-inline:var(--pad);z-index:7;display:flex;align-items:center;justify-content:center;gap:15px;flex-wrap:wrap;}
.metro-tools button,.metro-file-label{min-height:40px;font-size:10px;line-height:1.4;display:inline-flex;align-items:center;justify-content:center;padding:9px 13px;border:1px solid #d3bfa055;border-radius:3px;background:#211a14eb;color:#e6ddd1;cursor:pointer;max-width:240px;text-align:center}
.metro-file-label{position:relative}.metro-file-label:focus-within{outline:2px solid #d3bfa0;outline-offset:3px}.metro-file-label input{position:absolute;inset:0;opacity:0;width:100%;height:100%;padding:0;margin:0;cursor:pointer;font-size:16px;}
.metro-preview-note{display:none}.metro-error .metro-status [data-metro-message]{border-color:#d3bfa075}
html[data-motion=on] .hero.metro-hero{height:calc(100svh + var(--metro-distance) + var(--metro-dwell));min-height:0}
html[data-motion=on] .hero.metro-hero .metro-stage{position:sticky!important;top:0;min-height:600px;height:100svh}
html[data-motion=on] .metro-ending{opacity:0}
html[data-motion=off] .metro-progress{display:none}
@media(max-width:767px){
 .hero.metro-hero{--metro-distance:1450px;--metro-dwell:200px;height:100svh;min-height:600px}
 .hero.metro-hero .metro-stage{height:100svh;min-height:600px}
 .metro-intro{top:35%;inset-inline:20px}
 .metro-intro>.eyebrow{font-size:8px;letter-spacing:.14em;margin-bottom:22px}
 .hero.metro-hero h1{font-size:14.1vw;line-height:1;margin:0 0 18px;letter-spacing:-.066em}
 .metro-deck{font-size:14px;max-width:300px;line-height:1.6}
 .metro-ending{bottom:22%;inset-inline:26px}
 .metro-ending h2{font-size:clamp(28px,7.6vw,43px);line-height:1.16;max-width:500px;letter-spacing:-.042em}
 .metro-ending .eyebrow{font-size:7px;line-height:1.7;margin-bottom:15px}
 .metro-console{inset-inline:22px;gap:8px;grid-template-columns:1fr 1fr;bottom:max(23px,env(safe-area-inset-bottom))}
 .metro-console button,.metro-console a{font-size:10px;gap:9px;max-width:170px}
 .metro-cue{position:absolute;bottom:60px;left:10%;right:10%;justify-content:center;font-size:7px;letter-spacing:.10em;}
 .metro-cue>i{height:25px}.metro-replay{grid-column:1}.metro-skip{grid-column:2}
 .metro-status{top:105px;inset-inline:20px;font-size:10px}.metro-tools{top:161px;inset-inline:20px;gap:10px}
 .metro-tools button,.metro-file-label{font-size:10px;padding:9px 10px;max-width:200px}
 .metro-video{object-position:50% 50%}
 html[data-motion=on] .hero.metro-hero{height:calc(100svh + var(--metro-distance) + var(--metro-dwell));min-height:0}
 html[data-motion=on] .hero.metro-hero .metro-stage{min-height:600px;height:100svh;position:sticky!important;top:0}
}
/* Compact landscape: remain full-screen, keep ordinary scrolling and skip accessible. */
@media(max-height:599px){
 .hero.metro-hero .metro-stage,html[data-motion=on] .hero.metro-hero .metro-stage,.hero.metro-hero{min-height:0}
 .metro-intro{top:30%;}.metro-intro>.eyebrow{margin-bottom:13px;font-size:7px}
 .hero.metro-hero h1{font-size:min(12vw,18svh);margin-bottom:12px}.metro-deck{font-size:12px}
 .metro-ending{bottom:28%}.metro-ending h2{font-size:clamp(20px,5.2svh,36px)}.metro-ending .eyebrow{font-size:6px;margin-bottom:8px}
 .metro-console{bottom:12px}.metro-cue{position:static;inset:auto;font-size:7px}.metro-console{grid-template-columns:1fr auto 1fr}.metro-skip{grid-column:3}
 .metro-status{top:88px;font-size:8px}.metro-status [data-metro-message]{padding:5px 9px}.metro-tools{top:125px}
 .metro-tools button,.metro-file-label{min-height:32px;font-size:8px;padding:6px 10px}
}
@media(prefers-reduced-motion:reduce){
 html[data-motion] .hero.metro-hero,.hero.metro-hero{height:100svh;min-height:600px}
 html[data-motion] .hero.metro-hero .metro-stage{position:relative!important;min-height:600px;height:100svh}
 .metro-media,.metro-intro,.metro-ending{transform:none!important;opacity:1!important}.metro-ending{bottom:19%}
 .metro-progress{display:none}
}
@media(prefers-reduced-motion:reduce) and (max-height:599px){html[data-motion] .hero.metro-hero,html[data-motion] .hero.metro-hero .metro-stage{min-height:0}}
