/* Demo a voce: stile del componente (classi dv-) e della finestra nella home (#demo-voce).
   Tutto è racchiuso in .dv o .dv-modale, così non tocca gli stili della home. Colori e font uguali alla home. */
.dv,.dv-modale{
  --dv-paper:#F8F4ED;--dv-paper-2:#F1EADD;--dv-card:#FFFDF9;--dv-ink:#2B2621;--dv-soft:#5E564B;--dv-faint:#948A79;
  --dv-olive:#4E5D45;--dv-terra:#C06A42;--dv-terra-2:#A85833;--dv-line:#E3DACA;
  --dv-serif:'Newsreader',Georgia,serif;--dv-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
.dv{font-family:var(--dv-sans);color:var(--dv-ink);font-size:16px;line-height:1.55;text-align:left}
.dv *{box-sizing:border-box;margin:0;padding:0}
.dv [hidden]{display:none!important}
.dv button{font:inherit;color:inherit;cursor:pointer}

.dv-passi{display:flex;gap:6px;margin:0 0 18px}
.dv-passi span{flex:1;height:4px;border-radius:4px;background:var(--dv-line);transition:background .3s}
.dv-passi span.on{background:var(--dv-terra)}

.dv-schermo{background:var(--dv-card);border:1px solid var(--dv-line);border-radius:24px;padding:28px 22px;animation:dv-entra .35s ease}
@keyframes dv-entra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.dv-kicker{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dv-terra);margin-bottom:8px}
.dv h2,.dv h3{font-family:var(--dv-serif);font-weight:400;line-height:1.15;color:var(--dv-ink)}
.dv h2 em,.dv h3 em{color:var(--dv-terra)}
.dv-h1{font-size:clamp(1.9rem,6vw,2.5rem);margin-bottom:16px}
.dv h3{font-size:clamp(1.45rem,5vw,1.9rem);margin-bottom:14px}
.dv-asia{width:88px;height:88px;border-radius:50%;object-fit:cover;display:block;margin-bottom:18px;border:3px solid var(--dv-paper-2)}

.dv-cosa{margin:0 0 24px 1.2rem!important;color:var(--dv-soft)}
.dv-cosa li{margin-bottom:6px}
.dv-btn{display:block;width:100%;background:var(--dv-terra);color:#fff!important;border:0;border-radius:999px;padding:15px 20px;font-weight:500;font-size:1rem;text-align:center;transition:background .2s}
.dv-btn:hover{background:var(--dv-terra-2)}
.dv-link{display:block;margin:14px auto 0!important;background:none;border:0;color:var(--dv-soft)!important;text-decoration:underline;font-size:.95rem}
.dv-nota{margin-top:20px!important;font-size:.85rem;color:var(--dv-faint);text-align:center}
.dv-reale{margin-top:10px!important;font-size:.85rem;color:var(--dv-soft);text-align:center}
.dv-reale2{font-size:.9rem;color:var(--dv-olive)!important;margin-top:6px}

.dv-video{position:relative;border-radius:16px;overflow:hidden;background:#000;aspect-ratio:16/9;margin-bottom:18px}
.dv-video video{width:100%;height:100%;display:block;object-fit:cover}
.dv-sub{position:absolute;left:50%;bottom:6%;transform:translateX(-50%);max-width:88%;width:max-content;background:rgba(24,22,18,.62);color:#fff;font-size:clamp(.74rem,2.4vw,.92rem);line-height:1.35;text-align:center;padding:3px 10px;border-radius:6px;pointer-events:none;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.dv-play{z-index:1;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(255,253,249,.95);border:0;border-radius:999px;padding:12px 22px;font-weight:500;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.dv-domanda{text-align:center;margin:6px 0 18px!important}

.dv-stampi{background:var(--dv-paper);border:1px dashed var(--dv-line);border-radius:14px;padding:14px 16px;margin-bottom:18px;color:var(--dv-soft)}
.dv-stampi p{margin-bottom:4px}
.dv-stampi b{color:var(--dv-ink)}

.dv-registra{text-align:center}
.dv-mic{display:inline-flex;align-items:center;gap:12px;background:var(--dv-olive);color:#fff!important;border:0;border-radius:999px;padding:18px 30px;font-size:1.05rem;font-weight:500;min-width:240px;justify-content:center}
.dv-punto{width:14px;height:14px;border-radius:50%;background:#fff}
.dv-mic.rec{background:var(--dv-terra)}
.dv-mic.rec .dv-punto{animation:dv-pulsa 1s infinite}
@keyframes dv-pulsa{50%{opacity:.25;transform:scale(.7)}}
.dv-tempo{margin-top:10px!important;font-variant-numeric:tabular-nums;color:var(--dv-faint);font-size:.9rem}
.dv-aiuto{margin-top:6px!important;color:var(--dv-faint);font-size:.85rem}

.dv textarea{width:100%;border:1px solid var(--dv-line);border-radius:14px;padding:14px;font:inherit;font-size:16px;background:#fff;color:var(--dv-ink);margin-bottom:12px;resize:vertical}

.dv-attesa{display:flex;align-items:center;justify-content:center;gap:12px;padding:18px;color:var(--dv-soft)}
.dv-onde{display:inline-flex;gap:4px;align-items:center;height:20px}
.dv-onde i{width:4px;height:100%;background:var(--dv-terra);border-radius:2px;animation:dv-onda .9s infinite ease-in-out}
.dv-onde i:nth-child(2){animation-delay:.15s}.dv-onde i:nth-child(3){animation-delay:.3s}
@keyframes dv-onda{50%{transform:scaleY(.3)}}

.dv blockquote{font-family:var(--dv-serif);font-size:1.15rem;line-height:1.45;background:var(--dv-paper);border-radius:14px;padding:14px 16px;margin-bottom:16px;color:var(--dv-ink);border:0;quotes:none}
.dv-sentito{margin-top:8px}
.dv-errore{margin-top:14px!important;padding:12px 14px;border-radius:12px;background:#FBEAE2;color:var(--dv-terra-2);font-size:.95rem}

.dv-trucchi{display:grid;gap:12px;margin-bottom:22px}
.dv-trucchi>div{border:1px solid var(--dv-line);border-radius:14px;padding:14px 16px 12px 52px;position:relative}
.dv-trucchi span{position:absolute;left:14px;top:13px;width:26px;height:26px;border-radius:50%;background:var(--dv-terra);color:#fff;font-size:.85rem;display:grid;place-items:center}
.dv-es{font-family:var(--dv-serif);font-style:italic;color:var(--dv-soft);margin-top:4px!important}
.dv-es b{font-style:normal;color:var(--dv-ink);font-weight:400;background:#FCE9DC;border-radius:4px;padding:0 3px}

.dv-numeri{width:100%;border-collapse:collapse;margin:6px 0 20px}
.dv-numeri th,.dv-numeri td{padding:10px 6px;border-bottom:1px solid var(--dv-line);text-align:center}
.dv-numeri th:first-child,.dv-numeri td:first-child{text-align:left;color:var(--dv-soft)}
.dv-numeri thead th{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dv-faint);font-weight:400}
.dv-numeri td.su{color:var(--dv-olive);font-weight:500}
.dv-numeri td.su::after{content:" ↑"}
.dv-confronto{display:grid;gap:12px}
.dv-dopo blockquote{background:#EEF1EA}
@media(min-width:560px){.dv-confronto{grid-template-columns:1fr 1fr}}

.dv-ponte{margin-top:28px;padding-top:24px;border-top:1px solid var(--dv-line)}
.dv-ponte-box{background:#EEF1EA;border-radius:18px;padding:18px 18px 16px;margin-bottom:24px}
.dv-ponte-box p{color:var(--dv-ink);margin-bottom:4px}
.dv-ponte-box p:first-child{font-family:var(--dv-serif);font-size:1.25rem;line-height:1.3}
.dv-ponte-box b{color:var(--dv-olive);font-weight:600}
.dv-sotto{color:var(--dv-faint);font-size:.9rem;margin:-6px 0 16px!important}
.dv-piani{display:grid;gap:14px}
.dv-piano{position:relative;border:1px solid var(--dv-line);border-radius:20px;padding:20px;background:#fff;display:flex;flex-direction:column;gap:10px}
.dv-top{border:2px solid var(--dv-terra);box-shadow:0 14px 34px -18px rgba(192,106,66,.55);padding-top:24px}
.dv-badge{position:absolute;top:-12px;left:18px;background:var(--dv-terra);color:#fff;font-size:.75rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:4px 12px}
.dv-testa{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.dv-nome{font-family:var(--dv-serif);font-size:1.4rem;line-height:1.2}
.dv-tag{color:var(--dv-terra-2);font-size:.88rem;font-weight:500;margin-top:2px!important}
.dv-prezzo{font-family:var(--dv-serif);font-size:1.6rem;line-height:1.1;white-space:nowrap;text-align:right}
.dv-prezzo small{display:block;font-family:var(--dv-sans);font-size:.78rem;color:var(--dv-faint)}
.dv-ancora{font-size:.86rem;color:var(--dv-olive);background:var(--dv-paper);border-radius:10px;padding:7px 11px}
.dv-punti{list-style:none;display:grid;gap:7px}
.dv-punti li{display:flex;gap:9px;align-items:flex-start;font-size:.93rem;color:var(--dv-soft);line-height:1.4}
.dv-punti svg{flex:none;width:17px;height:17px;margin-top:2px;fill:none;stroke:var(--dv-olive);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.dv-piano .dv-btn{margin-top:6px;width:100%}
.dv-top .dv-btn{box-shadow:0 10px 22px -10px rgba(192,106,66,.8)}
.dv-garanzia{margin-top:16px!important;font-size:.86rem;color:var(--dv-soft);background:var(--dv-paper-2);border-radius:14px;padding:12px 14px;line-height:1.45}
.dv-garanzia b{color:var(--dv-olive)}

/* ---------- finestra nella home ---------- */
/* Su telefono a tutto schermo (meno distrazioni mentre si parla), su desktop scheda al centro.
   Sopra la barra fissa (40) e sotto il banner dei cookie (9999), come la finestra d'acquisto (200). */
.dv-modale{position:fixed;inset:0;z-index:210;background:rgba(43,38,33,.55);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .25s}
.dv-modale[hidden]{display:none}
.dv-modale.open{opacity:1}
.dv-scheda{position:relative;background:var(--dv-paper);width:100%;height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  padding:calc(16px + env(safe-area-inset-top)) 16px calc(24px + env(safe-area-inset-bottom))}
.dv-x{position:sticky;top:0;margin-left:auto;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--dv-line);background:var(--dv-card);color:var(--dv-ink);font-size:1.5rem;line-height:1;cursor:pointer;z-index:2}
.dv-x+.dv-root{margin-top:10px}
.dv-x:focus{outline:none}
.dv-x:focus-visible{outline:2px solid var(--dv-terra);outline-offset:2px}
.dv-root{max-width:600px;margin:0 auto}
@media(min-width:700px){
  .dv-scheda{width:min(660px,calc(100% - 48px));height:auto;max-height:calc(100% - 48px);border-radius:28px;padding:22px 28px 28px;box-shadow:0 30px 80px -30px rgba(0,0,0,.5)}
  .dv-modale.open .dv-scheda{animation:dv-entra .3s ease}
}