/* Acquisition and accessibility polish layered after the canonical theme CSS. */
html { overflow-x: clip; }
body { overflow-x: clip; max-width: 100%; overflow-wrap: break-word; }
img, svg, video, canvas, iframe, table, pre { max-width: 100%; }
pre, table { overflow-x: auto; }
h1 { font-size: clamp(3.2rem, 8vw, 7.375rem); text-wrap: balance; }
h2 { text-wrap: balance; }
.section-lede { text-wrap: pretty; }
.signal-band { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.audience-band { border-block: 1px solid rgba(246,240,228,.1); background: linear-gradient(135deg, rgba(83,217,212,.06), transparent 45%, rgba(179,140,255,.08)); }
.audience-grid { margin-top: 2rem; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 1px; background: rgba(246,240,228,.12); }
.audience-card { min-height:210px; display:flex; flex-direction:column; justify-content:space-between; gap:1.5rem; padding:1.5rem; background:#0b0d13; border:1px solid transparent; transition:transform 160ms ease,border-color 160ms ease,background 160ms ease; }
.audience-card span { color:var(--gold); font-size:.75rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.audience-card strong { font-size:1.15rem; line-height:1.35; }
.audience-card:hover,.audience-card:focus-visible { transform:translateY(-3px); border-color:var(--violet); background:#11131d; }
.product-disclosure { max-width:760px; margin-top:1.25rem; color:var(--quiet); font-size:.9rem; line-height:1.55; }
#how .how-steps { list-style:none; margin:1.5rem 0 0; padding:0; display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); counter-reset:step; }
#how .how-steps li { padding:1.1rem 1.25rem; border:1px solid rgba(255,255,255,.10); border-radius:14px; background:rgba(255,255,255,.02); }
#how .how-steps li::before { counter-increment:step; content:counter(step); display:inline-flex; width:1.6rem; height:1.6rem; align-items:center; justify-content:center; border-radius:50%; background:rgba(120,200,255,.15); color:#bfe3ff; font-size:.85rem; margin-bottom:.55rem; }
#how .how-steps strong { display:block; margin-bottom:.3rem; }
#how .how-steps span { display:block; opacity:.72; font-size:.92rem; line-height:1.4; }
#how .faq { margin-top:2rem; max-width:760px; }
#how .faq h3 { font-size:1rem; opacity:.8; margin:0 0 .75rem; }
#how .faq details { border-bottom:1px solid rgba(255,255,255,.08); padding:.7rem 0; }
#how .faq summary { cursor:pointer; font-weight:600; list-style:none; }
#how .faq summary::-webkit-details-marker { display:none; }
#how .faq summary::before { content:"+ "; color:#7cc8ff; }
#how .faq details[open] summary::before { content:"− "; }
#how .faq p { margin:.5rem 0 0; opacity:.75; line-height:1.5; }
:where(a,button,input,select,textarea,summary):focus-visible { outline:3px solid var(--cyan); outline-offset:3px; }
@media (max-width:1100px) { .audience-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .signal-band { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:680px) { .audience-grid,.signal-band { grid-template-columns:1fr; } .audience-card { min-height:150px; } }
@media (prefers-reduced-motion:reduce) { .audience-card { transition:none; } }
