/* Theme A: Cinematic. Letterboxed title card over grain and a slow light leak. */
html.t-cinematic{--radius:2px}
.t-cinematic .hero-cinematic{min-height:100svh;display:grid;place-items:center;text-align:center;padding:7rem var(--pad);overflow:hidden}
.t-cinematic .letterbox::before,.t-cinematic .letterbox::after{content:"";position:absolute;left:0;right:0;height:11vh;background:#000;z-index:1;animation:cine-bars 1.8s cubic-bezier(.7,0,.2,1) .2s both}
.t-cinematic .letterbox::before{top:0;transform-origin:top}
.t-cinematic .letterbox::after{bottom:0;transform-origin:bottom}
.t-cinematic .hero-inner{position:relative;z-index:2;max-width:70rem}
.t-cinematic .title{font-size:clamp(3rem,10vw,9rem);font-weight:500;line-height:.95;letter-spacing:-.01em}
.t-cinematic .title .w{display:inline-block;animation:cine-in 2.2s cubic-bezier(.2,.6,.1,1) both;animation-delay:calc(.5s + var(--i) * .25s)}
.t-cinematic .tagline{margin:1.5rem auto 0;max-width:34rem;font-size:clamp(1.05rem,1.6vw,1.3rem);color:color-mix(in srgb,var(--text) 78%,var(--bg))}
.t-cinematic .ctas{justify-content:center}
.t-cinematic .btn-primary{background:transparent;color:var(--text);border-color:var(--accent)}
.t-cinematic .btn-primary:hover{background:var(--accent);color:var(--bg)}
.t-cinematic .status{position:absolute;z-index:2;left:var(--pad);bottom:calc(11vh + 1rem);font-size:.875rem}
.t-cinematic .intro{display:flex;justify-content:center}
.t-cinematic .lede{text-align:center;font-family:var(--f-display);font-size:clamp(1.3rem,2.4vw,1.9rem);line-height:1.4}
.t-cinematic .connect-inner{margin:0 auto}
@keyframes cine-bars{from{transform:scaleY(4.5)}to{transform:scaleY(1)}}
@keyframes cine-in{from{opacity:0;transform:translateY(.15em);filter:blur(8px)}to{opacity:1;transform:none;filter:blur(0)}}
.t-cinematic .title{font-variation-settings:"opsz" 30}