@charset "UTF-8";

/* One screen, three chapters. Poster art is conceptual until licensed video arrives. */
.horizontal-film-panel{display:block;background:#10241e;color:#f3efe5}
.horizontal-film-panel .film-cinema-v36{display:grid;grid-template-columns:minmax(0,66%) minmax(340px,34%);width:100%;height:100%;min-height:0;padding:0}
.film-cinema-screen{position:relative;isolation:isolate;min-width:0;min-height:0;overflow:hidden;background:#0a1511 var(--film-cinema-poster,url("assets/film-cinema-01-v36.jpg")) 55% 52%/cover no-repeat}
.film-cinema-screen::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(5,17,13,.48),transparent 25%,transparent 51%,rgba(3,12,9,.83) 100%),linear-gradient(90deg,rgba(5,17,13,.33),transparent 40%);pointer-events:none}
.film-cinema-screen-top{position:absolute;z-index:1;top:35px;right:clamp(26px,3.7vw,49px);left:clamp(26px,3.7vw,49px);display:flex;align-items:center;justify-content:space-between;gap:20px;color:#e9d4a8;font-size:10px;font-weight:700;letter-spacing:.19em;white-space:nowrap}
.film-cinema-screen-top small{color:#d5d5c6;font-size:9px;font-weight:400;letter-spacing:.1em}
.film-cinema-open{position:absolute;z-index:1;top:47%;left:50%;display:grid;place-items:center;width:96px;height:96px;border:1px solid #f4ddac;border-radius:50%;background:rgba(11,31,23,.36);color:#f8e6be;cursor:pointer;font-size:27px;transform:translate(-50%,-50%);box-shadow:0 0 0 12px rgba(11,31,23,.12);backdrop-filter:blur(6px);transition:background .2s,transform .2s}
.film-cinema-open span{margin-left:5px}
.film-cinema-open:hover{background:rgba(217,184,117,.28);transform:translate(-50%,-50%) scale(1.05)}
.film-cinema-caption{position:absolute;z-index:1;right:clamp(26px,3.7vw,49px);bottom:30px;left:clamp(26px,3.7vw,49px);color:#fff8e8;text-shadow:0 3px 16px rgba(0,0,0,.45)}
.film-cinema-chapter{display:block;margin-bottom:12px;color:#dbc48f;font-size:10px;font-weight:700;letter-spacing:.22em}
.film-cinema-caption h3{margin:0;font:500 clamp(35px,3.6vw,48px)/1.22 var(--serif);letter-spacing:.06em}
.film-cinema-caption p{margin:7px 0 20px;color:#d2d9cd;font-size:11px;letter-spacing:.1em}
.film-cinema-caption>a{position:absolute;right:0;bottom:42px;padding-bottom:5px;border-bottom:1px solid #d1bd90;color:#f0dfb7;font-size:11px;letter-spacing:.1em;text-decoration:none}
.film-cinema-caption>a:hover{color:#fff4d4;border-color:#fff4d4}
.film-cinema-progress{display:flex;align-items:center;gap:11px;color:#e9d1a1;font:11px/1 Georgia,serif}
.film-cinema-progress i{display:block;flex:1;height:2px;background:rgba(230,194,123,.36)}
.film-cinema-progress b{display:block;width:33.333%;height:100%;background:#e6c27b;transition:width .25s}
.film-cinema-program{display:flex;flex-direction:column;min-width:0;min-height:0;overflow-y:auto;padding:clamp(27px,2.5vw,33px) clamp(25px,3.4vw,44px) 23px;border-left:1px solid #ceb47d;background:#f2eee3;color:#19332b;scrollbar-width:thin;scrollbar-color:#b9ad8c transparent}
.film-cinema-eyebrow{color:#a37d46;font-size:10px;font-weight:700;letter-spacing:.22em}
.film-cinema-program h2{margin:15px 0 9px;font:500 clamp(47px,4.5vw,58px)/1.15 var(--serif);letter-spacing:.04em}
.film-cinema-intro{max-width:330px;margin:0;color:#617466;font-size:13px;line-height:1.8}
.film-cinema-list{display:flex;flex-direction:column;margin:23px 0 0;padding:0;list-style:none;border-top:1px solid #9da995}
.film-cinema-list li{display:flex;align-items:center;min-height:84px;border-bottom:1px solid #c5cbbd;transition:background .2s}
.film-cinema-list li.is-selected{margin:0 -17px;padding:0 17px;border-bottom-color:#1c3b30;background:#1c3b30;color:#f7edda}
.film-cinema-list button{display:grid;grid-template-columns:45px minmax(0,1fr);align-items:center;gap:11px;flex:1;min-width:0;min-height:83px;padding:8px 4px;border:0;background:none;color:inherit;cursor:pointer;text-align:left}
.film-cinema-list li:not(.is-selected):hover{background:#e5e8dd}
.film-cinema-number{align-self:start;margin-top:14px;color:#ac8650;font:21px/1 Georgia,serif}
.film-cinema-list li.is-selected .film-cinema-number{color:#e5c68a}
.film-cinema-list strong{display:block;font:500 clamp(20px,1.95vw,25px)/1.35 var(--serif);white-space:nowrap}
.film-cinema-list small{display:block;margin-top:5px;color:#748879;font-size:10px;letter-spacing:.08em}
.film-cinema-list li.is-selected small{color:#b9cbb7}
.film-cinema-list li>a{align-self:flex-start;flex:0 0 20px;margin-top:27px;color:#a37d46;font-size:17px;text-align:center;text-decoration:none}
.film-cinema-list li.is-selected>a{color:#e5c68a}
.film-cinema-list li>a:hover{color:#183e30}
.film-cinema-note{margin:auto 0 0;padding-top:16px;color:#697c6d;font-size:10px;line-height:1.65}
.film-cinema-note span{display:block;color:#a17f50;font-size:9px;font-weight:700;letter-spacing:.15em}
body.film-cinema-current .site-guide-launcher{display:none}

@media(max-width:900px){
  .horizontal-film-panel .film-cinema-v36{display:flex;flex-direction:column;height:auto;min-height:100%}
  .film-cinema-screen{flex:0 0 auto;height:clamp(390px,62vh,535px)}
  .film-cinema-program{flex:0 0 auto;overflow:visible;padding:30px clamp(22px,5vw,44px) 33px}
  .film-cinema-list li{min-height:80px}
  .film-cinema-list button{min-height:79px}
}
@media(max-width:540px){
  .film-cinema-screen{height:clamp(340px,53vh,470px)}
  .film-cinema-screen-top{top:20px;left:19px;right:19px;font-size:8px}
  .film-cinema-screen-top small{font-size:8px}
  .film-cinema-open{width:70px;height:70px;font-size:22px}
  .film-cinema-caption{left:19px;right:19px;bottom:20px}
  .film-cinema-caption h3{font-size:33px}
  .film-cinema-caption p{max-width:260px;font-size:9px;line-height:1.5}
  .film-cinema-caption>a{bottom:38px;font-size:9px}
  .film-cinema-program h2{font-size:49px}
  .film-cinema-intro{font-size:12px}
  .film-cinema-list strong{font-size:21px}
}
@media(prefers-reduced-motion:reduce){.film-cinema-open,.film-cinema-list li,.film-cinema-progress b{transition:none}}