/* White, electric blue, and a quieter hierarchy. */
:root{--accent:#335cff;--accent-deep:#2447dc;--accent-soft:#edf1ff;--accent-light:#b6c4ff;--paper:#fff;scroll-padding-top:112px}
::selection{background:#dce4ff;color:var(--ink)}
.site-header{position:sticky;top:0;z-index:10;background:#fffffff2;backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.header{border-bottom:0}
.brand-symbol{width:44px;height:28px;border-radius:0}.brand{gap:11px}
.primary-nav a{border-radius:7px;transition:background .2s,color .2s}
.primary-nav a:hover,.primary-nav a[aria-current=location]{background:var(--accent-soft);color:var(--accent-deep);text-decoration:none}
.header .login{border:1px solid #d4d7df;border-radius:8px;background:transparent;color:var(--ink);gap:16px;transition:background .2s,border-color .2s,color .2s}
.header .login:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.login svg{transition:transform .2s}.login:hover svg{transform:translateX(3px)}
.hero{padding-top:42px}.hero h1 em{color:var(--accent)}
.little-line{width:22px;height:6px;border-radius:8px;background:var(--accent);vertical-align:middle}
.hero-foot{color:var(--muted);font-size:.6875rem;letter-spacing:1.2px;margin-top:36px}
.button{border-radius:8px;transition:transform .2s,background .2s,box-shadow .2s}
.dark{background:var(--accent);color:#fff}
.button span{transition:transform .2s}
.button:hover{background:var(--accent-deep);color:#fff;transform:translateY(-2px);box-shadow:0 5px 18px #335cff1a}
.button:hover span{transform:translate(2px,-2px)}
.button:active{transform:translateY(0)}.button:disabled{cursor:wait;transform:none;box-shadow:none}
.text-link{text-decoration-color:#b8bdc8}.text-link:hover{color:var(--accent-deep);text-decoration-color:currentColor}
.cinema{background:#141820;padding-block:30px}
.section-top .eyebrow,.screen-bar>span:first-child,.choice-arrow,.detail-figure figcaption strong,.focus-symbol{color:var(--accent-light)}
.screen-frame{border-radius:10px}.screen-bar>span:first-child{display:inline-flex;align-items:center;gap:10px}
.playback-indicator{display:inline-block;width:6px;height:6px;border-radius:50%;background:#74809a}
.screen-frame[data-playing=true] .playback-indicator{background:var(--accent-light);box-shadow:0 0 0 4px #b6c4ff16;animation:playing 1.6s ease-in-out infinite}
@keyframes playing{50%{box-shadow:0 0 0 7px #b6c4ff00}}
.film-choice{border-radius:8px;transition:background .2s,border-color .2s,transform .2s}
.film-choice[aria-pressed=true]{border-color:#819aff;background:#222e4c}
.film-choice:hover{border-color:#7183aa;background:#212b3f;transform:translateY(-2px)}
.choice-arrow{transition:transform .2s}.film-choice:hover .choice-arrow{transform:translate(2px,-2px)}
.player-error{color:#f3b6ab}
.workflow{padding-block:56px}.workflow .steps{background:#fff}
.workflow .step-number{background:var(--accent-soft);color:var(--accent-deep);border-radius:8px}
.studio{background:#f0f1f5;border-color:#e3e5ec}
.audience-grid{gap:24px}.audience-grid article{padding:30px}
.audience-label{color:var(--accent-deep);font-weight:600;font-size:.6875rem}
.access{background:var(--accent-soft);border:1px solid #e0e6fc}
.access h2 em{color:var(--accent-deep)}.demo-expect{border-color:#d3dbf5}
.demo-panel{border-color:#dee3f0;border-radius:12px}
#demo-form input:not([type=checkbox]),#demo-form textarea{background:#fdfdfe;transition:border-color .2s,box-shadow .2s}
#demo-form input:focus-visible,#demo-form textarea:focus-visible{border-color:var(--accent)}
.form-consent input{accent-color:var(--accent)}
.receipt-check{background:var(--accent-soft);color:var(--accent-deep)}
.skip{color:#fff}
dialog{border-radius:14px;box-shadow:0 24px 80px #0c153d33}
dialog::backdrop{background:#101525b3}
.close-dialog{border-radius:50%}.close-dialog:hover{background:var(--accent-soft)}
@media(max-width:760px){
 :root{scroll-padding-top:96px}
 .header .login{gap:7px;padding:10px 13px}.hero{padding-top:30px}
 .header .brand-symbol{width:36px;height:24px}
 .hero>.eyebrow{max-width:30ch;text-wrap:balance}
 .hero-foot{font-size:.6875rem;letter-spacing:.4px;margin-top:24px}
 .cinema{padding-block:22px}.workflow{padding-block:40px}
 .audience-grid article{padding:24px}
}
@media(max-width:380px){.header .login{padding-inline:10px}.header .brand-symbol{width:32px;height:22px}}
@media(hover:none){.button:hover,.film-choice:hover{transform:none}}
@media(prefers-reduced-motion:reduce){
 :root{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
}