/* SPOT in Farmacia 2.7.0 (Alessandro, 03/10/2026) — "la vetrina che vende", in vetrina.html e presentazione.html:
   banner centrale dei tre piani, tabella di confronto, "Come nasce SPOT in Farmacia", riquadri che spiegano ogni sezione.
   Regole del movimento (le stesse delle anteprime SPOT+ dal 1.9.5): si muove il disegno, mai un dato; una volta sola,
   quando il riquadro entra nello schermo (proposte.js); mai all'infinito; niente movimento per chi chiede meno
   movimento; senza JavaScript tutto resta fermo nella posizione finale. Solo transform e opacity.
   Difesa dal tema del sito (Flatsome): tabelle, titoli e paragrafi riportati ai colori e alle misure della pagina. */

/* ---------- banner centrale dei piani ---------- */
.motc-page .blk.vt-piani{background:linear-gradient(160deg,color-mix(in srgb,#1E5FB3 14%,var(--sur)),var(--sur) 48%,color-mix(in srgb,#2FD3C8 10%,var(--sur)))}
.motc-page.motc-pres .blk.vt-piani{border:1px solid var(--line);border-radius:22px;padding:30px 24px}
.motc-page.motc-pres .vt-piani > h2{text-align:center;font-size:clamp(24px,3.4vw,32px);margin:0 0 6px}
.motc-page .vt-piani .vt-intro{margin:0 auto 26px;text-align:center;max-width:46em;font-size:15.5px}
.motc-page:not(.motc-pres) .vt-piani .vt-intro{text-align:left;margin-left:0}
.motc-page .vt-piani .price{gap:18px;padding-top:12px}
.motc-page .vt-piani .plan{padding-top:26px}
.motc-page .vt-piani .plan.pro{box-shadow:0 18px 40px -26px color-mix(in srgb,var(--spot-oro) 70%,transparent)}
.motc-page .vt-nastro{position:absolute;top:-12px;left:18px;z-index:1;font:600 11px/1 Poppins,system-ui,sans-serif;letter-spacing:.04em;
  padding:6px 10px;border-radius:999px;border:1px solid var(--spot-oro);color:var(--spot-oro);background:var(--sur);white-space:nowrap}
.motc-page .plan.spec .vt-nastro{border-color:var(--spot-spec-fondo);color:var(--spot-spec-tx);background:var(--spot-spec-fondo)}
.motc-page .plan .vt-perche{margin:10px 0 0;font-size:14px;font-weight:500;line-height:1.45;color:var(--tx)!important}
.motc-page .plan li.vt-forte{color:var(--tx)}
.motc-page .plan li.vt-forte b{color:var(--spot-oro)}
.motc-page .plan.spec li.vt-forte b{color:var(--tx)}

/* ---------- tabella di confronto ---------- */
.motc-page .vt-confronto{margin:26px 0 0}
.motc-page .vt-titoletto{font-size:17px;font-weight:600;margin:0 0 10px}
.motc-page .vt-scorre{border:1px solid var(--line);border-radius:14px;background:var(--sur);overflow:hidden}
.motc-page table.vt-tabella{width:100%;margin:0;border-collapse:collapse;border:0;font-size:14px;background:transparent}
.motc-page .vt-tabella th,.motc-page .vt-tabella td{border:0;border-bottom:1px solid var(--line);padding:11px 12px;text-transform:none;
  letter-spacing:normal;color:var(--tx);background:transparent;vertical-align:middle;line-height:1.4;font-size:14px}
.motc-page .vt-tabella tbody tr:last-child th,.motc-page .vt-tabella tbody tr:last-child td{border-bottom:0}
.motc-page .vt-tabella thead th{font-weight:600;font-size:13px;text-align:center;background:var(--sur2);white-space:nowrap}
.motc-page .vt-tabella thead th:first-child{text-align:left;color:var(--mu)}
.motc-page .vt-tabella thead th:nth-child(3){box-shadow:inset 0 -3px 0 var(--spot-oro)}
.motc-page .vt-tabella thead th:nth-child(4){box-shadow:inset 0 -3px 0 var(--spot-spec-fondo)}
.motc-page .vt-tabella th[scope=row]{text-align:left;font-weight:600;width:52%}
.motc-page .vt-tabella .vt-cosa{display:block;margin-top:2px;font-weight:400;font-size:12.5px;color:var(--mu)}
.motc-page .vt-tabella td{text-align:center;width:16%}
.motc-page .vt-tabella td.si{color:var(--acc);font-weight:700;font-size:16px}
.motc-page .vt-tabella td.no{color:var(--mu);opacity:.75}
.motc-page .vt-tabella td.parte{font-size:12.5px}
.motc-page .vt-tabella tr.vt-gruppo th{background:var(--sur2);color:var(--mu);font-size:11px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;padding:7px 12px}
.motc-page .vt-tabella tr.vt-forte th,.motc-page .vt-tabella tr.vt-forte td{background:color-mix(in srgb,var(--spot-oro) 13%,transparent)}
.motc-page .vt-tabella tr.vt-forte th[scope=row]{box-shadow:inset 3px 0 0 var(--spot-oro);font-size:15px}
.motc-page .vt-tabella tr.vt-forte td.parte{font-weight:600}
.motc-page .vt-ln{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.motc-page .vt-stella{display:inline-block;margin:0 0 6px;padding:3px 9px;border-radius:999px;background:var(--spot-oro);color:#0E1B3D;
  font:600 10.5px/1.3 Poppins,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.motc-page[data-theme=light] .vt-stella{color:#fff}
.motc-page .vt-tabella .vt-stella{display:table;margin-bottom:5px}
/* telefono: ogni riga diventa una scheda (nome e cosa ci fai sopra, i tre piani sotto, ognuno col suo nome) */
@media (max-width:640px){
  .motc-page .vt-tabella thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .motc-page .vt-tabella,.motc-page .vt-tabella tbody{display:block}
  .motc-page .vt-tabella tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid var(--line)}
  .motc-page .vt-tabella tr:last-child{border-bottom:0}
  .motc-page .vt-tabella th,.motc-page .vt-tabella td{border-bottom:0;width:auto;display:block}
  .motc-page .vt-tabella th[scope=row],.motc-page .vt-tabella tr.vt-gruppo th{grid-column:1/-1}
  .motc-page .vt-tabella th[scope=row]{padding-bottom:4px;width:auto}
  .motc-page .vt-tabella td{padding:6px 6px 12px}
  .motc-page .vt-tabella td::before{content:attr(data-piano);display:block;margin-bottom:2px;font:600 9.5px/1.3 Poppins,system-ui,sans-serif;
    letter-spacing:.06em;color:var(--mu);text-transform:uppercase}
  .motc-page .vt-tabella tr.vt-forte th[scope=row]{box-shadow:none}
  .motc-page .vt-tabella tr.vt-forte{box-shadow:inset 3px 0 0 var(--spot-oro)}
}

/* ---------- come nasce SPOT in Farmacia ---------- */
.motc-page .blk.vt-storia{overflow:hidden;background:linear-gradient(135deg,color-mix(in srgb,#2FD3C8 8%,var(--sur)),var(--sur) 55%)}
.motc-page.motc-pres .blk.vt-storia{border:1px solid var(--line);border-radius:22px;padding:34px 30px 26px}
.motc-page .vt-storia h2{position:relative;font-size:clamp(21px,2.8vw,26px);margin:0 0 14px}
.motc-page .vt-virgolette{position:absolute;top:-18px;right:22px;font:700 150px/1 Georgia,"Times New Roman",serif;color:var(--acc);opacity:.16;pointer-events:none}
.motc-page .vt-storia p{position:relative;max-width:46em;margin:0 0 12px;font-size:16px;line-height:1.7;color:var(--tx)!important}
.motc-page .vt-storia p.vt-chiusa{font-weight:600;font-size:17px;padding-left:14px;border-left:3px solid var(--acc)}
.motc-page .vt-storia p.vt-firma{margin:16px 0 0;font-size:14px;font-style:italic;color:var(--mu)!important}
.motc-page .vt-storia p.vt-firma::before{content:"— "}
/* 06/10/2026 (rifinitura): la firma di Alessandro, disegnata a mano in SVG, col nome e il ruolo */
.motc-page .vt-firma-blocco{position:relative;margin:24px 0 0;padding-top:16px;border-top:1px solid var(--line);max-width:46em}
.motc-page .vt-firma-svg{display:block;width:min(260px,70%);height:auto;color:var(--blu);margin:0 0 4px -6px}
.motc-page .vt-storia p.vt-firma-nome{margin:0;font:600 17px/1.3 Poppins,system-ui,sans-serif;color:var(--tx)!important}
.motc-page .vt-storia p.vt-firma-ruolo{margin:2px 0 0;font:400 14px/1.4 Poppins,system-ui,sans-serif;color:var(--mu)!important}

/* ---------- cosa fa ogni sezione ---------- */
.motc-page.motc-pres .pres-dentro > h2,.motc-page.motc-pres .pres-plus > h2{font-size:clamp(20px,2.8vw,25px);line-height:1.3;margin:0 0 8px}
.motc-page .vt-griglia{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(290px,100%),1fr));gap:14px;margin-top:12px}
.motc-page .pres-spec .vt-griglia{grid-template-columns:repeat(auto-fill,minmax(min(400px,100%),1fr))}
.motc-page .vt-voce{display:flex;flex-direction:column;background:var(--sur);border:1px solid var(--line);border-radius:16px;padding:16px}
.motc-page .vt-voce h3{font-size:17px;font-weight:600;margin:6px 0 6px}
.motc-page .vt-voce .vt-testo > p,.motc-page.motc-pres .pres-plus .vt-voce .vt-testo > p{margin:0 0 12px;font-size:14px;line-height:1.5;max-width:none}
/* 07/10/2026: etichetta (dt) su una riga sua, testo (dd) sotto in minuscolo normale. Tutto dichiarato qui, perche' i temi
   WordPress stilano dl/dt/dd (maiuscolo, in linea, senza margini) e sulla pagina vera l'etichetta finiva attaccata al testo. */
.motc-page .vt-mkt{display:block;margin:auto 0 0;padding:10px 0 0;border:0;border-top:1px dashed var(--line);text-transform:none}
.motc-page .vt-mkt dt,.motc-page .vt-mkt dd{display:block;float:none;clear:both;width:auto;padding:0;text-transform:none;text-align:left;font-style:normal}
.motc-page .vt-mkt dt{margin:0 0 2px;font:600 12px/1.4 Poppins,system-ui,sans-serif;letter-spacing:.02em;color:var(--acc)}
.motc-page .vt-mkt dd{margin:0 0 12px;font:400 14px/1.45 Poppins,system-ui,sans-serif;letter-spacing:normal;color:var(--tx)}
.motc-page .vt-mkt dd:last-child{margin-bottom:0}
.motc-page.motc-pres .pres-dentro > p,.motc-page.motc-pres .pres-plus > p{margin:0 0 14px;font-size:15px;max-width:52em}
.motc-page .vt-voce h3 .badge{display:inline-block;margin-left:4px;padding:2px 6px;vertical-align:2px;font-size:9.5px;letter-spacing:.06em;
  border-color:var(--spot-oro);color:var(--spot-oro);background:transparent}
/* 07/10/2026: il nome del piano sempre intero (sulla pagina vera "SPOTspecialist" era tagliato a poche lettere) */
.motc-page :is(.vt-voce h3,.pres-plus h2) .badge{width:auto;min-width:0;max-width:none;height:auto;overflow:visible;white-space:nowrap;
  text-overflow:clip;text-indent:0;text-transform:none;line-height:1.5;float:none;box-sizing:content-box}
.motc-page.motc-pres .pres-plus > h2{display:flex;flex-wrap:wrap;align-items:center;column-gap:10px;row-gap:6px}
.motc-page.motc-pres .pres-plus > h2 .badge{margin:0;vertical-align:baseline}
.motc-page .pres-spec .vt-voce h3 .badge{border-color:var(--spot-spec-fondo);color:var(--spot-spec-tx);background:var(--spot-spec-fondo)}
.motc-page .vt-voce-forte{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:22px;align-items:center;
  border-color:var(--spot-oro);background:linear-gradient(135deg,color-mix(in srgb,var(--spot-oro) 13%,var(--sur)),var(--sur) 62%)}
.motc-page .vt-voce-forte h3{font-size:22px}
.motc-page .vt-voce-forte .vt-testo > p,.motc-page.motc-pres .pres-plus .vt-voce-forte .vt-testo > p{font-size:15px}
@media (max-width:700px){.motc-page .vt-voce-forte{grid-template-columns:minmax(0,1fr);gap:4px}}

/* ---------- i disegni: solo forme, nessuna scritta, nessun dato ---------- */
.motc-page .vt-scena{position:relative;height:96px;margin:0 0 12px;border-radius:12px;overflow:hidden;border:1px solid var(--line);
  background:color-mix(in srgb,var(--acc) 6%,var(--sur2))}
.motc-page .vt-voce-forte .vt-scena{height:180px;margin:0}
.motc-page .vt-scena i{position:absolute;display:block;font-style:normal;--g:linear-gradient(135deg,#1E5FB3,#2FD3C8)}
.motc-page .vt-scena i:nth-child(2){--i:1}.motc-page .vt-scena i:nth-child(3){--i:2}.motc-page .vt-scena i:nth-child(4){--i:3}
.motc-page .vt-scena i:nth-child(5){--i:4}.motc-page .vt-scena i:nth-child(6){--i:5}.motc-page .vt-scena i:nth-child(7){--i:6}
.motc-page .vt-scena i:nth-child(8){--i:7}.motc-page .vt-scena i:nth-child(9){--i:8}.motc-page .vt-scena i:nth-child(10){--i:9}
.motc-page .vt-scena i:nth-child(11){--i:10}.motc-page .vt-scena i:nth-child(12){--i:11}
/* barre in fila (in onda, influenza, a chi parla, laboratorio) */
.motc-page .vt-onda,.motc-page .vt-curva,.motc-page .vt-achi,.motc-page .vt-lab{display:flex;align-items:flex-end;gap:8px;padding:14px 18px}
.motc-page .vt-onda i,.motc-page .vt-curva i,.motc-page .vt-achi i,.motc-page .vt-lab i{position:static;flex:1;border-radius:5px 5px 2px 2px;
  background:var(--g);transform-origin:50% 100%}
.motc-page .vt-onda i:first-child{flex:0 0 46%;height:100%;margin-right:6px;border-radius:8px;background:transparent;border:2px solid var(--acc)}
.motc-page .vt-onda i:nth-child(2){position:absolute;flex:none;left:calc(18px + (100% - 36px) * .23 - 6px);top:calc(50% - 9px);width:0;height:0;
  border-radius:0;background:none;border-left:14px solid var(--acc);border-top:9px solid transparent;border-bottom:9px solid transparent}
.motc-page .vt-onda i:nth-child(3){height:46%}.motc-page .vt-onda i:nth-child(4){height:78%}.motc-page .vt-onda i:nth-child(5){height:60%}
.motc-page .vt-curva i:nth-child(1){height:18%}.motc-page .vt-curva i:nth-child(2){height:34%}.motc-page .vt-curva i:nth-child(3){height:58%}
.motc-page .vt-curva i:nth-child(4){height:88%}.motc-page .vt-curva i:nth-child(5){height:70%}.motc-page .vt-curva i:nth-child(6){height:44%}
.motc-page .vt-curva i:nth-child(7){height:24%}
.motc-page .vt-achi i:nth-child(odd){background:var(--pnk)}.motc-page .vt-achi i:nth-child(even){background:var(--blu)}
.motc-page .vt-achi i:nth-child(1){height:40%}.motc-page .vt-achi i:nth-child(2){height:28%}.motc-page .vt-achi i:nth-child(3){height:82%}
.motc-page .vt-achi i:nth-child(4){height:56%}.motc-page .vt-achi i:nth-child(5){height:62%}.motc-page .vt-achi i:nth-child(6){height:38%}
.motc-page .vt-lab i{background:color-mix(in srgb,var(--mu) 45%,transparent)}
.motc-page .vt-lab i:nth-child(4){background:var(--g)}
.motc-page .vt-lab i:nth-child(1){height:52%}.motc-page .vt-lab i:nth-child(2){height:70%}.motc-page .vt-lab i:nth-child(3){height:44%}
.motc-page .vt-lab i:nth-child(4){height:92%}.motc-page .vt-lab i:nth-child(5){height:60%}.motc-page .vt-lab i:nth-child(6){height:36%}
/* barre orizzontali (Top 10) */
.motc-page .vt-top{display:flex;flex-direction:column;justify-content:center;gap:6px;padding:12px 18px}
.motc-page .vt-top i{position:static;height:9px;border-radius:5px;background:var(--g);transform-origin:0 50%}
.motc-page .vt-top i:nth-child(1){width:92%}.motc-page .vt-top i:nth-child(2){width:76%}.motc-page .vt-top i:nth-child(3){width:62%}
.motc-page .vt-top i:nth-child(4){width:50%}.motc-page .vt-top i:nth-child(5){width:38%}
/* fumetti (colleghi) */
.motc-page .vt-bolle i{height:24px;border-radius:14px}
.motc-page .vt-bolle i:nth-child(1){left:16px;top:14px;width:48%;background:var(--sur);border:1px solid var(--line)}
.motc-page .vt-bolle i:nth-child(2){right:16px;top:38px;width:42%;background:var(--g)}
.motc-page .vt-bolle i:nth-child(3){left:32px;top:62px;width:30%;height:20px;background:var(--sur);border:1px solid var(--line)}
/* formazione */
.motc-page .vt-play i:nth-child(1){left:22px;top:22px;width:50px;height:50px;border-radius:50%;background:var(--g)}
.motc-page .vt-play i:nth-child(2){left:42px;top:36px;width:0;height:0;border-left:15px solid #fff;border-top:11px solid transparent;border-bottom:11px solid transparent}
.motc-page .vt-play i:nth-child(3){left:90px;right:20px;top:34px;height:9px;border-radius:5px;background:color-mix(in srgb,var(--mu) 45%,transparent)}
.motc-page .vt-play i:nth-child(4){left:90px;right:60px;top:52px;height:9px;border-radius:5px;background:color-mix(in srgb,var(--mu) 30%,transparent)}
/* meteo: l'icona del tempo della pagina */
.motc-page .vt-meteo{display:flex;align-items:center;justify-content:center}
.motc-page .vt-meteo .pres-icona{width:64px;height:64px;padding:8px}
/* Riordina l'esposizione: tre ripiani, le categorie si spostano al loro posto */
.motc-page .vt-scaffale i:nth-child(-n+3){left:7%;right:7%;height:3px;border-radius:2px;background:var(--line)}
.motc-page .vt-scaffale i:nth-child(1){top:32%}.motc-page .vt-scaffale i:nth-child(2){top:62%}.motc-page .vt-scaffale i:nth-child(3){top:92%}
.motc-page .vt-scaffale i:nth-child(n+4){width:17%;height:20%;border-radius:5px}
.motc-page .vt-scaffale i:nth-child(4){left:10%;top:12%;background:var(--g);--da:translate(130%,170%)}
.motc-page .vt-scaffale i:nth-child(5){left:30%;top:12%;background:var(--amb);--da:translate(240%,0)}
.motc-page .vt-scaffale i:nth-child(6){left:10%;top:42%;background:var(--pnk);--da:translate(330%,-150%)}
.motc-page .vt-scaffale i:nth-child(7){left:52%;top:42%;background:var(--blu);--da:translate(-180%,150%)}
.motc-page .vt-scaffale i:nth-child(8){left:30%;top:72%;background:color-mix(in srgb,var(--mu) 50%,transparent);--da:translate(160%,-150%)}
.motc-page .vt-scaffale i:nth-child(9){left:72%;top:72%;background:var(--acc);--da:translate(-300%,-300%)}
/* radar */
.motc-page .vt-radar i{left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px}
.motc-page .vt-radar i:nth-child(1){border-radius:50%;border:2px solid var(--line);box-shadow:inset 0 0 0 17px color-mix(in srgb,var(--sur) 70%,transparent),inset 0 0 0 19px var(--line)}
.motc-page .vt-radar i:nth-child(2){background:var(--g);opacity:.85;clip-path:polygon(50% 8%,86% 34%,74% 82%,30% 90%,16% 40%)}
.motc-page .vt-radar i:nth-child(3){width:38px;height:2px;margin:-1px 0 0;background:var(--acc);transform-origin:0 50%}
/* lista (cosa preparare al banco) */
.motc-page .vt-lista{display:flex;flex-direction:column;justify-content:center;gap:7px;padding:10px 18px}
.motc-page .vt-lista i{position:relative;height:10px;width:70%;margin-left:22px;border-radius:5px;background:color-mix(in srgb,var(--mu) 40%,transparent)}
.motc-page .vt-lista i::before{content:"";position:absolute;left:-22px;top:-2px;width:12px;height:12px;border-radius:4px;background:var(--acc)}
.motc-page .vt-lista i:nth-child(2){width:56%}.motc-page .vt-lista i:nth-child(3){width:64%}.motc-page .vt-lista i:nth-child(4){width:46%}
/* pollini e aria: quattro giorni */
.motc-page .vt-pallini{display:flex;align-items:center;justify-content:space-around;padding:0 12px}
.motc-page .vt-pallini i{position:static;border-radius:50%}
.motc-page .vt-pallini i:nth-child(1){width:20px;height:20px;background:var(--acc)}
.motc-page .vt-pallini i:nth-child(2){width:34px;height:34px;background:var(--amb)}
.motc-page .vt-pallini i:nth-child(3){width:46px;height:46px;background:var(--red)}
.motc-page .vt-pallini i:nth-child(4){width:28px;height:28px;background:var(--amb)}
/* post social: il telefono con il post (immagine, due righe, il cuore) e due fumetti ai lati */
.motc-page .vt-social i:nth-child(1){left:50%;top:10px;width:72px;height:100px;margin-left:-36px;border-radius:12px;border:2px solid var(--line);background:var(--sur)}
.motc-page .vt-social i:nth-child(2){left:50%;top:20px;width:58px;height:30px;margin-left:-29px;border-radius:6px;background:var(--g)}
.motc-page .vt-social i:nth-child(3){left:50%;top:57px;width:50px;height:6px;margin-left:-29px;border-radius:3px;background:color-mix(in srgb,var(--mu) 50%,transparent)}
.motc-page .vt-social i:nth-child(4){left:50%;top:68px;width:32px;height:6px;margin-left:-29px;border-radius:3px;background:color-mix(in srgb,var(--mu) 32%,transparent)}
.motc-page .vt-social i:nth-child(5){left:50%;top:64px;width:12px;height:12px;margin-left:15px;border-radius:50%;background:var(--pnk)}
.motc-page .vt-social i:nth-child(6){left:max(10px,calc(50% - 150px));top:20px;width:92px;height:22px;border-radius:12px 12px 12px 3px;border:1px solid var(--line);background:var(--sur)}
.motc-page .vt-social i:nth-child(7){left:calc(50% + 54px);top:50px;width:86px;height:22px;border-radius:12px 12px 3px 12px;background:var(--g);opacity:.9}
/* calendario dei post */
.motc-page .vt-calendario{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;padding:14px 18px}
.motc-page .vt-calendario i{position:static;border-radius:4px;background:color-mix(in srgb,var(--mu) 30%,transparent)}
.motc-page .vt-calendario i:nth-child(3n+2){background:var(--g)}
/* schede e report da stampare */
.motc-page .vt-foglio i:nth-child(1){left:22%;right:22%;bottom:0;height:26px;border-radius:8px 8px 0 0;background:color-mix(in srgb,var(--mu) 40%,transparent);z-index:1}
.motc-page .vt-foglio i:nth-child(2){left:30%;right:30%;top:10px;bottom:14px;border-radius:4px;border:1px solid var(--line);background:var(--sur) repeating-linear-gradient(180deg,transparent 0 12px,var(--line) 12px 13px) 0 18px/100% calc(100% - 26px) no-repeat}
.motc-page .vt-foglio i:nth-child(3){left:30%;right:30%;top:10px;height:8px;border-radius:4px 4px 0 0;background:var(--g)}

/* ---------- il movimento: preparato da proposte.js (vt-pronto), parte con .anima, una volta ---------- */
@keyframes vt-cresce-y{from{transform:scaleY(0)}to{transform:none}}
@keyframes vt-cresce-x{from{transform:scaleX(0)}to{transform:none}}
@keyframes vt-pop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.08);opacity:1}100%{transform:none;opacity:1}}
@keyframes vt-entra{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}
@keyframes vt-scivola{from{transform:translateX(-16px);opacity:0}to{transform:none;opacity:1}}
@keyframes vt-sposta{from{transform:var(--da,none);opacity:.4}to{transform:none;opacity:1}}
@keyframes vt-giro{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes vt-sale{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
/* il ritardo di ogni pezzo sta in --vt-rit (dentro la scorciatoia "animation"); fermo finche' non arriva .anima */
.motc-page .vt-scena i{--vt-rit:calc(var(--i,0) * 110ms)}
.motc-page .vt-pronto .vt-onda i:nth-child(n+3),.motc-page .vt-pronto .vt-curva i,.motc-page .vt-pronto .vt-achi i,
.motc-page .vt-pronto .vt-lab i{animation:vt-cresce-y .7s cubic-bezier(.2,.7,.2,1) var(--vt-rit) 1 both}
.motc-page .vt-pronto .vt-onda i:nth-child(-n+2){animation:vt-pop .6s ease-out var(--vt-rit) 1 both}
.motc-page .vt-pronto .vt-top i{animation:vt-cresce-x .7s cubic-bezier(.2,.7,.2,1) var(--vt-rit) 1 both}
.motc-page .vt-pronto .vt-bolle i,.motc-page .vt-pronto .vt-play i,.motc-page .vt-pronto .vt-pallini i,
.motc-page .vt-pronto .vt-calendario i{animation:vt-pop .6s ease-out var(--vt-rit) 1 both}
.motc-page .vt-pronto .vt-lista i{animation:vt-scivola .5s ease-out var(--vt-rit) 1 both}
.motc-page .vt-pronto .vt-scaffale i:nth-child(-n+3){animation:vt-cresce-x .5s ease-out var(--vt-rit) 1 both}
.motc-page .vt-scaffale i:nth-child(n+4){--vt-rit:calc(300ms + var(--i,0) * 140ms)}
.motc-page .vt-pronto .vt-scaffale i:nth-child(n+4){animation:vt-sposta 1.1s cubic-bezier(.3,.7,.2,1) var(--vt-rit) 1 both}
.motc-page .vt-pronto .vt-radar i:nth-child(-n+2){animation:vt-pop .7s ease-out var(--vt-rit) 1 both}
.motc-page .vt-pronto .vt-radar i:nth-child(3){animation:vt-giro 1.6s linear .5s 2 both}
.motc-page .vt-pronto .vt-social i,.motc-page .vt-pronto .vt-foglio i:nth-child(1){animation:vt-entra .6s ease-out var(--vt-rit) 1 both}
.motc-page .vt-pronto .vt-foglio i:nth-child(n+2){animation:vt-entra .9s cubic-bezier(.2,.7,.2,1) .3s 1 both}
.motc-page .vt-sale.vt-pronto{animation:vt-sale .7s cubic-bezier(.2,.7,.2,1) var(--vt-rit,0s) 1 both}
.motc-page .price .vt-sale:nth-child(2){--vt-rit:.12s}
.motc-page .price .vt-sale:nth-child(3){--vt-rit:.24s}
.motc-page .vt-pronto .vt-scena i,.motc-page .vt-sale.vt-pronto{animation-play-state:paused!important}
.motc-page .vt-pronto.anima .vt-scena i,.motc-page .vt-sale.vt-pronto.anima{animation-play-state:running!important}
@media (prefers-reduced-motion:reduce){.motc-page .vt-scena i,.motc-page .vt-sale{animation:none!important}}

/* 06/10/2026 (rifinitura, parte B2) - nell'area riservata (non nella presentazione, .motc-pres, che resta com'e'): banner dei
   piani, storia e riquadri delle sezioni coi valori del sistema grafico (console.css): marchio, raggi, superficie 2, spazi. */
.motc-page:not(.motc-pres) .vt-scena i{--g:linear-gradient(135deg,var(--ds-brand),var(--ds-brand-2))}
.motc-page:not(.motc-pres) .vt-play i:nth-child(2){border-left-color:var(--ds-surface)}
.motc-page:not(.motc-pres) .vt-stella{color:var(--ds-on-brand);border-radius:var(--ds-r-pill);font-family:var(--ds-font)}
.motc-page:not(.motc-pres) .vt-nastro{border-radius:var(--ds-r-pill);font-family:var(--ds-font)}
.motc-page:not(.motc-pres) .vt-scorre{border-color:var(--ds-border);border-radius:var(--ds-r-md);background:var(--ds-surface)}
.motc-page:not(.motc-pres) .vt-tabella :is(th,td){border-bottom-color:var(--ds-border)}
.motc-page:not(.motc-pres) .vt-tabella :is(thead th,tr.vt-gruppo th){background:var(--ds-surface-2)}
.motc-page:not(.motc-pres) :is(.vt-tabella .vt-cosa,.vt-tabella thead th:first-child,.vt-tabella tr.vt-gruppo th,.vt-storia p.vt-firma,.vt-storia p.vt-firma-ruolo){color:var(--ds-muted)!important}
.motc-page:not(.motc-pres) .vt-griglia{gap:var(--ds-s2)}
.motc-page:not(.motc-pres) .vt-voce{border-color:transparent;border-radius:var(--ds-r-md);background:var(--ds-surface-2);padding:var(--ds-s2)}
.motc-page:not(.motc-pres) .vt-voce-forte{border-color:var(--spot-oro);gap:var(--ds-s3)}
.motc-page:not(.motc-pres) .vt-scena{border:0;border-radius:var(--ds-r-sm);background:color-mix(in srgb,var(--ds-accent) 6%,var(--ds-surface))}
.motc-page:not(.motc-pres) .vt-mkt{border-top:1px solid var(--ds-border)}
.motc-page:not(.motc-pres) .vt-firma-blocco{border-top-color:var(--ds-border)}

/* 2.18.1: schede dei piani - prezzo in un blocco (cifra grande, condizioni piccole), tutto allineato a sinistra */
.motc-page .vt-piani .plan .prezzo-mese{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px;row-gap:2px;margin:8px 0 0;text-align:left}
.motc-page .vt-piani .plan .prezzo-cifra{font:700 28px/1.1 Poppins,system-ui,sans-serif;color:var(--tx)}
.motc-page .vt-piani .plan .prezzo-mese span,.motc-page .vt-piani .plan .prezzo-anno{font-size:13px;font-weight:400;line-height:1.4;color:var(--mu)}
.motc-page .vt-piani .plan .prezzo-anno{margin:4px 0 0}
