/* Luxury walkthrough opening. Timing is controlled in film.js.
   Keep the approved footage unfiltered; gradients support readable type only. */
:root{--film-height:610svh}
.opening-film{background:radial-gradient(ellipse at 50% 42%,#52122e 0%,#34091e 48%,#1a0510 100%)}
.film-sticky{background:transparent;perspective:none}
.film-scene{position:absolute;inset:0;z-index:0}
/* A single paused decoder feeds the existing canvas; it does not affect layout. */
.film-video-source{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;pointer-events:none}
.film-shade{opacity:var(--scene-shade,1);background:linear-gradient(90deg,rgba(26,5,16,.46),rgba(26,5,16,.015) 70%),linear-gradient(180deg,rgba(26,5,16,.12),transparent 45%,rgba(26,5,16,.72))}
.film-topline{top:26px;align-items:center;min-height:40px;font-size:9px;letter-spacing:.16em}
.film-topline>span{color:var(--cream)}
.film-quick-quote{display:flex;align-items:center;gap:20px;font-size:12px;letter-spacing:.02em;text-decoration:none;color:var(--cream);padding:11px 16px;border:1px solid rgba(243,201,180,.4);background:rgba(26,5,16,.3);border-radius:3px;backdrop-filter:blur(10px);min-height:44px;transition:background .2s,border .2s,box-shadow .2s}
.film-quick-quote:hover,.film-quick-quote:focus-visible{background:var(--wine);border-color:var(--neon);box-shadow:0 0 24px rgba(232,28,66,.3)}
.film-quick-quote span::before{display:none!important}
.clean-intro{position:absolute;z-index:2;left:var(--page-gutter);top:22%;width:45%;max-width:650px;pointer-events:none;will-change:transform,opacity}
.clean-intro h1{font:500 clamp(57px,6.8vw,105px)/.98 var(--head);letter-spacing:-.06em;color:var(--cream);margin:0 0 23px;text-shadow:0 3px 40px rgba(26,5,16,.2)}
.clean-intro h1 span{color:#E81C42;text-shadow:0 0 30px rgba(232,28,66,.23)}
.clean-intro p{max-width:42ch;margin:0;color:var(--cream);font-size:clamp(14px,1.1vw,17px);line-height:1.7}
.clean-script{position:absolute;z-index:2;right:var(--page-gutter);bottom:26%;width:45%;height:110px;pointer-events:none;text-align:right}
.clean-script span:last-child{font-size:clamp(62px,8vw,125px)}
.clean-script span{position:absolute;right:0;bottom:0;font:400 clamp(80px,10vw,150px)/.9 var(--head);color:var(--cream);text-shadow:0 4px 35px rgba(26,5,16,.35);opacity:0}
.clean-dashboard{position:absolute;z-index:2;left:var(--page-gutter);bottom:14%;width:min(450px,39vw);pointer-events:none;color:var(--cream)}
.clean-time{position:relative;font:500 clamp(40px,4.6vw,68px)/1 var(--head);letter-spacing:-.045em;height:1.12em;font-variant-numeric:tabular-nums}
.clean-time>span{display:block;transition:none}
.clean-duration{position:absolute;inset:0;color:#E81C42;text-shadow:0 0 25px rgba(232,28,66,.3);opacity:0}
.clean-clock-label{font-size:12px;margin:8px 0 19px;color:var(--peach)}
.clean-progress-line{display:flex;justify-content:space-between;font-size:10px;color:var(--cream);gap:12px;letter-spacing:.015em}
.clean-progress-line>span:last-child{color:var(--peach);font-size:9px}
.clean-progress{height:1px;background:rgba(243,201,180,.35);margin:12px 0 15px}
.clean-progress i{display:block;height:100%;background:var(--neon);box-shadow:0 0 10px var(--neon);transform:scaleX(var(--clean-progress,0));transform-origin:left}
.clean-rooms{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:7px 16px;color:var(--peach);font-size:10px}
.clean-rooms li::before{content:'·';display:inline-block;width:12px;color:var(--peach)}
.clean-rooms li.is-done{color:var(--cream)}
.clean-rooms li.is-done::before{content:'✓';color:#E81C42;text-shadow:0 0 12px var(--neon)}
.film-checks{z-index:2}
.film-checks path{stroke:#E81C42;stroke-width:2.5}
.film-scroll-cue{bottom:5%;left:50%;transform:translateX(-50%);font-size:10px}
.film-rail{bottom:7%;font-size:9px}
.clean-continue{position:absolute;z-index:5;bottom:4%;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.06em;text-decoration:none;color:var(--peach);display:flex;align-items:center;gap:20px;min-height:44px;opacity:0;pointer-events:none;white-space:nowrap}
.clean-continue.is-active{pointer-events:auto}
.clean-continue:hover{color:var(--cream)}
/* A quiet ending over the final video frame, with an immediate route to quote. */
.clean-finish{position:absolute;z-index:4;left:var(--page-gutter);right:var(--page-gutter);top:29%;max-width:760px;opacity:0;will-change:opacity,transform}
.clean-finish-label{display:flex;align-items:center;gap:11px;font-size:10px;letter-spacing:.16em;margin:0 0 24px;color:var(--cream)}
.clean-finish-label span{color:#E81C42;text-shadow:0 0 14px var(--neon)}
.clean-finish h2{font:500 clamp(48px,5.8vw,83px)/1.04 var(--head);letter-spacing:-.055em;color:var(--cream);margin:0 0 32px;text-shadow:0 3px 40px rgba(26,5,16,.4)}
.clean-finish h2 em{font-style:normal;color:#E81C42;text-shadow:0 0 26px rgba(232,28,66,.25)}
.clean-finish .btn{display:inline-flex;gap:45px;padding:16px 22px;font-size:14px;min-height:50px}
@media(max-width:900px){.clean-intro{top:24%;width:55%}.clean-intro h1{font-size:clamp(52px,8vw,80px)}.clean-intro p{font-size:14px;max-width:35ch}}
@media(max-width:600px){
 :root{--film-height:590svh}
 .film-topline{top:16px;left:20px;right:20px;font-size:7px;letter-spacing:.09em}.film-topline>span{max-width:95px;line-height:1.5}.film-topline span:first-child::before{margin-right:7px;width:4px;height:4px}
 .film-quick-quote{font-size:10px;padding:10px 12px;gap:15px;letter-spacing:0}
 .clean-intro{left:24px;right:24px;top:20%;width:auto;max-width:360px}.clean-intro h1{font-size:clamp(52px,13vw,76px);margin-bottom:20px;letter-spacing:-.055em}.clean-intro p{font-size:12px;line-height:1.6;max-width:31ch}
 .film-shade{background:linear-gradient(90deg,rgba(26,5,16,.50),rgba(26,5,16,.28)),linear-gradient(180deg,rgba(26,5,16,.18),transparent 42%,rgba(26,5,16,.70))}
 .clean-dashboard{left:24px;right:24px;bottom:13%;width:auto}.clean-time{font-size:44px}.clean-clock-label{font-size:10px;margin-bottom:16px}.clean-progress-line{font-size:9px}.clean-progress-line>span:last-child{font-size:8px}.clean-progress{margin-block:10px}.clean-rooms{font-size:9px;gap:6px 10px}
 .clean-script{right:25px;top:14%;bottom:auto;width:90%;height:100px}.clean-script span{font-size:clamp(68px,19vw,80px);white-space:nowrap}.clean-script span:last-child{font-size:clamp(48px,13vw,68px)}
 .film-scroll-cue{bottom:3.5%;left:24px;transform:none;font-size:9px}.film-rail{bottom:6%;right:24px}
 .clean-finish{top:29%;left:24px;right:24px}.clean-finish h2{font-size:clamp(40px,10.5vw,60px);margin-bottom:26px}.clean-finish-label{font-size:8px;letter-spacing:.1em;margin-bottom:20px}.clean-finish .btn{font-size:13px;gap:40px}
 .clean-continue{font-size:10px;bottom:3%;gap:16px}
}
@media(max-height:700px) and (min-width:601px){.clean-intro{top:21%}.clean-intro h1{font-size:65px}.clean-intro p{font-size:12px}.clean-dashboard{bottom:14%;width:380px}.clean-time{font-size:40px}.clean-clock-label{margin-bottom:10px}.clean-finish{top:26%}.clean-finish h2{font-size:58px}}
@media(max-height:700px) and (max-width:600px){.clean-intro{top:18%}.clean-intro h1{font-size:48px;margin-bottom:14px}.clean-intro p{font-size:11px}.clean-dashboard{bottom:13%}.clean-time{font-size:34px}.clean-clock-label{margin-bottom:10px}.clean-rooms{font-size:8px}.clean-script{top:12%;height:80px}.clean-finish{top:25%}}
@media(prefers-reduced-motion:reduce){
 .opening-film{height:100svh;min-height:650px}.film-sticky{height:100%;min-height:650px;position:relative}
 .clean-intro,.clean-script,.clean-dashboard,.film-checks,.film-scroll-cue,.film-rail,.film-loading{display:none}
 .clean-finish{opacity:1;transform:none!important}.clean-continue{opacity:1;pointer-events:auto}
}