:root{
  --navy:#0F141E; --gold:#C59A3A; --cream:#FFFBEB; --ink:#23272F; --mut:#6B7280;
  --line:#E5E0D3; --card:#FFFFFF; --bg:#FAF8F4; --err:#D14343;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent}
html,body{margin:0; padding:0}
body{font-family:'Segoe UI',Calibri,Arial,sans-serif; background:var(--bg); color:var(--ink); font-size:16px; line-height:1.45; padding-bottom:96px}
.hidden{display:none !important}

.top{background:var(--navy); color:#fff; padding:12px 16px; position:sticky; top:0; z-index:20}
.top-in{max-width:660px; margin:0 auto; display:flex; justify-content:space-between; gap:12px; align-items:center}
.top strong{font-size:15px; letter-spacing:.4px}
.top span{display:block; color:var(--gold); font-size:11px; letter-spacing:1px; text-transform:uppercase}
.top-r{font-size:10.5px; color:#D1D5DB; text-align:right; line-height:1.5}

main{max-width:660px; margin:0 auto; padding:18px 14px 10px}
.hero{text-align:center; padding:6px 0 14px}
.kicker{color:var(--gold); font-size:11px; font-weight:700; letter-spacing:2px}
.hero h1{margin:6px 0 4px; font-size:27px; color:var(--navy)}
.hero p{margin:0; color:var(--mut); font-size:13.5px}

.alert{background:#FDECEC; border:1px solid #F3B9B9; color:#8C2626; border-radius:12px; padding:10px 14px; font-size:13.5px; margin:0 0 12px}

.card{background:var(--card); border:1px solid var(--line); border-left:5px solid var(--gold); border-radius:14px; padding:16px 16px 14px; margin:0 0 14px; box-shadow:0 1px 3px rgba(15,20,30,.06)}
.card h2{margin:0 0 10px; font-size:16.5px; color:var(--navy); display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.num{background:var(--navy); color:var(--gold); width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:12.5px; font-weight:700; flex:0 0 auto}
.sub{margin:0 0 10px; color:var(--mut); font-size:12.5px}

.lab{display:block; margin:10px 0 5px; font-size:13px; font-weight:700; color:var(--navy)}
.lab b{color:var(--err)}
.hint{font-weight:400; color:var(--mut); font-size:11.5px}
input[type=text],input[type=email],textarea{width:100%; border:1.5px solid var(--line); border-radius:10px; padding:11px 12px; font-size:15.5px; font-family:inherit; background:#fff; color:var(--ink); margin:0 0 4px}
input:focus,textarea:focus{outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(197,154,58,.15)}
input.err,textarea.err{border-color:var(--err); box-shadow:0 0 0 3px rgba(209,67,67,.12)}
textarea{resize:vertical}

.chips{display:flex; flex-wrap:wrap; gap:8px; margin:2px 0 4px}
.chip{border:1.5px solid var(--line); background:#fff; color:var(--ink); border-radius:999px; padding:9px 15px; font-size:14px; font-family:inherit; cursor:pointer; transition:all .15s}
.chip.on{background:var(--navy); border-color:var(--navy); color:var(--gold); font-weight:700}
.chip:active{transform:scale(.97)}

.rcards{display:grid; grid-template-columns:1fr 1fr; gap:9px; margin:2px 0 4px}
.rcard{border:1.5px solid var(--line); background:#fff; border-radius:12px; padding:11px 10px; font-size:13.5px; font-family:inherit; cursor:pointer; display:flex; align-items:center; gap:8px; justify-content:flex-start; text-align:left; transition:all .15s; color:var(--ink)}
.rcard .sw{width:22px; height:22px; border-radius:7px; flex:0 0 auto; border:1px solid rgba(0,0,0,.08)}
.rcard.on{border-color:var(--gold); background:var(--cream); box-shadow:0 0 0 3px rgba(197,154,58,.18); font-weight:700}
.rcard.tall{flex-direction:column; align-items:flex-start; gap:5px}
.rcard.tall strong{font-size:14px; color:var(--navy)}
.rcard.tall small{font-size:11px; color:var(--mut); line-height:1.4; font-weight:400}
@media (max-width:480px){ .rcards{grid-template-columns:1fr} }

.consent{display:flex; gap:9px; align-items:flex-start; margin-top:12px; font-size:12.5px; color:var(--mut)}
.consent input{width:20px; height:20px; margin:1px 0 0; accent-color:var(--gold); flex:0 0 auto}
.consent b{color:var(--err)}

.bar{position:fixed; left:0; right:0; bottom:0; background:rgba(255,255,255,.96); backdrop-filter:blur(6px); border-top:1px solid var(--line); padding:10px 14px calc(10px + env(safe-area-inset-bottom)); z-index:30}
.bar button{display:block; width:100%; max-width:660px; margin:0 auto; background:var(--gold); color:var(--navy); border:none; border-radius:12px; padding:15px; font-size:16.5px; font-weight:800; font-family:inherit; cursor:pointer; letter-spacing:.3px}
.bar button:active{transform:scale(.99)}
.bar span{display:block; text-align:center; color:var(--mut); font-size:10.5px; margin-top:5px}

.overlay{position:fixed; inset:0; background:rgba(15,20,30,.72); z-index:50; display:flex; align-items:center; justify-content:center; padding:20px; overflow:hidden}
.success-card{background:#fff; border-radius:20px; padding:30px 24px; max-width:420px; width:100%; text-align:center; border-top:6px solid var(--gold); position:relative; z-index:2; animation:pop .35s ease}
@keyframes pop{from{transform:scale(.85); opacity:0} to{transform:scale(1); opacity:1}}
.big{font-size:52px; line-height:1}
.success-card h2{color:var(--navy); margin:10px 0 6px; font-size:24px}
.ref{display:inline-block; background:var(--cream); border:1px dashed var(--gold); color:var(--navy); font-weight:700; font-size:13px; border-radius:8px; padding:5px 12px; margin:2px 0 8px}
.success-card p{color:var(--mut); font-size:14px; margin:0 0 16px}
.success-card button{background:var(--navy); color:var(--gold); border:none; border-radius:10px; padding:12px 26px; font-size:14.5px; font-weight:700; font-family:inherit; cursor:pointer}
#confetti span{position:absolute; top:-12px; width:9px; height:14px; z-index:1; border-radius:2px; animation:fall linear forwards}
@keyframes fall{to{transform:translateY(110vh) rotate(720deg); opacity:.9}}