:root { --bg:#07111f; --panel:#0d1b2e; --panel2:#122641; --text:#f5f8fc; --muted:#9fb0c5; --green:#43e08d; --blue:#3395ff; --orange:#ff8a34; --line:rgba(255,255,255,.12); --danger:#ff8a8a; }
* { box-sizing:border-box; }
html, body { min-height:100%; }
body { margin:0; color:var(--text); background:radial-gradient(circle at 80% 10%,rgba(51,149,255,.16),transparent 34%),var(--bg); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
button, input { font:inherit; }
.shell { width:min(100%,1040px); min-height:100vh; margin:auto; padding:0 24px 40px; }
.topbar { height:76px; display:flex; align-items:center; justify-content:space-between; }
.brand { width:76px; height:62px; overflow:hidden; display:flex; align-items:center; justify-content:center; border-radius:10px; text-decoration:none; background:#000; }
.brand img { width:76px; height:76px; object-fit:cover; display:block; }
.secure-label { color:var(--muted); font-size:.84rem; }
.screen { min-height:calc(100vh - 116px); animation:enter .28s ease both; }
.screen[hidden], .question[hidden] { display:none; }
.hero { display:grid; grid-template-columns:1.2fr .8fr; gap:56px; align-items:center; }
.eyebrow { margin:0 0 14px; color:var(--green); text-transform:uppercase; letter-spacing:.13em; font-size:.74rem; font-weight:850; }
h1,h2,legend { color:var(--text); line-height:1.06; letter-spacing:-.045em; }
h1 { max-width:720px; margin:0 0 22px; font-size:clamp(2.7rem,6vw,5.8rem); }
h1 span { color:var(--green); }
h2 { margin:0 0 16px; font-size:clamp(2rem,4vw,3.5rem); }
.lead { max-width:700px; margin:0 0 28px; color:var(--muted); font-size:clamp(1.05rem,2vw,1.3rem); line-height:1.65; }
.fine-print,.route-note { color:var(--muted); font-size:.84rem; }
.button { min-height:54px; display:inline-flex; align-items:center; justify-content:center; padding:14px 22px; border:0; border-radius:14px; color:var(--text); font-weight:850; text-decoration:none; cursor:pointer; transition:transform .18s,opacity .18s; }
.button:hover { transform:translateY(-2px); }
.button:focus-visible,input:focus-visible { outline:3px solid var(--orange); outline-offset:3px; }
.button[disabled],.button[aria-disabled="true"] { opacity:.45; cursor:not-allowed; transform:none; }
.primary { background:linear-gradient(135deg,var(--blue),#1166d5); box-shadow:0 14px 35px rgba(51,149,255,.22); }
.ghost { border:1px solid var(--line); background:transparent; }
.full { width:100%; }
.signal-card { min-height:320px; display:flex; flex-direction:column; justify-content:flex-end; gap:14px; padding:34px; border:1px solid var(--line); border-radius:28px; background:linear-gradient(145deg,var(--panel2),var(--panel)); box-shadow:0 30px 80px rgba(0,0,0,.28); }
.signal-card strong { font-size:1.65rem; line-height:1.2; }
.signal-card span { color:var(--muted); }
.growth-mark { height:150px; display:flex; align-items:flex-end; gap:12px; }
.growth-mark i { flex:1; border-radius:9px 9px 2px 2px; background:linear-gradient(var(--green),rgba(67,224,141,.16)); }
.growth-mark i:nth-child(1){height:28%}.growth-mark i:nth-child(2){height:46%}.growth-mark i:nth-child(3){height:68%}.growth-mark i:nth-child(4){height:95%}
.quiz { max-width:760px; margin:auto; padding-top:6vh; }
.progress-wrap { margin-bottom:44px; }
.progress-copy { display:flex; justify-content:space-between; margin-bottom:10px; color:var(--muted); font-size:.86rem; }
.progress-copy span:first-child { color:var(--green); font-weight:850; }
.progress-track { height:7px; overflow:hidden; border-radius:99px; background:rgba(255,255,255,.08); }
.progress-track span { display:block; width:20%; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--blue),var(--green)); transition:width .25s ease; }
fieldset { min-width:0; margin:0; padding:0; border:0; }
legend { width:100%; margin-bottom:30px; font-size:clamp(1.8rem,4vw,3rem); font-weight:850; }
.choice { display:block; margin:12px 0; cursor:pointer; }
.choice input { position:absolute; opacity:0; pointer-events:none; }
.choice span { min-height:62px; display:flex; align-items:center; padding:16px 20px; border:1px solid var(--line); border-radius:15px; color:#dce6f2; background:rgba(255,255,255,.035); transition:border .18s,background .18s; }
.choice input:checked + span { border-color:var(--green); background:rgba(67,224,141,.1); }
.choice input:focus-visible + span { outline:3px solid var(--orange); outline-offset:3px; }
.actions { display:flex; justify-content:space-between; gap:12px; margin-top:28px; }
.form-error { min-height:24px; margin:14px 0 0; color:var(--danger); }
.contact { max-width:820px; margin:auto; padding:6vh 0; display:grid; grid-template-columns:.85fr 1.15fr; gap:40px; align-items:start; }
.contact > div p:not(.eyebrow),.result > p { color:var(--muted); line-height:1.65; }
form { padding:28px; border:1px solid var(--line); border-radius:24px; background:rgba(13,27,46,.86); }
#contact-form label:not(.consent) { display:block; margin-bottom:16px; color:#dce6f2; font-weight:750; }
input[type="text"],input[type="tel"] { width:100%; min-height:52px; margin-top:7px; padding:12px 14px; border:1px solid var(--line); border-radius:11px; color:var(--text); background:#081525; }
.consent { display:grid; grid-template-columns:auto 1fr; gap:10px; margin:8px 0 16px; color:var(--muted); font-size:.86rem; line-height:1.45; }
.consent input { width:19px; height:19px; }
.result { max-width:720px; margin:auto; padding-top:13vh; text-align:center; }
.result-icon { width:72px; height:72px; display:grid; place-items:center; margin:0 auto 26px; border-radius:50%; color:var(--bg); background:var(--green); font-size:2rem; font-weight:950; }
.result .button { margin-top:16px; }
@keyframes enter { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }
@media (max-width:760px) {
  .shell { padding:0 18px 30px; }
  .topbar { height:66px; }
  .screen { min-height:calc(100vh - 96px); }
  .hero { display:block; padding:8vh 0 4vh; }
  .signal-card { min-height:190px; margin-top:36px; padding:24px; }
  .growth-mark { height:70px; }
  .quiz { padding-top:4vh; }
  .progress-wrap { margin-bottom:32px; }
  .contact { display:block; padding-top:4vh; }
  .contact > div { margin-bottom:24px; }
  form { padding:20px; }
  .button { width:100%; }
  .actions .button { width:auto; flex:1; }
}
@media (prefers-reduced-motion:reduce) { * { animation:none!important; transition:none!important; } }