/* Quiz corto Keepbull: aggiunte allo stile del quiz lungo (../quiz/quiz.css) */
.progress-bar-container{margin-bottom:8px}
.contatore{font-size:12px;font-weight:600;color:var(--kb-testo-2);margin-bottom:20px;text-align:center}
.verde{color:var(--kb-verde);font-weight:700}
.prova-stelle{color:#FF4C01;font-size:22px;letter-spacing:2px;margin-top:4px}
.prova-voto{font-size:15px;margin:2px 0 12px;text-align:center}
.prova-img{width:auto;max-width:260px;max-height:260px;border-radius:12px;display:block;margin:0 auto 14px}
.prova-punti{width:100%;max-width:460px;background:#fff;border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.prova-punti div{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600}
.prova-punti .ico-sm{width:20px;height:20px;color:var(--kb-rosa);flex-shrink:0}
.carica{max-width:360px;margin:20px auto 0;height:10px}
.carica .loading-item-bar-fill{transition:width 2s linear}
.spunte{width:100%;max-width:460px;display:flex;flex-direction:column;gap:8px;margin:8px 0 16px}
.spunte div{background:#fff;border-radius:10px;padding:10px 14px;font-size:14px;display:flex;gap:10px;align-items:flex-start}
.spunte div b{font-weight:700}
.spunte .ok{color:var(--kb-verde);font-weight:800}
.pacco{width:100%;max-width:460px;background:#fff;border:3px solid var(--kb-rosa);border-radius:14px;padding:30px 16px 18px;position:relative;text-align:center}
.pacco-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--kb-rosa);color:#fff;font-size:13px;font-weight:700;padding:4px 14px;border-radius:20px;white-space:nowrap}
.pacco-img{max-height:190px;width:auto;display:block;margin:0 auto 10px}
.pacco-titolo{font-family:var(--kb-font-titoli);font-size:20px;font-weight:700}
.pacco-prezzo{font-size:22px;font-weight:800;margin:2px 0}
.pacco-prezzo s{color:#999;font-size:16px;font-weight:600;margin-left:6px}
.pacco-nota{font-size:14px;color:var(--kb-testo-2)}
.fiducia{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;font-size:13px;font-weight:600;margin-top:14px}
.altri-formati{font-size:12px;color:var(--kb-testo-2);margin:10px 0 0;text-align:center}

/* ===== STEP 5: LANCETTA (previsione da confermare) ===== */
#stepL{position:relative}
.lan-sub b{color:var(--kb-testo)}
.lan-sub .rosa{color:var(--kb-rosa)}
.lan-chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:-6px 0 14px;max-width:460px}
.lan-chip{font-size:12px;font-weight:700;padding:5px 11px;border-radius:20px;background:#fff;border:1.5px solid #F2C4DC;color:var(--kb-rosa);opacity:0;transform:translateY(6px) scale(.9);animation:lanChip .4s cubic-bezier(.2,1.4,.4,1) forwards}
@keyframes lanChip{to{opacity:1;transform:none}}
.lan-card{width:100%;max-width:460px;position:relative;overflow:hidden;border-radius:22px;padding:18px 12px 16px;
  background:radial-gradient(120% 90% at 50% 0%,#2A1E66 0%,#14163A 55%,#0B0E26 100%);
  box-shadow:0 18px 40px -12px rgba(229,0,114,.45),0 6px 18px rgba(15,68,150,.35),inset 0 1px 0 rgba(255,255,255,.08);
  touch-action:none;user-select:none;-webkit-user-select:none;transition:box-shadow .4s}
.lan-alone{position:absolute;left:50%;top:62%;width:260px;height:260px;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(255,31,142,.28),transparent 65%);pointer-events:none;transition:background .4s}
#lanSvg{display:block;width:100%;height:auto;cursor:grab;position:relative;overflow:visible}
#lanSvg.drag{cursor:grabbing}
#lanSvg:focus-visible{outline:2px solid #FF5FAE;outline-offset:4px;border-radius:12px}
.lan-ghost{animation:lanPulse 1.4s ease-in-out infinite}
@keyframes lanPulse{0%,100%{opacity:1}50%{opacity:.35}}
.lan-onda{opacity:0}
.lan-lettura{display:flex;justify-content:center;align-items:baseline;gap:8px;margin-top:-4px;position:relative}
.lan-num{font-family:var(--kb-font-titoli);font-weight:800;font-size:52px;line-height:1;font-variant-numeric:tabular-nums;
  background:linear-gradient(90deg,#FF5FAE,#fff 60%);-webkit-background-clip:text;background-clip:text;color:transparent;transition:transform .15s}
.lan-num.salto{transform:scale(1.18)}
.lan-lab{color:#C9CBE3;font-size:15px;font-weight:600}
.lan-hint{text-align:center;min-height:22px;font-size:15px;font-weight:700;color:#FF8FC4;margin:8px 0 0;position:relative}
.lan-mano{display:inline-block;animation:lanMano 1.1s ease-in-out infinite}
@keyframes lanMano{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(10px,-6px) rotate(14deg)}}
.lan-card.agita{animation:lanAgita .25s 2}
@keyframes lanAgita{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
/* agganciata */
.lan-card.preso{box-shadow:0 18px 44px -10px rgba(34,197,94,.6),0 6px 18px rgba(15,68,150,.35),inset 0 0 0 2px rgba(34,197,94,.7)}
.lan-card.preso .lan-alone{background:radial-gradient(circle,rgba(34,197,94,.35),transparent 65%)}
.lan-card.preso .lan-ghost{animation:none;opacity:0;transition:opacity .3s}
.lan-card.preso .lan-ago{fill:#22C55E;stroke:#22C55E}
.lan-card.preso .lan-onda{animation:lanOnda .9s ease-out 2}
@keyframes lanOnda{0%{opacity:1;r:12;stroke-width:4}100%{opacity:0;r:70;stroke-width:0}}
.lan-card.preso .lan-num{background:linear-gradient(90deg,#4ADE80,#fff 70%);-webkit-background-clip:text;background-clip:text}
.lan-ok{width:100%;max-width:460px;display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:14px 16px;border-radius:16px;
  background:linear-gradient(135deg,#ECFDF3,#fff);border:2px solid #22C55E;box-shadow:0 10px 24px -10px rgba(22,163,74,.5);
  animation:lanEntra .5s cubic-bezier(.2,1.5,.4,1)}
@keyframes lanEntra{from{opacity:0;transform:translateY(14px) scale(.94)}to{opacity:1;transform:none}}
.lan-tick{flex:none;width:34px;height:34px;border-radius:50%;background:#16A34A;color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px;box-shadow:0 0 0 6px rgba(22,163,74,.18)}
.lan-ok p{margin:0;font-size:14px;line-height:1.45;color:var(--kb-testo-3)}
.lan-ok strong{display:block;font-family:var(--kb-font-titoli);font-size:18px;color:#15803D;margin-bottom:2px}
.lan-cta{width:100%;max-width:460px;margin-top:16px;border:0;border-radius:12px;padding:17px;font-family:var(--kb-font-titoli);font-size:17px;font-weight:700;color:#fff;cursor:pointer;
  background:var(--kb-sfumatura);position:relative;overflow:hidden;transition:opacity .3s,transform .1s;box-shadow:0 10px 24px -8px rgba(229,0,114,.6)}
.lan-cta:disabled{opacity:.28;cursor:not-allowed;box-shadow:none}
.lan-cta:not(:disabled){animation:lanBattito 1.6s ease-in-out infinite}
.lan-cta:not(:disabled)::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);animation:lanLuce 1.8s ease-in-out infinite}
@keyframes lanBattito{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}
@keyframes lanLuce{0%{left:-60%}60%,100%{left:130%}}
.lan-cta:not(:disabled):active{transform:scale(.97)}
.lan-coriandoli{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:50}
@media (prefers-reduced-motion:reduce){.lan-ghost,.lan-mano,.lan-cta,.lan-cta::after,.lan-card.agita{animation:none!important}}
.lan-ok[hidden]{display:none}
#lanSvg:focus:not(:focus-visible){outline:none}
/* aggancio stretto: dentro la sagoma la zona diventa verde e invita a lasciare */
.lan-card.dentro #lanZone{stroke:#22C55E;stroke-opacity:.6}
.lan-card.dentro .lan-ghost{animation:none;opacity:1}
.lan-card.dentro .lan-ago{fill:#4ADE80;stroke:#4ADE80}
.lan-card.dentro .lan-hint{color:#4ADE80}
