/* ---------- quiz funnel (specifico di demo-gratuita.html) ---------- */
.quiz-hero .hero-inner{ max-width: 620px; }

/* la riga in corsivo (Instrument Serif) ha discendenti (es. "g") più
   profondi del line-height 1.02 del titolo: senza questo margine
   l'overflow:hidden del reveal-line li ritaglia. */
.quiz-hero .hero-title .reveal-line{ padding-bottom: 0.18em; margin-bottom: -0.18em; }

.quiz-progress{ width:100%; max-width: 280px; margin: 0 auto 40px; }
.quiz-progress-track{ height:3px; background: var(--line); border-radius:2px; overflow:hidden; }
.quiz-progress-fill{ height:100%; width:0%; background: var(--accent); border-radius:2px; transition: width .4s var(--ease); }
.quiz-progress-label{ margin-top:10px; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color: var(--text-faint); }

.quiz-step{ display:none; }
.quiz-step.active{ display:block; }
.quiz-hero .quiz-step.active{ animation: quizIn .5s var(--ease); }
@keyframes quizIn{ from{ opacity:0; transform: translateY(16px); } to{ opacity:1; transform: translateY(0); } }

.quiz-back{
  display:inline-flex; align-items:center; gap:6px;
  background:none; border:none; cursor:pointer; padding:0;
  font-family: var(--font-body); font-size:.82rem; font-weight:500;
  color: var(--text-dim); margin-bottom:22px;
}
.quiz-back:hover{ color: var(--accent); }

.quiz-question{
  font-family: var(--font-display); font-weight:600; letter-spacing:-.01em;
  font-size: clamp(1.5rem, 4vw, 2.4rem); line-height:1.18; margin-bottom:30px;
}

.quiz-options{ display:flex; flex-direction:column; gap:12px; }
.quiz-option{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  width:100%; text-align:left; padding:18px 22px;
  background: var(--bg); border:1px solid var(--line); border-radius:14px;
  font-family: var(--font-body); font-size:1rem; font-weight:500; color: var(--text);
  cursor:pointer; transition: border-color .25s var(--ease), background .25s var(--ease), transform .2s var(--ease);
}
.quiz-option:hover{ border-color: var(--accent); background: var(--bg-elev); transform: translateX(2px); }
.quiz-option.selected{ border-color: var(--accent); background: var(--accent-soft); }
.quiz-option-arrow{ opacity:0; flex-shrink:0; color: var(--accent); transition: opacity .2s; }
.quiz-option:hover .quiz-option-arrow,
.quiz-option.selected .quiz-option-arrow{ opacity:1; }

.quiz-followup{
  display:flex; flex-direction:column; gap:12px;
  max-height:0; overflow:hidden; opacity:0;
  margin-top:0; padding-top:0; border-top:1px solid transparent;
  transition: max-height .45s var(--ease), opacity .3s var(--ease),
              margin-top .45s var(--ease), padding-top .45s var(--ease),
              border-color .45s var(--ease);
}
.quiz-followup.open{
  max-height:420px; opacity:1;
  margin-top:18px; padding-top:18px; border-top-color: var(--line-soft);
}
.quiz-followup-label{ font-size:.85rem; color: var(--text-dim); }
.quiz-followup-field{
  background: var(--bg); border:1px solid var(--line); border-radius:12px;
  padding:14px 18px; font-family: var(--font-body); font-size:1rem; color: var(--text);
}
.quiz-followup-textarea{ resize: vertical; min-height: 90px; }
.quiz-followup-field:focus{ outline:none; border-color: var(--accent); }
.quiz-followup-error{ display:none; font-size:.8rem; color: var(--error); margin:0; }
.quiz-followup.has-error .quiz-followup-error{ display:block; }
.quiz-followup.has-error .quiz-followup-field{ border-color: var(--error); }
.quiz-followup-continue{ align-self:flex-start; }

.quiz-intro-caption{ margin-top:20px; font-size:.78rem; color: var(--text-faint); }

.quiz-recap{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px;
  margin: 0 auto 8px; max-width:520px; font-size:.86rem; color: var(--text-dim);
}
.quiz-recap span{ background: var(--bg-alt); border-radius:100px; padding:6px 14px; }
.quiz-restart{
  display:block; margin: 0 auto 34px; background:none; border:none; cursor:pointer;
  font-family: var(--font-body); font-size:.82rem; color: var(--accent);
  text-decoration: underline; text-underline-offset:2px; padding:0;
}

@media (max-width: 640px){
  .quiz-question{ font-size:1.4rem; }
  .quiz-option{ padding:16px 18px; }
}

/* ---------- footer minimale (solo copyright / P.IVA / legal) ---------- */
.site-footer{ padding-top: 36px; }
.footer-bottom{ border-top: none; padding-top: 0; }
