/* Cinerama programme edition: inherit the unchanged Velvet and Matinee palette. */
.site-header{position:fixed;min-height:90px;padding:15px 4%;gap:22px;background:color-mix(in oklch,var(--extension-surface) 93%,transparent);border-bottom:1px solid color-mix(in oklch,var(--extension-rule) 65%,transparent);backdrop-filter:blur(12px)}
.site-header.is-scrolled{background:var(--extension-surface);box-shadow:none}
.brand{gap:13px}
.brand span{font-size:25px;letter-spacing:.11em}
.desktop-nav{gap:21px}
.desktop-nav a{font:400 22px/1.2 Georgia,serif}
.desktop-nav a+a::before{content:"/" / "";margin-right:21px;color:var(--extension-accent);text-decoration:none}
.header-actions{gap:13px}
.header-join{justify-content:center;min-height:47px;padding:11px 23px;border-radius:13px;background:var(--cream);color:var(--ink);font-size:17px;font-weight:600;text-decoration:none}
.header-join:hover{background:var(--b-paper-muted)}
html[data-theme=light] .site-header{background:var(--extension-surface);border-bottom-color:var(--extension-rule)}
html[data-theme=light] .header-join{background:var(--cobalt);color:var(--cream)}
html[data-theme=light] .header-join:hover{background:color-mix(in oklch,var(--cobalt) 85%,var(--ink))}
.button{border-radius:11px}
.cinema-intro{padding:56px 4% 66px;border-bottom:1px solid var(--extension-rule)}
.cinema-intro h1{font-size:clamp(44px,4.35vw,70px)}
.cinema-intro-action{padding-left:46px}
.cinema-intro .cinema-join{border-radius:12px}
/* Keep the original TV and phone presentation and its sticky phone-width TV. */
.demo-section{padding:82px 4% 68px}
.demo-intro{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);align-items:end;gap:70px;max-width:1328px;margin:0 auto 58px;padding-bottom:34px;border-bottom:1px solid var(--b-paper-border);text-align:left}
.demo-intro h2{max-width:650px;margin:0;font-size:clamp(46px,4.5vw,68px);line-height:1.04}
.demo-intro>p{max-width:430px;margin:0;font-size:21px;line-height:1.4;letter-spacing:-.015em}
/* Thin rules and a shared reading width connect the programme sections. */
.extension-section{padding:92px 4%;scroll-margin-top:16px}
.section-inner{max-width:1328px}
.extension-section h2{font-size:clamp(46px,4.8vw,74px);line-height:1.03;letter-spacing:-.025em;text-wrap:balance}
.extension-section p{font-size:18px;line-height:1.55}
.how-section{background:var(--extension-surface);border-bottom:1px solid var(--extension-rule)}
.how-section .section-inner{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.25fr);gap:90px}
.how-heading{display:block;padding:0;border:0}
.how-heading h2{max-width:330px;font-size:clamp(48px,5vw,76px)}
.screening-steps{display:block}
.screening-steps li{position:relative;min-width:0;margin:0;padding:28px 0 30px 54px;border-top:1px solid var(--extension-rule)}
.screening-steps li:last-child{padding-bottom:0}
.step-reel{position:absolute;left:0;top:33px;width:26px;height:26px;margin:0}
.screening-steps h3{margin:0 0 10px;font:600 24px/1.25 "DM Sans",sans-serif;letter-spacing:-.015em}
.screening-steps p{max-width:560px}
.programme-section{padding-top:76px}
.programme-heading{display:block;margin-bottom:50px;padding-bottom:30px;border-bottom:1px solid var(--extension-rule)}
.programme-heading>div:first-child{display:flex;justify-content:space-between;align-items:end;gap:60px}
.programme-heading h2{max-width:700px}
.programme-disclosure{max-width:325px;margin:0!important;font-size:15px!important}
.genre-programme{display:block}
.genre-film{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.5fr);align-items:center;gap:8%;max-width:1160px;padding:0 0 46px;margin:0 auto 46px;border-bottom:1px solid var(--extension-rule)}
.genre-film:last-child{margin-bottom:0;padding-bottom:0;border-bottom:0}
.genre-film:nth-child(even){grid-template-columns:minmax(0,1.5fr) minmax(0,.75fr)}
.genre-film:nth-child(even) .genre-poster{grid-column:2;grid-row:1}
.genre-film:nth-child(even) .genre-caption{grid-column:1;grid-row:1}
.genre-poster{width:100%;max-width:350px;box-shadow:none}
.genre-caption{padding:0}
.genre-caption h3{max-width:650px;font-size:clamp(38px,4vw,60px);line-height:1.04;text-wrap:balance}
.genre-caption h3>span{font-size:14px;vertical-align:baseline;margin-left:9px}
.genre-caption .genre-credit{margin-top:12px;font-size:15px}
.programme-host-note{max-width:620px;margin:29px 0 0;padding:23px 0 0;border-left:0;border-top:1px solid var(--extension-rule);background:none}
.programme-host-note p{font:400 clamp(22px,2vw,29px)/1.35 Georgia,serif;color:var(--extension-text);letter-spacing:-.01em}
.programme-host-note footer{margin-top:18px;font-size:15px}
.hosts-section{background:var(--extension-soft);padding-top:84px;padding-bottom:88px}
.hosts-layout{grid-template-columns:minmax(0,1.45fr) minmax(0,.8fr);gap:80px}
.role-tabs{gap:38px;margin-top:34px}
.role-tabs [role=tab]{min-height:55px;font:400 24px/1.2 "DM Serif",Georgia,serif}
.role-tabs [role=tab][aria-selected=true]:after{height:2px}
.role-panel{padding-top:32px}
.role-panel h3{font-size:38px;margin-bottom:25px}
.role-points{max-width:640px;gap:24px}
.role-points li{grid-template-columns:25px minmax(0,1fr);gap:16px}
.role-points p{font-size:18px;line-height:1.55}
.role-reel{width:20px;height:20px;margin-top:4px}
.hosts-intro{padding:9px 0 0 40px;border-left:1px solid var(--extension-rule)}
.hosts-intro h3{font-size:clamp(35px,3.2vw,48px);line-height:1.07}
.hosts-intro>p{margin-top:24px;font-size:19px;line-height:1.5}
.host-apply{margin-top:24px;font-size:18px}
.waitlist-section{padding-top:84px;padding-bottom:27px}
.closing-invitation{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:70px;align-items:center}
.waitlist-section h2{font-size:clamp(56px,6.5vw,96px);line-height:.99}
.closing-signup{padding-left:37px;border-left:1px solid color-mix(in oklch,var(--extension-text) 45%,transparent)}
.closing-signup>p{max-width:370px;font-size:24px;line-height:1.3;letter-spacing:-.02em}
.closing-actions{margin-top:27px}
.closing-actions .button{min-height:58px;padding:13px 29px;font-size:22px}
.waitlist-section .site-footer{max-width:none;margin-top:78px;padding-top:24px;font-size:14px}
.footer-wordmark{font-size:20px}
.signup-dialog h2{font-size:40px}
.menu-dialog nav>a:not(.button){font:400 27px/1.3 Georgia,serif}
@media(max-width:1200px) and (min-width:1001px){
 .site-header{gap:17px}.brand span{font-size:21px}.desktop-nav{gap:15px}.desktop-nav a{font-size:19px}.desktop-nav a+a::before{margin-right:15px}.header-actions{gap:7px}.header-join{padding:10px 18px;font-size:16px}
 .hosts-layout{gap:50px}.hosts-intro{padding-left:28px}
}
@media(max-width:1000px){
 .site-header{min-height:86px;padding:18px 32px}.brand span{font-size:24px}
 .cinema-intro{padding:42px 32px 52px}.cinema-intro h1{font-size:43px}.cinema-intro-action{padding-left:27px}
 .demo-section{padding:66px 32px 48px}.demo-intro{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:32px;margin-bottom:42px;padding-bottom:26px}.demo-intro h2{font-size:43px}.demo-intro>p{font-size:18px}
 .extension-section{padding:68px 32px}.extension-section h2{font-size:52px}
 .how-section .section-inner{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:40px}.how-heading h2{font-size:51px}.screening-steps h3{font-size:22px}.screening-steps p{font-size:17px}
 .programme-heading>div:first-child{display:block}.programme-disclosure{max-width:480px;margin-top:20px!important}
 .genre-film{gap:7%;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);padding-bottom:36px;margin-bottom:36px}.genre-film:nth-child(even){grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}.genre-caption h3{font-size:39px}.programme-host-note{margin-top:22px;padding-top:18px}.programme-host-note p{font-size:24px}
 .hosts-layout{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:38px}.hosts-intro{padding-left:26px}.hosts-intro h3{font-size:34px}.hosts-intro>p,.role-points p{font-size:17px}.role-panel h3{font-size:32px}.role-tabs{gap:27px}
 .closing-invitation{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:32px}.waitlist-section h2{font-size:62px}.closing-signup{padding-left:27px}.closing-signup>p{font-size:22px}.closing-actions .button{padding:12px 22px;font-size:20px}.waitlist-section .site-footer{margin-top:60px}
}
@media(max-width:620px){
 .site-header{min-height:76px;padding:16px 20px;gap:10px;background:var(--extension-surface)}.brand{gap:10px}.brand span{font-size:20px}.header-actions{gap:0}
 .cinema-intro{padding:29px 20px 42px}.cinema-intro h1{font-size:clamp(37px,9.9vw,55px)}.cinema-intro-action{padding:23px 0 0}
 .demo-section{padding:48px 20px 28px}.demo-intro{display:block;margin-bottom:28px;padding-bottom:25px}.demo-intro h2{font-size:40px;max-width:360px}.demo-intro>p{margin-top:18px;font-size:18px;max-width:440px}
 .extension-section{padding:52px 20px}.extension-section h2{font-size:43px;line-height:1.04}.extension-section p{font-size:17px}
 .how-section .section-inner{display:block}.how-heading{padding:0;margin-bottom:29px}.how-heading h2{max-width:none;font-size:46px}.screening-steps li{padding:24px 0 26px 44px}.step-reel{top:27px;width:22px;height:22px}.screening-steps h3{font-size:22px;margin-bottom:11px}.screening-steps p{font-size:17px}
 .programme-heading{margin-bottom:32px;padding-bottom:24px}.programme-heading h2{font-size:45px}.programme-disclosure{margin-top:18px!important;font-size:14px!important}
 .genre-film,.genre-film:nth-child(even){display:block;padding:0 0 30px;margin:0 0 30px}.genre-film+.genre-film{padding-top:0;border-top:0}.genre-film:last-child{padding-bottom:0;margin-bottom:0}.genre-poster{width:76%;max-width:320px;margin:0 0 28px}.genre-film:nth-child(even) .genre-poster{margin-left:auto}.genre-caption h3{font-size:38px}.genre-caption h3>span{font-size:13px}.genre-caption .genre-credit{font-size:14px}.programme-host-note{margin-top:22px;padding-top:19px}.programme-host-note p{font-size:24px;line-height:1.35}.programme-host-note footer{font-size:14px}
 .hosts-layout{display:block}.role-tabs{gap:33px;margin-top:27px}.role-tabs [role=tab]{font-size:24px}.role-panel{padding-top:27px}.role-panel h3{font-size:33px;margin-bottom:22px}.role-points{gap:23px}.role-points p{font-size:17px}.role-reel{width:20px;height:20px}.hosts-intro{margin-top:36px;padding:28px 0 0;border-left:0;border-top:1px solid var(--extension-rule)}.hosts-intro h3{max-width:310px;font-size:36px}.hosts-intro>p{max-width:490px;margin-top:18px;font-size:18px}.host-apply{margin-top:20px;font-size:18px}
 .closing-invitation{display:block}.waitlist-section h2{font-size:56px}.closing-signup{margin-top:28px;padding:23px 0 0;border-left:0;border-top:1px solid color-mix(in oklch,var(--extension-text) 45%,transparent)}.closing-signup>p{font-size:22px}.closing-actions{margin-top:23px}.closing-actions .button{font-size:21px}.waitlist-section .site-footer{margin-top:47px;padding-top:19px;font-size:13px}.footer-wordmark{gap:11px;font-size:16px}.footer-wordmark img{width:37px;height:37px}.signup-dialog h2{font-size:35px}
}

/* v39: carry the approved cream reel-camera navigation over the artwork. */
.projector-symbols{position:absolute;overflow:hidden;pointer-events:none}
.brand-mark,.footer-mark{display:block;flex-shrink:0;width:44px;height:44px;fill:currentColor}
.cinema-screen-mark{display:block;flex-shrink:0;fill:currentColor;color:var(--cream)}
.site-header:not(.is-scrolled),html[data-theme=light] .site-header:not(.is-scrolled){color:var(--cream);background:linear-gradient(180deg,color-mix(in oklch,var(--ink) 55%,transparent),transparent);border-bottom-color:transparent;backdrop-filter:none}
.site-header:not(.is-scrolled) .brand,.site-header:not(.is-scrolled) .theme-toggle,.site-header:not(.is-scrolled) .menu-toggle{color:var(--cream)}
.site-header:not(.is-scrolled) .desktop-nav a+a::before{color:var(--cream)}
.site-header:not(.is-scrolled) .header-join{background:var(--cream);color:var(--ink)}
.site-header:not(.is-scrolled) .header-join:hover{background:var(--b-paper-muted)}
.site-header:not(.is-scrolled) :is(.theme-toggle,.menu-toggle):hover{background:color-mix(in oklch,var(--cream) 12%,transparent)}
.site-header.is-scrolled{background:var(--extension-surface);color:var(--extension-text)}
.site-header.is-scrolled .brand,.site-header.is-scrolled .theme-toggle,.site-header.is-scrolled .menu-toggle{color:var(--extension-accent)}
html[data-theme=light] .site-header.is-scrolled{background:var(--extension-surface);border-bottom-color:var(--extension-rule)}
@media(max-width:620px){.brand-mark{width:35px;height:35px}.footer-mark{width:37px;height:37px}}
