/* Public text-list opt-in page. Light card on the dark support-page background, matching
   the contact page so the site reads as one thing to a reviewer. */
.optin-layout{display:grid;grid-template-columns:minmax(340px,1fr) minmax(380px,.8fr);gap:clamp(50px,9vw,130px);min-height:calc(100svh - 110px);align-items:center;padding:clamp(70px,9vw,130px) clamp(24px,8vw,130px);background:radial-gradient(circle at 14% 80%,rgba(123,77,255,.45),transparent 28%),radial-gradient(circle at 86% 20%,rgba(255,78,184,.35),transparent 26%)}
.optin-intro h1{font-size:clamp(62px,9vw,140px);line-height:.92;text-transform:uppercase}
.optin-intro h1 em{color:var(--acid)}
.optin-lede{max-width:460px;margin-top:30px;color:#d4cedd;font-size:17px;line-height:1.7}
.optin-points{display:grid;gap:14px;margin:38px 0 0;padding:0;list-style:none}
.optin-points li{display:flex;gap:15px;align-items:flex-start;color:#d4cedd;font-size:14px;line-height:1.6}
.optin-points b{color:var(--pink);font:10px 'DM Mono',monospace;padding-top:3px}
.optin-note{max-width:460px;margin-top:32px;color:#a49dae;font-size:13px;line-height:1.7}
.optin-note strong{color:#fff}

.optin-card{padding:clamp(28px,4vw,52px);background:var(--paper);color:var(--ink);box-shadow:18px 18px 0 var(--acid)}
.optin-card h2{margin:6px 0 28px;font-size:clamp(30px,3.4vw,42px)}
.optin-card form{display:grid;gap:22px}
.optin-field{display:grid;gap:8px;color:#665f6e;font:10px 'DM Mono',monospace;text-transform:uppercase}
.optin-field input{width:100%;padding:13px 0;border:0;border-bottom:1px solid rgba(16,13,24,.3);border-radius:0;background:transparent;color:var(--ink);font:17px Manrope,sans-serif;outline:none}
.optin-field input:focus{border-color:var(--purple);box-shadow:0 2px 0 var(--purple)}

/* The consent row is the part reviewers look at: unchecked, and the full sentence visible. */
.optin-consent{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:start;cursor:pointer}
.optin-consent input{width:20px;height:20px;margin-top:2px;accent-color:var(--purple);cursor:pointer;flex:0 0 auto}
.optin-consent span{color:#4f4858;font-size:13px;line-height:1.65}
.optin-card .ticket-button{width:max-content;border:0;cursor:pointer}
.optin-card .ticket-button:disabled{opacity:.5;cursor:not-allowed}
.optin-status{min-height:20px;margin:0;color:#4f4858;font-size:13px;line-height:1.6}
.optin-status.is-error{color:#b21462}
.optin-status.is-ok{color:#2f7d32}
.optin-status.is-note{color:#665f6e}
.optin-fineprint{margin:0;color:#6d6675;font-size:12px;line-height:1.7}
.optin-fineprint a{color:var(--purple);text-decoration:underline}
.optin-fineprint b{color:var(--ink)}

@media(max-width:900px){.optin-layout{grid-template-columns:1fr}.optin-card{max-width:650px}}
@media(max-width:650px){.optin-layout{padding:60px 20px 85px}.optin-intro h1{font-size:clamp(52px,16vw,82px)}.optin-card{padding:28px 20px;box-shadow:10px 10px 0 var(--acid)}}

/* Two independent consents, each with its own box. Kept visually equal so neither looks
   like the default: a reviewer must see that marketing can be declined on its own. */
.optin-choices{margin:0;padding:0;border:0;display:grid;gap:18px}
.optin-choices legend{padding:0;margin-bottom:14px;color:#665f6e;font:10px 'DM Mono',monospace;text-transform:uppercase}
.optin-consent b{display:block;margin-bottom:4px;color:var(--ink);font-size:14px}
.optin-consent span span{display:block}