:root{ --bg:#0f0f10; --card:#151518; --text:#e9e9ee; --muted:#a8acb3; --brand:#c7a936; }
*{ box-sizing:border-box; } body{ margin:0; font-family:system-ui, -apple-system, Segoe UI, Roboto, sans-serif; color:var(--text); background:var(--bg); }
a{ color:var(--brand); text-decoration:none; }
.container{ max-width:900px; margin:0 auto; padding:24px; }
.hero{ padding:64px 24px; text-align:center; background:linear-gradient(180deg,#111,#0f0f10); }
.btn{ background:var(--brand); color:#111; border:none; padding:12px 18px; border-radius:12px; font-weight:700; cursor:pointer; display:inline-block; }
.btn.outline{ background:transparent; color:var(--brand); border:1px solid var(--brand); }
.card{ background:var(--card); padding:24px; border-radius:16px; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.grid{ display:grid; gap:16px; grid-template-columns:1fr; }
@media (min-width:768px){ .grid{ grid-template-columns:1fr 1fr; } }
.q{ background:#101014; padding:16px; border-radius:12px; }
.likert label{ margin-right:8px; }
.controls{ display:flex; justify-content:space-between; margin-top:16px; }
.cta-sticky{ position:sticky; bottom:0; background:#0a0a0c; padding:12px 16px; text-align:center; border-top:1px solid #222; }
.score{ font-size:1.2rem; }
.band.ALTA{ border-left:4px solid #35d07f; padding-left:12px; }
.band.MEDIA{ border-left:4px solid #f6c343; padding-left:12px; }
.band.BAJA{ border-left:4px solid #ff5a5f; padding-left:12px; }
.form label{ display:block; margin:10px 0; }
.form input[type=text], .form input[type=email]{ width:100%; padding:10px; border-radius:10px; border:1px solid #2a2a2e; background:#0e0e11; color:#fff; }
.note{ color:var(--muted); font-size:.9rem; margin-top:8px; }
.options-list{ list-style:none; padding:0; margin:8px 0 0; }
.options-list li{ margin:8px 0; padding:8px; border:1px solid #2a2a2e; border-radius:10px; }
.options-list input{ margin-right:8px; }
.cta-box{ margin-top:16px; margin-bottom:16px; }
.cta-box .btn{ margin-top:8px; }
.cta-box + .btn{ margin-top:12px; display:inline-block; }