/* ==================================================================
   Hosting Stak — foglio di stile unico del sito (IT + EN)
   Palette del marchio: slate #2a3a43 / #374d59 / #40525c ·
   teal #1abc9c / #16a085 / #66efd4 · arancio #f38630 · grigio #f0f1f3
   Font: Hanken Grotesk, ospitato sul dominio (cartella /fonts).
   Nessuna dipendenza esterna: niente Bootstrap, niente jQuery.
   Questo file è identico nei repo hostingstak_it e hostingstak_en.
   ================================================================== */

@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/hanken-grotesk-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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/hanken-grotesk-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}

:root{
  --slate-950:#1e2b32; --slate-900:#2a3a43; --slate-800:#374d59; --slate-700:#40525c;
  --slate-500:#566b77; --slate-300:#a9b8c0; --slate-200:#cfd9de;
  --line:#dde4e8; --line-dark:rgba(255,255,255,.13);
  --mist:#f0f1f3; --paper:#ffffff;
  --teal:#1abc9c; --teal-deep:#16a085; --teal-ink:#0c7a64; --teal-50:#e5f6f2; --mint:#66efd4; --on-teal:#0f2a33;
  /* pulsanti principali: PIATTI, tinta unica, testo bianco su un verde più profondo del marchio.
     Sul verde acceso (#1abc9c) il bianco ha un contrasto di 2,4:1 e si legge male; qui è 4,6:1.
     Niente sfumature, riflessi o aloni: per cambiare tutti i pulsanti, l'etichetta "Consigliato"
     e la barra d'ordine sul telefono bastano queste tre variabili. */
  --btn:#0d856d; --btn-hover:#0a705c; --on-btn:#fff;
  --orange:#f38630; --orange-ink:#a9500c; --star:#f6a821; --red:#c0392b; --red-50:#fbeae7;
  --font:"Hanken Grotesk","Segoe UI",system-ui,-apple-system,sans-serif;
  --radius:14px;
  --shadow:0 1px 2px rgba(30,43,50,.05),0 20px 44px -20px rgba(30,43,50,.28);
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--slate-900);font:400 1.0625rem/1.6 var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,p,ul,ol,dl,dd,blockquote,figure,table{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
img{display:block;max-width:100%}
button,input{font:inherit;color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.wrap{width:100%;max-width:1180px;margin-inline:auto;padding-inline:clamp(16px,4vw,32px)}

/* icone: un solo set a tratto, 24px, ereditano il colore */
.ico{flex:none;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.ico--sm{width:18px;height:18px;stroke-width:2.4}
.ico--xs{width:15px;height:15px;stroke-width:2}
.ibox .ico{width:26px;height:26px}
.ibox{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:13px;background:var(--ibox-bg,var(--teal-50));color:var(--ibox-fg,var(--teal-ink))}

/* i componenti leggono --fg / --muted / --rule: funzionano su fondo chiaro e scuro */
.sec{--fg:var(--slate-900);--muted:var(--slate-500);--rule:var(--line);--eyebrow:var(--teal-ink);--focus:var(--teal-deep);
  padding-block:clamp(60px,8.5vw,108px);color:var(--fg);scroll-margin-top:76px}
.sec--mist{background:var(--mist)}
.sec--flush{padding-top:0}
:focus-visible{outline:2px solid var(--focus,var(--mint));outline-offset:3px;border-radius:6px}

.eyebrow{font:700 .8rem/1.2 var(--font);letter-spacing:.11em;text-transform:uppercase;color:var(--eyebrow)}
h2{font:700 clamp(1.85rem,3.3vw,2.7rem)/1.08 var(--font);letter-spacing:-.022em;text-wrap:balance}
h3{font:700 1.2rem/1.25 var(--font);letter-spacing:-.005em}
.shead{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:20px clamp(32px,6vw,96px);align-items:end;margin-bottom:clamp(34px,5vw,56px)}
.shead__main{display:grid;gap:14px}
.shead__side{color:var(--muted);max-width:34em}
@media (max-width:860px){.shead{grid-template-columns:minmax(0,1fr)}}

/* bottoni */
.btn{background:transparent;display:inline-flex;align-items:center;justify-content:center;gap:.6em;font:700 1rem/1 var(--font);padding:.95em 1.5em;border-radius:10px;border:1.5px solid transparent;text-decoration:none;cursor:pointer;white-space:nowrap;transition:transform .16s ease,background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease}
.btn--teal{background:var(--btn);color:var(--on-btn)}
.btn--teal:hover{background:var(--btn-hover);color:var(--on-btn)}
.btn--ghost{border-color:rgba(255,255,255,.32);color:#fff}
.btn--ghost:hover{border-color:var(--mint);color:var(--mint)}
.btn--line{border-color:var(--slate-900);color:var(--slate-900)}
.btn--line:hover{background:var(--slate-900);color:#fff}
.btn--sm{padding:.7em 1.1em;font-size:.92rem}
.btn .ico{width:18px;height:18px;stroke-width:2.2}
.ico--go{transition:transform .16s ease}
.btn:hover .ico--go,.tlink:hover .ico--go{transform:translateX(3px)}
.tlink{font-weight:700;text-decoration:none;color:var(--eyebrow);display:inline-flex;gap:.4em;align-items:center;padding-block:4px}
/* dentro una frase (senza freccia) va a capo come il resto del testo, non in blocco */
.tlink:not(:has(.ico)){display:inline;padding-block:0}
.tlink .ico{width:18px;height:18px;stroke-width:2.2}
.tlink:hover{text-decoration:underline;text-underline-offset:4px}
.flag{flex:none;width:21px;height:14px;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.18)}

/* suggerimento lingua */
.suggest{background:var(--mist);border-bottom:1px solid var(--line);font-size:.92rem;--focus:var(--teal-deep)}
.suggest__in{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding-block:8px}
.suggest p{margin-right:auto}
.suggest__go{display:inline-block;padding-block:6px;font-weight:700;color:var(--teal-ink);text-underline-offset:3px}
.suggest__x{display:grid;place-items:center;border:0;background:transparent;cursor:pointer;padding:9px;border-radius:6px;color:var(--slate-500)}
.suggest__x:hover{background:#fff;color:var(--slate-900)}

/* barra utility: offerta + supporto, area clienti, lingua */
.util{--focus:var(--mint);background:var(--slate-950);color:var(--slate-200);font-size:.9rem;position:relative;z-index:70}
.util__in{display:flex;align-items:center;justify-content:space-between;gap:8px 24px;min-height:42px}
.util__promo{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding-block:8px}
.tag{font:700 .72rem/1 var(--font);letter-spacing:.1em;text-transform:uppercase;background:var(--orange);color:#2b1503;padding:5px 8px;border-radius:6px}
.util b{color:#fff;font-weight:700}
.util s{color:var(--slate-300)}
.util__promo a{color:var(--mint);font-weight:700;text-decoration:none;white-space:nowrap;padding-block:6px;margin-block:-6px}
.util__promo a:hover{text-decoration:underline}
.util__links{display:flex;align-items:center;gap:22px;flex:none}
.util__links>a{color:var(--slate-200);text-decoration:none}
.util__links>a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.lang{position:relative}
.lang__btn{display:inline-flex;align-items:center;gap:8px;background:transparent;border:1px solid var(--line-dark);border-radius:8px;padding:9px 10px;cursor:pointer;color:#fff;font-size:.9rem;line-height:1}
.lang__btn:hover{border-color:rgba(255,255,255,.4)}
.lang__btn::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.8}
.lang__menu{position:absolute;right:0;top:calc(100% + 8px);min-width:190px;background:#fff;color:var(--slate-900);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;--focus:var(--teal-deep)}
.lang__menu a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;text-decoration:none;font-size:.95rem}
.lang__menu a:hover{background:var(--mist)}
.lang__menu a[aria-current]{font-weight:700}
.lang__menu .ico{margin-left:auto;color:var(--teal-ink)}
@media (max-width:860px){.util__links>a{display:none}.util__long{display:none}.lang__btn span{display:none}}

/* header */
.hdr{--focus:var(--mint);position:sticky;top:env(safe-area-inset-top,0px);z-index:60;background:rgba(42,58,67,.96);-webkit-backdrop-filter:saturate(140%) blur(10px);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--line-dark);color:#fff;transition:box-shadow .2s ease}
.hdr.is-stuck{box-shadow:0 14px 30px -18px rgba(0,0,0,.65)}
.hdr__in{display:flex;align-items:center;gap:28px;min-height:70px}
.logo{display:inline-flex;flex:none;padding-block:7px}
.logo img{height:30px;width:auto}
.nav{display:flex;align-items:center;gap:26px;margin-left:auto;font:600 1rem/1 var(--font)}
.nav a{color:var(--slate-200);text-decoration:none;padding:8px 0;border-bottom:2px solid transparent;transition:color .16s ease,border-color .16s ease}
.nav a:hover{color:#fff;border-color:var(--teal)}
.nav__extra{display:none}
.nav__langs{display:none}
.hdr__burger{display:none;margin-left:auto;align-items:center;gap:10px;background:transparent;border:1.5px solid rgba(255,255,255,.3);color:#fff;border-radius:10px;padding:.6em 1em;font:700 .92rem/1 var(--font);cursor:pointer}
.hdr__burger i{display:block;width:16px;height:2px;background:currentColor;box-shadow:0 5px 0 currentColor,0 -5px 0 currentColor}
@media (max-width:1120px){
  .hdr__burger{display:inline-flex}
  .hdr__cta{display:none}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;margin:0;background:var(--slate-900);padding:4px clamp(16px,4vw,32px) 20px;border-bottom:1px solid var(--line-dark)}
  .hdr.is-open .nav{display:flex}
  .nav a{padding:15px 0;border-bottom:1px solid var(--line-dark)}
  .nav__extra{display:block}
  .nav__langs{display:flex;gap:10px;padding-top:16px}
  .nav__langs a{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--line-dark);border-radius:10px;padding:12px}
  .nav__langs a[aria-current]{background:rgba(255,255,255,.08);color:#fff}
}

/* hero */
.hero{--focus:var(--mint);position:relative;isolation:isolate;overflow:hidden;color:#fff;
  background:
    radial-gradient(rgba(255,255,255,.055) 1px,transparent 1.3px) 0 0/26px 26px,
    radial-gradient(1100px 560px at 90% -14%,#47616f 0%,rgba(71,97,111,0) 62%),
    linear-gradient(180deg,var(--slate-900),var(--slate-950));
  padding-block:clamp(48px,7vw,96px) clamp(60px,8vw,108px)}
.hero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,5vw,80px);align-items:center}
@media (max-width:1020px){.hero__grid{grid-template-columns:minmax(0,1fr)}}
.hero__copy{display:grid;gap:24px;justify-items:start}
.hero h1{font:700 clamp(2.5rem,5.3vw,4.15rem)/1.02 var(--font);letter-spacing:-.03em;text-wrap:balance}
.hero h1 small{display:block;margin-bottom:22px;color:var(--mint)}
.hero h1 span{color:var(--mint)}
.lede{font-size:clamp(1.08rem,1.45vw,1.24rem);line-height:1.55;color:var(--slate-200);max-width:33em}
.lede b{color:#fff;font-weight:600}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.hero__from{font-size:.98rem;color:var(--slate-200);margin-top:-8px}
.hero__from b{color:#fff;font-size:1.15em}
.trust{display:flex;flex-wrap:wrap;gap:8px 24px;width:100%;padding-top:20px;border-top:1px solid var(--line-dark);font-size:.94rem;color:var(--slate-200)}
.trust li{display:inline-flex;align-items:baseline;gap:7px}
.trust b{color:#fff;font-weight:700}
.stars{color:var(--star);letter-spacing:2px;font-size:.95em}

/* visual del hero: il mockup reale della VPS */
.stage{position:relative;margin:34px 0 44px}
.stage::before{content:"";position:absolute;inset:-10% -6%;z-index:-1;background:radial-gradient(closest-side,rgba(26,188,156,.30),rgba(26,188,156,0) 72%)}
.stage__img{width:100%;height:auto;filter:drop-shadow(0 34px 38px rgba(0,0,0,.5))}
.chip{position:absolute;display:flex;align-items:center;gap:11px;background:#fff;color:var(--slate-900);border-radius:13px;padding:10px 16px 10px 10px;box-shadow:0 22px 44px -18px rgba(0,0,0,.6);font-size:.86rem;line-height:1.25}
.chip b{display:block;font-size:.96rem}
.chip small{font-size:1em;color:var(--slate-500)}
.chip .ibox{width:38px;height:38px;border-radius:10px}
.chip .ibox .ico{width:22px;height:22px}
.chip--pc{left:-6px;top:-30px}
.chip--vps{right:-2px;bottom:-34px}
@media (max-width:560px){
  .stage{margin:6px 0 0}
  .chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
  .chip{position:static;padding:9px 10px;gap:9px}
}

/* fascia di rassicurazione */
.assure{border-bottom:1px solid var(--line)}
.assure__in{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.assure__item{display:flex;align-items:center;gap:14px;padding:26px clamp(12px,2vw,26px);border-left:1px solid var(--line);font-size:.93rem;line-height:1.35;color:var(--slate-500)}
.assure__item:first-child{border-left:0;padding-left:0}
.assure__item b{display:block;font-size:1.04rem;color:var(--slate-900)}
@media (max-width:1100px){.assure__in{grid-template-columns:repeat(2,minmax(0,1fr))}.assure__item{padding:20px 16px 20px 0;border-left:0;border-top:1px solid var(--line)}.assure__item:nth-child(-n+2){border-top:0}}
@media (max-width:560px){.assure__in{grid-template-columns:minmax(0,1fr)}.assure__item:nth-child(2){border-top:1px solid var(--line)}}

/* piattaforme: stessa griglia a 4 colonne (e stessi margini interni) della fascia di rassicurazione,
   così le linee verticali proseguono. Titolo + una riga, poi un gruppo per colonna; ogni nome porta
   alla sua sezione nella pagina del prodotto. */
.plat{border-bottom:1px solid var(--line)}
.plat__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.plat__intro,.plat__lane{padding:28px clamp(12px,2vw,26px) 26px;border-left:1px solid var(--line)}
.plat__intro{display:grid;gap:8px;align-content:start;border-left:0;padding-left:0}
.plat__lane--2{grid-column:span 2}
.plat__lane--3{grid-column:span 3;display:grid;align-content:center}   /* gruppo unico, senza etichetta: centrato rispetto al testo accanto */
.plat__title{font:700 1.12rem/1.25 var(--font);letter-spacing:-.01em;color:var(--slate-900)}
.plat__intro p{font-size:.93rem;line-height:1.45;color:var(--slate-500);text-wrap:pretty}
.plat__kind{margin-bottom:8px;font:700 .76rem/1.3 var(--font);letter-spacing:.11em;text-transform:uppercase;color:var(--teal-ink)}
.plat__list{display:grid;gap:0 20px;justify-items:start}
.plat__lane--2 .plat__list{grid-template-rows:repeat(3,auto);grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}   /* 2 colonne × 3 righe: alta quanto il gruppo accanto */
.plat__lane--3 .plat__list{grid-template-columns:repeat(3,minmax(0,1fr))}
.plat__list a{display:inline-flex;align-items:center;gap:9px;padding-block:6px;font:600 1rem/1.3 var(--font);color:var(--slate-900);text-decoration:none;transition:color .16s ease}
.plat__list .ico{flex:none;color:var(--teal-ink)}
.plat__list a:hover{color:var(--teal-ink);text-decoration:underline;text-underline-offset:4px}
@media (max-width:1100px){
  .plat__grid{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
  .plat__intro{grid-column:1/-1;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:6px 0;align-items:baseline;padding:24px 0 0}
  .plat__intro p{padding-left:clamp(12px,2vw,26px)}
  .plat__lane{padding-top:18px}
  .plat__intro+.plat__lane{border-left:0;padding-left:0}
  .plat__lane--2,.plat__lane--3{grid-column:auto}
  .plat__lane--3{grid-column:1/-1}
}
@media (max-width:620px){
  .plat__grid{grid-template-columns:minmax(0,1fr)}
  .plat__intro{grid-template-columns:minmax(0,1fr);padding-top:26px}
  .plat__intro p{padding-left:0}
  .plat__lane{border-left:0;padding:16px 0 14px}
  .plat__lane+.plat__lane{border-top:1px solid var(--line)}
  .plat__lane:last-child{padding-bottom:22px}
  .plat__list,.plat__lane--2 .plat__list,.plat__lane--3 .plat__list{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-flow:row}
}

/* prodotti */
.products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@media (max-width:860px){.products{grid-template-columns:minmax(0,1fr)}}
.product{--fg:var(--slate-900);--muted:var(--slate-500);--rule:var(--line);--eyebrow:var(--teal-ink);--ibox-bg:#fff;
  display:flex;flex-direction:column;gap:20px;padding:clamp(26px,3.4vw,42px);border-radius:20px;background:var(--mist);color:var(--fg);scroll-margin-top:96px}
.product--dark{--fg:#fff;--muted:var(--slate-200);--rule:var(--line-dark);--eyebrow:var(--mint);--focus:var(--mint);--ibox-bg:rgba(102,239,212,.13);--ibox-fg:var(--mint);
  background:radial-gradient(520px 300px at 100% 0%,#47616f 0%,rgba(71,97,111,0) 70%),var(--slate-800)}
.product__head{display:flex;align-items:center;gap:14px}
.product h3{font-size:clamp(1.55rem,2.5vw,2rem);letter-spacing:-.02em;line-height:1.12}
.product__for{color:var(--muted)}
.ticks{display:grid;gap:11px}
.ticks li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:11px;align-items:start}
.ticks .ico{margin-top:.24em;color:var(--eyebrow)}
.range{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--rule);padding-block:14px}
.range li{display:grid;gap:3px;padding-left:16px;border-left:1px solid var(--rule);font-size:.85rem;line-height:1.2;color:var(--muted)}
.range li:first-child{padding-left:0;border-left:0}
.range b{font-size:1.12rem;color:var(--fg);white-space:nowrap}
.product__foot{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.from{display:grid;gap:2px;font-size:.85rem;color:var(--muted);line-height:1.1}
.from b{font:700 1.75rem/1 var(--font);letter-spacing:-.02em;color:var(--fg)}
.from b small{font:400 .5em var(--font);letter-spacing:0;color:var(--muted);margin-left:3px}

.uses{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:20px}
@media (max-width:1100px){.uses{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.uses{grid-template-columns:minmax(0,1fr)}}
.uses li{display:grid;gap:10px;align-content:start;padding:24px;border:1px solid var(--line);border-radius:var(--radius);transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.uses li:hover{border-color:var(--slate-300);box-shadow:var(--shadow);transform:translateY(-2px)}
.uses h3{font-size:1.1rem;margin-top:4px}
.uses p{font-size:.98rem;color:var(--slate-500)}
.uses .tlink{margin-top:2px;font-size:.96rem}

/* confronto */
.scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius)}
.cmp{width:100%;min-width:820px;border-collapse:collapse;font-size:.98rem;line-height:1.45}
.cmp th,.cmp td{padding:17px 20px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.cmp tr:last-child th,.cmp tr:last-child td{border-bottom:0}
.cmp thead th{font:700 .78rem/1.2 var(--font);letter-spacing:.09em;text-transform:uppercase;color:var(--slate-500);background:var(--mist)}
.cmp tbody th{font-weight:700;width:31%}
.cmp td{position:relative;padding-left:52px;color:var(--slate-500);width:23%}
.cmp .cmp__win{color:var(--slate-900);background:rgba(26,188,156,.075)}
.cmp thead .cmp__win{color:var(--teal-ink);background:rgba(26,188,156,.15);box-shadow:inset 0 3px 0 var(--teal)}
.mark{position:absolute;left:20px;top:17px;width:22px;height:22px;padding:4px;border-radius:50%;stroke-width:3}
.mark--no{background:var(--red-50);color:var(--red)}
.mark--yes{background:var(--teal-50);color:var(--teal-ink)}
.cmp__win .mark--yes{background:var(--teal);color:var(--on-teal)}
.cmp__note{margin-top:22px;max-width:60em;color:var(--slate-500)}
.cmp__note b{color:var(--slate-900)}

/* prezzi */
.pricebar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:34px}
.seg{display:inline-flex;padding:4px;background:#fff;border:1px solid var(--line);border-radius:12px;max-width:100%}
.seg button{border:0;background:transparent;font:700 1rem/1 var(--font);padding:.8em 1.3em;border-radius:9px;color:var(--slate-500);cursor:pointer;white-space:nowrap;transition:background-color .16s ease,color .16s ease}
.seg button:hover{color:var(--slate-900)}
.seg button[aria-selected="true"]{background:var(--slate-900);color:#fff}
.plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:stretch}
@media (max-width:1100px){.plans{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 18px}}
@media (max-width:620px){.plans{grid-template-columns:minmax(0,1fr)}}
.plan{position:relative;display:flex;flex-direction:column;gap:18px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:30px 22px 20px;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.plan:hover{border-color:var(--slate-300);box-shadow:var(--shadow);transform:translateY(-2px)}
.plan--featured,.plan--featured:hover{border-color:var(--teal);box-shadow:0 0 0 1px var(--teal),var(--shadow)}
.plan__flag{position:absolute;top:-12px;left:22px;background:var(--btn);color:var(--on-btn);font:700 .72rem/1 var(--font);letter-spacing:.09em;text-transform:uppercase;padding:6px 10px;border-radius:6px}
.plan__name{font:700 1.35rem/1.2 var(--font)}
.plan__fit{font-size:.95rem;line-height:1.45;color:var(--slate-500);min-height:4.35em}
.plan__price{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.plan__amount{font:700 2.75rem/1 var(--font);letter-spacing:-.035em}
.plan__amount small{font-size:.46em;font-weight:700;letter-spacing:0}
.plan__per{font-size:.95rem;color:var(--slate-500)}
.plan__specs{border-top:1px solid var(--line)}
.plan__specs div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.96rem}
.plan__specs dt{color:var(--slate-500)}
.plan__specs dd{font-weight:700;text-align:right}
.plan__specs em{font-style:normal;font-weight:600;font-size:.8em;color:var(--teal-ink);margin-left:4px;white-space:nowrap}
.plan__feats{display:grid;gap:9px;font-size:.95rem;line-height:1.4}
.plan__feats li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:9px;align-items:start}
.plan__feats .ico{margin-top:.2em;color:var(--teal-ink)}
.plan__feats li.is-off{color:var(--slate-500)}
.plan__feats li.is-off .ico{color:var(--slate-300)}
.plan__cta{margin-top:auto;width:100%}
.plan .btn--line{border-color:var(--line)}
.plan .btn--line:hover{border-color:var(--slate-900)}
.plan__secure{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:-6px;font-size:.82rem;color:var(--slate-500)}
.included{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:34px;padding-top:24px;border-top:1px solid var(--line);font-size:.98rem;color:var(--slate-500)}
.included li{display:inline-flex;align-items:center;gap:7px}
.included .ico{color:var(--teal-ink)}
.included strong{color:var(--slate-900);font-weight:700}
.paynote{margin-top:18px;font-size:.95rem;color:var(--slate-500)}
.paynote a{color:var(--teal-ink);font-weight:700}

/* infrastruttura */
.feats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(24px,4vw,56px)}
@media (max-width:900px){.feats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.feats{grid-template-columns:minmax(0,1fr)}}
.feat{display:grid;gap:12px;align-content:start;padding-block:28px 34px;border-top:1px solid var(--line)}
.feat h3{margin-top:6px}
.feat p{color:var(--slate-500)}

/* come funziona: passi + guida video */
.how{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(32px,5vw,72px);align-items:center}
@media (max-width:900px){.how{grid-template-columns:minmax(0,1fr)}}
.steps{display:grid;gap:0;counter-reset:step}
.step{position:relative;display:grid;gap:6px;padding:0 0 30px 62px;counter-increment:step}
.step:last-child{padding-bottom:0}
.step::before{content:counter(step);position:absolute;left:0;top:0;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--slate-900);color:#fff;font:700 1.05rem/1 var(--font)}
.step::after{content:"";position:absolute;left:19.5px;top:48px;bottom:8px;width:1px;background:var(--slate-300)}
.step:last-child::after{display:none}
.step h3{padding-top:7px}
.step p{color:var(--slate-500)}
.video{display:grid;gap:16px}
.video__poster{--play:clamp(60px,9vw,84px);position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;border:0;border-radius:18px;overflow:hidden;cursor:pointer;color:#fff;--focus:var(--teal-deep);
  background:
    radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.3px) 0 0/22px 22px,
    radial-gradient(460px 280px at 78% -10%,#4d6a79 0%,rgba(77,106,121,0) 70%),
    linear-gradient(160deg,var(--slate-800),var(--slate-950));
  box-shadow:var(--shadow)}
/* anteprima: un fotogramma vero del video (ospitato sul sito), scurito in basso perché
   play ed etichetta si leggano. Il play sta in basso a sinistra: al centro del fotogramma c'è il logo. */
.video__frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.video__poster::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(30,43,50,.88) 0%,rgba(30,43,50,.35) 38%,rgba(30,43,50,0) 62%);pointer-events:none}
.video__poster:hover .video__frame{transform:scale(1.025)}
.video__play{--play:clamp(52px,6.5vw,64px);position:absolute;z-index:1;left:22px;bottom:20px;display:grid;place-items:center;width:var(--play);height:var(--play);border-radius:50%;background:var(--teal);color:var(--on-teal);box-shadow:0 0 0 7px rgba(26,188,156,.22),0 14px 28px -10px rgba(0,0,0,.6);transition:transform .2s ease,box-shadow .2s ease}
.video__play .ico{width:36%;height:36%;margin-left:6%}
.video__poster:hover .video__play{transform:scale(1.06);box-shadow:0 0 0 10px rgba(26,188,156,.2),0 14px 28px -10px rgba(0,0,0,.6)}
.video__tag{position:absolute;z-index:1;left:calc(22px + clamp(52px,6.5vw,64px) + 16px);bottom:calc(20px + (clamp(52px,6.5vw,64px) - 32px) / 2);display:inline-flex;align-items:center;gap:8px;font:600 .9rem/1 var(--font);background:rgba(30,43,50,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:9px 12px;border-radius:9px}
@media (prefers-reduced-motion:reduce){.video__frame{transition:none}.video__poster:hover .video__frame{transform:none}}
.video figcaption{color:var(--slate-500);max-width:40em}
.video figcaption b{color:var(--slate-900)}

/* recensioni */
.rating{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;color:var(--slate-500)}
.rating b{color:var(--slate-900)}
.rating .tlink{flex-basis:100%}
.quote{display:grid;gap:18px;align-content:start}
.quote figcaption{display:flex;align-items:center;gap:12px;font-size:.95rem;color:var(--slate-500);line-height:1.35}
.quote figcaption b{display:block;color:var(--slate-900)}
.quote img{flex:none;width:48px;height:48px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #fff,0 0 0 3px var(--line)}
.quote--lead{position:relative;grid-template-columns:minmax(0,1fr);padding:clamp(26px,3.6vw,48px);background:var(--mist);border-radius:20px;margin-bottom:20px;overflow:hidden}
.quote--lead::after{content:"”";position:absolute;right:clamp(18px,3vw,44px);top:14px;font:700 clamp(7rem,11vw,10rem)/1 Georgia,"Times New Roman",serif;color:rgba(42,58,67,.07);pointer-events:none}
.quote--lead blockquote{position:relative;font:600 clamp(1.25rem,2vw,1.6rem)/1.4 var(--font);letter-spacing:-.01em;max-width:44em}
.quote--lead img{width:58px;height:58px}
.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:900px){.quotes{grid-template-columns:minmax(0,1fr)}}
.quotes .quote{grid-template-rows:auto 1fr auto;padding:26px;border:1px solid var(--line);border-radius:16px}

/* faq */
.faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,88px);align-items:start}
@media (max-width:900px){.faq{grid-template-columns:minmax(0,1fr)}}
.faq__head{display:grid;gap:18px;justify-items:start}
.faq__head p:not(.eyebrow){color:var(--slate-500)}
.faq__list{display:grid;gap:10px}
.faq__list details{background:#fff;border:1px solid var(--line);border-radius:14px;transition:border-color .16s ease,box-shadow .16s ease}
.faq__list details:hover{border-color:var(--slate-300)}
.faq__list details[open]{box-shadow:var(--shadow)}
.faq__list summary{display:flex;justify-content:space-between;align-items:center;gap:20px;cursor:pointer;list-style:none;padding:18px 20px;font:700 1.08rem/1.35 var(--font);border-radius:14px}
.faq__list summary::-webkit-details-marker{display:none}
.faq__list summary::after{content:"";flex:none;width:10px;height:10px;margin-right:4px;border-right:2px solid var(--teal-ink);border-bottom:2px solid var(--teal-ink);transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s ease}
.faq__list details[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.faq__list details p{padding:0 56px 20px 20px;color:var(--slate-500);max-width:64ch}
.faq__list details a{color:var(--teal-ink);font-weight:700}

/* chiusura */
.final{--focus:var(--mint);color:#fff;
  background:
    radial-gradient(rgba(255,255,255,.05) 1px,transparent 1.3px) 0 0/26px 26px,
    radial-gradient(900px 420px at 12% 120%,#47616f 0%,rgba(71,97,111,0) 60%),
    var(--slate-800);
  padding-block:clamp(60px,8.5vw,108px)}
.final__in{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:32px clamp(32px,6vw,96px)}
@media (max-width:860px){.final__in{grid-template-columns:minmax(0,1fr)}}
.final h2{font-size:clamp(2rem,4vw,3.1rem);max-width:13em}
.final__side{display:grid;gap:14px;justify-items:start}
.final__side p{font-size:.92rem;color:var(--slate-200)}

/* footer */
.ftr{--focus:var(--mint);background:var(--slate-950);color:var(--slate-300);padding-block:clamp(48px,6vw,72px) 32px;font-size:.98rem}
.ftr__grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:36px clamp(24px,4vw,56px)}
@media (max-width:860px){.ftr__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.ftr__grid{grid-template-columns:minmax(0,1fr)}}
.ftr__brand{display:grid;gap:16px;align-content:start;max-width:26em}
.ftr__brand>img{height:28px;width:auto}
.ftr h3{font:700 .78rem/1 var(--font);letter-spacing:.11em;text-transform:uppercase;color:#fff;margin-bottom:16px}
.ftr li+li{margin-top:10px}
.ftr a{color:var(--slate-200);text-decoration:none;transition:color .16s ease}
.ftr a:hover{color:var(--mint)}
.ftr__langs{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.ftr__langs a{display:inline-flex;align-items:center;gap:8px;padding-block:6px;margin-block:-6px}
.ftr__langs a[aria-current]{color:#fff;font-weight:700}
.ftr__social{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:.92rem}
.ftr__social a{padding-block:6px;margin-block:-6px}
/* colonne dei link: lo stesso passo di prima, ma lo spazio tra una voce e l'altra si può toccare */
.ftr__grid li+li{margin-top:0}
.ftr__grid li a{display:inline-block;padding-block:5px}
.ftr__grid h3{margin-bottom:11px}
.ftr__net{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px clamp(24px,4vw,56px);align-items:start;margin-top:40px;padding-top:32px;border-top:1px solid var(--line-dark)}
@media (max-width:860px){.ftr__net{grid-template-columns:minmax(0,1fr)}}
.ftr__tools h3{margin-bottom:6px}
.ftr__tools>p{font-size:.88rem;margin-bottom:18px}
.ftr__tools ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 28px}
@media (max-width:480px){.ftr__tools ul{grid-template-columns:minmax(0,1fr)}}
.ftr__tools li+li{margin-top:0}
.ftr__tools a{display:grid;gap:2px;line-height:1.35}
.ftr__tools a b{color:#fff;font-weight:600}
.ftr__tools a span{font-size:.88rem;color:var(--slate-300)}
.ftr__tools a:hover b{color:var(--mint)}
.tpb{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 16px;align-items:start;padding:16px 18px;border:1px solid var(--line-dark);border-radius:14px;background:rgba(255,255,255,.035);transition:border-color .16s ease,background-color .16s ease}
.tpb:hover{border-color:rgba(102,239,212,.45);background:rgba(255,255,255,.06)}
.tpb svg{width:78px;height:auto;margin-top:2px}
.tpb__txt{display:grid;gap:4px;line-height:1.35}
.tpb__txt small{font:700 .72rem/1.2 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--slate-300)}
.tpb__txt b{color:#fff;font-size:1rem;font-weight:600}
.tpb__txt span{font-size:.86rem;color:var(--slate-300)}
.tpb__go{grid-column:2;display:inline-flex;align-items:center;gap:.4em;font-size:.9rem;font-weight:700;color:var(--mint)}
.tpb__go .ico{width:16px;height:16px;stroke-width:2.2}
.ftr__legal{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:16px 32px;margin-top:44px;padding-top:24px;border-top:1px solid var(--line-dark);font-size:.88rem;line-height:1.6}
.ftr__pay{display:flex;flex-wrap:wrap;gap:8px}
.ftr__pay span{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-dark);border-radius:8px;padding:6px 10px;color:var(--slate-200)}

/* barra d'ordine mobile */
.mcta{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(30,43,50,.97);border-top:1px solid var(--line-dark);color:#fff;--focus:var(--mint)}
.mcta>span{display:grid;gap:2px;font-size:.78rem;line-height:1.1;color:var(--slate-300)}
.mcta b{font-size:1.15rem;color:#fff}
/* lo spazio per la barra sta nel footer (che resta scuro fino in fondo) e solo dove la barra c'è */
@media (max-width:720px){.mcta{display:flex}.ftr--bar{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}}

/* assistente di chat (widget esterno): il suo pulsante e il suo fumetto stanno in basso
   a destra con gli stili scritti nell'attributo style, quindi si spostano solo con
   !important. Dove c'è la barra d'ordine (alta 58px più la zona sicura) vanno alzati,
   altrimenti ci finiscono sopra. Il pulsante non ha né id né classe: lo si riconosce
   dal pallino "online" che contiene, il fumetto dal suo ruolo di avviso. */
@media (max-width:720px){
  body:has(.mcta)>button:has(>[data-sc-online-dot]){bottom:calc(70px + env(safe-area-inset-bottom,0px))!important}
  body:has(.mcta)>div[role="status"][aria-live="polite"]{bottom:calc(100px + env(safe-area-inset-bottom,0px))!important}
}
/* finché c'è il banner dei cookie l'assistente resta nascosto, altrimenti ci finisce sopra:
   prima si risponde al banner. Iubenda lo toglie dal documento appena si sceglie, quindi
   subito dopo l'assistente ricompare da solo. */
body:has(#iubenda-cs-banner)>button:has(>[data-sc-online-dot]),
body:has(#iubenda-cs-banner)>div[role="status"][aria-live="polite"]{visibility:hidden!important;pointer-events:none!important}

/* guida video: finestra */
.lightbox{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:clamp(16px,4vw,48px);background:rgba(15,23,28,.88);--focus:var(--mint)}
.lightbox__box{position:relative;width:min(100%,980px)}
.lightbox__frame{aspect-ratio:16/9;background:#0f181d;border-radius:14px;overflow:hidden;box-shadow:0 40px 90px -30px #000}
.lightbox__frame iframe{display:block;width:100%;height:100%;border:0}
.lightbox__note{display:grid;gap:12px;align-content:center;justify-items:start;height:100%;padding:clamp(20px,5vw,56px);color:var(--slate-200)}
.lightbox__note b{font-size:1.3rem;color:#fff}
.lightbox__close{position:absolute;right:0;top:-46px;display:inline-flex;align-items:center;gap:8px;background:transparent;border:0;color:#fff;font-weight:700;cursor:pointer;padding:8px}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}

/* ==================================================================
   Componenti delle pagine interne
   ================================================================== */

/* salto al contenuto */
.skip{position:absolute;left:16px;top:-64px;z-index:200;background:#fff;color:var(--slate-900);padding:10px 16px;border-radius:8px;font-weight:700;text-decoration:none;box-shadow:var(--shadow);transition:top .16s ease}
.skip:focus{top:12px}

.wrap--narrow{max-width:900px}
.sec--tight{padding-block:clamp(40px,5.5vw,68px)}
.nav a[aria-current="page"]{color:#fff;border-color:var(--teal)}
.center{text-align:center}
.lead{font-size:clamp(1.08rem,1.4vw,1.2rem);line-height:1.6;color:var(--slate-500);max-width:46em}
.lead b,.lead strong{color:var(--slate-900);font-weight:600}
.muted{color:var(--slate-500)}
.nowrap{white-space:nowrap}

/* testata delle pagine interne */
.phero{--focus:var(--mint);position:relative;isolation:isolate;overflow:hidden;color:#fff;
  background:
    radial-gradient(rgba(255,255,255,.055) 1px,transparent 1.3px) 0 0/26px 26px,
    radial-gradient(1000px 520px at 92% -20%,#47616f 0%,rgba(71,97,111,0) 62%),
    linear-gradient(180deg,var(--slate-900),var(--slate-950));
  padding-block:clamp(28px,3.6vw,44px) clamp(48px,6.5vw,88px)}
.phero__grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(36px,5vw,76px);align-items:center}
.phero--simple .phero__grid{grid-template-columns:minmax(0,1fr)}
@media (max-width:1020px){.phero__grid{grid-template-columns:minmax(0,1fr)}}
.phero__copy{display:grid;gap:22px;justify-items:start}
.phero h1{font:700 clamp(2.1rem,4.3vw,3.35rem)/1.05 var(--font);letter-spacing:-.028em;text-wrap:balance;max-width:17em}
.phero h1 span{color:var(--mint)}
.phero .eyebrow{color:var(--mint)}
.phero--simple h1{max-width:20em}
.phero--simple .lede{max-width:44em}
.phero__facts{display:flex;flex-wrap:wrap;gap:8px 24px;width:100%;padding-top:20px;border-top:1px solid var(--line-dark);font-size:.94rem;color:var(--slate-200)}
.phero__facts li{display:inline-flex;align-items:baseline;gap:7px}
.phero__facts b{color:#fff;font-weight:700}
.phero .stage{margin:26px 0 40px}
@media (max-width:560px){.phero .stage{margin:4px 0 0}}

/* testata semplice: un grafico a candele appena accennato sulla destra, a tema con il sito */
.phero--simple::after{content:"";position:absolute;z-index:-1;right:max(16px,calc((100vw - 1180px) / 2));bottom:0;width:min(44vw,540px);height:82%;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 540 270' fill='none'%3E%3Cg stroke='%2366efd4' stroke-opacity='.13'%3E%3Cpath d='M0 230h540M0 170h540M0 110h540M0 50h540'/%3E%3C/g%3E%3Cg stroke='%2366efd4' stroke-opacity='.5' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M45 182v58M100 150v62M155 170v44M210 118v66M265 138v48M320 88v70M375 106v46M430 56v70M485 74v42'/%3E%3C/g%3E%3Cg fill='%2366efd4' fill-opacity='.3'%3E%3Crect x='36' y='196' width='18' height='30' rx='3'/%3E%3Crect x='91' y='164' width='18' height='34' rx='3'/%3E%3Crect x='201' y='132' width='18' height='38' rx='3'/%3E%3Crect x='311' y='102' width='18' height='42' rx='3'/%3E%3Crect x='421' y='70' width='18' height='42' rx='3'/%3E%3C/g%3E%3Cg fill='%23e2685a' fill-opacity='.32'%3E%3Crect x='146' y='180' width='18' height='24' rx='3'/%3E%3Crect x='256' y='148' width='18' height='28' rx='3'/%3E%3Crect x='366' y='116' width='18' height='26' rx='3'/%3E%3Crect x='476' y='84' width='18' height='22' rx='3'/%3E%3C/g%3E%3Cpath d='M20 236C90 206 150 214 210 166s100-24 160-62 90-30 150-66' stroke='%231abc9c' stroke-opacity='.7' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") right bottom/contain no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 42%);mask-image:linear-gradient(90deg,transparent 0,#000 42%)}
@media (max-width:1020px){.phero--simple::after{display:none}}
.phero--simple .phero__copy{max-width:46rem}

/* briciole di pane */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin-bottom:clamp(22px,3vw,36px);font-size:.88rem;line-height:1.3;color:var(--slate-300)}
.crumbs li{display:inline-flex;align-items:center;gap:8px}
.crumbs li+li::before{content:"/";color:var(--slate-500)}
.crumbs a{color:var(--slate-200);text-decoration:none;padding-block:8px;margin-block:-8px}   /* più area da toccare, stessa impaginazione */
.crumbs a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.crumbs [aria-current]{color:var(--slate-300)}

/* scheda dati nella testata dei prodotti */
.spec{display:grid;gap:18px;background:#fff;color:var(--slate-900);border-radius:20px;padding:clamp(22px,2.8vw,34px);box-shadow:0 34px 70px -34px rgba(0,0,0,.75);--focus:var(--teal-deep)}
.spec__top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 18px}
.spec__label{font:700 .76rem/1.2 var(--font);letter-spacing:.11em;text-transform:uppercase;color:var(--teal-ink)}
.spec__price{display:grid;gap:2px;font-size:.88rem;color:var(--slate-500);line-height:1.15}
.spec__price b{font:700 2.4rem/1 var(--font);letter-spacing:-.03em;color:var(--slate-900)}
.spec__price b small{font-size:.42em;font-weight:700;letter-spacing:0;margin-left:2px}
.spec dl{border-top:1px solid var(--line)}
.spec dl div{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:.98rem}
.spec dt{color:var(--slate-500)}
.spec dd{font-weight:700;text-align:right}
.spec .btn{width:100%}
.spec__note{font-size:.86rem;color:var(--slate-500);text-align:center;margin-top:-6px}

/* piani: pannelli a schede e griglie a 5 */
.planpanel[hidden]{display:none}
.plans--5{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.plans--5 .plan{padding:28px 16px 18px}
.plans--5 .plan__amount{font-size:2.3rem}
.plans--5 .plan__fit{min-height:5.8em}
@media (max-width:1240px){.plans--5{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 18px}.plans--5 .plan{padding:30px 22px 20px}.plans--5 .plan__fit{min-height:4.35em}}
@media (max-width:860px){.plans--5{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.plans--5{grid-template-columns:minmax(0,1fr)}}
.plan__was{display:grid;gap:4px;justify-items:start;margin-top:8px;font-size:.84rem;line-height:1.3;color:var(--slate-500);min-height:2.95em}
.plan__was s{margin-right:6px}
.plan__was em{font-style:normal;font-weight:700;color:var(--orange-ink);background:#fdf0e3;padding:1px 7px;border-radius:5px}

/* tabella di confronto dei piani */
.matrix{width:100%;min-width:760px;border-collapse:collapse;font-size:.97rem;line-height:1.4}
.matrix th,.matrix td{padding:14px 16px;border-bottom:1px solid var(--line);text-align:center;vertical-align:middle}
.matrix tr:last-child th,.matrix tr:last-child td{border-bottom:0}
.matrix thead th{background:var(--mist);font:700 .95rem/1.25 var(--font);color:var(--slate-900)}
.matrix thead th small{display:block;margin-top:3px;font-weight:600;font-size:.84rem;color:var(--slate-500)}
.matrix tbody th{text-align:left;font-weight:600;color:var(--slate-700);width:26%}
.matrix td{color:var(--slate-900)}
.matrix .is-featured{background:rgba(26,188,156,.075)}
.matrix thead .is-featured{background:rgba(26,188,156,.15);box-shadow:inset 0 3px 0 var(--teal);color:var(--teal-ink)}
.matrix .ico{width:20px;height:20px;stroke-width:2.6;vertical-align:-4px;color:var(--teal-ink)}
.matrix .is-no{color:var(--slate-300)}
.matrix .is-no .ico{color:var(--slate-300)}
.matrix tfoot td{padding:16px}
.matrix tfoot th{border-bottom:0}

/* due colonne: testo + elenco o immagine */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:start}
.split--center{align-items:center}
@media (max-width:900px){.split{grid-template-columns:minmax(0,1fr)}}
.split__main{display:grid;gap:18px;align-content:start;justify-items:start}
.split__main p{color:var(--slate-500)}
.split__main p b,.split__main p strong{color:var(--slate-900);font-weight:600}
.split .ticks{gap:14px}
.split .ticks b{display:block;color:var(--slate-900)}
.split .ticks li>span{color:var(--slate-500)}
.panel{display:grid;gap:16px;padding:clamp(24px,3vw,36px);border-radius:20px;background:var(--mist)}
.sec--mist .panel{background:#fff;border:1px solid var(--line)}
.panel h3{font-size:1.25rem}

/* schede generiche a tre colonne */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:980px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* su due colonne l'ultima scheda dispari occupa tutta la riga, invece di lasciare un vuoto */
@media (min-width:621px) and (max-width:980px){.cards>:last-child:nth-child(odd){grid-column:1/-1}}
@media (max-width:620px){.cards{grid-template-columns:minmax(0,1fr)}}
.cards--2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:760px){.cards--2{grid-template-columns:minmax(0,1fr)}}
.card{display:grid;gap:10px;align-content:start;padding:26px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.card:hover{border-color:var(--slate-300);box-shadow:var(--shadow);transform:translateY(-2px)}
.card h3{font-size:1.12rem;margin-top:4px}
.card p{font-size:.98rem;color:var(--slate-500)}
.card .tlink{margin-top:2px;font-size:.96rem}
a.card{text-decoration:none;color:inherit}

/* piattaforme con descrizione */
.platgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(24px,4vw,56px)}
@media (max-width:900px){.platgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.platgrid{grid-template-columns:minmax(0,1fr)}}
.platgrid li{display:grid;gap:6px;align-content:start;padding-block:22px 26px;border-top:1px solid var(--line)}
.platgrid b,.platgrid h3{font:700 1.08rem/1.3 var(--font);letter-spacing:0}
.platgrid a{color:var(--teal-ink);font-weight:600;text-underline-offset:3px}
.platgrid li[id],.notice[id]{scroll-margin-top:96px}
.platgrid span{color:var(--slate-500);font-size:.98rem}

/* avviso */
.notice{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;padding:18px 20px;border-radius:14px;background:var(--teal-50);color:var(--slate-900)}
.notice .ico{color:var(--teal-ink);margin-top:2px}
.notice p{color:var(--slate-700)}
.notice b{color:var(--slate-900)}
.notice--warn{background:#fdf0e3}
.notice--warn .ico{color:var(--orange-ink)}

/* muro delle recensioni */
.quotes--wall{display:block;columns:3 300px;column-gap:20px}
.quotes--wall .quote{break-inside:avoid;margin-bottom:20px;background:#fff}
.quote__tag{justify-self:start;font:700 .72rem/1 var(--font);letter-spacing:.09em;text-transform:uppercase;color:var(--teal-ink);background:var(--teal-50);padding:5px 8px;border-radius:6px}

/* testo lungo: chi siamo, SLA, pagine legali */
.prose{max-width:74ch;color:var(--slate-700)}
.prose>*+*{margin-top:1.05em}
.prose h2{font-size:clamp(1.45rem,2.3vw,1.85rem);line-height:1.15;color:var(--slate-900);margin-top:2.1em}
.prose h3{color:var(--slate-900);margin-top:1.7em}
.prose h4{font:700 1.02rem/1.3 var(--font);color:var(--slate-900);margin:1.5em 0 0}
.prose>:first-child{margin-top:0}
.prose ul{list-style:disc;padding-left:1.3em}
.prose ol{list-style:decimal;padding-left:1.4em}
.prose li+li{margin-top:.45em}
.prose a{color:var(--teal-ink);font-weight:600;text-underline-offset:3px;overflow-wrap:anywhere}
.prose strong,.prose b{color:var(--slate-900)}
.prose table{width:100%;border-collapse:collapse;font-size:.97rem}
.prose th,.prose td{padding:12px 14px;border:1px solid var(--line);text-align:left;vertical-align:top}
.prose thead th{background:var(--mist);color:var(--slate-900)}
.prose .scroll{margin-top:1.2em}
.prose--wide{max-width:none}
.legal{font-size:.98rem}
.legal h1,.legal h2,.legal h3,.legal h4,.legal h5{font:700 1.15rem/1.3 var(--font);letter-spacing:0;color:var(--slate-900);margin-top:1.8em}

/* pagina con colonna laterale */
.aside-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.42fr);gap:clamp(32px,5vw,72px);align-items:start}
@media (max-width:900px){.aside-layout{grid-template-columns:minmax(0,1fr)}}
.aside-card{display:grid;gap:14px;padding:24px;border-radius:16px;background:var(--mist);position:sticky;top:96px}
@media (max-width:900px){.aside-card{position:static}}
.aside-card h2,.aside-card h3{font:700 1.08rem/1.3 var(--font);letter-spacing:0}
.aside-card ul{display:grid;gap:12px}
.aside-card li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:start;font-size:.97rem;color:var(--slate-700)}
.aside-card li .ico{width:20px;height:20px;color:var(--teal-ink);margin-top:2px}
.aside-card li b{display:block;color:var(--slate-900)}
.aside-card a{color:var(--teal-ink);font-weight:600}
/* un pulsante resta un pulsante anche dentro i contenitori che colorano i link */
.aside-card a.btn--teal,.prose a.btn--teal,.platgrid a.btn--teal{color:var(--on-btn);font-weight:700;text-decoration:none}
.aside-card a.btn--line,.prose a.btn--line,.platgrid a.btn--line{color:var(--slate-900);font-weight:700;text-decoration:none}
.aside-card a.btn--line:hover,.prose a.btn--line:hover,.platgrid a.btn--line:hover{color:#fff}

/* modulo */
.form{display:grid;gap:18px;--focus:var(--teal-deep)}
.form__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:620px){.form__row{grid-template-columns:minmax(0,1fr)}}
.field{display:grid;gap:6px;align-content:start}
.field label{font-weight:600;font-size:.95rem;color:var(--slate-900)}
.field label small{font-weight:400;color:var(--slate-500)}
.field input,.field select,.field textarea{width:100%;font:inherit;line-height:1.4;padding:12px 14px;border:1.5px solid var(--line);border-radius:10px;background:#fff;color:var(--slate-900);transition:border-color .16s ease,box-shadow .16s ease}
.field select{-webkit-appearance:none;appearance:none;padding-right:40px;background-image:linear-gradient(45deg,transparent 50%,var(--slate-500) 50%),linear-gradient(135deg,var(--slate-500) 50%,transparent 50%);background-position:calc(100% - 20px) 52%,calc(100% - 14px) 52%;background-size:6px 6px;background-repeat:no-repeat}
.field textarea{min-height:170px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:#8b9aa3}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--slate-300)}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--teal-deep);box-shadow:0 0 0 3px rgba(26,188,156,.22)}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:var(--red)}
.field__err{font-size:.88rem;color:var(--red)}
.check{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;font-size:.96rem;color:var(--slate-700)}
.check input{width:18px;height:18px;margin-top:3px;accent-color:var(--teal-deep)}
.check a{color:var(--teal-ink);font-weight:600}
.check.has-error{color:var(--red)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form__msg{padding:16px 18px;border-radius:12px;font-weight:600}
.form__msg--ok{background:var(--teal-50);color:var(--teal-ink)}
.form__msg--ko{background:var(--red-50);color:var(--red)}
.form button[disabled]{opacity:.6;cursor:progress}
.form__note{display:flex;align-items:center;gap:7px;margin-top:14px;font-size:.84rem;line-height:1.4;color:var(--slate-500)}
.form__note .ico{flex:none;color:var(--teal-ink)}

/* tabelle semplici */
.tbl{width:100%;border-collapse:collapse;font-size:.98rem}
.tbl th,.tbl td{padding:14px 18px;border-bottom:1px solid var(--line);text-align:left}
.tbl thead th{background:var(--mist);font:700 .78rem/1.2 var(--font);letter-spacing:.09em;text-transform:uppercase;color:var(--slate-500)}
.tbl tbody th{font-weight:600}
.tbl tr:last-child th,.tbl tr:last-child td{border-bottom:0}
.tbl td b{color:var(--teal-ink)}

/* numeri in evidenza: vedi più sotto "fascia dei numeri" */
.figures{display:grid}

/* link alle altre pagine */
.related{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.related{grid-template-columns:minmax(0,1fr)}}
.rel{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;align-items:start;padding:22px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;text-decoration:none;color:inherit;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.rel:hover{border-color:var(--slate-300);box-shadow:var(--shadow);transform:translateY(-2px)}
.rel .ibox{grid-row:span 2}
.rel b{font-size:1.06rem;align-self:end}
.rel span:last-child{grid-column:2;font-size:.95rem;color:var(--slate-500)}

/* guida a passi numerati con immagine o nota */
.guide{display:grid;gap:0;counter-reset:gstep;max-width:60em}
.guide>li{position:relative;display:grid;gap:8px;padding:0 0 34px 66px;counter-increment:gstep}
.guide>li:last-child{padding-bottom:0}
.guide>li::before{content:counter(gstep);position:absolute;left:0;top:0;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--slate-900);color:#fff;font:700 1.08rem/1 var(--font)}
.guide>li::after{content:"";position:absolute;left:20.5px;top:50px;bottom:8px;width:1px;background:var(--slate-300)}
.guide>li:last-child::after{display:none}
.guide h3{padding-top:8px}
.guide p{color:var(--slate-500)}
.guide p b{color:var(--slate-900);font-weight:600}
.guide kbd{font:600 .88em/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:var(--mist);border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:3px 7px;color:var(--slate-900)}

/* mappa del sito */
.smap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px clamp(24px,4vw,56px)}
@media (max-width:760px){.smap{grid-template-columns:minmax(0,1fr)}}
.smap h2{font:700 .8rem/1.2 var(--font);letter-spacing:.11em;text-transform:uppercase;color:var(--teal-ink);margin-bottom:14px}
.smap li+li{margin-top:10px}
.smap a{color:var(--slate-900);font-weight:600;text-decoration:none}
.smap a:hover{color:var(--teal-ink);text-decoration:underline;text-underline-offset:3px}
.smap span{display:block;font-size:.92rem;color:var(--slate-500)}

/* 404 e pagine rimosse */
.e404{display:grid;gap:20px;justify-items:start;max-width:46em}
.e404__code{font:700 clamp(4rem,10vw,7rem)/0.9 var(--font);letter-spacing:-.05em;color:var(--mint)}

/* footer: nota sui prezzi */
.ftr__note{margin-top:18px;font-size:.86rem;line-height:1.5;color:var(--slate-300)}
.ftr__note a{text-decoration:underline;text-underline-offset:3px}

/* app per il Desktop remoto */
.apps{display:grid;grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr);gap:20px clamp(24px,4vw,56px);align-items:center;margin-top:clamp(36px,5vw,56px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--line)}
@media (max-width:900px){.apps{grid-template-columns:minmax(0,1fr)}}
.apps__head{display:grid;gap:8px}
.apps__head h3{font-size:1.25rem}
.apps__head p{color:var(--slate-500);font-size:.98rem;max-width:30em}
.apps__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:560px){.apps__list{grid-template-columns:minmax(0,1fr)}}
.apps__list a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 14px;align-items:center;height:100%;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:#fff;text-decoration:none;color:inherit;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.apps__list a:hover{border-color:var(--slate-300);box-shadow:var(--shadow);transform:translateY(-2px)}
.apps__list .ibox{width:42px;height:42px;border-radius:11px}
.apps__list .ibox .ico{width:22px;height:22px}
.apps__txt{display:grid;gap:1px;line-height:1.3}
.apps__txt b{font-size:1rem}
.apps__txt span{font-size:.87rem;color:var(--slate-500)}
.apps__go{display:inline-flex;align-items:center;gap:.35em;font-size:.86rem;font-weight:700;color:var(--teal-ink);white-space:nowrap}
.apps__go .ico{width:16px;height:16px;stroke-width:2.2}
.apps__list a:hover .ico--go{transform:translateX(3px)}
.guide a,.notice a{color:var(--teal-ink);font-weight:600;text-underline-offset:3px}

/* tabelle su schermi stretti: niente scorrimento orizzontale.
   I confronti (.cmp) diventano schede impilate, con l'intestazione della colonna
   ripetuta in ogni cella; la tabella dei piani (.matrix) mostra un piano alla
   volta, scelto con i pulsanti. Le classi is-stacked / is-picker le aggiunge
   js/site.js: senza JavaScript resta lo scorrimento. */
.mpick{display:none}
/* 900px e non meno: i confronti hanno una larghezza minima di 820px e fino a
   circa 890px di schermo (tablet in verticale) sarebbero ancora scorsi di lato. */
@media (max-width:900px){
  .scroll--stack{overflow:visible;border:0;border-radius:0}
  .cmp.is-stacked{display:block;min-width:0}
  .cmp.is-stacked thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .cmp.is-stacked tbody,.cmp.is-stacked tr,.cmp.is-stacked tbody th,.cmp.is-stacked td{display:block;width:auto}
  .cmp.is-stacked tr{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}
  .cmp.is-stacked tr+tr{margin-top:14px}
  .cmp.is-stacked tbody th{padding:15px 18px;background:var(--mist);border-bottom:1px solid var(--line);font-size:1.02rem;line-height:1.35}
  .cmp.is-stacked td{padding:12px 18px 13px 52px;border-bottom:1px solid var(--line)}
  .cmp.is-stacked td.no-mark{padding-left:18px}
  .cmp.is-stacked tr:last-child td:not(:last-child){border-bottom:1px solid var(--line)}
  .cmp.is-stacked tr td:last-child{border-bottom:0}
  .cmp.is-stacked td::before{content:attr(data-label);display:block;margin-bottom:2px;font:700 .7rem/1.35 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--slate-500)}
  .cmp.is-stacked td.cmp__win::before{color:var(--teal-ink)}
  .cmp.is-stacked .mark{left:18px;top:15px}

  .mpick{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
  .mpick button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.6em 1.05em;font:700 .92rem/1 var(--font);color:var(--slate-500);cursor:pointer}
  .mpick button[aria-pressed="true"]{background:var(--slate-900);border-color:var(--slate-900);color:#fff}
  .scroll--fit{overflow:visible}
  .matrix.is-picker{min-width:0}
  .matrix.is-picker th:not(:first-child),.matrix.is-picker td{display:none}
  .matrix.is-picker[data-col="1"] tr>:nth-child(2),
  .matrix.is-picker[data-col="2"] tr>:nth-child(3),
  .matrix.is-picker[data-col="3"] tr>:nth-child(4),
  .matrix.is-picker[data-col="4"] tr>:nth-child(5),
  .matrix.is-picker[data-col="5"] tr>:nth-child(6){display:table-cell}
  .matrix.is-picker tbody th{width:58%}
  .matrix.is-picker th,.matrix.is-picker td{padding:13px 14px}
}
/* tablet: le schede del confronto su due colonne */
@media (min-width:620px) and (max-width:900px){
  .cmp.is-stacked tbody{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
  .cmp.is-stacked tr+tr{margin-top:0}
}

/* fascia dei numeri: pannello scuro con i valori in evidenza */
.figures{grid-template-columns:repeat(4,minmax(0,1fr));border:0;border-radius:22px;overflow:hidden;color:#fff;box-shadow:var(--shadow);
  background:
    radial-gradient(rgba(255,255,255,.05) 1px,transparent 1.3px) 0 0/24px 24px,
    radial-gradient(720px 320px at 100% 0%,#47616f 0%,rgba(71,97,111,0) 70%),
    linear-gradient(160deg,var(--slate-800),var(--slate-950))}
.figures li,.figures li:first-child{display:grid;gap:10px;align-content:start;padding:clamp(24px,3vw,38px) clamp(20px,2.6vw,34px);border-left:1px solid var(--line-dark);border-top:0;font-size:.95rem;line-height:1.4;color:var(--slate-200)}
.figures li:first-child{border-left:0}
.figures .ibox{--ibox-bg:rgba(102,239,212,.13);--ibox-fg:var(--mint);width:42px;height:42px;border-radius:11px;margin-bottom:6px}
.figures .ibox .ico{width:22px;height:22px}
.figures b{font:700 clamp(2.1rem,3.6vw,3rem)/1 var(--font);letter-spacing:-.035em;color:var(--mint)}
@media (max-width:860px){
  .figures{grid-template-columns:repeat(2,minmax(0,1fr))}
  .figures li:nth-child(odd){border-left:0;padding-left:clamp(20px,2.6vw,34px)}
  .figures li:nth-child(n+3){border-top:1px solid var(--line-dark)}
}
.sec--tight+.sec--flush{padding-top:clamp(12px,2vw,24px)}

/* pagina Recensioni: due in evidenza, le altre in griglia */
.revs__lead{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:20px}
@media (max-width:900px){.revs__lead{grid-template-columns:minmax(0,1fr)}}
.quote--feature{position:relative;grid-template-rows:auto auto 1fr auto;padding:clamp(24px,3vw,38px);border-radius:20px;background:var(--mist);overflow:hidden}
.quote--feature::after{content:"”";position:absolute;right:22px;top:6px;font:700 7rem/1 Georgia,"Times New Roman",serif;color:rgba(42,58,67,.07);pointer-events:none}
.quote--feature blockquote{position:relative;font-size:1.04rem;line-height:1.62;color:var(--slate-700)}
.quote--feature figcaption img{width:54px;height:54px}
.quotes .quote--tagged{grid-template-rows:auto auto 1fr auto}
.revs__note{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;margin-top:28px;padding:20px 22px;border:1px dashed var(--slate-300);border-radius:16px;color:var(--slate-500);max-width:none}
.revs__note b{color:var(--slate-900)}
.revs__note a{color:var(--teal-ink);font-weight:600;text-underline-offset:3px}
.revs__note .ico{color:var(--teal-ink);margin-top:2px}

/* confronto a cinque colonne (guida Mac): le larghezze pensate per quattro
   schiacciavano l'ultima colonna */
.cmp--5{min-width:830px}
.cmp--5 tbody th{width:24%}
.cmp--5 td{width:19%;padding-left:46px}
.cmp--5 .mark{left:16px}
/* elenco di problemi, non di vantaggi: icone arancioni invece delle spunte verdi */
.ticks--warn .ico{color:var(--orange-ink)}

/* elenco delle piattaforme: un accento verde sul filetto di ogni voce */
.platgrid li{position:relative}
.platgrid li::before{content:"";position:absolute;left:0;top:-1px;width:36px;height:2px;border-radius:2px;background:var(--teal)}

/* telefono: pagina più corta. Icona a fianco del titolo nelle schede e nessuna
   altezza minima pensata per allineare le colonne del desktop. */
@media (max-width:620px){
  .plan__fit,.plans--5 .plan__fit,.plan__was{min-height:0}
  .plan__was:empty{display:none}
}
@media (max-width:600px){
  .feat:has(>.ibox),.uses li:has(>.ibox),.card:has(>.ibox){grid-template-columns:40px minmax(0,1fr);gap:6px 14px}
  .feat:has(>.ibox)>*,.uses li:has(>.ibox)>*,.card:has(>.ibox)>*{grid-column:2}
  .feat>.ibox,.uses li>.ibox,.card>.ibox{grid-column:1;grid-row:1/span 2;width:40px;height:40px;border-radius:11px}
  .feat>.ibox .ico,.uses li>.ibox .ico,.card>.ibox .ico{width:21px;height:21px}
  .feat:has(>.ibox) h3,.uses li:has(>.ibox) h3,.card:has(>.ibox) h3{margin-top:7px}
  .feat{padding-block:22px 24px}
  .uses li,.card{padding:20px}
}

/* il suggerimento della lingua compare solo se serve (lo decide js/site.js prima del primo disegno) */
.suggest[hidden]{display:none}

@media print{
  .suggest,.util,.hdr,.mcta,.lightbox,.final,.ftr__net,.hero__cta,.phero__cta{display:none!important}
  .hero,.phero,.ftr{background:#fff!important;color:#000!important}
  body{font-size:11pt}
}