/* Real showroom footage: portrait on desktop, immersive green-edged mobile view. */
.page-order .cinema.real-cinema{background:#152a21}
.real-cinema .cinema-slide{--film-height:680px;height:var(--film-height);min-height:0;max-height:none;aspect-ratio:auto}
.real-cinema .cinema-media{position:absolute;right:6%;top:0;bottom:0;width:calc(var(--film-height) * .562637363);aspect-ratio:512/910;overflow:hidden;background:#e2e0d8}
.real-cinema .cinema-poster,
.page-order .real-cinema .cinema-slide video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;filter:none}
.real-cinema .cinema-poster{z-index:0}
.page-order .real-cinema .cinema-slide video{z-index:1;opacity:1;transition:opacity .25s ease;background:transparent}
.page-order .real-cinema.cinema-enhanced .cinema-slide video{opacity:0}
.page-order .real-cinema.cinema-enhanced .cinema-slide.has-frame video{opacity:1}
.real-cinema .cinema-slide::after{display:none}
.real-cinema .cinema-top{inset:28px 6% auto}
.real-cinema .cinema-caption{left:6%;right:auto;bottom:190px;width:40%;max-width:520px}
.real-cinema .cinema-caption h3{font-size:clamp(42px,4.4vw,66px);line-height:1.1}
.real-cinema .cinema-controls{left:6%;right:auto;bottom:48px;width:40%;grid-template-columns:1fr auto;gap:12px}
.real-cinema .film-position{grid-column:1/-1;margin-bottom:18px}
.real-cinema .film-dot{width:36px;height:44px}
.real-cinema .circle-button{width:44px;height:44px}
.real-cinema .circle-button:disabled{opacity:.35;cursor:default}
.real-photo-note{color:var(--muted);font-size:12px;line-height:1.7;margin:15px 0 0}
@media(min-width:720px) and (max-width:959px){
 .real-cinema .cinema-slide{--film-height:560px;height:var(--film-height)}
 .real-cinema .cinema-media{right:3%}
 .real-cinema .cinema-caption,.real-cinema .cinema-controls{left:5%;width:40%}
 .real-cinema .cinema-caption h3{font-size:42px}
 .real-cinema .cinema-controls{grid-template-columns:1fr;gap:8px}
 .real-cinema .film-position{margin:0}
 .real-cinema .film-buttons{justify-self:start}
}
/* Let the footage continue behind the mobile caption, fading into the green base. */
.cinema-scroll-cue{display:none}
@media(max-width:719px){
 .page-order .cinema.real-cinema{--gallery-height:clamp(360px,calc(100vh - var(--order-nav-height,73px) - 48px),700px);--gallery-height:clamp(360px,calc(100svh - var(--order-nav-height,73px) - 48px),700px);width:100%;max-width:none;margin:0}
 .page-order .real-cinema .cinema-slide{height:var(--gallery-height);min-height:0;max-height:none;aspect-ratio:auto;padding:0;display:block}
 .real-cinema .cinema-media{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;isolation:isolate}
 .real-cinema .cinema-media::after{content:'';position:absolute;inset:auto 0 0;height:240px;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(21,42,33,0) 0%,rgba(21,42,33,.15) 14%,rgba(21,42,33,.80) 42%,rgba(21,42,33,.94) 73%,#152a21 100%)}
 .real-cinema .cinema-poster,.page-order .real-cinema .cinema-slide video{object-position:50% 60%}
 .real-cinema [data-room="kitchen"] .cinema-poster,.page-order .real-cinema [data-room="kitchen"] video{object-position:50% 62%}
 .real-cinema [data-room="bedroom"] .cinema-poster,.page-order .real-cinema [data-room="bedroom"] video{object-position:50% 66%}
 .real-cinema [data-room="bathroom"] .cinema-poster,.page-order .real-cinema [data-room="bathroom"] video{object-position:50% 63%}
 .page-order .real-cinema .cinema-caption{position:absolute;left:max(22px,env(safe-area-inset-left));right:max(22px,env(safe-area-inset-right));top:auto;bottom:78px;width:auto;height:auto;min-height:0;max-width:none;padding:0;box-sizing:border-box;z-index:3}
 .real-cinema .cinema-caption .lbl{font-size:10px;letter-spacing:.18em;margin:0 0 4px;line-height:1.4}
 .real-cinema .cinema-caption h3{font-size:clamp(32px,8.2vw,38px);line-height:1.1;min-height:0;max-width:100%;margin:0}
 .page-order .real-cinema .cinema-top{inset:12px max(16px,env(safe-area-inset-right)) auto max(16px,env(safe-area-inset-left))}
 .real-cinema .cinema-top .back-link{color:#183c2d;background:#fffffff0;padding:5px 9px;min-height:36px;max-width:none;text-shadow:none;font-size:11px}
 .page-order .real-cinema .cinema-controls{left:max(14px,env(safe-area-inset-left));right:max(22px,env(safe-area-inset-right));bottom:14px;width:auto;grid-template-columns:1fr auto;gap:16px}
 .real-cinema .film-position{display:none}
 .real-cinema .film-dots{gap:0}
 .real-cinema .film-dot{width:44px;height:44px}
 .real-cinema .film-buttons{gap:0}
 .real-cinema #film-prev,.real-cinema #film-next{display:none}
 .real-cinema .circle-button{width:44px;height:44px}
 .cinema-scroll-cue{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;box-sizing:border-box;background:#fff;color:var(--strong);font-size:11px;letter-spacing:.09em;line-height:1.4;text-decoration:none}
 .cinema-scroll-cue svg{width:16px;height:16px;flex:none}
 .cinema-scroll-cue:hover{text-decoration:underline;text-underline-offset:4px}
 .page-order .cinema-context{padding-top:20px}
}
@media(max-width:719px) and (max-height:550px){
 .page-order .real-cinema .cinema-caption{bottom:70px}
 .real-cinema .cinema-caption h3{font-size:30px}
 .page-order .real-cinema .cinema-controls{bottom:10px}
}
@media(max-width:719px) and (orientation:landscape){
 .page-order .cinema.real-cinema{--gallery-height:clamp(240px,calc(100vh - var(--order-nav-height,73px) - 36px),380px);--gallery-height:clamp(240px,calc(100svh - var(--order-nav-height,73px) - 36px),380px)}
 .page-order .real-cinema .cinema-slide{height:var(--gallery-height);display:block}
 .real-cinema .cinema-media{position:absolute;right:5%;top:0;bottom:0;left:auto;width:calc(var(--gallery-height) * .562637363);height:100%;aspect-ratio:512/910}
 .real-cinema .cinema-media::after{display:none}
 .page-order .real-cinema .cinema-caption{position:absolute;left:5%;right:auto;top:70px;bottom:auto;width:48%;height:auto;padding:0}
 .real-cinema .cinema-caption h3{font-size:30px}
 .page-order .real-cinema .cinema-controls{left:calc(5% - 8px);right:auto;width:49%;bottom:13px;gap:8px}
 .real-cinema .film-dot{width:40px}
 .real-cinema .cinema-top .back-link{color:#fff;background:transparent;padding:0}
 .cinema-scroll-cue{min-height:36px;padding-block:8px}
}
@media(prefers-reduced-motion:reduce){.page-order .real-cinema .cinema-slide video{transition:none}}
