/* ============================================================
   QUICKSCAN — multi-step form
   ============================================================ */

.qs-section{padding:32px 0 100px}
.qs-shell{
  display:grid;grid-template-columns:.9fr 1.6fr;gap:32px;align-items:start;
}
@media (max-width:1000px){.qs-shell{grid-template-columns:1fr}.qs-form{position:static}}

/* ---- Sidebar (steps) ---- */
.qs-side{
  position:sticky;top:90px;
  border:1px solid var(--rule);border-radius:var(--r-xl);background:var(--paper-2);
  padding:32px 28px;
}
.qs-side .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--signal);display:flex;align-items:center;gap:10px;margin-bottom:18px}
.qs-side h2{font-size:28px;font-weight:600;letter-spacing:-.02em;line-height:1.1;margin-bottom:14px}
.qs-side h2 em{font-family:var(--serif);font-style:italic;color:var(--signal);font-weight:400}
.qs-side p{font-size:14px;line-height:1.55;color:var(--ink-2);margin-bottom:24px;max-width:34ch}

.qs-progress{
  height:6px;background:var(--rule);border-radius:999px;overflow:hidden;margin-bottom:6px;
}
.qs-progress .bar{height:100%;background:var(--signal);width:9.09%;transition:width .5s cubic-bezier(.2,.8,.2,1);border-radius:999px}
.qs-progress-meta{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-bottom:24px}

.qs-steps{list-style:none;display:flex;flex-direction:column;gap:2px}
.qs-steps li{
  display:flex;align-items:center;gap:14px;padding:10px 12px;border-radius:10px;
  font-size:13px;color:var(--ink-3);transition:all .3s;cursor:pointer;
}
.qs-steps li:hover{background:var(--paper-3);color:var(--ink-2)}
.qs-steps li .ix{
  width:22px;height:22px;border-radius:999px;display:grid;place-items:center;flex:none;
  font-family:var(--mono);font-size:10px;background:var(--paper-3);color:var(--ink-3);transition:all .3s;
  font-weight:500;
}
.qs-steps li.is-done{color:var(--ink-2)}
.qs-steps li.is-done .ix{background:var(--mint);color:var(--mint-deep)}
.qs-steps li.is-done .ix::before{content:"✓"}
.qs-steps li.is-done .ix span{display:none}
.qs-steps li.is-active{background:var(--paper);color:var(--ink);font-weight:500;box-shadow:var(--shadow-card)}
.qs-steps li.is-active .ix{background:var(--signal);color:#fff}

/* ---- Form panel ---- */
.qs-form{
  border:1px solid var(--rule);border-radius:var(--r-xl);background:var(--paper);
  padding:48px;box-shadow:var(--shadow-card);min-height:560px;
  position:sticky;top:90px;align-self:start;
  display:flex;flex-direction:column;
}
@media (max-width:680px){.qs-form{padding:28px 24px}}

.qs-step{display:none;animation:qs-fade .4s cubic-bezier(.2,.8,.2,1)}
.qs-step.is-active{display:flex;flex-direction:column;gap:20px;flex:1}
@keyframes qs-fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

.qs-step .qs-label{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--signal)}
.qs-step h3{font-size:clamp(28px,3vw,38px);line-height:1.05;letter-spacing:-.02em;font-weight:600;max-width:24ch;margin-bottom:6px}
.qs-step h3 em{font-family:var(--serif);font-style:italic;color:var(--signal);font-weight:400}
.qs-step .help{font-size:14px;color:var(--ink-2);line-height:1.55;max-width:48ch}

/* Inputs */
.qs-field{display:flex;flex-direction:column;gap:8px}
.qs-field label{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.qs-field input, .qs-field textarea{
  font-family:var(--display);font-size:16px;color:var(--ink);
  background:var(--paper-2);border:1px solid var(--rule);border-radius:12px;padding:16px 18px;
  transition:border-color .25s, background .25s;width:100%;
}
.qs-field input:focus, .qs-field textarea:focus{outline:none;border-color:var(--signal);background:#fff}
.qs-field textarea{min-height:120px;resize:vertical;font-family:var(--display);line-height:1.5}
.qs-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:600px){.qs-row{grid-template-columns:1fr}}

/* Choice grid */
.qs-choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.qs-choice{
  display:flex;align-items:center;gap:12px;cursor:pointer;
  border:1px solid var(--rule);border-radius:12px;background:var(--paper-2);
  padding:16px 18px;font-size:14px;font-weight:500;color:var(--ink-2);
  transition:all .25s;
}
.qs-choice input{display:none}
.qs-choice .check{
  width:18px;height:18px;border-radius:6px;border:1.5px solid var(--rule);flex:none;
  display:grid;place-items:center;transition:all .25s;background:var(--paper);
}
.qs-choice.qs-radio .check{border-radius:999px}
.qs-choice:has(input:checked){background:var(--signal);color:#fff;border-color:var(--signal)}
.qs-choice:has(input:checked) .check{background:#fff;border-color:#fff}
.qs-choice:has(input:checked) .check::after{content:"";width:8px;height:8px;border-radius:2px;background:var(--signal)}
.qs-choice.qs-radio:has(input:checked) .check::after{border-radius:999px}
.qs-choice:hover:not(:has(input:checked)){border-color:var(--signal);color:var(--ink)}

.qs-choices-tight{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}

/* Consent */
.qs-consent{
  display:flex;gap:14px;align-items:flex-start;cursor:pointer;
  background:var(--paper-2);border:1px solid var(--rule);border-radius:12px;padding:18px 20px;
}
.qs-consent input{display:none}
.qs-consent .check{width:18px;height:18px;border-radius:6px;border:1.5px solid var(--rule);flex:none;margin-top:2px;display:grid;place-items:center;background:var(--paper);transition:all .25s}
.qs-consent:has(input:checked) .check{background:var(--signal);border-color:var(--signal)}
.qs-consent:has(input:checked) .check::after{content:"✓";color:#fff;font-size:11px;font-weight:700}
.qs-consent p{font-size:13px;line-height:1.55;color:var(--ink-2)}
.qs-consent strong{color:var(--ink);font-weight:500}

/* Footer (nav buttons) */
.qs-foot{
  margin-top:auto;padding-top:32px;display:flex;justify-content:space-between;align-items:center;gap:16px;
  border-top:1px solid var(--rule);
}
.qs-back{
  display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;
  border:1px solid var(--rule);background:transparent;color:var(--ink-2);font-size:13px;font-weight:500;
  transition:all .25s;
}
.qs-back:hover{background:var(--paper-2);color:var(--ink)}
.qs-back:disabled{opacity:.4;cursor:not-allowed}
.qs-next{
  display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border-radius:999px;
  background:var(--signal);color:#fff;font-size:14px;font-weight:500;
  transition:all .25s;box-shadow:0 10px 30px -10px rgba(73,120,247,.5);
}
.qs-next:hover{background:var(--ink);transform:translateX(4px)}

/* Done state */
.qs-done{display:none;flex-direction:column;align-items:center;text-align:center;gap:16px;padding:60px 20px}
.qs-done.is-active{display:flex}
.qs-done .badge{
  width:72px;height:72px;border-radius:999px;background:var(--mint);color:var(--mint-deep);
  display:grid;place-items:center;font-size:32px;font-family:var(--serif);font-style:italic;
}
.qs-done h3{font-size:32px;font-weight:600;letter-spacing:-.02em;max-width:18ch}
.qs-done p{font-size:15px;color:var(--ink-2);line-height:1.6;max-width:42ch}

/* ============================================================
   FASE 1 — value-tease, char-counter, inline errors, AVG collapse
   ============================================================ */

.qs-side .qs-tease{
  font-size:14px;line-height:1.55;color:var(--ink-2);margin-bottom:18px;
  max-width:34ch;padding:12px 14px;background:var(--paper-2);border-left:2px solid var(--signal);border-radius:4px;
}

.qs-field .qs-sub{
  font-size:12px;color:var(--ink-3);margin:-4px 0 4px 0;line-height:1.5;
}

.qs-meta-row{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  margin-top:6px;font-family:var(--mono);font-size:11px;letter-spacing:.04em;
  color:var(--ink-3);
}
.qs-meta-row .qs-hint{font-family:inherit;text-transform:none;letter-spacing:0;font-size:12px;color:var(--ink-3)}
.qs-counter{flex:none;color:var(--ink-3);transition:color .25s}
.qs-counter.is-low{color:#c98a00}

.qs-error{
  font-size:12px;color:#b3261e;margin-top:8px;line-height:1.5;
  display:flex;align-items:center;gap:6px;
}
.qs-error::before{content:"⚠";font-size:13px}

.qs-field.has-error input,
.qs-field.has-error textarea{border-color:#b3261e;background:#fff5f4}
.qs-field.has-error label{color:#b3261e}
.qs-consent.has-error{border-color:#b3261e;background:#fff5f4}

.qs-consent-body{display:flex;flex-direction:column;gap:8px}
.qs-consent-body p{font-size:13px;line-height:1.55;color:var(--ink-2);margin:0}
.qs-consent-body strong{color:var(--ink);font-weight:500}
.qs-avg-toggle{
  color:var(--signal);text-decoration:underline;font-size:13px;margin-left:4px;cursor:pointer;
}
.qs-avg-toggle:hover{color:var(--ink)}
.qs-avg-more{padding:10px 0 0 0;border-top:1px solid var(--rule);margin-top:4px}
.qs-avg-more p{font-size:12px;color:var(--ink-3);line-height:1.55}
.qs-avg-more a{color:var(--signal);text-decoration:underline}

/* Side-nav — only 3 items now, give them more breathing room */
.qs-steps li{padding:14px 14px;font-size:14px}
