*{box-sizing:border-box}
html,body{width:100%;min-height:100%;margin:0;overflow:hidden;background:#080002}
body{color:#fff;font-family:Arial,Helvetica,sans-serif}
button,input{font:inherit}
.hero{position:relative;display:grid;width:100%;min-height:100svh;overflow:hidden;isolation:isolate;background:#080002}
.films,.film,.shade,.grain,.mystery-veil{position:absolute;inset:0}
.films{z-index:-2}.film{width:100%;height:100%;object-fit:cover;transform:scale(1.012);filter:saturate(1.12) contrast(1.08)}
.shade{background:radial-gradient(circle at 50% 52%,transparent 14%,rgba(0,0,0,.16) 58%,rgba(0,0,0,.62) 110%),linear-gradient(180deg,rgba(0,0,0,.2),transparent 28%,transparent 68%,rgba(0,0,0,.3))}
.grain{opacity:.08;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");mix-blend-mode:soft-light;pointer-events:none}
.mystery-veil{background:radial-gradient(ellipse at 50% 44%,rgba(65,0,5,.08) 0%,rgba(0,0,0,.46) 48%,rgba(0,0,0,.9) 110%);animation:veil-breathe 17.8s ease-in-out infinite;pointer-events:none}
.content.quote-layout{display:flex;width:min(92vw,1560px);min-height:100svh;margin:0 auto;align-items:center;justify-content:center;padding:clamp(40px,8vh,90px) 0;text-align:center}
.quote-message{display:flex;width:100%;min-height:0;flex-direction:column;align-items:center;justify-content:center;padding:0}
.mystery-quote{display:grid;justify-items:center;gap:clamp(20px,3vh,34px);margin:0;text-align:center}
.mystery-quote p{max-width:13em;margin:0;color:#fff;font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.35rem,4vw,4.8rem);font-weight:400;font-style:italic;line-height:1.12;letter-spacing:.005em;text-wrap:balance;text-shadow:0 4px 34px rgba(0,0,0,.7);animation:quote-reveal 17.8s cubic-bezier(.22,.75,.2,1) infinite both}
.mystery-quote cite{color:rgba(255,255,255,.8);font-family:Georgia,"Times New Roman",serif;font-size:clamp(.95rem,1.3vw,1.3rem);font-style:normal;letter-spacing:.16em;text-transform:uppercase;animation:author-reveal 17.8s ease infinite both}
.subscribe{min-width:240px;min-height:60px;padding:15px 40px;border:2px solid rgba(255,255,255,.78);border-radius:999px;color:#fff;background:rgba(8,0,2,.18);font-size:1rem;cursor:pointer;backdrop-filter:blur(5px);transition:color .18s ease,background .18s ease,transform .18s ease}
.subscribe:hover,.subscribe:focus-visible{color:#321015;background:#fff;transform:translateY(-2px)}
.curtain-cta{min-width:min(420px,88vw);margin-top:clamp(40px,6vh,70px);text-transform:uppercase;letter-spacing:.08em;animation:reveal-button 17.8s cubic-bezier(.22,.75,.2,1) infinite both}
.soundtrack-toggle{position:absolute;right:clamp(18px,2.2vw,34px);bottom:clamp(18px,2.5vh,30px);z-index:3;display:flex;min-height:44px;align-items:center;gap:10px;padding:0 15px;border:1px solid rgba(255,255,255,.32);border-radius:999px;color:rgba(255,255,255,.8);background:rgba(8,0,2,.35);backdrop-filter:blur(10px);cursor:pointer;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;transition:.2s}
.soundtrack-toggle:hover,.soundtrack-toggle:focus-visible,.soundtrack-toggle.is-playing{color:#fff;border-color:rgba(255,255,255,.72);background:rgba(8,0,2,.62)}
.soundtrack-toggle.has-error{border-color:rgba(255,190,190,.7);color:#fff}.soundtrack-icon{display:grid;width:22px;height:22px;place-items:center;border:1px solid currentColor;border-radius:50%;font-size:.58rem;letter-spacing:0}
.subscribe:focus-visible,.soundtrack-toggle:focus-visible{outline:3px solid rgba(255,255,255,.9);outline-offset:4px}
dialog{width:min(510px,calc(100vw - 30px));border:1px solid rgba(176,134,87,.35);border-radius:16px;padding:34px;color:#102958;background:rgba(255,255,255,.98);box-shadow:0 28px 90px rgba(0,0,0,.45)}
dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(5px)}.close{position:absolute;right:14px;top:10px;border:0;color:#5e6878;background:transparent;font-size:1.8rem;cursor:pointer}
dialog h2{margin:0 0 12px;font-family:Georgia,"Times New Roman",serif;font-size:2rem;font-weight:400}dialog p{margin:0;color:#596579;line-height:1.6}
form{display:grid;gap:14px;margin-top:22px}form label{font-size:.88rem;font-weight:600}form input{width:100%;height:52px;border:1px solid #cdd4df;border-radius:10px;padding:0 14px;color:#102958;background:#fff;font-size:16px}form button{min-height:52px;border:0;border-radius:10px;color:#fff;background:#102958;font-weight:600;cursor:pointer}form small{color:#7a8494;font-size:.72rem;line-height:1.5}
.success{justify-items:center;padding:18px 4px 8px;text-align:center}.success span{display:grid;width:52px;height:52px;margin:0 auto 14px;place-items:center;border-radius:50%;color:#fff;background:#102958;font-size:1.5rem}
@keyframes veil-breathe{0%,10%{opacity:.96;backdrop-filter:brightness(.38) blur(1.2px)}30%{opacity:.72;backdrop-filter:brightness(.62) blur(.5px)}72%{opacity:.35;backdrop-filter:brightness(.88)}94%{opacity:.42;backdrop-filter:brightness(.82)}100%{opacity:.96;backdrop-filter:brightness(.38) blur(1.2px)}}
@keyframes quote-reveal{0%,5%{opacity:0;transform:translateY(18px) scale(.98);filter:blur(9px)}18%,94%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}100%{opacity:0;transform:translateY(-5px);filter:blur(3px)}}
@keyframes author-reveal{0%,17%{opacity:0;transform:translateY(9px)}28%,94%{opacity:1;transform:translateY(0)}100%{opacity:0}}
@keyframes reveal-button{0%,25%{opacity:0;transform:translateY(12px) scale(.96);box-shadow:0 0 0 rgba(255,255,255,0)}38%,96%{opacity:1;transform:translateY(0) scale(1);box-shadow:0 0 34px rgba(255,255,255,.1)}100%{opacity:0;transform:translateY(-4px)}}
@media(max-width:700px){.film{object-position:center;transform:scale(1.035)}.content.quote-layout{width:100%;min-height:100svh;padding:max(24px,env(safe-area-inset-top)) 20px max(76px,calc(env(safe-area-inset-bottom) + 62px))}.quote-message{width:100%;max-width:430px;margin:auto}.mystery-quote{width:100%;gap:18px}.mystery-quote p{max-width:10em;margin-inline:auto;font-size:clamp(2rem,10vw,3.25rem);line-height:1.1}.mystery-quote cite{font-size:.8rem;letter-spacing:.12em}.curtain-cta{width:min(340px,90vw);min-width:0;min-height:58px;height:auto;margin:30px auto 0;padding:15px 20px;font-size:.86rem;line-height:1.25}.soundtrack-toggle{right:50%;bottom:max(14px,env(safe-area-inset-bottom));min-height:42px;padding:0 13px;transform:translateX(50%);font-size:.64rem;white-space:nowrap}dialog{padding:28px 22px;border-radius:14px}dialog h2{padding-right:22px;font-size:1.65rem}}
@media(max-width:370px){.mystery-quote p{font-size:clamp(1.8rem,9.4vw,2.3rem)}.curtain-cta{width:92vw;font-size:.8rem}}
@media(prefers-reduced-motion:reduce){.film{transform:none}.mystery-veil{opacity:.38;animation:none;backdrop-filter:none}.mystery-quote p,.mystery-quote cite,.curtain-cta{opacity:1;animation:none;transform:none;filter:none}}