/* SPOT in Farmacia 2.10.0-2.10.5 (Alessandro, 12/10/2026) — la pagina di presentazione (presentazione.html) nel marchio di
   brand_12-10: fondo #07090e, grigio #a0b0bc (SPOT), lime #d4e47e (SPOT+), viola #a87fd4 (SPOTspecialist), caratteri di
   sistema (Arial Black per i titoli). Tutto sotto .motc-pres.pr-nuova: la vetrina degli abbonati non cambia.
   I disegni delle funzioni girano in loop (solo transform, opacity e tratto), si fermano fuori dallo schermo
   (presentazione.js) e per chi chiede meno movimento. */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(caratteri/Inter-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(caratteri/Inter-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(caratteri/Inter-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(caratteri/Inter-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(caratteri/Poppins-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(caratteri/Poppins-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(caratteri/Poppins-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(caratteri/Poppins-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
.motc-page.motc-pres.pr-nuova,.motc-page.motc-pres.pr-nuova[data-theme=light]{--bg:#07090e;--sur:#0d1018;--sur2:#11151f;--line:rgba(255,255,255,.08);
  --tx:#e8edf2;--mu:#a0b0bc;--acc:#a0b0bc;--blu:#c8d0d8;--ci:#a0b0bc;--cl:#d4e47e;--cv:#a87fd4;--ac:var(--ci);
  background:var(--bg);color:var(--tx);color-scheme:dark;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden;overflow-x:clip}
.motc-pres.pr-nuova .wrap{max-width:1180px;margin:0 auto;padding:0 16px 32px;box-sizing:border-box}
.motc-pres.pr-nuova *,.motc-pres.pr-nuova *::before,.motc-pres.pr-nuova *::after{box-sizing:border-box}
.motc-pres.pr-nuova .lg-chiaro{display:none}
.motc-pres.pr-nuova .lg-scuro{display:block}
.motc-pres.pr-nuova .spot-logo .logo .wm .name{color:#e8edf2}
/* il logo in alto, grande: 0.9 (scritta 43px), 0.62 sul telefono (30px) */
.motc-page.motc-pres.pr-nuova .spot-barra .spot-marchio .spot-logo{zoom:.9}
@media (max-width:760px){.motc-page.motc-pres.pr-nuova .spot-barra .spot-marchio .spot-logo{zoom:.62}}
.motc-pres.pr-nuova h1,.motc-pres.pr-nuova h2{font-family:'Arial Black','Arial Bold',Arial,sans-serif;font-weight:900;letter-spacing:-.5px;color:var(--tx)}
.motc-pres.pr-nuova h3{font-family:Arial,Helvetica,sans-serif;font-weight:700;color:var(--tx)}
.motc-pres.pr-nuova p{color:rgba(200,208,216,.9)}
.motc-pres.pr-nuova .blk{background:none;border:0;box-shadow:none;padding:0;margin:72px 0 0}

/* 1. apertura corta (2.10.5): kicker, titolo, una riga e i pulsanti. Poi «Come nasce», poi il video con cos'e' SPOT.
   Spazi sulla scala da 8 px. */
.motc-pres .pr-apertura{max-width:760px;margin:24px auto 0;text-align:center}
@media (min-width:960px){.motc-pres .pr-apertura{margin-top:40px}}
.motc-pres.pr-nuova .pr-apertura .azioni{justify-content:center}
.motc-pres .pr-guarda{display:grid;gap:24px;align-items:center}
@media (min-width:960px){.motc-pres .pr-guarda{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:48px}}
.motc-pres .pr-cosa{min-width:0}
.motc-pres .pr-cornice{position:relative;padding:14px;min-width:0}
.motc-pres .pr-schermo{position:relative;border-radius:16px;overflow:hidden;background:#0d1018;
  border:1px solid rgba(160,176,188,.28);
  box-shadow:0 0 0 1px rgba(7,9,14,.9),0 0 42px rgba(160,176,188,.10),0 24px 60px rgba(0,0,0,.55),-16px 0 48px -24px rgba(212,228,126,.35),16px 0 48px -24px rgba(168,127,212,.4)}
.motc-pres .pr-schermo-testa{display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;background:#11151f;border-bottom:1px solid var(--line)}
.motc-pres .pr-schermo-testa i{width:8px;height:8px;border-radius:50%;background:rgba(160,176,188,.45)}
.motc-pres .pr-schermo-testa i:nth-child(2){background:rgba(212,228,126,.6)}
.motc-pres .pr-schermo-testa i:nth-child(3){background:rgba(168,127,212,.6)}
.motc-pres .pr-schermo-testa span{margin-left:8px;font-size:10px;letter-spacing:3px;text-transform:uppercase;color:rgba(160,176,188,.7);white-space:nowrap;overflow:hidden}
.motc-pres .pr-video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000;object-fit:cover}
/* gli angolini del mirino (Intro del marchio): partono dal centro e scattano agli angoli, una volta */
.motc-pres .pr-angolo{position:absolute;width:30px;height:30px;border:0 solid var(--ci);opacity:.8;pointer-events:none;
  filter:drop-shadow(0 0 4px rgba(160,176,188,.6));animation:pr-scatto .6s cubic-bezier(.4,0,.2,1) .5s both}
.motc-pres .pr-a1{top:0;left:0;border-top-width:2px;border-left-width:2px;border-top-left-radius:6px;--dx:calc(50cqw - 15px);--dy:120px}
.motc-pres .pr-a2{top:0;right:0;border-top-width:2px;border-right-width:2px;border-top-right-radius:6px;--dx:calc(-50cqw + 15px);--dy:120px}
.motc-pres .pr-a3{bottom:0;left:0;border-bottom-width:2px;border-left-width:2px;border-bottom-left-radius:6px;--dx:calc(50cqw - 15px);--dy:-120px}
.motc-pres .pr-a4{bottom:0;right:0;border-bottom-width:2px;border-right-width:2px;border-bottom-right-radius:6px;--dx:calc(-50cqw + 15px);--dy:-120px}
.motc-pres .pr-cornice{container-type:inline-size}
@keyframes pr-scatto{0%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.4)}20%{opacity:1}100%{opacity:.8;transform:none}}

.motc-pres.pr-nuova .kicker{font-size:11px;letter-spacing:4px;text-transform:uppercase;color:var(--mu);margin:0 0 8px}
.motc-pres.pr-nuova .pr-apertura h1{font-size:clamp(34px,6vw,54px);line-height:1;letter-spacing:-1.5px;margin:0 0 16px}
.motc-pres.pr-nuova .pr-apertura h1::after{content:"";display:block;width:140px;height:2px;margin:16px auto 0;border-radius:2px;
  background:linear-gradient(90deg,var(--ci),var(--cl) 45%,var(--cv) 80%,transparent);box-shadow:0 0 8px rgba(160,176,188,.4)}
.motc-pres.pr-nuova .pres-titolo{font-size:clamp(18px,2.2vw,22px);line-height:1.4;font-weight:700;color:var(--tx);margin:0 0 24px}
.motc-pres.pr-nuova .pres-sotto{font-size:16px;line-height:1.6;margin:0 0 16px}
.motc-pres.pr-nuova .pres-problema{border-left:2px solid var(--cl);padding:4px 0 4px 16px;margin:0}
.motc-pres.pr-nuova .pres-problema h2{font-size:18px;margin:0 0 4px;letter-spacing:0}
.motc-pres.pr-nuova .pres-problema p{margin:0;font-size:15px;line-height:1.55}
.motc-pres.pr-nuova .azioni{display:flex;flex-wrap:wrap;gap:8px}
.motc-pres.pr-nuova .azioni a{display:inline-flex;align-items:center;min-height:46px;padding:12px 22px;border-radius:10px;font-weight:700;font-size:15px;text-decoration:none}
.motc-pres.pr-nuova .azioni a.primario{background:var(--cl);color:#07090e;box-shadow:0 0 22px rgba(212,228,126,.28)}
.motc-pres.pr-nuova .azioni a.secondario{border:1px solid rgba(160,176,188,.45);color:var(--tx);background:transparent}

/* 2. come nasce: stesso testo, nei colori del marchio */
.motc-pres.pr-nuova .blk.vt-storia{position:relative;background:linear-gradient(160deg,#0f131c,#0b0e15 60%);border:1px solid var(--line);
  border-top:2px solid rgba(160,176,188,.35);border-radius:18px;padding:30px 22px 24px}
.motc-pres.pr-nuova .vt-storia h2{font-size:clamp(22px,3vw,30px)}
.motc-pres.pr-nuova .vt-storia p{color:rgba(200,208,216,.92)!important}
.motc-pres.pr-nuova .vt-storia p.vt-chiusa{border-left-color:var(--cl)}
.motc-pres.pr-nuova .vt-virgolette{color:rgba(160,176,188,.18)}
.motc-pres.pr-nuova .vt-firma-svg{color:#c8d0d8}
.motc-pres.pr-nuova .vt-storia p.vt-firma-nome{font-family:'Arial Black',Arial,sans-serif;font-weight:900}
@media (min-width:760px){.motc-pres.pr-nuova .blk.vt-storia{padding:44px 48px 32px}}

/* 3. le funzioni: titolo, disegno e due righe sempre visibili; i dettagli con «Scopri di più» */
.motc-pres .pr-funzioni .blk>h2{font-size:clamp(22px,3.2vw,32px);margin:0 0 8px}
.motc-pres .pr-funzioni .blk>p{max-width:46em;font-size:16px;line-height:1.6;margin:0 0 22px}
.motc-pres .pres-dentro{--ac:var(--ci)}
.motc-pres .pres-plus{--ac:var(--cl)}
.motc-pres .pres-plus.pres-spec{--ac:var(--cv)}
.motc-pres.pr-nuova .badge{display:inline-block;vertical-align:middle;padding:2px 10px;border-radius:20px;font:700 11px/1.5 Arial,sans-serif;
  letter-spacing:.5px;color:var(--ac);background:color-mix(in srgb,var(--ac) 13%,transparent);border:1px solid color-mix(in srgb,var(--ac) 32%,transparent)}
.motc-pres .pr-griglia{display:grid;gap:16px;grid-template-columns:1fr}
@media (min-width:700px){.motc-pres .pr-griglia{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1080px){.motc-pres .pr-griglia{grid-template-columns:repeat(3,minmax(0,1fr))}}
.motc-pres .pr-voce{position:relative;display:flex;flex-direction:column;min-width:0;background:var(--sur);border:1px solid var(--line);
  border-top:2px solid color-mix(in srgb,var(--ac) 45%,transparent);border-radius:16px;overflow:hidden;transition:transform .2s,box-shadow .3s}
.motc-pres .pr-voce:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ac) 40%,transparent)}
.motc-pres .pr-voce.pr-forte{box-shadow:0 0 0 1px color-mix(in srgb,var(--ac) 55%,transparent),0 0 34px color-mix(in srgb,var(--ac) 16%,transparent)}
.motc-pres .pr-scena{height:132px;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(ellipse 70% 80% at 50% 40%,color-mix(in srgb,var(--ac) 9%,transparent),transparent 70%),#0a0d14;border-bottom:1px solid var(--line)}
.motc-pres .pr-scena svg{width:200px;max-width:80%;height:120px;overflow:visible}
.motc-pres .pr-testo{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.motc-pres .pr-testo h3{font-size:17px;line-height:1.3;margin:0 0 6px}
.motc-pres .pr-testo h3 .badge{margin-left:4px}
.motc-pres .pr-testo h3 .pr-unito{white-space:nowrap}
.motc-pres .pr-testo p{font-size:14.5px;line-height:1.55;margin:0 0 8px}
.motc-pres .pr-testo p.pr-riga{color:var(--tx);font-weight:600}
.motc-pres.pr-nuova .vt-stella{display:inline-block;align-self:flex-start;margin:0 0 8px;padding:2px 10px;border-radius:20px;font-size:11px;font-weight:700;
  color:#07090e;background:var(--ac)}
.motc-pres .pr-apri{align-self:flex-start;margin-top:auto;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 14px;
  border:1px solid color-mix(in srgb,var(--ac) 40%,transparent);border-radius:10px;background:transparent;color:var(--ac);font:700 14px Arial,sans-serif;cursor:pointer}
.motc-pres .pr-apri::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.motc-pres .pr-apri[aria-expanded=true]::after{transform:translateY(2px) rotate(-135deg)}
.motc-pres .pr-apri:hover{background:color-mix(in srgb,var(--ac) 10%,transparent)}
.motc-pres .pr-apri:focus-visible,.motc-pres.pr-nuova summary:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
.motc-pres .pr-dettagli{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.motc-pres .pr-dettagli dl{margin:0 0 8px}
.motc-pres .pr-dettagli dt{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--ac);margin:8px 0 2px}
.motc-pres .pr-dettagli dd{margin:0;font-size:14.5px;line-height:1.55;color:rgba(200,208,216,.9)}
.motc-pres .pr-dettagli p.pr-incluso{font-size:13px;color:var(--mu);margin:6px 0 0}

/* i disegni (2.10.5): griglia 200x120, linee sottili al neon col bagliore del colore del piano (grigio SPOT, lime SPOT+,
   viola SPOTspecialist). Lo stato di base e' il disegno finito: chi chiede meno movimento vede quello. Tutto cio' che serve
   solo al movimento (tratteggi, partenze) sta dentro i @keyframes. Giri da 4, 6 o 8 s, con 0% uguale a 100%;
   ease-in-out, lineare solo per rotazioni e flussi. I ritardi sono negativi: nessun salto alla partenza. */
.motc-pres .pr-scena *{transform-box:fill-box;transform-origin:center;stroke-linecap:round;stroke-linejoin:round}
.motc-pres .pr-scena .l{fill:none;stroke:rgba(160,176,188,.4);stroke-width:1.5}
.motc-pres .pr-scena .lf{fill:#0a0d14;stroke:rgba(160,176,188,.4);stroke-width:1.5}
.motc-pres .pr-scena .d{fill:rgba(160,176,188,.16)}
.motc-pres .pr-scena .n{fill:none;stroke:var(--ac);stroke-width:2;filter:drop-shadow(0 0 3px color-mix(in srgb,var(--ac) 60%,transparent))}
.motc-pres .pr-scena .nf{fill:var(--ac);filter:drop-shadow(0 0 4px color-mix(in srgb,var(--ac) 70%,transparent))}
.motc-pres .pr-scena .nd{fill:color-mix(in srgb,var(--ac) 22%,transparent)}
.motc-pres .pr-scena .ns{fill:color-mix(in srgb,var(--ac) 14%,#0a0d14);stroke:var(--ac);stroke-width:1.5;
  filter:drop-shadow(0 0 3px color-mix(in srgb,var(--ac) 50%,transparent))}
.motc-pres .pr-scena .lente{fill:rgba(7,9,14,.6);stroke:var(--ac);stroke-width:2;filter:drop-shadow(0 0 3px color-mix(in srgb,var(--ac) 60%,transparent))}
.motc-pres .pr-scena .tratteggio{stroke-dasharray:3 5}
.motc-pres .pr-scena .sem{fill:var(--c);opacity:.22;filter:drop-shadow(0 0 5px var(--c))}
.motc-pres .pr-scena .s1{--c:#e07a6a}
.motc-pres .pr-scena .s2{--c:#e8c46a}
.motc-pres .pr-scena .s3{--c:var(--ac);opacity:1}
.motc-pres .pr-scena .k-anello{transform:rotate(-90deg)}

/* i movimenti */
.motc-pres .pr-scena .k-flusso{animation:k-flusso 4s linear infinite}
.motc-pres .pr-scena .k-pulsa{animation:k-pulsa 4s ease-in-out infinite;animation-delay:calc(var(--i,0)*.4s - 4s)}
.motc-pres .pr-scena .k-eco{animation:k-eco 4s ease-in-out infinite;animation-delay:calc(var(--i,0)*.5s - 4s)}
.motc-pres .pr-scena .k-cresci{transform-origin:left center;animation:k-cresci 6s ease-in-out infinite;animation-delay:calc(var(--i,0)*.2s - 6s)}
.motc-pres .pr-scena .k-finisce{transform-origin:left center;animation:k-finisce 6s ease-in-out infinite;animation-delay:calc(var(--i,0)*.6s - 6s)}
.motc-pres .pr-scena .k-giro{animation:k-giro 8s linear infinite}
.motc-pres .pr-scena .k-deriva{animation:k-deriva 6s ease-in-out infinite}
.motc-pres .pr-scena .k-turno{animation:k-turno 6s ease-in-out infinite;animation-delay:calc(var(--i,0)*2s - 6s)}
.motc-pres .pr-scena .k-avanza,.motc-pres .pr-scena .k-disegna{animation:k-traccia 6s ease-in-out infinite}
.motc-pres .pr-scena .k-lettera{animation:k-lettera 6s ease-in-out infinite}
.motc-pres .pr-scena .k-avviso{animation:k-avviso 6s ease-in-out infinite}
.motc-pres .pr-scena .k-pioggia{animation:k-pioggia 4s ease-in-out infinite}
.motc-pres .pr-scena .k-colonna{transform-origin:center bottom;animation:k-colonna 6s ease-in-out infinite;animation-delay:calc(var(--i,0)*.25s - 6s)}
.motc-pres .pr-scena .k-giorno{animation:k-giorno 8s ease-in-out infinite}
.motc-pres .pr-scena .k-radar{transform-box:view-box;transform-origin:100px 60px;animation:k-giro 4s linear infinite}
.motc-pres .pr-scena .k-blip{animation:k-blip 4s ease-in-out infinite}
.motc-pres .pr-scena .k-spunta{animation:k-spunta 6s ease-in-out infinite;animation-delay:calc(var(--i,0)*.8s - 6s)}
.motc-pres .pr-scena .k-sali{animation:k-sali 4s ease-in-out infinite}
.motc-pres .pr-scena .k-scambio-a{animation:k-scambio-a 8s ease-in-out infinite}
.motc-pres .pr-scena .k-scambio-b{animation:k-scambio-b 8s ease-in-out infinite}
.motc-pres .pr-scena .k-bolla{animation:k-bolla 8s ease-in-out infinite;animation-delay:calc(var(--i,0)*.8s - 8s)}
.motc-pres .pr-scena .k-stampa{animation:k-stampa 6s ease-in-out infinite}
.motc-pres .pr-scena .k-su2{animation:k-su2 8s ease-in-out infinite}
.motc-pres .pr-scena .k-giu2{animation:k-giu2 8s ease-in-out infinite}
.motc-pres .pr-scena .k-nascondi{animation:k-nascondi 8s ease-in-out infinite}
.motc-pres .pr-scena .k-post{animation:k-post 6s ease-in-out infinite}
.motc-pres .pr-scena .k-cuore{animation:k-cuore 6s ease-in-out infinite}
.motc-pres .pr-scena .k-casella{animation:k-casella 8s ease-in-out infinite;animation-delay:calc(var(--i,0)*.5s - 8s)}
.motc-pres .pr-scena .k-lente{animation:k-lente 8s ease-in-out infinite}

@keyframes k-flusso{0%{stroke-dasharray:24 76;stroke-dashoffset:100}100%{stroke-dasharray:24 76;stroke-dashoffset:0}}
@keyframes k-pulsa{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.15);opacity:.55}}
@keyframes k-eco{0%,60%,100%{opacity:.2}30%{opacity:1}}
@keyframes k-cresci{0%,100%{transform:scaleX(.3)}30%,75%{transform:scaleX(1)}}
@keyframes k-finisce{0%,100%{transform:scaleX(1);opacity:1}45%,60%{transform:scaleX(.1);opacity:.4}}
@keyframes k-giro{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
@keyframes k-deriva{0%,100%{transform:translateX(0)}50%{transform:translateX(-10px)}}
@keyframes k-turno{0%,40%,100%{opacity:.22}8%,30%{opacity:1}}
@keyframes k-traccia{0%{stroke-dasharray:100;stroke-dashoffset:100;opacity:0}6%{opacity:1}45%,85%{stroke-dashoffset:0;opacity:1}
  95%,100%{stroke-dasharray:100;stroke-dashoffset:0;opacity:0}}
@keyframes k-lettera{0%,100%{transform:translateY(0)}45%,65%{transform:translateY(16px)}}
@keyframes k-avviso{0%,40%,90%,100%{opacity:0;transform:scale(.4)}50%,80%{opacity:1;transform:scale(1)}}
@keyframes k-pioggia{0%{transform:translateY(-3px);opacity:0}25%,60%{opacity:1}100%{transform:translateY(4px);opacity:0}}
@keyframes k-colonna{0%,100%{transform:scaleY(.35)}35%,70%{transform:scaleY(1)}}
@keyframes k-giorno{0%,18%,100%{transform:translateX(0)}25%,43%{transform:translateX(44px)}50%,68%{transform:translateX(88px)}
  75%,93%{transform:translateX(132px)}}
@keyframes k-blip{0%,70%,100%{opacity:.15;transform:scale(1)}3%{opacity:1;transform:scale(1.5)}15%{opacity:1;transform:scale(1)}}
@keyframes k-spunta{0%{stroke-dasharray:100;stroke-dashoffset:100;opacity:0}5%{opacity:1}20%,80%{stroke-dashoffset:0;opacity:1}
  92%,100%{stroke-dasharray:100;stroke-dashoffset:0;opacity:0}}
@keyframes k-sali{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes k-scambio-a{0%,15%,90%,100%{transform:translate(0,0)}40%,65%{transform:translate(72px,36px)}}
@keyframes k-scambio-b{0%,15%,90%,100%{transform:translate(0,0)}40%,65%{transform:translate(-72px,-36px)}}
@keyframes k-bolla{0%{opacity:0;transform:translateY(6px)}10%,70%{opacity:1;transform:translateY(0)}85%,100%{opacity:0;transform:translateY(-4px)}}
@keyframes k-stampa{0%{opacity:0;transform:translateY(-24px)}15%{opacity:1}50%,80%{opacity:1;transform:translateY(0)}95%,100%{opacity:0;transform:translateY(0)}}
@keyframes k-su2{0%,20%,95%,100%{transform:translateY(0)}40%,75%{transform:translateY(-26px)}}
@keyframes k-giu2{0%,20%,95%,100%{transform:translateY(0)}40%,75%{transform:translateY(26px)}}
@keyframes k-nascondi{0%,25%,95%,100%{opacity:1}45%,75%{opacity:.2}}
@keyframes k-post{0%{opacity:0;transform:translateY(8px)}12%,80%{opacity:1;transform:translateY(0)}92%,100%{opacity:0;transform:translateY(-6px)}}
@keyframes k-cuore{0%,45%,75%,100%{transform:scale(1)}52%{transform:scale(1.3)}60%{transform:scale(.92)}67%{transform:scale(1.12)}}
@keyframes k-casella{0%,75%,100%{opacity:.15;transform:scale(.6)}10%,60%{opacity:1;transform:scale(1)}}
@keyframes k-lente{0%,100%{transform:translate(0,0)}33%{transform:translate(-56px,12px)}66%{transform:translate(-100px,-6px)}}

/* fuori dallo schermo i disegni si fermano (presentazione.js) */
.motc-pres .pr-scena.pr-fermo *{animation-play-state:paused}

/* 4. i piani, come la pagina Piani del marchio: carte scure, filo colorato in alto, prezzo nel colore del piano */
.motc-pres.pr-nuova .vt-piani>h2{font-size:clamp(24px,3.4vw,36px);text-align:center;margin:0 0 8px}
.motc-pres.pr-nuova .vt-piani .vt-intro{text-align:center;max-width:44em;margin:0 auto 28px;font-size:16px;line-height:1.6}
.motc-pres.pr-nuova .vt-piani .price{display:grid;gap:18px;grid-template-columns:1fr;max-width:1000px;margin:0 auto}
@media (min-width:900px){.motc-pres.pr-nuova .vt-piani .price{grid-template-columns:repeat(3,minmax(0,1fr))}}
.motc-pres.pr-nuova .vt-piani .plan{position:relative;background:var(--sur);border:1px solid var(--line);border-radius:16px;padding:24px;
  min-width:0;color:var(--tx);box-shadow:none;transition:transform .2s;display:flex;flex-direction:column}
.motc-pres.pr-nuova .vt-piani .plan:hover{transform:translateY(-4px)}
.motc-pres.pr-nuova .vt-piani .plan.free{--ac:var(--ci);border-top:2px solid rgba(160,176,188,.35)}
.motc-pres.pr-nuova .vt-piani .plan.pro{--ac:var(--cl);border-top:2px solid rgba(212,228,126,.5);box-shadow:0 0 40px -12px rgba(212,228,126,.25)}
.motc-pres.pr-nuova .vt-piani .plan.spec{--ac:var(--cv);border-top:2px solid rgba(168,127,212,.5);box-shadow:0 0 40px -12px rgba(168,127,212,.25)}
.motc-pres.pr-nuova .vt-piani .piano-marchio{margin:0 0 14px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.motc-pres.pr-nuova .vt-piani .plan h3{font:900 20px 'Arial Black',Arial,sans-serif;color:var(--tx);margin:0 0 8px}
.motc-pres.pr-nuova .vt-piani .plan .p{font:900 32px/1 'Arial Black',Arial,sans-serif;color:var(--ac);text-shadow:0 0 20px color-mix(in srgb,var(--ac) 35%,transparent);margin:0 0 10px}
.motc-pres.pr-nuova .vt-piani .plan .prezzo{font-size:15px;font-weight:700;color:var(--ac);margin:0 0 4px}
.motc-pres.pr-nuova .vt-piani .plan .prezzo-anno{font-size:13px;font-weight:400;color:var(--mu)}
.motc-pres.pr-nuova .vt-piani .plan .vt-perche{font-size:14px;line-height:1.5;margin:10px 0 12px}
.motc-pres.pr-nuova .vt-piani .plan ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.motc-pres.pr-nuova .vt-piani .plan li{position:relative;padding-left:14px;font-size:13.5px;line-height:1.45;color:rgba(200,208,216,.88)}
.motc-pres.pr-nuova .vt-piani .plan li::before{content:"";position:absolute;left:0;top:7px;width:5px;height:5px;border-radius:50%;background:var(--ac);opacity:.85}
.motc-pres.pr-nuova .vt-piani .vt-nastro{display:inline-block;margin:0 0 10px;padding:2px 10px;border-radius:20px;font-size:11px;font-weight:700;
  color:var(--ac);border:1px solid color-mix(in srgb,var(--ac) 35%,transparent);background:color-mix(in srgb,var(--ac) 10%,transparent);position:static}
/* 2.10.5: «Scegli <piano>» in fondo a ogni carta, nel colore del piano */
.motc-pres.pr-nuova .vt-piani .pr-scegli{margin:auto 0 0;padding-top:24px}
.motc-pres.pr-nuova .vt-piani .pr-scegli-a{display:flex;align-items:center;justify-content:center;min-height:48px;padding:8px 16px;border-radius:8px;
  background:var(--ac);color:#07090e;font-weight:700;font-size:15px;text-decoration:none;box-shadow:0 0 24px -8px var(--ac);transition:filter .2s}
.motc-pres.pr-nuova .vt-piani .pr-scegli-a:hover{filter:brightness(1.1)}
.motc-pres.pr-nuova .vt-piani .pr-scegli-a:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
.motc-pres.pr-nuova .vt-piani .nota-iva{max-width:60em;margin:18px auto 0;text-align:center;font-size:12.5px;color:var(--mu)}
.motc-pres.pr-nuova .pr-confronto{max-width:1000px;margin:24px auto 0;background:var(--sur);border:1px solid var(--line);border-radius:14px}
.motc-pres.pr-nuova .pr-confronto summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;min-height:48px}
.motc-pres.pr-nuova .pr-confronto summary::-webkit-details-marker{display:none}
.motc-pres.pr-nuova .pr-confronto summary h3{margin:0;font-size:15px;color:var(--tx)}
.motc-pres.pr-nuova .pr-confronto summary::after{content:"";flex:none;width:8px;height:8px;border-right:2px solid var(--mu);border-bottom:2px solid var(--mu);transform:rotate(45deg);transition:transform .2s}
.motc-pres.pr-nuova .pr-confronto[open] summary::after{transform:rotate(-135deg)}
.motc-pres.pr-nuova .pr-confronto .vt-scorre{overflow-x:auto;padding:0 12px 14px}
.motc-pres.pr-nuova .pr-confronto .vt-tabella{background:transparent;color:var(--tx)}
.motc-pres.pr-nuova .pr-confronto .vt-tabella th,.motc-pres.pr-nuova .pr-confronto .vt-tabella td{border-color:var(--line);color:var(--tx)}

/* chiusura e piede */
.motc-pres.pr-nuova .pres-chiusura{text-align:center;padding:36px 18px;border:1px solid var(--line);border-radius:18px;
  background:radial-gradient(ellipse 60% 90% at 50% 0,rgba(160,176,188,.08),transparent 70%),var(--sur)}
.motc-pres.pr-nuova .pres-chiusura h2{font-size:clamp(20px,2.8vw,28px);margin:0 0 18px}
.motc-pres.pr-nuova .pres-chiusura .azioni{justify-content:center}
.motc-pres.pr-nuova footer{margin-top:48px;border-top:1px solid var(--line);padding-top:18px;color:var(--mu)}
.motc-pres.pr-nuova footer p,.motc-pres.pr-nuova footer a{color:var(--mu)}

@media (prefers-reduced-motion:reduce){
  .motc-pres .pr-scena *,.motc-pres .pr-angolo{animation:none!important}
  .motc-pres .pr-voce,.motc-pres .vt-piani .plan,.motc-pres .vt-piani .pr-scegli-a{transition:none}
}

/* 12/10/2026: il tema impone stili propri a .badge e ai pulsanti: si riportano quelli del marchio */
.motc-pres.pr-nuova .badge{width:auto!important;height:auto!important;min-width:0!important;border-radius:20px!important;line-height:1.5!important;position:static!important}
.motc-pres .pr-apri{text-transform:none!important;letter-spacing:0!important;font-size:14px}
.motc-pres .badge::before,.motc-pres .badge::after{content:none!important;display:none!important}
.motc-pres .badge{width:auto!important;height:auto!important;min-width:0!important;border-radius:20px!important;line-height:1.5!important;position:static!important;padding:2px 10px!important}

/* 12/10/2026 (Alessandro): logo del piano nei titoli dei gruppi, misura leggibile ma discreta */
.motc-pres h2 .pr-titolo-logo{display:inline-flex;vertical-align:middle;margin-left:12px;zoom:.8}
.motc-pres h2 .pr-titolo-logo .spot-logo .spec-text{letter-spacing:1.2px}
@media (max-width:600px){
  /* 2.18.0: sul telefono il logo va sotto il titolo, centrato (a destra «specialist» usciva dal bordo) */
  .motc-page.motc-pres.pr-nuova h2:has(.pr-titolo-logo){display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;text-align:center}
  .motc-pres h2 .pr-titolo-logo .spot-logo .spec-text{letter-spacing:.5px}
  .motc-pres h2 .pr-titolo-logo{zoom:.45;margin-left:0;flex:none}
}
/* pulsanti «Scegli»: colori del piano, il tema non li sovrascrive */
.motc-pres.pr-nuova .vt-piani .plan .pr-scegli-a{width:100%;box-sizing:border-box;border-radius:12px!important;min-height:52px;font:700 16px/1.2 Arial,sans-serif!important;
  letter-spacing:.2px!important;text-transform:none!important;text-decoration:none!important;border:1.5px solid transparent!important;transition:transform .15s,filter .2s,box-shadow .2s}
.motc-pres.pr-nuova .vt-piani .plan.free .pr-scegli-a{background:transparent!important;color:#eef1f6!important;border-color:#a0b0bc!important;box-shadow:0 0 18px -10px #a0b0bc}
.motc-pres.pr-nuova .vt-piani .plan.pro .pr-scegli-a{background:#d4e47e!important;color:#07090e!important;box-shadow:0 0 28px -8px #d4e47e}
.motc-pres.pr-nuova .vt-piani .plan.spec .pr-scegli-a{background:#a87fd4!important;color:#07090e!important;box-shadow:0 0 28px -8px #a87fd4}
.motc-pres.pr-nuova .vt-piani .plan .pr-scegli-a:hover{transform:translateY(-1px);filter:brightness(1.08)}
/* 2.10.7: forma dei pulsanti «Scegli» pulita (il tema imponeva padding e larghezza): a tutta larghezza, testo centrato */
.motc-pres.pr-nuova .vt-piani .plan .pr-scegli{width:100%!important;margin:auto 0 0!important;padding:24px 0 0!important}
.motc-pres.pr-nuova .vt-piani .plan .pr-scegli-a{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;
  height:52px!important;min-height:0!important;padding:0 20px!important;margin:0!important;line-height:1!important;border-radius:999px!important;font-size:16px!important}
/* 2.11.0 (Alessandro, 12/10/2026: "controlla la asincronia"): tabella di confronto e pulsanti allineati */
.motc-pres.pr-nuova .pr-confronto .vt-tabella thead th{border-bottom:3px solid transparent!important;text-align:center;box-shadow:none!important}
.motc-pres.pr-nuova .pr-confronto .vt-tabella thead th:first-child{text-align:left;border-bottom-color:#1c2534!important}
.motc-pres.pr-nuova .pr-confronto .vt-tabella thead th:nth-child(2){border-bottom-color:#a0b0bc!important}
.motc-pres.pr-nuova .pr-confronto .vt-tabella thead th:nth-child(3){border-bottom-color:#d4e47e!important}
.motc-pres.pr-nuova .pr-confronto .vt-tabella thead th:nth-child(4){border-bottom-color:#a87fd4!important}
.motc-pres.pr-nuova .pr-confronto .vt-tabella td{text-align:center;vertical-align:middle}
.motc-pres.pr-nuova .pr-confronto .vt-tabella td.si span[aria-hidden]{font-size:18px;font-weight:700;line-height:1}
.motc-pres.pr-nuova .pr-confronto .vt-tabella td[data-piano="SPOT"] span[aria-hidden]{color:#a0b0bc}
.motc-pres.pr-nuova .pr-confronto .vt-tabella td[data-piano="SPOT+"] span[aria-hidden]{color:#d4e47e}
.motc-pres.pr-nuova .pr-confronto .vt-tabella td[data-piano="SPOTspecialist"] span[aria-hidden]{color:#a87fd4}
.motc-pres.pr-nuova .pr-confronto>summary{border:1px solid #1c2534!important;border-radius:12px!important;outline:none!important;box-shadow:none!important}
.motc-pres.pr-nuova .pr-confronto>summary:focus{outline:none!important}
.motc-pres.pr-nuova .pr-confronto>summary:focus-visible{outline:2px solid #a0b0bc!important;outline-offset:2px}
.motc-pres.pr-nuova .vt-piani{align-items:stretch!important}
.motc-pres.pr-nuova .vt-piani .plan{display:flex!important;flex-direction:column!important;height:auto}
.motc-pres.pr-nuova .vt-piani .plan>ul{flex:1 1 auto}

/* 2.13.0 (Alessandro, 12/10/2026): caratteri della presentazione. Titoli e pulsanti Poppins, testi Inter; file tenuti nel
   plugin (caratteri/), nessuna richiesta a Google. Piano B: Arial. */
.motc-page.motc-pres.pr-nuova,.motc-page.motc-pres.pr-nuova[data-theme=light]{font-family:'Inter',Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65}
.motc-page.motc-pres.pr-nuova h1,.motc-page.motc-pres.pr-nuova h2,.motc-page.motc-pres.pr-nuova h3{font-family:'Poppins',Arial,Helvetica,sans-serif}
.motc-page.motc-pres.pr-nuova .pr-apertura h1{font-size:38px;line-height:1.1;font-weight:700;letter-spacing:-.8px}
.motc-page.motc-pres.pr-nuova h2{font-size:24px;line-height:1.25;font-weight:700;letter-spacing:-.3px}
.motc-page.motc-pres.pr-nuova .pres-problema h2{font-size:18px}
.motc-page.motc-pres.pr-nuova h3,.motc-page.motc-pres.pr-nuova .pr-testo h3{font-size:18px;font-weight:600;line-height:1.3}
.motc-page.motc-pres.pr-nuova .pr-confronto summary h3{font-size:16px}
.motc-page.motc-pres.pr-nuova .vt-piani .plan h3{font:700 20px/1.2 'Poppins',Arial,sans-serif;color:var(--tx)}
.motc-page.motc-pres.pr-nuova .vt-piani .plan .p{font:700 32px/1 'Poppins',Arial,sans-serif}
.motc-page.motc-pres.pr-nuova .vt-storia p.vt-firma-nome{font-family:'Poppins',Arial,sans-serif;font-weight:600}
.motc-page.motc-pres.pr-nuova .pres-titolo{font-size:18px;font-weight:600;line-height:1.5;color:#c4ccd6}
.motc-page.motc-pres.pr-nuova .vt-storia p,.motc-page.motc-pres.pr-nuova .pres-sotto,.motc-page.motc-pres.pr-nuova .pr-funzioni .blk>p,.motc-page.motc-pres.pr-nuova .vt-piani .vt-intro{font-size:16px;line-height:1.65}
.motc-page.motc-pres.pr-nuova .azioni a,.motc-page.motc-pres.pr-nuova .pr-apri{font-family:'Poppins',Arial,sans-serif;font-weight:600}
.motc-page.motc-pres.pr-nuova .vt-piani .plan .pr-scegli-a{font-family:'Poppins',Arial,sans-serif!important;font-weight:600!important}

/* 2.13.0: sul telefono tutti i testi centrati (la versione per computer non cambia) */
@media (max-width:600px){
  .motc-pres.pr-nuova .pr-apertura,.motc-pres.pr-nuova .pr-cosa,.motc-pres.pr-nuova .vt-storia,.motc-pres.pr-nuova .pr-funzioni .blk>h2,.motc-pres.pr-nuova .pr-funzioni .blk>p,
  .motc-pres.pr-nuova .pr-testo,.motc-pres.pr-nuova .pr-dettagli,.motc-pres.pr-nuova .pr-confronto summary h3{text-align:center}
  .motc-pres.pr-nuova .pr-funzioni .blk>p{margin-left:auto;margin-right:auto}
  .motc-pres.pr-nuova .pres-problema{border-left:0;padding:4px 0}
  .motc-pres.pr-nuova .vt-storia p.vt-chiusa{border-left:0;padding-left:0}
  .motc-pres.pr-nuova .vt-storia p{margin-left:auto;margin-right:auto}
  .motc-pres.pr-nuova .vt-firma-blocco{margin-left:auto;margin-right:auto;text-align:center}
  .motc-pres.pr-nuova .vt-firma-svg{margin:0 auto 4px}
  .motc-pres.pr-nuova .pr-testo{align-items:center}
  .motc-pres.pr-nuova .pr-testo .vt-stella,.motc-pres.pr-nuova .pr-apri{align-self:center}
  .motc-pres.pr-nuova .pr-confronto summary h3{flex:1}
}

/* 2.18.0: titoli e righe bilanciati (niente parola sola a capo), racconto centrato nella scheda */
.motc-pres.pr-nuova h1,.motc-pres.pr-nuova h2,.motc-pres.pr-nuova h3,.motc-pres.pr-nuova .pres-titolo,.motc-pres.pr-nuova .pres-sotto{text-wrap:balance}
.motc-pres.pr-nuova p,.motc-pres.pr-nuova li{text-wrap:pretty}
.motc-page.motc-pres.pr-nuova .pres-titolo{max-width:44em;margin-left:auto;margin-right:auto;text-align:center}
.motc-page.motc-pres.pr-nuova .vt-storia h2{max-width:none;margin-left:auto!important;margin-right:auto!important;text-align:center}
.motc-page.motc-pres.pr-nuova .vt-storia p{max-width:68ch;margin-left:auto!important;margin-right:auto!important}
/* 2.18.0 telefono: «SPOT in Farmacia» su una riga anche a 360 px; «Scopri di più» alto 44 px dove si tocca col dito */
.motc-page.motc-pres.pr-nuova .pr-apertura h1{font-size:clamp(28px,9.2vw,38px)}
@media (pointer:coarse){.motc-pres .pr-apri{min-height:44px}}

/* 2.18.1: schede dei piani allineate a sinistra a ogni larghezza (le schede non seguono piu' il centrato 2.13.0 del telefono);
   prezzo in un blocco: cifra grande, condizioni piccole sotto */
.motc-page.motc-pres.pr-nuova .vt-piani .plan{text-align:left;align-items:stretch}
.motc-page.motc-pres.pr-nuova .vt-piani .piano-marchio{justify-content:flex-start}
.motc-page.motc-pres.pr-nuova .vt-piani .plan .vt-nastro{align-self:flex-start}
.motc-page.motc-pres.pr-nuova .vt-piani .plan h3{margin:0 0 10px}
.motc-page.motc-pres.pr-nuova .vt-piani .plan .prezzo-cifra{font:700 32px/1.1 'Poppins',Arial,sans-serif;color:var(--ac);text-shadow:0 0 20px color-mix(in srgb,var(--ac) 35%,transparent)}
.motc-page.motc-pres.pr-nuova .vt-piani .plan .prezzo-mese span{font-size:13px;font-weight:400;line-height:1.4;color:var(--mu)}
.motc-page.motc-pres.pr-nuova .vt-piani .plan .prezzo-anno{margin:4px 0 0;font-size:13px;font-weight:400;line-height:1.4;color:var(--mu)}
.motc-page.motc-pres.pr-nuova .vt-piani .plan ul{gap:9px}
.motc-page.motc-pres.pr-nuova .vt-piani .plan li{display:block;padding-left:16px;text-align:left}
.motc-page.motc-pres.pr-nuova .vt-piani .plan li::before{position:absolute;left:0;top:.6em;margin:0}
