.finale_wrap { --ink: #f3efe8; --mute: rgba(243, 239, 232, 0.56); --line: rgba(243, 239, 232, 0.18); --red: #ff2a1c;
  position: relative; margin-top: -100vh; background: none; color: var(--ink); font-family: 'LM Sans', 'Helvetica Neue', Arial, sans-serif; }
.finale_wrap .finale_contain { position: sticky; top: 0; height: 100vh; overflow: clip; visibility: var(--vis, hidden); transform: translateY(var(--hold, 0px)); background: transparent; }
.finale_wrap .finale_sound { position: absolute; top: 22px; right: clamp(20px, 4vw, 64px); z-index: 6; display: flex; align-items: center; gap: 3px; height: 32px; padding: 0 12px; background: rgba(0, 0, 0, 0.4); border: 1px solid rgba(243, 239, 232, 0.2); border-radius: 999px; color: #f3efe8; cursor: pointer; backdrop-filter: blur(8px); font: 500 12px 'LM Sans', sans-serif; pointer-events: auto; }
.finale_wrap .finale_sound i { width: 2px; height: 4px; background: currentColor; border-radius: 1px; }
.finale_wrap .finale_sound span { margin-left: 8px; }
.finale_wrap .finale_sound[aria-pressed="true"] i { animation: finale-eq 1.1s ease-in-out infinite; }
.finale_wrap .finale_sound[aria-pressed="true"] i:nth-child(2) { animation-delay: -0.3s; } .finale_wrap .finale_sound[aria-pressed="true"] i:nth-child(3) { animation-delay: -0.6s; } .finale_wrap .finale_sound[aria-pressed="true"] i:nth-child(4) { animation-delay: -0.15s; }
@keyframes finale-eq { 0%, 100% { height: 4px; } 50% { height: 13px; } }
@media (prefers-reduced-motion: reduce) { .finale_wrap .finale_sound[aria-pressed="true"] i { animation: none; height: 10px; } }
.finale_wrap .finale_stage { position: absolute; inset: 0; }
.finale_wrap .finale_stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.finale_wrap .finale_hire { position: absolute; left: clamp(16px, 2.4vw, 40px); right: clamp(16px, 2.4vw, 40px); bottom: clamp(150px, 21vh, 200px); opacity: var(--hire, 0); transform: translateY(calc((1 - var(--hire, 0)) * 40px)); display: grid; grid-template-columns: 1fr auto; align-items: end; }
.finale_wrap .finale_hire::before { content: ''; position: absolute; left: -10vw; right: -10vw; bottom: -20vh; height: 70vh; z-index: -1; background: linear-gradient(0deg, rgba(0,0,0,0.85), rgba(0,0,0,0)); pointer-events: none; }
.finale_wrap .finale_kicker { grid-column: 1; grid-row: 1; font-size: 12px; color: var(--mute); margin: 0 0 10px; }
.finale_wrap .finale_title { grid-column: 1 / -1; grid-row: 2; font-size: min(19vw, 30vh); line-height: 0.76; font-weight: 680; font-stretch: 75%; letter-spacing: -0.055em; margin: 0; white-space: nowrap; }
.finale_wrap .finale_cta { grid-column: 2; grid-row: 1; margin-bottom: 18px; display: inline-flex; align-items: center; gap: 12px; color: #000; background: var(--ink); text-decoration: none; font-size: 15px; font-weight: 600; padding: 15px 24px; border-radius: 999px; }
.finale_wrap .finale_cta::after { content: '→'; }
.finale_wrap .finale_heaffles { position: absolute; right: clamp(20px, 4vw, 64px); top: clamp(84px, 11vh, 112px); width: min(18rem, 26vw); text-align: right; margin: 0; font-size: 14px; line-height: 1.45; color: var(--mute); opacity: var(--hire, 0); }
.finale_wrap .finale_link { color: var(--ink); text-underline-offset: 4px; }
.finale_wrap .finale_run { height: 240vh; pointer-events: none; }
.finale_wrap .finale_colophon { position: relative; z-index: 3; margin-top: -1px; background: #000; padding: clamp(36px, 7vh, 72px) clamp(16px, 2.4vw, 40px) clamp(20px, 3vh, 32px); display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 96px); border-top: 1px solid var(--line); }
.finale_wrap .finale_colophon::before { content: ''; position: absolute; left: 0; right: 0; bottom: 100%; height: 22vh; background: linear-gradient(0deg, #000, rgba(0, 0, 0, 0)); pointer-events: none; }
.finale_wrap .finale_col_k { margin: 0 0 14px; font-size: 12px; color: var(--mute); }
.finale_wrap .finale_col_t { margin: 0 0 28px; font-size: clamp(16px, 1.25vw, 20px); line-height: 1.45; max-width: 38rem; }
.finale_wrap .finale_cta.is-foot { margin: 0; }
.finale_wrap .finale_col_b { display: grid; gap: 16px; align-content: start; }
.finale_wrap .finale_col_c, .finale_wrap .finale_credits { margin: 0; font-size: 12px; line-height: 1.55; color: rgba(243, 239, 232, 0.62); }
.finale_wrap .finale_tm { margin: 8px 0 0; padding-top: 14px; border-top: 1px solid var(--line); font-size: 11px; color: var(--mute); }
@media (max-width: 767px) {
  .finale_wrap .finale_hire { bottom: 150px; }
  .finale_wrap .finale_kicker { margin-bottom: 8px; }
  .finale_wrap .finale_title { font-size: 15.4vw; }
  .finale_wrap .finale_hire { grid-template-columns: 1fr; }
  .finale_wrap .finale_cta { grid-column: 1; grid-row: 3; margin: 16px 0 0; justify-self: start; }
  .finale_wrap .finale_heaffles { left: 20px; right: 20px; width: auto; top: 84px; text-align: left; font-size: 13px; }
  .finale_wrap .finale_colophon { grid-template-columns: 1fr; gap: 26px; padding-top: 32px; }
  .finale_wrap .finale_col_t { font-size: 15px; margin-bottom: 22px; }
  .finale_wrap .finale_col_c, .finale_wrap .finale_credits { font-size: 11px; }
}

.finale_wrap button:focus-visible, .finale_wrap a:focus-visible, .finale_wrap [tabindex]:focus-visible { outline: 2px solid #ff2a1c; outline-offset: 3px; }
@media (max-width: 767px) { .finale_wrap .finale_sound span { display: none; } .finale_wrap .finale_sound { padding: 0 10px; top: 16px; } }

/* the editor's canvas: only the stills of the live page (stage.js canvasStills) */
.finale_wrap.is-canvas .finale_run { display: none; }
.finale_wrap.is-canvas { height: auto !important; margin: 0 !important; background: #000; }
.finale_wrap.is-canvas > :not(.finale_stills) { display: none !important; }
.finale_wrap .finale_stills { display: block; }
/* the Heaffles line sits over the cup's bright rim: a soft field of its own */
.finale_wrap .finale_heaffles { color: rgba(243, 239, 232, 0.86); text-shadow: 0 1px 14px rgba(0, 0, 0, 0.9), 0 0 3px rgba(0, 0, 0, 0.6); }
.finale_wrap .finale_contain::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 26vh; z-index: 1; pointer-events: none; opacity: var(--hire, 0); background: linear-gradient(180deg, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0)); }
.finale_wrap .finale_heaffles, .finale_wrap .finale_hire { z-index: 2; }
.finale_wrap .finale_hire, .finale_wrap .finale_heaffles { visibility: var(--hire-vis, hidden); }
