/* Silver-black metal finish shared with the 3-2-1 Guide. */
html { scroll-padding-top:100px; scroll-padding-bottom:116px; }
[hidden] { display:none !important; }
.button.primary:not([value='delete']),
.hero .button.primary, .closing .button.primary, .cinema-invite .button.primary {
  color:#f5f6f7;
  background:linear-gradient(180deg,#51575c 0%,#292d31 43%,#111315 53%,#353a3f 100%);
  border:1px solid rgba(224,228,232,.32);
  box-shadow:inset 0 1px rgba(255,255,255,.38),inset 0 -1px rgba(0,0,0,.7),0 10px 24px rgba(0,0,0,.4);
  text-shadow:0 1px 1px rgba(0,0,0,.8);
  font-weight:650; letter-spacing:-.015em;
  min-height:56px; padding:16px 25px; font-size:14px;
  transition:background .18s,box-shadow .18s,transform .18s;
}
.button.primary:not(:disabled):not([value='delete']):hover {
  color:#fff;
  background:linear-gradient(180deg,#646a70 0%,#373c41 43%,#1a1d20 53%,#464c52 100%);
  border-color:rgba(235,238,241,.62);
  box-shadow:inset 0 1px rgba(255,255,255,.48),inset 0 -1px rgba(0,0,0,.7),0 12px 28px rgba(0,0,0,.5);
  transform:translateY(-2px);
}
.button.primary:not(:disabled):active { transform:translateY(0); }
.button.primary .arrow { margin-left:12px; font-size:19px; }
.button:focus-visible, .contact-retry:focus-visible { outline:2px solid #f5f5f5; outline-offset:5px; }
.button.primary:disabled { opacity:.4; box-shadow:none; cursor:not-allowed; transform:none; }
.site-header .button.primary.header-cta { min-height:44px; padding:11px 19px; font-size:12px; }
.header-stage { color:#b8b8ba; font-size:12px; letter-spacing:.035em; }
body:not([data-page='landing']) .site-header { background:rgba(8,8,8,.94); }
.cta-action, .cinema-invite-action { display:flex; flex-direction:column; align-items:flex-start; gap:13px; }
.cta-action small, .cinema-invite-action .cta-status { font-size:12px; color:#b6b6b9; letter-spacing:.01em; }
.cta-contact-note { font-size:11px; color:#8f8f94; line-height:1.65; }
.cinema-invite { max-width:1200px; margin:60px auto 0; padding:12px 28px 50px; flex-direction:column; align-items:center; text-align:center; gap:32px; }
.cinema-invite-copy { max-width:720px; }
.cinema-invite-copy .eyebrow { justify-content:center; }
.cinema-invite-copy h2 { letter-spacing:-.055em; }
.cinema-invite-copy p { max-width:630px; margin-left:auto; margin-right:auto; }
.cinema-invite-action { width:100%; max-width:460px; align-items:center; }
.cinema-invite .button.primary { width:100%; min-height:68px; padding:21px 34px; font-size:17px; justify-content:center; }
.cinema-invite-action .cta-contact-note { max-width:400px; }
.chart-cta { display:flex; align-items:center; justify-content:space-between; gap:32px; margin:48px 0 0; padding:35px 0 0; border-top:1px solid #ffffff22; }
.chart-cta .eyebrow { font-size:9px; color:#a6a6ab; letter-spacing:.18em; margin-bottom:14px; }
.chart-cta h3 { margin:0 0 10px; color:#f1f1f2; font-size:clamp(23px,2.5vw,30px); font-weight:500; letter-spacing:-.04em; }
.chart-cta p { color:#a7a7ad; font-size:14px; line-height:1.7; margin:0; }
.chart-cta .cta-action { flex-shrink:0; }
.closing { position:relative; isolation:isolate; margin-top:40px; padding-top:80px; padding-bottom:80px; align-items:center; gap:45px; border-top:1px solid #ffffff24; }
.closing:after { background:radial-gradient(ellipse at 24% 50%,#ffffff06,transparent 65%); }
.closing .eyebrow { font-size:10px; color:#f7931a; margin-bottom:25px; }
.closing h2 { font-size:clamp(35px,4vw,58px); letter-spacing:-.05em; }
.closing h2 span { color:#a7a7ad; }
.closing p { font-size:15px; color:#b7b7bb; }
.closing .cta-action { flex-shrink:0; align-items:center; }
.closing .eyebrow { justify-content:center; }
.closing-film { position:absolute; z-index:-2; inset:56px 28px; border-radius:36px; overflow:hidden; background:#080808; pointer-events:none; }
.closing-film-poster, .closing-film-poster img, .closing-film-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.closing-film-video { opacity:0; transition:opacity .6s; }
.closing-film.is-ready .closing-film-video { opacity:1; }
.closing.has-cinema-film:after { background:linear-gradient(180deg,#0009,#000b 52%,#000e); pointer-events:none; }
.closing.has-cinema-film h2 span { color:#d0d0d3; }
.closing.has-cinema-film p, .closing.has-cinema-film small { color:#c3c3c7; }
.closing-film-toggle { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:36px; padding:7px 13px; border:1px solid #ffffff30; border-radius:999px; background:#0808088c; color:#c7c7cc; font:inherit; font-size:11px; cursor:pointer; }
.closing-film-toggle:hover { color:#fff; border-color:#ffffff70; background:#181818; }
.closing-film-toggle:focus-visible { outline:2px solid #f5f5f5; outline-offset:4px; }
/* Keep the decorative film control available to keyboard and screen-reader users. */
.closing-film-toggle:not(:focus-visible) { position:absolute; width:1px; height:1px; min-height:0; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.quiz-bottom .button { min-width:180px; }
.quiz-bottom .back-link { min-height:44px; display:inline-flex; align-items:center; }
.contact-submit { justify-content:space-between; }
.contact-reassurance { display:block; margin-top:14px; text-align:center; font-size:12px; color:#b5b5b9; }
.contact-retry { min-height:44px; width:100%; white-space:normal; margin:0 0 24px; font-size:13px; }
.mobile-cta { display:none; }
@media(max-width:1000px) {
 .cinema-invite { gap:30px; }
 .chart-cta { flex-direction:column; align-items:flex-start; }
}
@media(max-width:680px) {
 html { scroll-padding-top:88px; scroll-padding-bottom:128px; }
 body .site-header { gap:12px; padding:12px 18px; }
 .site-header .brand { width:140px; min-width:0; }
 .site-header nav { gap:0; }
 .site-header .nav-info { display:none; }
 .site-header .button.primary.header-cta { padding:10px 14px; min-height:44px; font-size:11px; max-width:180px; white-space:normal; line-height:1.35; }
 .site-header .header-cta .arrow { margin-left:6px; }
 .header-stage { text-align:right; max-width:130px; line-height:1.5; font-size:11px; }
 .cinema-invite { margin:30px auto 0; padding:12px 22px 36px; gap:27px; }
 .cinema-invite-copy h2 { font-size:44px; line-height:1.06; }
 .cinema-invite-copy p { font-size:15px; }
 .cta-action { width:100%; max-width:none; align-items:stretch; }
 .cta-action .button { width:100%; white-space:normal; line-height:1.45; text-align:left; justify-content:space-between; padding:16px 22px; font-size:14px; }
 .cinema-invite-action { max-width:400px; }
 .cinema-invite .button.primary { min-height:62px; padding:19px 22px; font-size:15px; white-space:normal; line-height:1.45; text-align:center; }
 .cinema-invite-action .cta-status, .cta-action small { text-align:center; font-size:11px; }
 .cinema-invite-action .cta-contact-note { max-width:none; text-align:center; }
 .chart-cta { margin-top:30px; padding-top:26px; gap:24px; }
 .closing { padding-top:48px; padding-bottom:48px; margin-top:16px; gap:28px; }
 .closing .cta-contact-note { text-align:center; }
 .closing .cta-action { align-items:stretch; }
 .closing-film-toggle { align-self:center; }
 .quiz-bottom { gap:12px; }
 .quiz-bottom .button.primary { min-width:0; max-width:72%; white-space:normal; line-height:1.35; padding:15px 19px; font-size:13px; }
 .mobile-cta:not([hidden]) { display:flex; position:fixed; z-index:60; bottom:0; left:0; right:0; padding:13px 18px max(13px,env(safe-area-inset-bottom)); align-items:center; gap:15px; justify-content:space-between; background:rgba(13,13,14,.97); border-top:1px solid #ffffff2b; box-shadow:0 -12px 30px #0005; }
 .mobile-cta > div { min-width:0; }
 .mobile-cta strong { display:block; font-size:13px; font-weight:550; color:#eee; }
 .mobile-cta small { display:block; margin-top:5px; max-width:155px; font-size:10px; line-height:1.5; color:#a5a5ac; }
 .mobile-cta .button.primary { min-height:48px; max-width:54%; padding:12px 16px; font-size:12px; line-height:1.35; white-space:normal; flex-shrink:0; }
 .mobile-cta .arrow { margin-left:7px; }
 .has-mobile-cta .header-cta { visibility:hidden; }
 .has-mobile-cta :is(a,button,summary,input) { scroll-margin-bottom:125px; scroll-margin-top:90px; }
}
@media(max-width:640px) { .closing-film { inset:40px 16px; border-radius:28px; } }
@media(prefers-reduced-motion:reduce) { .button, .closing-film-video { transition:none !important; } }
