/* =========================================================================== GET HELP — EVERYTHING CENTERED (founder ruling 2026-08-10) Page-scoped ON PURPOSE. Every selector is under .help__in, and this sheet is linked from get-help.html only, so the same #enroll markup stays LEFT-ALIGNED inside the homepage .emod modal (index.html does not load this file). Nothing here changes copy, order, colour or the lock. 211 keeps its place above the form; the
lock is untouched. =========================================================================== */ .help__in{text-align:center} .help__in .enr__211note,.help__in .enr__privacy,.help__in .enr__shut-d,.help__in .enr__sub,.help__in .enr211__s{margin-inline:auto} /* Narrower measure so the three lines balance instead of ragging under the plate. Generous air above it — the note is a separate thought from the 211 plate. */ .help__in .enr__211note{max-width:48ch;text-wrap:balance;margin-top:clamp(40px,5vw,72px)} /* .sec__head / .eyebrow--*.sec__head are flex rows with a leading rule. */ .help__in .sec__head,.help__in .enr .sect,.help__in .enr__shut-k,.help__in .enr211__k{justify-content:center} .help__in .enr211__row{justify-content:center} /* 211 sits close under the hero band — the section's own top padding plus a margin left a dead field above the plate (founder ruling, arrows on a screenshot). Padding trimmed on this page only; the margin is gone. */ .help__in .enr211{margin-top:0} .hero--help+.sec{padding-top:clamp(20px,2.4vw,34px)} .help__in .enr__taperow{justify-content:center;gap:12px} /* Lists: the green dash marker moves from the left of the line to a centred rule above it — the device survives, the ragged left edge does not. */ .help__in .help__l li{padding-left:0;max-width:40ch;margin-inline:auto} .help__in .help__l li::before{position:static;display:block;width:16px;height:2px;margin:0 auto 9px} .help__in .help__l li+li{margin-top:16px} /* The form sits in its own centred column so the fields do not run the full shell width once their labels are centred over them. */ .help__in .enr form{max-width:660px;margin-inline:auto} .help__in .enr input[type=text],.help__in .enr input[type=tel],.help__in .enr input[type=email],.help__in .enr select{text-align:center} .help__in .enr select{padding-left:48px;text-align-last:center} .help__in .enr .radios label{justify-content:center} .help__in .enr .checkrow{align-items:center;justify-content:center;text-align:center} .help__in .enr .checkrow label{text-align:center} .help__in .enr__stamp{margin-inline:auto} @media (max-width:640px){ .help__in .enr211__row{align-items:center} } /* =========================================================================== HERO — the index.html / about.html shell, replayed WITHOUT JS. The shell hides .reveal-line spans, .ahero__bar and .hero__sub until .is-loaded lands on ; motion.js does that and this page does not load it (standing ruling). These @keyframes carry the same motion on load, so the head can never be stuck invisible. Timings mirror the shell's transitions. =========================================================================== */ .hero--help .reveal-line>span{animation:gh-line 820ms var(--ease-enter) both} .hero--help .reveal-line:nth-child(2)>span{animation-delay:90ms} .hero--help .ahero__bar{animation:gh-bar 700ms var(--ease-scrub) 560ms both} .hero--help .hero__sub{animation:gh-rise 600ms var(--ease-enter) 480ms both} @keyframes gh-line{from{transform:translateY(105%)}to{transform:translateY(0)}} @keyframes gh-bar{from{transform:scaleX(0)}to{transform:scaleX(1)}} @keyframes gh-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}} @media (prefers-reduced-motion:reduce){ .hero--help .reveal-line>span,.hero--help .ahero__bar,.hero--help .hero__sub{animation:none;opacity:1;transform:none} }