/* Flux SEO — foglio di stile unico
   Direzione: consulente digitale moderno. Bianco + blu profondo + fasce navy.
   Tutto senza grazie. Nessun tema scuro automatico: il sito ha una faccia sola. */

:root{
  --sfondo:#ffffff;
  --carta:#ffffff;
  --carta2:#f3f6fc;
  --carta3:#e9eefa;
  --navy:#0d1530;
  --navy2:#141e42;
  --inchiostro:#0d1530;
  --tenue:#586182;
  --tenue2:#8b93ad;
  --bordo:#e2e8f4;
  --bordo-forte:#c8d2e8;
  --blu:#1f4fd8;
  --blu-scuro:#1639a6;
  --blu-velo:#eaf0fe;
  --rosso:#d33a3a;
  --rosso-velo:#fdeeee;
  --verde-ok:#0f8a5f;
  --ombra:0 1px 2px rgba(13,21,48,.04), 0 14px 38px -18px rgba(13,21,48,.22);
  --ombra-forte:0 2px 6px rgba(13,21,48,.06), 0 26px 60px -24px rgba(13,21,48,.32);
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --serif: var(--font);
  --col:1160px;
  --testo:720px;
  --r:16px;
  --r-g:22px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--sfondo);color:var(--inchiostro);
  font-family:var(--font);font-size:18px;line-height:1.62;
  -webkit-font-smoothing:antialiased;
}

/* ---------- impalcatura ---------- */
.wrap{width:100%;max-width:var(--col);margin:0 auto;padding:0 24px}
.testo{max-width:var(--testo)}
.sez{padding:clamp(52px,7vw,96px) 0}
.sez.velo{background:var(--carta2)}
.sez.scura{background:var(--navy);color:#fff}
.griglia2{display:grid;gap:clamp(20px,3vw,32px);grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.griglia3{display:grid;gap:clamp(16px,2.4vw,24px);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}

/* ---------- testo ---------- */
h1,h2,h3,h4{font-weight:800;line-height:1.12;letter-spacing:-.035em;margin:0 0 .5em;color:inherit}
h1{font-size:clamp(2.25rem,5.6vw,3.7rem);line-height:1.06}
h2{font-size:clamp(1.7rem,3.6vw,2.5rem)}
h3{font-size:clamp(1.15rem,2vw,1.38rem);font-weight:750;letter-spacing:-.02em}
h4{font-size:.76rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--tenue)}
p{margin:0 0 1.1em}
a{color:var(--blu);text-decoration:none;font-weight:600}
a:hover{text-decoration:underline;text-underline-offset:3px}
.testo a,p a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
strong{font-weight:700}
hr{border:0;border-top:1px solid var(--bordo);margin:2.4em 0}
code{font-family:var(--mono);font-size:.9em;background:var(--carta3);padding:2px 6px;border-radius:5px}

.occhiello{
  display:inline-block;background:var(--blu-velo);color:var(--blu);
  font-size:.75rem;font-weight:750;letter-spacing:.13em;text-transform:uppercase;
  padding:7px 15px;border-radius:30px;margin:0 0 1.3em;
}
.scura .occhiello{background:rgba(255,255,255,.12);color:#8fb2ff}
.guida{font-size:clamp(1.1rem,2vw,1.3rem);color:var(--tenue);line-height:1.55}
.scura .guida{color:#b6c0dd}
.nota{font-size:.86rem;color:var(--tenue2);line-height:1.55}
.scura .nota{color:#8e98bb}
.grande{font-size:1.1rem}

/* ---------- testata ---------- */
.testata{
  position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);
  backdrop-filter:saturate(1.6) blur(12px);border-bottom:1px solid var(--bordo);
}
@supports not (backdrop-filter:blur(1px)){.testata{background:#fff}}
.testata .wrap{display:flex;align-items:center;gap:20px;min-height:72px;flex-wrap:wrap}
.marchio{
  font-weight:800;font-size:1.32rem;letter-spacing:-.045em;
  color:var(--inchiostro);text-decoration:none;margin-right:auto;white-space:nowrap;
}
.marchio:hover{text-decoration:none}
.marchio i{font-style:normal;color:var(--blu)}
.menu{display:flex;align-items:center;gap:clamp(12px,1.7vw,25px);flex-wrap:wrap;margin-left:auto}
.menu a{color:var(--tenue);font-size:.94rem;font-weight:600;white-space:nowrap}
.menu a:hover{color:var(--inchiostro);text-decoration:none}
.menu a[aria-current="page"]{color:var(--inchiostro)}
.menu .bottone{
  background:var(--blu);color:#fff;border-radius:30px;padding:11px 22px;font-weight:700;font-size:.92rem;
  box-shadow:0 6px 18px -8px rgba(31,79,216,.7);
}
.menu .bottone:hover{background:var(--blu-scuro);color:#fff;text-decoration:none}

/* ---------- apertura ---------- */
.apertura{padding:clamp(52px,7.5vw,104px) 0 clamp(40px,5vw,64px)}
.apertura h1{max-width:15ch}
.apertura .guida{max-width:46ch}
.apertura.stretta h1{max-width:21ch}

/* ---------- bottoni ---------- */
.cta{
  display:inline-block;background:var(--blu);color:#fff;
  font-weight:700;font-size:1.02rem;padding:16px 30px;border-radius:30px;border:0;
  box-shadow:0 10px 26px -12px rgba(31,79,216,.85);
}
.cta:hover{background:var(--blu-scuro);color:#fff;text-decoration:none}
.cta.vuoto{background:transparent;color:var(--blu);border:1.5px solid var(--bordo-forte);box-shadow:none}
.cta.vuoto:hover{background:var(--blu-velo);color:var(--blu)}
.scura .cta{background:#fff;color:var(--navy);box-shadow:none}
.scura .cta:hover{background:#e7edfb;color:var(--navy)}
.scura .cta.vuoto{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.scura .cta.vuoto:hover{background:rgba(255,255,255,.1);color:#fff}
.bottoni{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:28px 0 0}

/* ---------- cifre ---------- */
.cifre{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  margin:36px 0 0;padding:0;list-style:none}
.cifre li{background:var(--carta);border:1px solid var(--bordo);border-radius:var(--r-g);padding:26px 24px}
.cifre b{
  display:block;font-size:clamp(2.3rem,5.2vw,3.1rem);font-weight:800;
  letter-spacing:-.05em;line-height:1;color:var(--blu);font-variant-numeric:tabular-nums;
}
.cifre li.male b{color:var(--rosso)}
.cifre span{display:block;font-size:.9rem;color:var(--tenue);margin-top:.65em;line-height:1.45}
.scura .cifre li{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14)}
.scura .cifre b{color:#7ea6ff}
.scura .cifre li.male b{color:#ff9b8f}
.scura .cifre span{color:#b6c0dd}

/* ---------- schede servizio con icona ---------- */
.servizi{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:38px 0 0}
.servizio{background:var(--carta);border:1px solid var(--bordo);border-radius:var(--r-g);
  padding:28px 26px;box-shadow:var(--ombra)}
.servizio .icona{
  width:50px;height:50px;border-radius:14px;background:var(--blu-velo);
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;
}
.servizio .icona svg{width:26px;height:26px;stroke:var(--blu);fill:none;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round}
.servizio h3{margin-bottom:.4em}
.servizio p{color:var(--tenue);font-size:.97rem;margin-bottom:0}
.scura .servizio{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14);box-shadow:none}
.scura .servizio .icona{background:rgba(255,255,255,.12)}
.scura .servizio .icona svg{stroke:#8fb2ff}
.scura .servizio p{color:#b6c0dd}

/* ---------- blocco persona ---------- */
.persona{display:grid;gap:clamp(24px,4vw,48px);align-items:center;
  grid-template-columns:minmax(200px,250px) 1fr}
.persona .ritratto{width:100%;max-width:250px;aspect-ratio:1/1;border-radius:var(--r-g);object-fit:cover;
  background:var(--carta3);display:block}
.persona .segnaposto{
  width:100%;aspect-ratio:1/1;border-radius:var(--r-g);background:var(--carta3);
  border:2px dashed var(--bordo-forte);display:flex;align-items:center;justify-content:center;
  text-align:center;padding:24px;color:var(--tenue2);font-size:.88rem;line-height:1.5;
}
@media (max-width:700px){.persona{grid-template-columns:1fr}.persona .ritratto,.persona .segnaposto{max-width:260px}}

/* ---------- riquadri ---------- */
.riq{background:var(--carta);border:1px solid var(--bordo);border-radius:var(--r-g);
  padding:clamp(24px,3vw,34px);margin:30px 0;box-shadow:var(--ombra)}
.riq>:last-child{margin-bottom:0}
.riq h3{margin-top:0}
.riq.rosso{background:var(--rosso-velo);border-color:#f2c4c4;box-shadow:none}
.riq.rosso h3{color:var(--rosso)}
.riq.verde{background:var(--blu-velo);border-color:#c3d6fb;box-shadow:none}
.riq.piatto{box-shadow:none;background:var(--carta2)}
.riq.stretto{padding:22px 24px}
.scura .riq{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14);box-shadow:none}

.citazione{font-size:clamp(1.2rem,2.4vw,1.5rem);line-height:1.4;font-weight:600;
  border-left:4px solid var(--blu);padding:4px 0 4px 24px;margin:32px 0}
.citazione cite{display:block;font-size:.85rem;font-style:normal;font-weight:500;color:var(--tenue);margin-top:.9em}

/* ---------- tabelle ---------- */
.tab{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:30px 0;
  border:1px solid var(--bordo);border-radius:var(--r);background:var(--carta)}
table{border-collapse:collapse;width:100%;min-width:440px;font-size:.95rem}
caption{text-align:left;color:var(--tenue2);font-size:.84rem;padding:14px 18px 0;caption-side:bottom;line-height:1.5}
th,td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--bordo);vertical-align:top}
thead th{font-size:.73rem;letter-spacing:.09em;text-transform:uppercase;color:var(--tenue);
  font-weight:750;background:var(--carta2)}
tbody tr:last-child td{border-bottom:0}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
td.forte{font-weight:700}
td.male{color:var(--rosso);font-weight:700}
td.bene{color:var(--verde-ok);font-weight:700}
tbody tr.spicca{background:var(--blu-velo)}
.barra{display:block;height:8px;border-radius:5px;background:var(--blu);min-width:3px}
.barra.male{background:var(--rosso)}

/* ---------- elenchi ---------- */
ul.segno{list-style:none;padding:0;margin:1.3em 0}
ul.segno li{padding-left:2em;position:relative;margin-bottom:.8em}
ul.segno li::before{content:"";position:absolute;left:0;top:.62em;width:11px;height:2px;
  border-radius:2px;background:var(--blu)}
ul.segno.no li::before{content:"\00d7";background:none;width:auto;height:auto;top:0;
  color:var(--rosso);font-size:1.2em;font-weight:700;line-height:1.35}
ul.segno.si li::before{content:"\2713";background:none;width:auto;height:auto;top:0;
  color:var(--verde-ok);font-weight:700;line-height:1.45}

ol.passi{list-style:none;counter-reset:p;padding:0;margin:2.2em 0}
ol.passi li{counter-increment:p;position:relative;padding-left:66px;margin-bottom:2em}
ol.passi li::before{
  content:counter(p);position:absolute;left:0;top:-3px;width:42px;height:42px;
  display:flex;align-items:center;justify-content:center;border-radius:13px;
  background:var(--blu);color:#fff;font-weight:800;font-size:1.05rem;
}
ol.passi h3{margin-bottom:.35em}
ol.passi p:last-child{margin-bottom:0}
.scura ol.passi li::before{background:#fff;color:var(--navy)}

/* ---------- schede prezzo ---------- */
.prezzi{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));margin:38px 0}
.prezzi>article{background:var(--carta);border:1px solid var(--bordo);border-radius:var(--r-g);
  padding:clamp(26px,3vw,36px);display:flex;flex-direction:column;box-shadow:var(--ombra)}
.prezzi>article.spicca{border:2px solid var(--blu);box-shadow:var(--ombra-forte)}
.etichetta{display:inline-block;background:var(--blu);color:#fff;font-size:.7rem;font-weight:750;
  letter-spacing:.11em;text-transform:uppercase;padding:6px 13px;border-radius:30px;margin-bottom:16px;align-self:flex-start}
.tariffa{font-size:clamp(2.5rem,5vw,3.1rem);font-weight:800;letter-spacing:-.05em;
  line-height:1;color:var(--inchiostro);margin:.1em 0 .15em}
.tariffa small{display:block;font-size:.85rem;font-weight:600;color:var(--tenue);letter-spacing:0;margin-top:.75em;line-height:1.4}
.prezzi ul{margin:1.5em 0 0;padding-left:1.2em}
.prezzi li{margin-bottom:.75em}
.prezzi .coda{margin-top:auto;padding-top:1.5em}

/* ---------- schede guida ---------- */
.schede{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:36px 0}
.scheda{background:var(--carta);border:1px solid var(--bordo);border-radius:var(--r-g);padding:28px;
  box-shadow:var(--ombra);display:flex;flex-direction:column}
.scheda h3{margin-bottom:.4em}
.scheda h3 a{color:var(--inchiostro);text-decoration:none}
.scheda h3 a:hover{color:var(--blu);text-decoration:none}
.scheda p{color:var(--tenue);font-size:.96rem}
.scheda .coda{margin-top:auto;padding-top:.9em;font-size:.9rem;font-weight:700}

/* ---------- indice ---------- */
.indice{background:var(--carta2);border:1px solid var(--bordo);border-radius:var(--r);padding:24px 28px;margin:34px 0}
.indice h4{margin-bottom:1em}
.indice ol{margin:0;padding-left:1.3em}
.indice li{margin-bottom:.5em}
.indice a{color:var(--inchiostro);text-decoration:none;font-weight:600}
.indice a:hover{color:var(--blu)}

/* ---------- richiamo finale ---------- */
.richiamo{background:var(--navy);color:#fff}
.richiamo h2{max-width:20ch}
.richiamo p{color:#c2cbe6}
.richiamo strong{color:#fff}

/* ---------- piede ---------- */
.piede{background:var(--carta2);border-top:1px solid var(--bordo);padding:56px 0 42px;font-size:.9rem;color:var(--tenue)}
.piede .colonne{display:grid;gap:32px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin-bottom:38px}
.piede h4{margin-bottom:1.1em}
.piede ul{list-style:none;padding:0;margin:0}
.piede li{margin-bottom:.6em}
.piede a{color:var(--tenue);font-weight:500}
.piede a:hover{color:var(--blu)}
.piede .legale{border-top:1px solid var(--bordo);padding-top:26px;font-size:.84rem;color:var(--tenue2);line-height:1.7}
.piede .legale p{margin:0 0 .4em}

/* ---------- dettagli ---------- */
details{border:1px solid var(--bordo);border-radius:var(--r);padding:18px 22px;margin:14px 0;background:var(--carta)}
details[open]{padding-bottom:8px}
summary{cursor:pointer;font-weight:700;list-style:none;color:var(--inchiostro)}
summary::-webkit-details-marker{display:none}
summary::before{content:"+";display:inline-block;width:1.3em;color:var(--blu);font-weight:800}
details[open] summary::before{content:"\2212"}

.tornasu{font-size:.9rem}
:target{scroll-margin-top:92px}
::selection{background:var(--blu);color:#fff}

@media (max-width:640px){
  body{font-size:17px}
  .testata .wrap{min-height:60px;padding-top:10px;padding-bottom:10px}
  .marchio{font-size:1.16rem}
  .menu{gap:15px;width:100%;order:3;overflow-x:auto;padding-bottom:3px}
  .menu a{font-size:.88rem}
  .menu .bottone{padding:9px 17px}
  ol.passi li{padding-left:54px}
  ol.passi li::before{width:36px;height:36px;font-size:.95rem;border-radius:11px}
}

@media print{
  .testata,.menu,.richiamo,.cta{display:none}
  body{background:#fff;color:#000;font-size:11pt}
  .sez{padding:18px 0}
}

/* ============================================================
   HERO grande — fascia scura a tutta larghezza con illustrazione
   ============================================================ */
.hero{
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(1100px 520px at 82% 18%, rgba(56,110,255,.42), transparent 62%),
    radial-gradient(760px 460px at 8% 96%, rgba(0,196,167,.20), transparent 60%),
    linear-gradient(160deg,#0b1230 0%,#0d1730 46%,#101c3f 100%);
  padding:clamp(44px,6vw,88px) 0 clamp(52px,7vw,96px);
}
.hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,.10) 1px, transparent 1px);
  background-size:26px 26px;
  -webkit-mask-image:linear-gradient(to bottom, #000, transparent 72%);
  mask-image:linear-gradient(to bottom, #000, transparent 72%);
}
.hero .wrap{position:relative;z-index:2}
.hero-griglia{display:grid;gap:clamp(32px,4.5vw,64px);align-items:center;
  grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr)}
@media (max-width:900px){.hero-griglia{grid-template-columns:1fr}}

.hero h1{font-size:clamp(2.3rem,5.4vw,3.75rem);letter-spacing:-.04em;max-width:15ch;color:#fff}
.hero .guida{color:#b9c4e4;max-width:44ch}
.hero .occhiello{background:rgba(255,255,255,.13);color:#a9c4ff}
.hero .cta{background:#fff;color:#0d1530;box-shadow:0 14px 34px -14px rgba(0,0,0,.7)}
.hero .cta:hover{background:#e6ecfb;color:#0d1530}
.hero .cta.vuoto{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.32)}
.hero .cta.vuoto:hover{background:rgba(255,255,255,.1);color:#fff}

/* riga di fiducia sotto i bottoni */
.fiducia{display:flex;flex-wrap:wrap;gap:10px 26px;margin:32px 0 0;padding:0;list-style:none}
.fiducia li{display:flex;align-items:center;gap:9px;font-size:.9rem;color:#aebbdd;font-weight:600}
.fiducia svg{width:17px;height:17px;stroke:#5ce0b0;fill:none;stroke-width:2.4;
  stroke-linecap:round;stroke-linejoin:round;flex:none}

/* illustrazione */
.mockup{position:relative;display:flex;justify-content:center}
.mockup svg{position:relative;z-index:1}
.mockup svg{width:100%;max-width:340px;height:auto;
  filter:drop-shadow(0 40px 70px rgba(0,0,0,.55))}
.pillola{
  position:absolute;z-index:3;background:#fff;color:#0d1530;border-radius:14px;
  padding:11px 15px;box-shadow:0 20px 44px -16px rgba(0,0,0,.6);
  font-size:.82rem;font-weight:700;line-height:1.35;max-width:190px;
}
.pillola b{display:block;font-size:1.35rem;letter-spacing:-.03em;line-height:1.1}
.pillola.male b{color:var(--rosso)}
.pillola.bene b{color:var(--verde-ok)}
.pillola.p1{top:6%;left:-6%}
.pillola.p2{bottom:9%;right:-5%}
@media (max-width:1080px){.pillola.p1{left:-2%}.pillola.p2{right:-1%}}
@media (max-width:520px){.pillola{display:none}}

/* ============================================================
   Aperture delle pagine interne — non più bianco piatto
   ============================================================ */
.apertura{
  position:relative;
  background:
    radial-gradient(760px 380px at 88% -10%, rgba(31,79,216,.13), transparent 64%),
    linear-gradient(180deg,#f2f6ff 0%,#ffffff 100%);
  border-bottom:1px solid var(--bordo);
}

/* ============================================================
   Confronto visivo di due risultati Google
   ============================================================ */
.serp{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));margin:36px 0}
.serp-card{background:#fff;border:1px solid var(--bordo);border-radius:var(--r-g);
  padding:26px;box-shadow:var(--ombra);position:relative}
.serp-card.ko{border-color:#f0c2c2}
.serp-card.ok{border-color:#bcd2fb}
.serp-tag{display:inline-block;font-size:.68rem;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;padding:5px 11px;border-radius:20px;margin-bottom:18px}
.serp-card.ko .serp-tag{background:var(--rosso-velo);color:var(--rosso)}
.serp-card.ok .serp-tag{background:var(--blu-velo);color:var(--blu)}
.serp-url{font-size:.82rem;color:#4d6b3f;margin:0 0 4px}
.serp-titolo{font-size:1.18rem;line-height:1.3;font-weight:600;margin:0 0 8px;letter-spacing:-.01em}
.serp-card.ko .serp-titolo{color:#7a1f1f}
.serp-card.ok .serp-titolo{color:#1a0dab}
.serp-desc{font-size:.9rem;color:var(--tenue);margin:0}
.serp-nota{margin:18px 0 0;padding-top:16px;border-top:1px dashed var(--bordo);
  font-size:.86rem;font-weight:700}
.serp-card.ko .serp-nota{color:var(--rosso)}
.serp-card.ok .serp-nota{color:var(--verde-ok)}

/* ============================================================
   Sezioni con sottopagine — briciole e navigazione interna
   ============================================================ */
.briciole{font-size:.85rem;color:var(--tenue2);margin:0 0 1.6em;display:flex;flex-wrap:wrap;gap:.5em}
.briciole a{color:var(--tenue);font-weight:600}
.briciole span[aria-current]{color:var(--inchiostro);font-weight:700}
.hero .briciole{color:#8e98bb}
.hero .briciole a{color:#b9c4e4}
.hero .briciole span[aria-current]{color:#fff}

.sottopagine{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:34px 0 0;padding:0;list-style:none}
.sottopagine li{margin:0}
.sottopagine a{
  display:block;height:100%;background:var(--carta);border:1px solid var(--bordo);
  border-radius:var(--r-g);padding:24px;box-shadow:var(--ombra);text-decoration:none;
  transition:border-color .15s, transform .15s;
}
.sottopagine a:hover{border-color:var(--blu);transform:translateY(-2px);text-decoration:none}
.sottopagine a[aria-current]{border:2px solid var(--blu);background:var(--blu-velo)}
.sottopagine .num{display:block;font-size:.72rem;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--blu);margin-bottom:.8em}
.sottopagine strong{display:block;font-size:1.1rem;font-weight:750;letter-spacing:-.02em;
  color:var(--inchiostro);margin-bottom:.45em;line-height:1.25}
.sottopagine span.d{display:block;font-size:.92rem;color:var(--tenue);font-weight:400;line-height:1.5}
.scura .sottopagine a{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14);box-shadow:none}
.scura .sottopagine a:hover{border-color:#8fb2ff}
.scura .sottopagine strong{color:#fff}
.scura .sottopagine span.d{color:#b6c0dd}
.scura .sottopagine .num{color:#8fb2ff}

/* barra di navigazione fra le sottopagine, in fondo */
.avanti-indietro{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;
  margin:44px 0 0;padding-top:26px;border-top:1px solid var(--bordo)}
.avanti-indietro a{font-weight:700;font-size:.96rem}

/* ============================================================
   Blocchi su sfondo BIANCO dentro le fasce scure.
   Senza queste regole il testo resta bianco e sparisce.
   ============================================================ */
.scura .tab,
.scura .prezzi > article,
.scura .scheda,
.scura .indice{color:var(--inchiostro)}

.scura .tab table,
.scura .tab td,
.scura .tab th,
.scura .prezzi > article,
.scura .prezzi > article h3,
.scura .prezzi > article li,
.scura .scheda h3,
.scura .scheda h3 a,
.scura .indice a{color:var(--inchiostro)}

.scura .tab thead th{color:var(--tenue);background:var(--carta2)}
.scura .tab caption{color:var(--tenue2)}
.scura .tab td.male{color:var(--rosso)}
.scura .tab td.bene{color:var(--verde-ok)}
.scura .tab tbody tr.spicca{background:var(--blu-velo)}
.scura .scheda p,
.scura .prezzi > article .nota{color:var(--tenue)}
.scura .tab a,
.scura .scheda a,
.scura .indice a:hover{color:var(--blu)}

/* ============================================================
   Menu a panino sul telefono — senza JavaScript, solo CSS
   ============================================================ */
.menu-int{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.menu-btn{display:none}

@media (max-width:760px){
  .testata .wrap{flex-wrap:wrap;min-height:58px;gap:12px}
  .marchio{margin-right:auto}

  .menu-btn{
    display:flex;flex-direction:column;justify-content:center;gap:5px;
    width:44px;height:44px;padding:10px;cursor:pointer;border-radius:10px;
    border:1px solid var(--bordo);background:var(--carta);flex:none;
  }
  .menu-btn span{display:block;height:2px;border-radius:2px;background:var(--inchiostro);transition:transform .18s, opacity .18s}
  .menu-int:checked ~ .menu-btn{background:var(--blu-velo);border-color:var(--blu)}
  .menu-int:checked ~ .menu-btn span{background:var(--blu)}
  .menu-int:checked ~ .menu-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .menu-int:checked ~ .menu-btn span:nth-child(2){opacity:0}
  .menu-int:checked ~ .menu-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .menu{
    display:none;order:3;width:100%;flex-direction:column;align-items:stretch;
    gap:0;margin:0;padding:6px 0 14px;border-top:1px solid var(--bordo);
  }
  .menu-int:checked ~ .menu{display:flex}
  .menu a{
    font-size:1.02rem;padding:13px 2px;border-bottom:1px solid var(--bordo);
    color:var(--inchiostro);
  }
  .menu a:last-of-type{border-bottom:0}
  .menu a[aria-current="page"]{color:var(--blu)}
  .menu .bottone{
    margin-top:12px;text-align:center;padding:14px 20px;border-bottom:0;
    color:#fff;font-size:1rem;
  }
}
