/* Bright opening, followed by the real films; never render an empty video layer. */
.cinema-stage { background: radial-gradient(ellipse at 78% 76%, #a5aaa0 0, transparent 64%), linear-gradient(112deg, #f6f3eb 0%, #efeee5 47%, #c2c6ba 76%, #929b8e 100%); }
.scene-sticky .hero-copy { color: #18221c; }
.scene-sticky .hero-copy p { color: #3e4b41; }
.scene-sticky .hero-copy .eyebrow { color: #3e4b41; }
.scene-sticky .hero-copy h1 em { color: #4d644e; }
.cinema-film { background-size: cover; background-position: center; }
.cinema-film--inside { background-image: url("./assets/piano-interior-poster-v18.jpg"); }
.cinema-film--action { background-image: url("./assets/piano-mechanics-poster-v18.jpg"); }
.cinema-film video { opacity: 0; transition: opacity .2s ease; }
.cinema-film video[data-frame-ready="true"] { opacity: 1; }
.scene-transition { color: #18221c; text-shadow: none; }

@media (max-width: 740px) {
  .site-header, .site-header.is-scrolled { background: rgba(247,248,243,.97); color: #18221c; box-shadow: 0 1px 0 rgba(31,43,34,.12); }
  .scene-section { height: 570svh; }
  .scene-sticky { height: 100svh; perspective: none; }
  .scene-stage { perspective: none; transform-style: flat; }
  .scene-sticky::before, .scene-floor, .scene-halo, .cinema-lens-flare { display: none; }
  .cinema-stage { background: linear-gradient(180deg, #f5f2e9 0%, #f5f2e9 39%, #dce0d5 69%, #a0ab9b 100%); }
  .scene-grain { opacity: .035; }
  .scene-photo, :root[data-design="atelier"] .scene-photo { inset: auto -2vw 3svh auto; width: 104vw; height: 45svh; transform-origin: 61% 40%; transform-style: flat; filter: drop-shadow(0 18px 22px rgba(11,20,12,.2)); }
  .scene-photo img { object-position: center bottom; }
  .scene-sticky .hero-copy, :root[data-design="galerie"] .scene-sticky .hero-copy { top: calc(72px + 2svh); left: 23px; right: 23px; max-width: none; }
  .scene-sticky .hero-copy .eyebrow { font-size: 9px; letter-spacing: .13em; }
  .scene-sticky .hero-copy h1, :root[data-design="galerie"] .scene-sticky .hero-copy h1 { font-size: clamp(34px, min(10.5vw, 6svh), 48px); line-height: 1.02; letter-spacing: -.045em; margin: 13px 0 12px; }
  .scene-sticky .hero-copy h1 em { display: block; font-size: 1.04em; }
  .scene-sticky .hero-copy p { max-width: 330px; font-size: 14px; line-height: 1.5; margin: 0 0 15px; }
  .scene-sticky .hero-copy .primary-button { min-height: 46px; padding: 10px 18px; font-size: 12px; }
  .cinema-film { inset: 72px 0 0; background-position: 56% center; transform-origin: center; }
  .cinema-film video { object-position: 56% center; filter: saturate(.82) contrast(1.04) brightness(.94); }
  .cinema-film--action { background-position: 60% center; }
  .cinema-film--action video { object-position: 60% center; filter: saturate(.8) contrast(1.06) brightness(.95); }
  .cinema-film--inside::after, .cinema-film--action::after { background: linear-gradient(180deg, transparent 35%, rgba(4,9,5,.18) 62%, rgba(4,9,5,.7) 100%); }
  .scene-chapter-copy, .scene-inside, .scene-mechanics { left: 0; right: 0; bottom: 0; width: auto; max-width: none; padding: 32px 24px 78px; border: 0; border-radius: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; transform-style: flat; background: linear-gradient(180deg, transparent, rgba(8,15,10,.78) 35%); color: #fffaf0; text-shadow: 0 1px 8px rgba(0,0,0,.2); }
  .scene-chapter-copy::before, .scene-inside::before, .scene-mechanics::before { display: none; }
  .scene-chapter-copy .eyebrow, .scene-inside .eyebrow, .scene-mechanics .eyebrow { color: #e7d7b7; font-size: 9px; letter-spacing: .14em; }
  .scene-chapter-copy p, .scene-inside p, .scene-mechanics p { font-size: clamp(35px, 10vw, 46px); line-height: 1.04; margin: 12px 0 10px; color: #fffaf0; }
  .scene-chapter-copy i, .scene-inside i, .scene-mechanics i { color: #e7d7b7; }
  .scene-chapter-copy small, .scene-inside small, .scene-mechanics small { color: #f0eee4; font-size: 13px; line-height: 1.55; max-width: 320px; }
  .scene-transition { top: 34%; padding-inline: 22px; }
  .scene-transition p { font-size: clamp(43px,11vw,64px); }
  .scene-caption { left: 24px; bottom: 29px; transform: none; font-size: 8px; color: #f3eee2; text-shadow: 0 1px 6px #000; }
  .scene-caption span { color: #d9c89f; }
  .scene-sticky[data-chapter="1"] .scene-caption { color: #26382a; text-shadow: none; }
  .scene-progress { left: 24px; right: auto; bottom: 16px; width: calc(100% - 48px); height: 2px; background: rgba(255,255,255,.25); }
  .scene-progress span { background: #d6c59e; }
  .scene-material-note { display: none; }
  .scroll-prompt { left: 24px; bottom: 25px; color: #26382a; font-size: 8px; }
}
@media (max-width: 740px) and (max-height: 680px) {
  .scene-sticky .hero-copy p { font-size: 12px; margin-bottom: 11px; }
  .scene-sticky .hero-copy h1, :root[data-design="galerie"] .scene-sticky .hero-copy h1 { margin-block: 10px; }
  .scene-photo, :root[data-design="atelier"] .scene-photo { height: 43svh; bottom: 2svh; }
}
@media (prefers-reduced-motion: reduce) {
  .scene-section { height: 100svh; }
  .cinema-film video { transition: none; }
}