/*
Theme Name: Kadence Child Semplifi
Description: Tema figlio di Kadence per Semplifi. Qui dentro va il CSS del sito.
Author: Semplifi
Template: kadence
Version: 1.2
*/
/* ==========================================================================
   Semplifi, componenti del tema figlio
   Da accodare a wp-content/themes/kadence-child/style.css
   Palette, font, bottoni e larghezze stanno nel Customizer di Kadence.
   Qui c'e' solo cio' che il Customizer non copre.
   Se cambi un colore nel Customizer, allinea la variabile qui sotto.
   ========================================================================== */

:root{
  --sf-navy:#14273D;
  --sf-ink:#0F1E2E;
  --sf-text:#26333F;
  --sf-brand:#123E78;
  --sf-paper:#F4F6FA;
  --sf-surface:#FFFFFF;
  --sf-line:#E0E6EF;
  --sf-line-strong:#C9D2DF;
  --sf-muted:#56657A;
  --sf-accent:#E29A2B;
  --sf-accent-700:#C9851C;
  --sf-accent-soft:#FBEED6;
  --sf-azzurro:#E2EAF4;
  --sf-on-navy:#C6D3E5;
  --sf-on-navy-dim:#9FB2CB;
  --sf-serif:'Lora', Georgia, 'Times New Roman', serif;
  --sf-sans:'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --sf-wrap:740px;
}

/* Firma: linea ambra da 3px in cima a ogni pagina */
body::before{
  content:"";
  position:fixed;
  top:0; left:0; right:0;
  height:3px;
  background:var(--sf-accent);
  z-index:9999;
}
body.admin-bar::before{top:32px;}
/* Sotto i 600px la barra di amministrazione non e' piu' fissa ma scorre
   con la pagina, quindi lo scarto va tolto o la linea resta staccata. */
@media (max-width:782px){ body.admin-bar::before{top:46px;} }
@media (max-width:600px){ body.admin-bar::before{top:0;} }

::selection{background:var(--sf-accent-soft);}
:focus-visible{outline:2px solid var(--sf-accent);outline-offset:3px;border-radius:2px;}

/* --------------------------------------------------------------------------
   Logo testuale
   Il titolo del sito e' "Semplifi", il punto ambra lo aggiunge il CSS.
   Niente file immagine: resta nitido ovunque e la legatura fi la fa il font.
   Selettori da riverificare sull'header reale al passo 7.
   -------------------------------------------------------------------------- */

/* Font, peso, dimensione e colore del titolo stanno nel Customizer, in
   Denominazione del sito: Kadence scrive quelle regole inline dopo questo
   foglio, quindi qui perderebbero. Il punto ambra non lo copre nessuno.
   Specificita' alzata a .site-header .site-branding per stare al sicuro. */
.site-title{
  letter-spacing:-.01em;
  font-feature-settings:"liga" 1;
}
.site-header .site-branding .site-title::after{
  content:".";
  color:var(--sf-accent);
}
/* Il Customizer scrive .site-branding .site-title{color:palette3;font-weight:700}
   in uno <style> stampato dopo i fogli esterni, quindi qui serve l'id
   #masthead per alzare la specificita' e tenere il logo bianco sul navy.
   La famiglia il Customizer non la scrive proprio: senza questa riga il
   titolo del sito cade sul font del corpo, cioe' Inter, e il logo
   dell'header esce con un carattere diverso da quello del footer. */
#masthead .site-branding .site-title{
  font-family:var(--sf-serif);
  color:#fff;
  font-weight:600;
}

/* --------------------------------------------------------------------------
   Tipografia del contenuto
   Si aggancia a .entry-content di Kadence: i blocchi montati la ereditano.
   -------------------------------------------------------------------------- */

.entry-content p{
  font-size:1.13rem;
  line-height:1.78;
  margin:0 0 1.35em;
  color:var(--sf-text);
}
.entry-content h2{
  font-family:var(--sf-serif);
  font-weight:600;
  color:var(--sf-ink);
  font-size:clamp(1.5rem,2.7vw,1.95rem);
  line-height:1.2;
  letter-spacing:-.01em;
  margin:1.9em 0 .55em;
}
.entry-content h3{
  font-family:var(--sf-serif);
  font-weight:600;
  color:var(--sf-ink);
  font-size:1.32rem;
  line-height:1.22;
  letter-spacing:-.01em;
  margin:1.6em 0 .5em;
}
.entry-content strong{font-weight:600;color:var(--sf-ink);}
.entry-content a{
  color:var(--sf-brand);
  text-decoration:underline;
  text-underline-offset:2px;
  text-decoration-thickness:1px;
}
.entry-content a:hover{color:var(--sf-ink);}

/* Elenchi puntati con pallino ambra */
.entry-content ul:not(.wp-block-list--plain){margin:0 0 1.5em;padding:0;list-style:none;}
.entry-content ul:not(.wp-block-list--plain) li{
  position:relative;
  padding-left:26px;
  margin-bottom:.6em;
  font-size:1.1rem;
  line-height:1.6;
}
.entry-content ul:not(.wp-block-list--plain) li::before{
  content:"";
  position:absolute;
  left:4px; top:.62em;
  width:7px; height:7px;
  border-radius:50%;
  background:var(--sf-accent);
}

/* Colonna di lettura stretta per articoli e pagine di testo */
.sf-wrap{max-width:var(--sf-wrap);margin-inline:auto;}

/* --------------------------------------------------------------------------
   Elementi editoriali
   -------------------------------------------------------------------------- */

.sf-eyebrow{
  font-family:var(--sf-sans);
  font-size:.74rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--sf-brand);
  margin:0 0 14px;
}

.sf-breadcrumb{
  font-family:var(--sf-sans);
  font-size:.74rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--sf-brand);
  margin:0 0 22px;
}
.sf-breadcrumb a{text-decoration:none;transition:opacity .15s ease;}
.sf-breadcrumb a:hover{opacity:.6;}

.sf-standfirst{
  font-family:var(--sf-serif);
  font-size:clamp(1.18rem,2vw,1.4rem);
  line-height:1.5;
  color:#3A4855;
  margin:22px 0 0;
  max-width:60ch;
}

.sf-byline{
  display:flex;
  flex-wrap:wrap;
  gap:6px 16px;
  align-items:center;
  margin-top:30px;
  padding:18px 0;
  border-top:1px solid var(--sf-line);
  border-bottom:1px solid var(--sf-line);
  font-family:var(--sf-sans);
  font-size:.86rem;
  color:var(--sf-muted);
}
.sf-byline strong{color:var(--sf-ink);font-weight:600;}

.sf-tag{
  display:inline-block;
  font-family:var(--sf-sans);
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  background:var(--sf-accent-soft);
  color:var(--sf-accent-700);
  padding:5px 10px;
  border-radius:4px;
}

/* Callout ambra: "Da dove iniziare", "In sintesi" */
.sf-callout{
  background:var(--sf-accent-soft);
  border-left:3px solid var(--sf-accent);
  border-radius:0 8px 8px 0;
  padding:24px 26px;
  margin:2.2em 0;
}
.sf-callout .sf-label{
  font-family:var(--sf-sans);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--sf-accent-700);
  margin:0 0 12px;
}
.sf-callout p{font-size:1.04rem;line-height:1.55;color:var(--sf-ink);margin:0;}
.sf-callout ul{margin:0;padding:0;list-style:none;}
.sf-callout ul li{
  position:relative;
  padding-left:22px;
  margin-bottom:.5em;
  font-size:1.02rem;
  line-height:1.55;
  color:var(--sf-ink);
}
.sf-callout ul li:last-child{margin-bottom:0;}
.sf-callout ul li::before{
  content:"";
  position:absolute;
  left:2px; top:.6em;
  width:6px; height:6px;
  border-radius:50%;
  background:var(--sf-accent-700);
}

/* Nota blu, neutra */
.sf-notice{
  background:var(--sf-surface);
  border:1px solid var(--sf-line);
  border-left:3px solid var(--sf-brand);
  border-radius:0 10px 10px 0;
  padding:24px 26px;
  margin:1.8em 0;
}
.sf-notice p{font-size:1.05rem;line-height:1.6;margin:0;color:var(--sf-ink);}

/* Box fonti con data di verifica, segnale EEAT */
.sf-fonti{
  margin:2.4em 0;
  background:var(--sf-surface);
  border:1px solid var(--sf-line);
  border-radius:10px;
  padding:24px 26px;
}
.sf-fonti .sf-label{
  font-family:var(--sf-sans);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--sf-muted);
  margin:0 0 14px;
}
.sf-fonti ol{margin:0;padding-left:20px;}
.sf-fonti li{font-size:.95rem;line-height:1.55;margin-bottom:10px;color:var(--sf-text);}
.sf-fonti li:last-child{margin-bottom:0;}
.sf-fonti .sf-verifica{font-size:.82rem;color:var(--sf-muted);margin:16px 0 0;}

/* Elenco di dati secchi, filetto ambra a sinistra */
.sf-facts{border-left:2px solid var(--sf-accent);padding-left:24px;margin:0 0 1.6em;}
.sf-facts ul{margin:0;padding:0;list-style:none;}
.sf-facts li{
  list-style:none;
  padding:12px 0;
  border-bottom:1px solid var(--sf-line);
  font-family:var(--sf-sans);
  font-size:.82rem;
  letter-spacing:.03em;
  color:var(--sf-ink);
}
.sf-facts li:last-child{border-bottom:none;}
.sf-facts li::before{display:none;}

/* Blocco autore, chi siamo */
.sf-author{
  background:var(--sf-surface);
  border:1px solid var(--sf-line);
  border-radius:12px;
  padding:26px;
  margin:1.8em 0;
}
.sf-author .sf-role-label{
  font-family:var(--sf-sans);
  font-size:.7rem;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--sf-accent-700);
  margin:0 0 12px;
}
.sf-author .sf-name{font-family:var(--sf-serif);font-weight:600;font-size:1.35rem;color:var(--sf-ink);margin:0;}
.sf-author .sf-role{font-size:.92rem;color:var(--sf-muted);margin:2px 0 14px;}
.sf-author .sf-bio{font-size:1rem;line-height:1.6;color:var(--sf-text);margin:0;}

.sf-dati{
  font-size:.92rem;
  color:var(--sf-muted);
  border-top:1px solid var(--sf-line);
  padding-top:22px;
  margin-top:1.6em;
}

.sf-endnote{margin-top:2.4em;padding-top:1.7em;border-top:1px solid var(--sf-line);}
.sf-endnote p{font-size:.95rem;color:var(--sf-muted);line-height:1.6;margin:0 0 .8em;}

.sf-updated{font-family:var(--sf-sans);font-size:.82rem;color:var(--sf-muted);}

/* --------------------------------------------------------------------------
   FAQ a fisarmonica, blocco Dettagli nativo di Gutenberg
   -------------------------------------------------------------------------- */

.sf-faq{margin-top:2.6em;border-top:1px solid var(--sf-line);padding-top:1.8em;}
.sf-faq details,
.sf-faq .wp-block-details{
  border-bottom:1px solid var(--sf-line);
  background:none;
  padding:0;
}
.sf-faq summary{
  font-family:var(--sf-serif);
  font-weight:600;
  font-size:1.15rem;
  color:var(--sf-ink);
  cursor:pointer;
  padding:16px 0;
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
}
.sf-faq summary::-webkit-details-marker{display:none;}
.sf-faq summary::after{
  content:"+";
  color:var(--sf-accent-700);
  font-family:var(--sf-sans);
  font-weight:600;
  font-size:1.4rem;
  transition:transform .18s ease;
}
.sf-faq details[open] summary::after{transform:rotate(45deg);}
.sf-faq details p{margin:0 0 18px;font-size:1.05rem;line-height:1.7;}

/* --------------------------------------------------------------------------
   Schede
   -------------------------------------------------------------------------- */

.sf-cardgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.sf-cardgrid.sf-cols-4{grid-template-columns:repeat(4,1fr);}

.sf-card{
  background:var(--sf-surface);
  border:1px solid var(--sf-line);
  border-radius:10px;
  padding:28px 24px;
  display:flex;
  flex-direction:column;
  min-height:236px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.sf-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px -28px rgba(15,30,46,.5);
  border-color:var(--sf-line-strong);
}
.sf-card h3{
  font-family:var(--sf-serif);
  font-weight:600;
  font-size:1.24rem;
  line-height:1.22;
  letter-spacing:-.01em;
  margin:0 0 10px;
  color:var(--sf-ink);
}
.sf-card p{color:var(--sf-muted);font-size:.95rem;margin:0;flex-grow:1;}
.sf-card .sf-meta{
  font-family:var(--sf-sans);
  font-size:.74rem;
  letter-spacing:.04em;
  color:var(--sf-muted);
  margin-top:18px;
}
.sf-card .sf-tag{align-self:flex-start;margin-bottom:18px;}

/* Confronto a due colonne */
.sf-compare{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:2.4em 0;}
.sf-compare-card{
  background:var(--sf-surface);
  border:1px solid var(--sf-line);
  border-top:3px solid var(--sf-brand);
  border-radius:10px;
  padding:26px 24px;
}
.sf-compare-card.sf-alt{border-top-color:var(--sf-accent);}
.sf-compare-card h3{
  font-family:var(--sf-serif);
  font-weight:600;
  font-size:1.4rem;
  letter-spacing:-.01em;
  margin:0 0 4px;
  color:var(--sf-ink);
}
.sf-compare-card .sf-sum{font-size:.95rem;color:var(--sf-muted);margin:0 0 18px;}
.sf-compare-card .sf-sublabel{
  font-family:var(--sf-sans);
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sf-muted);
  margin:16px 0 8px;
}
.sf-compare-card ul{margin:0;padding:0;list-style:none;}
.sf-compare-card ul li{
  position:relative;
  padding-left:20px;
  margin-bottom:.4em;
  font-size:.97rem;
  line-height:1.5;
}
.sf-compare-card ul li::before{
  content:"";
  position:absolute;
  left:3px; top:.6em;
  width:5px; height:5px;
  border-radius:50%;
  background:var(--sf-line-strong);
}

/* --------------------------------------------------------------------------
   Sommario numerato della home
   -------------------------------------------------------------------------- */

.sf-sommario{border-top:1px solid var(--sf-line-strong);}
.sf-somm-row{
  display:grid;
  grid-template-columns:64px 1fr auto;
  align-items:start;
  gap:24px;
  padding:26px 4px;
  border-bottom:1px solid var(--sf-line);
  transition:background .18s ease, padding-left .18s ease;
}
.sf-somm-row:hover{background:var(--sf-surface);padding-left:14px;}
.sf-somm-num{
  font-family:var(--sf-serif);
  font-weight:700;
  font-size:1.9rem;
  line-height:1;
  color:var(--sf-brand);
  padding-top:2px;
}
.sf-somm-title{font-family:var(--sf-serif);font-weight:600;font-size:1.5rem;letter-spacing:-.01em;color:var(--sf-ink);}
.sf-somm-desc{color:var(--sf-muted);font-size:1rem;margin-top:4px;max-width:60ch;}
.sf-somm-go{
  font-family:var(--sf-sans);
  font-size:.78rem;
  letter-spacing:.06em;
  color:var(--sf-brand);
  white-space:nowrap;
  padding-top:8px;
  opacity:0;
  transform:translateX(-6px);
  transition:opacity .18s ease, transform .18s ease;
}
.sf-somm-row:hover .sf-somm-go{opacity:1;transform:translateX(0);}

/* --------------------------------------------------------------------------
   Sezioni su fondo navy: hero della home e fasce scure
   Si applica al blocco Sezione con sfondo palette 1.
   -------------------------------------------------------------------------- */

.sf-navy{background:var(--sf-navy);color:var(--sf-on-navy);}
.sf-navy h1,
.sf-navy h2,
.sf-navy h3{color:#fff;}
.sf-navy p{color:var(--sf-on-navy);}
.sf-navy a{color:#fff;}
.sf-navy .sf-eyebrow{color:var(--sf-accent);}

.sf-navy h1{
  font-family:var(--sf-serif);
  font-weight:600;
  font-size:clamp(2.7rem,6.6vw,4.6rem);
  line-height:1.03;
  letter-spacing:-.025em;
  margin:0;
  max-width:14ch;
}
.sf-navy .sf-lede{
  font-size:clamp(1.1rem,1.7vw,1.3rem);
  color:var(--sf-on-navy);
  max-width:54ch;
  margin:26px 0 0;
}

/* Riga di prove sotto l'hero */
.sf-proof{
  display:flex;
  flex-wrap:wrap;
  gap:14px 40px;
  margin-top:clamp(44px,6vw,64px);
  padding-top:28px;
  border-top:1px solid rgba(255,255,255,.14);
  list-style:none;
}
.sf-proof li{
  font-family:var(--sf-sans);
  font-size:.78rem;
  letter-spacing:.04em;
  color:var(--sf-on-navy-dim);
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:0;
  margin:0;
}
.sf-proof li::before{
  content:"";
  position:static;
  width:6px; height:6px;
  border-radius:50%;
  background:var(--sf-accent);
  display:inline-block;
  flex:none;
}

/* --------------------------------------------------------------------------
   Fascia newsletter
   -------------------------------------------------------------------------- */

.sf-newsletter{
  background:var(--sf-azzurro);
  border-top:1px solid var(--sf-line-strong);
}
.sf-newsletter h2{
  font-family:var(--sf-serif);
  font-weight:600;
  color:var(--sf-ink);
  font-size:clamp(2rem,4vw,2.9rem);
  line-height:1.08;
  letter-spacing:-.015em;
  margin:0;
  max-width:18ch;
}
.sf-newsletter p{color:var(--sf-muted);max-width:50ch;margin:18px 0 0;}
.sf-newsletter input[type="email"],
.sf-newsletter input[type="text"]{
  font-family:var(--sf-sans);
  font-size:1rem;
  color:var(--sf-ink);
  background:#fff;
  border:1px solid var(--sf-line-strong);
  border-radius:999px;
  padding:.85em 1.3em;
  min-width:240px;
}
.sf-newsletter input::placeholder{color:#94A2B5;}
.sf-newsletter input:focus{outline:none;border-color:var(--sf-accent);}
.sf-consenso{font-size:.82rem;color:var(--sf-muted);margin-top:16px;max-width:48ch;}
.sf-consenso a{color:var(--sf-brand);text-decoration:underline;text-underline-offset:2px;}

/* Form Brevo, versione senza il prefisso .entry-content: serve se un giorno la
   fascia finisce fuori dal contenuto, per esempio dentro un widget. Le regole
   che contano davvero sono quelle prefissate, piu' in basso. */
.sf-nl-form{margin-top:30px;max-width:560px;}
.sf-nl-row{display:flex;gap:12px;flex-wrap:wrap;}
.sf-nl-row input[type="email"]{flex:1 1 240px;min-width:0;}
.sf-nl-consensi{margin-top:20px;display:flex;flex-direction:column;gap:18px;}
.sf-nl-hint{
  display:block;
  margin:5px 0 0 33px;
  font-family:var(--sf-sans);
  font-size:.78rem;
  line-height:1.45;
  color:var(--sf-muted);
  max-width:52ch;
}
.sf-nl-hint a{color:var(--sf-brand);text-decoration:underline;text-underline-offset:2px;}
.sf-req{color:var(--sf-accent-700);font-weight:700;margin-left:3px;}
.sf-nl-check{
  display:flex;
  align-items:flex-start;
  gap:11px;
  padding:2px 0;
  font-family:var(--sf-sans);
  font-size:.86rem;
  line-height:1.5;
  color:var(--sf-text);
  cursor:pointer;
  max-width:56ch;
}
.sf-nl-check input[type="checkbox"]{
  appearance:none;
  -webkit-appearance:none;
  flex:0 0 auto;
  width:22px;
  height:22px;
  margin:0;
  min-width:0;
  background:#fff;
  border:1px solid var(--sf-line-strong);
  border-radius:5px;
  cursor:pointer;
}
.sf-nl-check input[type="checkbox"]:checked{
  background-color:var(--sf-brand);
  border-color:var(--sf-brand);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M3 8.4l3.3 3.3L13 5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:center;
  background-size:15px 15px;
}
.sf-nl-check a{color:var(--sf-brand);text-decoration:underline;text-underline-offset:2px;}
.sf-nl-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

/* --------------------------------------------------------------------------
   Divisione tra sezioni: mai vuoto e basta
   -------------------------------------------------------------------------- */

.sf-sep{border-top:1px solid var(--sf-line);}

/* --------------------------------------------------------------------------
   Adattamento agli schermi piccoli
   -------------------------------------------------------------------------- */

@media (max-width:860px){
  .sf-cardgrid,
  .sf-cardgrid.sf-cols-4{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:600px){
  .sf-cardgrid,
  .sf-cardgrid.sf-cols-4{grid-template-columns:1fr;}
  .sf-compare{grid-template-columns:1fr;}
  .sf-somm-row{grid-template-columns:44px 1fr;}
  .sf-somm-go{display:none;}
}

@media (prefers-reduced-motion:reduce){
  *{transition:none !important;animation:none !important;}
}

/* --------------------------------------------------------------------------
   Passo 7: header e footer navy
   Sfondi, altezze, colori dei link di menu e del pulsante stanno nel
   Customizer di Kadence. Qui solo cio' che il Customizer non copre.
   -------------------------------------------------------------------------- */

/* Intestazione fissa. In Kadence free l'opzione non c'e' (e' tra le voci Pro),
   quindi la fa il foglio di stile. Se un giorno si passa a Pro, togliere
   questo blocco prima di attivare lo sticky nativo. */
#masthead{position:sticky;top:0;z-index:50;}
body.admin-bar #masthead{top:32px;}
@media (max-width:782px){ body.admin-bar #masthead{top:46px;} }
@media (max-width:600px){ body.admin-bar #masthead{top:0;} }

/* Filetto chiaro sotto l'header navy.
   Il controllo Bordo della riga principale non si apre nel Customizer
   di questa versione, quindi la linea la fa il foglio di stile. */
#masthead{border-bottom:1px solid rgba(255,255,255,.10);}

/* Dimensione del testo dei pulsanti.
   Colori, raggio, peso e spaziatura stanno nel Customizer, in
   Colori e font, Stili di base del pulsante. La dimensione li' non
   e' esposta e verrebbe ereditata dal corpo, cioe' 17px: troppo. */
.wp-block-button__link,
.kb-button,
.button,
input[type="submit"]{
  font-size:15px;
  line-height:1.2;
}

/* Titoli delle colonne del footer */
.site-footer .widget-title{
  font-family:var(--sf-sans);
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sf-on-navy-dim);
  margin:0 0 14px;
}

/* Elenchi di link nelle colonne del footer */
.site-footer .widget ul{list-style:none;margin:0;padding:0;}
.site-footer .widget li{margin:0;}
.site-footer .widget li a{
  display:block;
  font-size:.95rem;
  color:var(--sf-on-navy);
  padding:5px 0;
  text-decoration:none;
}
.site-footer .widget li a:hover{color:#fff;}

/* Colonna del marchio nel footer.
   Allineamento: le altre tre colonne aprono con un'etichetta di 12,5px, il
   marchio con una parola di 27px. Allineare le scatole non basta, perche' la
   scatola del marchio ha un'interlinea di 1,65 ereditata dal corpo che spinge
   la parola 7,6px sotto la riga delle etichette. Interlinea a 1 e mezzo
   millesimo di margine mettono la cima delle maiuscole sulla stessa riga
   (misurato: 356,75 contro 356,66). Il margine e' in em, quindi regge anche
   se un domani cambia la dimensione del marchio. */
.sf-foot-brand{
  display:block;
  font-family:var(--sf-serif);
  font-weight:600;
  font-size:1.7rem;
  line-height:1;
  margin-top:.05em;
  letter-spacing:-.01em;
  color:#fff;
  font-feature-settings:"liga" 1;
}
.sf-foot-brand::after{content:".";color:var(--sf-accent);}
/* Lo spazio bianco tra marchio e claim deve essere lo stesso che c'e' tra
   etichetta e primo link nelle altre colonne, cioe' 35px misurati da linea
   di base a cima delle maiuscole. Con 10px erano 20,7 contro 35 e la
   colonna del marchio sembrava compressa. Con 24px sono 34,7 contro 35.
   Non si puo' avere anche la prima riga del claim allineata al primo link:
   il marchio e' grande, la sua linea di base cade 11px sotto quella delle
   etichette, quindi o si pareggia il vuoto o si pareggia la riga. Vince il
   vuoto, perche' e' quello che si vede. */
/* La larghezza massima qui non e' estetica, e' strutturale: decide dove va
   a capo il claim e quindi dove finisce il testo della prima colonna, che
   e' meta' del calcolo della griglia qui sotto. Con 24ch le righe restano
   tre, la piu' lunga 215px. Se cambia il testo del claim, ricontrollare. */
.sf-foot-claim{
  color:var(--sf-on-navy-dim);
  font-size:.95rem;
  margin:24px 0 0;
  max-width:24ch;
}

/* Larghezza delle quattro colonne del footer.
   A colonne uguali il vuoto tra il blocco del marchio e Guide era 63px,
   quello tra Guide e Sito 182, tra Sito e Legale 201: le colonne sono
   larghe uguali ma il testo dentro no, il marchio e il claim occupano
   215px contro i 77-101px degli elenchi di link. L'occhio non vede le
   colonne, vede i vuoti tra i testi.
   Allargando la prima a 1,62 e stringendo le altre tre i vuoti diventano
   159, 150 e 169. I 19px che restano tra le ultime due sono nel testo:
   "Newsletter" e' piu' corto di "Assicurazioni" e non si pareggia senza
   forzature. Sotto i 1025px Kadence impila le colonne e la regola non
   deve intervenire. */
@media (min-width:1025px){
  .site-middle-footer-inner-wrap.site-footer-row-columns-4{
    grid-template-columns:1.62fr 1fr 1fr 1fr;
  }
}

/* Riga legale in fondo al footer.
   Centrata sul desktop: chiude la pagina e distingue la fascia legale
   dalla griglia di colonne sopra. Sul telefono resta a sinistra, dove
   centrare tre righe che vanno a capo spezza la lettura.
   Nel Customizer di questa versione la voce di allineamento non c'e',
   quindi l'allineamento lo decide questo blocco. */
.site-footer-row.site-footer-row-columns-1 .site-footer-section{text-align:center;}
@media (max-width:767px){
  .site-footer-row.site-footer-row-columns-1 .site-footer-section{text-align:left;}
}

.sf-foot-legal{
  border-top:1px solid rgba(255,255,255,.12);
  padding-top:22px;
}
.sf-foot-legal p{margin:0;}
/* I margini automatici centrano il blocco quando il testo e' centrato e
   non fanno niente quando e' a sinistra: una regola sola per i due casi. */
.sf-foot-legal .sf-disclaimer{
  font-size:.82rem;
  color:#8AA0C2;
  max-width:80ch;
  margin-left:auto;
  margin-right:auto;
}
.sf-foot-legal .sf-meta{
  font-size:.74rem;
  letter-spacing:.04em;
  color:#7E94B8;
  margin-top:10px;
}

/* --------------------------------------------------------------------------
   Telefono, correzioni misurate a 375px
   -------------------------------------------------------------------------- */

/* Il pulsante che apre il menu misura 37x31, sotto i 44x44 raccomandati per
   il dito. La riga alta 64px c'e' gia', serve solo allargare l'area. */
@media (max-width:1024px){
  .mobile-toggle-open-container .menu-toggle-open{
    min-width:44px;
    min-height:44px;
  }
}

/* Le voci del cassetto escono a 14px, cioe' piu' piccole del menu desktop.
   L'area toccabile e' gia' 52px, qui si alza solo la leggibilita'. */
#mobile-drawer .menu li a{font-size:16px;}

/* I link del footer a 37px di altezza sono al limite del bersaglio comodo:
   sul telefono si allargano, sul desktop restano compatti. */
@media (max-width:767px){
  .site-footer .widget li a{padding:8px 0;}
}

/* ==========================================================================
   Passo 8: home e cinque pillar montate a blocchi

   Due cose da sapere prima di toccare questa parte.

   1. Specificita'. La tipografia del contenuto e' agganciata a
      .entry-content p, .entry-content h2 e .entry-content ul li, che valgono
      (0,1,1) o piu'. Le classi sf- da sole valgono (0,1,0) e quindi
      perderebbero su colore, corpo e margini. Dentro il contenuto vanno
      sempre scritte con il prefisso .entry-content. Le regole qui sotto
      esistono quasi tutte per questo motivo, non perche' il componente
      fosse sbagliato.
   2. Contenitori. Il blocco Gruppo di Gutenberg a volte avvolge i figli in
      un .wp-block-group__inner-container e a volte no, a seconda della
      versione e del supporto theme.json. Dove sotto c'e' una griglia,
      quel contenitore va sciolto con display:contents, cosi' la regola
      vale nei due casi senza doverli distinguere.
   ========================================================================== */

html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}

/* L'header e' fisso a 72px piu' la linea ambra da 3px: senza questo scarto
   l'ancora #iscriviti arriva sotto l'header e il titolo della fascia
   resta nascosto. */
.entry-content [id]{scroll-margin-top:96px;}

/* Contenitori interni sciolti, vedi nota 2 in cima */
.sf-somm-row > .wp-block-group__inner-container,
.sf-cardgrid > .wp-block-group__inner-container,
.sf-compare > .wp-block-group__inner-container,
.sf-redazione > .wp-block-group__inner-container{display:contents;}

/* --------------------------------------------------------------------------
   Fasce di pagina
   La fascia porta lo sfondo e il ritmo verticale, l'inner tiene il contenuto
   dentro i 1120px. Perche' la fascia arrivi da bordo a bordo la pagina deve
   avere il layout Kadence "A larghezza intera": se non ce l'ha le fasce si
   fermano a 1120px, che non e' rotto ma perde l'alternanza di sfondi.
   -------------------------------------------------------------------------- */

/* margin-block:0 non e' pignoleria. Il layout a flusso di Gutenberg mette
   24px di stacco tra blocchi fratelli con una regola avvolta in :where(),
   cioe' a specificita' zero: senza questa riga tra la fascia navy e quella
   dopo comparirebbe una striscia chiara di 24px. */
.entry-content .sf-band{padding-block:clamp(56px,7vw,92px);margin-block:0;}
.entry-content .sf-band-inner{max-width:1120px;margin-inline:auto;padding-inline:24px;}
.entry-content .sf-band-inner.sf-narrow{max-width:788px;}
/* Hero della home. Sopra resta piu' alto di sotto, ma di poco: era 140 contro
   96 (rapporto 1,46) e sul desktop largo sembrava aria sprecata sopra il
   titolo. Ora 112 contro 96, cioe' 1,17: lo scarto si vede ancora e il titolo
   sale di 28px. Se un giorno si cambia, tenere il rapporto sotto 1,25. */
.entry-content .sf-hero-home{padding-block:clamp(60px,8.5vw,112px) clamp(56px,7vw,96px);}
.entry-content .sf-hero-pillar{padding-block:clamp(48px,7vw,84px) clamp(40px,5vw,60px);}
.entry-content .sf-hero-pillar h1{margin:0;}
.entry-content .sf-hero-pillar .sf-standfirst{margin:20px 0 1.7em;}
.entry-content .sf-hero-actions{margin-top:38px;gap:14px;}

/* --------------------------------------------------------------------------
   Testatine di sezione
   -------------------------------------------------------------------------- */

.entry-content .sf-section-head{max-width:640px;margin:0 0 clamp(36px,5vw,56px);}
.entry-content .sf-h2-big{
  font-family:var(--sf-serif);
  font-weight:600;
  color:var(--sf-ink);
  font-size:clamp(1.9rem,3.6vw,2.7rem);
  line-height:1.1;
  letter-spacing:-.01em;
  margin:0;
}
.entry-content .sf-h2-mid{
  font-family:var(--sf-serif);
  font-weight:600;
  color:var(--sf-ink);
  font-size:clamp(1.6rem,3vw,2.1rem);
  line-height:1.15;
  letter-spacing:-.01em;
  margin:0 0 clamp(26px,4vw,38px);
}

/* --------------------------------------------------------------------------
   Elementi editoriali, versione che regge dentro .entry-content
   -------------------------------------------------------------------------- */

.entry-content .sf-eyebrow{
  font-size:.74rem;
  font-weight:600;
  line-height:1.4;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--sf-brand);
  margin:0 0 14px;
}
.entry-content .sf-navy .sf-eyebrow{color:var(--sf-accent);}
.entry-content .sf-breadcrumb{
  font-size:.74rem;
  font-weight:600;
  line-height:1.4;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--sf-brand);
  margin:0 0 22px;
}
.entry-content .sf-breadcrumb a{color:var(--sf-brand);text-decoration:none;}
.entry-content .sf-breadcrumb a:hover{opacity:.6;}
.entry-content .sf-standfirst{
  font-family:var(--sf-serif);
  font-size:clamp(1.18rem,2vw,1.4rem);
  line-height:1.5;
  color:#3A4855;
  max-width:60ch;
}
.entry-content .sf-tag{
  display:inline-block;
  font-size:.68rem;
  font-weight:600;
  line-height:1.4;
  letter-spacing:.1em;
  text-transform:uppercase;
  background:var(--sf-accent-soft);
  color:var(--sf-accent-700);
  padding:5px 10px;
  border-radius:4px;
  margin:0 0 18px;
}

/* --------------------------------------------------------------------------
   Callout "Da dove iniziare"
   -------------------------------------------------------------------------- */

.entry-content .sf-callout{margin:0;}
.entry-content .sf-callout p{margin:0;font-size:1.04rem;line-height:1.55;color:var(--sf-ink);}
.entry-content .sf-callout .sf-label{
  font-size:.72rem;
  font-weight:600;
  line-height:1.4;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--sf-accent-700);
  margin:0 0 10px;
}
.entry-content .sf-callout p a{color:var(--sf-brand);font-weight:600;}
.entry-content .sf-callout ul{margin:0;padding:0;list-style:none;}
.entry-content .sf-callout ul li{
  position:relative;
  padding-left:22px;
  margin:0 0 .5em;
  font-size:1.02rem;
  line-height:1.55;
  color:var(--sf-ink);
}
.entry-content .sf-callout ul li:last-child{margin-bottom:0;}
.entry-content .sf-callout ul li::before{
  content:"";
  position:absolute;
  left:2px; top:.6em;
  width:6px; height:6px;
  border-radius:50%;
  background:var(--sf-accent-700);
}

/* --------------------------------------------------------------------------
   Sommario numerato della home
   La riga intera e' cliccabile senza che un link avvolga la griglia: il
   link sta sul titolo e il suo ::after copre la riga. Con i blocchi non si
   puo' avvolgere un Gruppo dentro un <a>, questa e' la via pulita.
   -------------------------------------------------------------------------- */

.entry-content .sf-somm-row{position:relative;}
.entry-content .sf-somm-num{
  font-family:var(--sf-serif);
  font-weight:700;
  font-size:1.9rem;
  line-height:1;
  color:var(--sf-brand);
  margin:0;
  padding-top:2px;
}
.entry-content .sf-somm-title{
  font-family:var(--sf-serif);
  font-weight:600;
  font-size:1.5rem;
  line-height:1.2;
  letter-spacing:-.01em;
  color:var(--sf-ink);
  margin:0;
}
.entry-content .sf-somm-title a{color:inherit;text-decoration:none;}
.entry-content .sf-somm-title a::after{content:"";position:absolute;inset:0;}
.entry-content .sf-somm-desc{
  color:var(--sf-muted);
  font-size:1rem;
  line-height:1.55;
  margin:4px 0 0;
  max-width:60ch;
}
.entry-content .sf-somm-go{
  font-size:.78rem;
  line-height:1.4;
  letter-spacing:.06em;
  color:var(--sf-brand);
  white-space:nowrap;
  margin:0;
  padding-top:8px;
}

/* --------------------------------------------------------------------------
   Schede guida
   Stessa tecnica del sommario: link sul titolo, ::after che copre la scheda.
   .sf-soon e' la scheda di una guida non ancora scritta: niente link,
   bordo tratteggiato, nessun effetto al passaggio del mouse.
   -------------------------------------------------------------------------- */

.entry-content .sf-cardgrid.sf-cols-2{grid-template-columns:repeat(2,1fr);}
.entry-content .sf-card{position:relative;}
.entry-content .sf-card h3{
  font-family:var(--sf-serif);
  font-weight:600;
  font-size:1.24rem;
  line-height:1.22;
  letter-spacing:-.01em;
  color:var(--sf-ink);
  margin:0 0 10px;
}
.entry-content .sf-card h3 a{color:inherit;text-decoration:none;}
.entry-content .sf-card h3 a::after{content:"";position:absolute;inset:0;}
.entry-content .sf-card p:not(.sf-tag):not(.sf-meta){
  color:var(--sf-muted);
  font-size:.95rem;
  line-height:1.55;
  margin:0;
  flex-grow:1;
}
.entry-content .sf-card .sf-meta{
  font-size:.74rem;
  line-height:1.4;
  letter-spacing:.04em;
  color:var(--sf-muted);
  margin:18px 0 0;
}
.entry-content .sf-card.sf-soon{background:#FBFCFE;border-style:dashed;}
.entry-content .sf-card.sf-soon:hover{
  transform:none;
  box-shadow:none;
  border-color:var(--sf-line);
}
.entry-content .sf-card.sf-soon .sf-meta{color:#8494A8;}

/* --------------------------------------------------------------------------
   Blocco redazione della home
   -------------------------------------------------------------------------- */

.entry-content .sf-redazione{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:clamp(36px,6vw,72px);
  align-items:start;
}
.entry-content .sf-redazione p{
  color:var(--sf-muted);
  font-size:1.08rem;
  line-height:1.7;
  margin:0 0 18px;
  max-width:52ch;
}
@media (max-width:860px){
  .entry-content .sf-redazione{grid-template-columns:1fr;}
}

/* Elenco di dati secchi: niente pallino, righe divise da un filetto.
   Serve ul li e non solo li, altrimenti perde contro la regola generale
   degli elenchi del contenuto. */
.entry-content .sf-facts ul{margin:0;padding:0;list-style:none;}
.entry-content .sf-facts ul li{
  padding:12px 0;
  margin:0;
  font-size:.82rem;
  line-height:1.5;
  letter-spacing:.03em;
  color:var(--sf-ink);
  border-bottom:1px solid var(--sf-line);
}
.entry-content .sf-facts ul li::before{content:none;}
.entry-content .sf-facts ul li:last-child{border-bottom:none;}

/* Riga di prove sotto l'hero della home */
.entry-content ul.sf-proof{
  display:flex;
  flex-wrap:wrap;
  gap:14px 40px;
  list-style:none;
  margin:clamp(44px,6vw,64px) 0 0;
  padding:28px 0 0;
  border-top:1px solid rgba(255,255,255,.14);
}
.entry-content ul.sf-proof li{
  position:static;
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:0;
  margin:0;
  font-size:.78rem;
  line-height:1.4;
  letter-spacing:.04em;
  color:var(--sf-on-navy-dim);
}
.entry-content ul.sf-proof li::before{
  content:"";
  position:static;
  top:auto; left:auto;
  width:6px; height:6px;
  border-radius:50%;
  background:var(--sf-accent);
  display:inline-block;
  flex:none;
}

/* --------------------------------------------------------------------------
   Pulsanti dentro il contenuto
   Il colore di base lo scrive il Customizer con specificita' (0,1,0) o (0,2,0)
   in uno <style> stampato dopo questo foglio: per vincere serve salire a tre
   classi. Sul navy il pulsante principale resta a testo scuro, mai bianco
   su ambra, altrimenti .sf-navy a lo schiarirebbe.
   -------------------------------------------------------------------------- */

/* Bersaglio dei pulsanti del contenuto. Misurato a 375px il 2026-07-29: quello
   dell'hero della home era alto 42px, sotto i 44 minimi, mentre quello del form
   era gia' stato corretto al passo 10. Qui la soglia vale per tutti, e non
   cambia niente sul desktop dove i pulsanti sono gia' piu' alti. */
.entry-content .wp-block-button .wp-block-button__link{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* Niente sottolineatura sui pulsanti. La regola generale dei link del
   contenuto (.entry-content a) sottolinea tutto, e su un pulsante a pillola
   quella riga sotto l'etichetta sembra un difetto. Tre classi perche' la
   sottolineatura arriva da una regola a specificita' (0,1,1) e il Customizer
   di Kadence stampa il suo <style> dopo questo foglio. */
.entry-content .wp-block-buttons .wp-block-button .wp-block-button__link,
.entry-content .wp-block-buttons .wp-block-button .wp-block-button__link:hover,
.entry-content .wp-block-button .wp-block-button__link,
.entry-content .wp-block-button .wp-block-button__link:hover{text-decoration:none;}

.entry-content .sf-navy .wp-block-button__link{color:var(--sf-ink);}
.entry-content .wp-block-button.sf-btn-ghost .wp-block-button__link{
  background:transparent;
  color:var(--sf-ink);
  border:1px solid var(--sf-line-strong);
}
.entry-content .wp-block-button.sf-btn-ghost .wp-block-button__link:hover{
  background:transparent;
  border-color:var(--sf-ink);
}
.entry-content .sf-navy .wp-block-button.sf-btn-ghost .wp-block-button__link{
  color:#fff;
  border-color:rgba(255,255,255,.32);
}
.entry-content .sf-navy .wp-block-button.sf-btn-ghost .wp-block-button__link:hover{
  border-color:#fff;
  background:transparent;
}

/* --------------------------------------------------------------------------
   Fascia newsletter
   Il form e' un blocco HTML segnaposto: al passo 10 va sostituito con il
   form Brevo con doppio consenso. Oggi il pulsante non invia niente.
   -------------------------------------------------------------------------- */

.entry-content .sf-newsletter h2{margin:0;}
.entry-content .sf-newsletter p{color:var(--sf-muted);max-width:52ch;margin:18px 0 0;}
.entry-content .sf-newsletter .sf-consenso{
  font-size:.82rem;
  line-height:1.5;
  color:var(--sf-muted);
  margin:16px 0 0;
  max-width:56ch;
}
.entry-content .sf-nl-form{
  margin-top:30px;
  max-width:560px;
}
.entry-content .sf-nl-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.entry-content .sf-nl-row input[type="email"]{flex:1 1 240px;min-width:0;}
.entry-content .sf-nl-btn{
  font-family:var(--sf-sans);
  font-weight:600;
  font-size:15px;
  line-height:1.2;
  background:var(--sf-accent);
  color:var(--sf-ink);
  border:0;
  border-radius:100px;
  padding:12px 26px;
  cursor:pointer;
}
.entry-content .sf-nl-btn:hover{background:var(--sf-accent-700);}

/* Sul telefono il pulsante va a capo e si accorcia alla sua altezza naturale,
   che misurata a 375px era 42px: sotto i 44 minimi. Il min-height lo riporta
   sopra la soglia senza toccare l'aspetto sul desktop, dove il flex lo stira
   gia' all'altezza del campo. */
.entry-content .sf-nl-btn{min-height:44px;}

/* Sotto i 520px il pulsante prende tutta la riga invece di restare un
   rettangolo da 105px sotto un campo largo 327: il bersaglio triplica. */
@media (max-width:520px){
  .entry-content .sf-nl-row .sf-nl-btn{width:100%;}
}

/* --------------------------------------------------------------------------
   Le due caselle di consenso del form Brevo, passo 10

   La casella si disegna da zero con appearance:none, perche' quella di sistema
   e' azzurra e su fondo #E2EAF4 sparisce. Il segno di spunta e' un SVG dentro
   background-image invece che uno pseudo elemento: sugli input gli pseudo
   elementi non sono garantiti allo stesso modo su tutti i browser.

   Bersaglio: la casella e' 22px ma l'area cliccabile e' tutta l'etichetta,
   testo compreso, che sta sempre sopra i 44px di altezza.
   -------------------------------------------------------------------------- */

.entry-content .sf-nl-consensi{
  margin-top:20px;
  display:flex;
  flex-direction:column;
  gap:18px;
}

/* La nota sotto ogni casella. Rientra di 33px, cioe' 22 di casella piu' 11 di
   spazio, per allinearsi al testo dell'etichetta e non alla casella. */
.entry-content .sf-nl-hint{
  display:block;
  margin:5px 0 0 33px;
  font-family:var(--sf-sans);
  font-size:.78rem;
  line-height:1.45;
  color:var(--sf-muted);
  max-width:52ch;
}
.entry-content .sf-nl-hint a{
  color:var(--sf-brand);
  text-decoration:underline;
  text-underline-offset:2px;
}

/* Asterisco del consenso obbligatorio. Ambra scura invece dell'ambra piena,
   perche' su fondo #E2EAF4 la piena e' troppo chiara per un segno da 1 em.
   E' aria-hidden nel markup: a chi usa uno screen reader lo dice l'attributo
   required, e la nota sotto spiega a parole cosa vuol dire l'asterisco, cosi'
   non serve una legenda separata. */
.entry-content .sf-req{
  color:var(--sf-accent-700);
  font-weight:700;
  margin-left:3px;
}
.entry-content .sf-nl-check{
  display:flex;
  align-items:flex-start;
  gap:11px;
  margin:0;
  /* L'etichetta e' tutta cliccabile. A 375px la prima misurava 41px di
     altezza, appena sotto i 44 minimi del bersaglio: due pixel sopra e sotto
     la portano a 45 senza spostare niente all'occhio. */
  padding:2px 0;
  font-family:var(--sf-sans);
  font-size:.86rem;
  line-height:1.5;
  color:var(--sf-text);
  cursor:pointer;
  max-width:56ch;
}
.entry-content .sf-nl-check input[type="checkbox"]{
  appearance:none;
  -webkit-appearance:none;
  flex:0 0 auto;
  width:22px;
  height:22px;
  margin:0;
  background:#fff;
  border:1px solid var(--sf-line-strong);
  border-radius:5px;
  cursor:pointer;
  transition:background .12s ease, border-color .12s ease;
}
.entry-content .sf-nl-check input[type="checkbox"]:hover{border-color:var(--sf-brand);}
.entry-content .sf-nl-check input[type="checkbox"]:checked{
  background-color:var(--sf-brand);
  border-color:var(--sf-brand);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M3 8.4l3.3 3.3L13 5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:center;
  background-size:15px 15px;
}
.entry-content .sf-nl-check input[type="checkbox"]:focus-visible{
  outline:2px solid var(--sf-accent);
  outline-offset:2px;
}
.entry-content .sf-nl-check a{
  color:var(--sf-brand);
  text-decoration:underline;
  text-underline-offset:2px;
}

/* Campo trappola antispam. Nel codice di Brevo lo nasconde la classe
   input--hidden del loro foglio di stile, che noi non carichiamo. Va tolto
   dalla vista e dal percorso della tastiera, non con display:none: alcuni bot
   saltano apposta i campi con display:none. */
.entry-content .sf-nl-hp{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}

/* --------------------------------------------------------------------------
   Margine sotto i blocchi Gruppo, azzerato dentro le fasce

   Kadence stacca di 32px ogni blocco Gruppo che non sia l'ultimo del suo
   contenitore. Nei componenti Semplifi quel margine e' sempre di troppo, e
   in due punti e' proprio un difetto: stacca le righe del sommario, che
   devono essere contigue e divise solo dal filetto, e aggiunge 32px tra le
   file di schede sopra i 18px del gap della griglia, misurato sul sito.
   Si azzera in blocco e si rimette solo dove serve davvero, cioe' sotto la
   testatina di sezione. Le due regole hanno la stessa specificita' (0,3,0),
   quindi l'ordine in cui sono scritte qui e' quello che decide: non
   invertirle.
   -------------------------------------------------------------------------- */

.entry-content .sf-band .wp-block-group,
.entry-content .sf-band .wp-block-buttons{margin-bottom:0;}
.entry-content .sf-band .sf-section-head{margin-bottom:clamp(36px,5vw,56px);}

/* Il rovescio della medaglia di quell'azzeramento, trovato il 2026-07-29
   guardando la privacy invece dell'HTML: i box editoriali sono anche loro
   blocchi Gruppo dentro una fascia, quindi si prendevano margin-bottom:0 e
   restavano incollati al paragrafo successivo. Il vuoto sopra c'era, perche'
   arrivava dal margine del paragrafo precedente, quello sotto no: misurato,
   0px contro i 24 di sopra. Qui il margine torna a ciascun componente, e resta
   azzerato dove serviva davvero, cioe' sulle strutture di impaginazione.
   Le regole valgono (0,3,0) come quella sopra e stanno dopo: l'ordine e'
   quello che decide, non spostarle. */
.entry-content .sf-band .sf-callout,
.entry-content .sf-band .sf-notice,
.entry-content .sf-band .sf-fonti,
.entry-content .sf-band .sf-endnote,
.entry-content .sf-band .sf-faq,
.entry-content .sf-band .sf-compare,
.entry-content .sf-band .sf-dati{margin-block:2.2em;}

/* Occhiello della fascia newsletter. La regola dei paragrafi della fascia,
   .entry-content .sf-newsletter p{margin:18px 0 0}, vale (0,2,1) e vince su
   .sf-eyebrow{margin:0 0 14px}: risultato, l'occhiello "La newsletter" era
   incollato al titolo, in home, nelle cinque pillar, in ogni articolo e nelle
   pagine di servizio. Misurato: 0px di stacco. Qui torna il respiro. */
.entry-content .sf-newsletter .sf-eyebrow{margin:0 0 14px;}

/* ==========================================================================
   Passo 9: i cinque articoli

   Valgono le due note in cima al passo 8: dentro il contenuto ogni classe
   sf- va scritta col prefisso .entry-content, e i contenitori interni dei
   Gruppi sopra una griglia vanno sciolti con display:contents (per il
   confronto a due colonne la riga c'e' gia' piu' su).

   Questa parte sta in fondo al foglio per un motivo preciso, non per
   comodita': le regole qui sotto valgono (0,3,0) esattamente come
   .entry-content .sf-band .wp-block-group{margin-bottom:0} scritta qui
   sopra. A parita' di specificita' decide l'ordine, quindi devono stare
   dopo. Non spostarle piu' in alto.
   ========================================================================== */

/* Testata dell'articolo. Chiude a zero perche' il respiro sotto la firma lo
   mette il corpo, altrimenti i due padding si sommano. */
.entry-content .sf-hero-article{padding-block:clamp(48px,7vw,84px) 0;}
.entry-content .sf-hero-article h1{margin:0;}
.entry-content .sf-hero-article .sf-standfirst{margin:22px 0 0;}

/* Firma: autore, data, minuti di lettura. Da sola .sf-byline vale (0,1,0) e
   perderebbe su .entry-content p, che vale (0,1,1). */
.entry-content .sf-byline{
  margin:30px 0 0;
  padding:18px 0;
  border-top:1px solid var(--sf-line);
  border-bottom:1px solid var(--sf-line);
  font-family:var(--sf-sans);
  font-size:.86rem;
  line-height:1.5;
  color:var(--sf-muted);
}
.entry-content .sf-byline strong{color:var(--sf-ink);font-weight:600;}

.entry-content .sf-article-body{padding-block:clamp(28px,4vw,40px) clamp(48px,6vw,72px);}

/* Nelle pillar il callout chiude la testata e vale margin:0. Dentro un
   articolo sta in mezzo al testo e vuole aria sopra e sotto. */
.entry-content .sf-article-body .sf-callout{margin:2.2em 0;}

/* --------------------------------------------------------------------------
   FAQ, blocco Dettagli nativo
   -------------------------------------------------------------------------- */

.entry-content .sf-faq{
  margin-top:2.6em;
  border-top:1px solid var(--sf-line);
  padding-top:1.8em;
}
.entry-content .sf-faq h2{margin:0 0 .3em;}
.entry-content .sf-faq .wp-block-details{border-bottom:1px solid var(--sf-line);}
.entry-content .sf-faq summary{
  font-family:var(--sf-serif);
  font-weight:600;
  font-size:1.15rem;
  color:var(--sf-ink);
  cursor:pointer;
  padding:16px 0;
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
}
.entry-content .sf-faq summary::-webkit-details-marker{display:none;}
.entry-content .sf-faq summary::after{
  content:"+";
  color:var(--sf-accent-700);
  font-family:var(--sf-sans);
  font-weight:600;
  font-size:1.4rem;
  line-height:1;
  transition:transform .18s ease;
}
.entry-content .sf-faq details[open] summary::after{transform:rotate(45deg);}
.entry-content .sf-faq details p{margin:0 0 18px;font-size:1.05rem;line-height:1.7;}

/* --------------------------------------------------------------------------
   Box fonti e nota di chiusura
   La lista delle fonti e' un ol: la regola dei pallini ambra vale solo per
   gli ul, quindi qui la numerazione resta quella nativa.
   -------------------------------------------------------------------------- */

.entry-content .sf-fonti{
  margin-top:2.4em;
  background:var(--sf-surface);
  border:1px solid var(--sf-line);
  border-radius:10px;
  padding:24px 26px;
}
.entry-content .sf-fonti .sf-label{
  font-family:var(--sf-sans);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--sf-muted);
  margin:0 0 14px;
}
.entry-content .sf-fonti ol{margin:0;padding-left:20px;}
.entry-content .sf-fonti li{
  font-size:.95rem;
  line-height:1.55;
  margin:0 0 10px;
  color:var(--sf-text);
}
.entry-content .sf-fonti li:last-child{margin-bottom:0;}
.entry-content .sf-fonti .sf-verifica{font-size:.82rem;color:var(--sf-muted);margin:16px 0 0;}

.entry-content .sf-endnote{
  margin-top:2.4em;
  padding-top:1.7em;
  border-top:1px solid var(--sf-line);
}
.entry-content .sf-endnote p{font-size:.95rem;color:var(--sf-muted);line-height:1.6;margin:0;}

/* --------------------------------------------------------------------------
   Confronto a due colonne
   Le voci degli elenchi qui sono piu' piccole e col punto grigio: senza il
   prefisso .entry-content perderebbero contro i pallini ambra del contenuto,
   che valgono (0,2,1).
   -------------------------------------------------------------------------- */

.entry-content .sf-compare{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin:2.4em 0;
}
.entry-content .sf-compare-card{
  background:var(--sf-surface);
  border:1px solid var(--sf-line);
  border-top:3px solid var(--sf-brand);
  border-radius:10px;
  padding:26px 24px;
}
.entry-content .sf-compare-card.sf-alt{border-top-color:var(--sf-accent);}
.entry-content .sf-compare-card h3{font-size:1.4rem;margin:0 0 4px;}
.entry-content .sf-compare-card .sf-sum{font-size:.95rem;color:var(--sf-muted);margin:0 0 18px;}
.entry-content .sf-compare-card .sf-sublabel{
  font-family:var(--sf-sans);
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sf-muted);
  margin:16px 0 8px;
}
.entry-content .sf-compare-card ul{margin:0;padding:0;list-style:none;}
.entry-content .sf-compare-card ul li{
  padding-left:20px;
  margin-bottom:.4em;
  font-size:.97rem;
  line-height:1.5;
}
.entry-content .sf-compare-card ul li::before{
  left:3px;
  top:.6em;
  width:5px;
  height:5px;
  background:var(--sf-line-strong);
}

/* --------------------------------------------------------------------------
   Continua a leggere
   -------------------------------------------------------------------------- */

.entry-content .sf-related .sf-h2-mid{margin-bottom:clamp(26px,4vw,38px);}

@media (max-width:600px){
  .entry-content .sf-compare{grid-template-columns:1fr;}
}

/* --------------------------------------------------------------------------
   Semplifi, pagine Chi siamo, Contatti e Cookie Policy
   Stessa trappola del passo 8: dentro .entry-content le classi sf- da sole
   valgono (0,1,0) e perdono contro .entry-content p, che vale (0,1,1) ed e'
   scritta prima nel foglio. Senza queste regole il blocco dei dati societari
   e la riga di ultimo aggiornamento escono come paragrafi normali: non e'
   rotto, e' l'opposto di quello che devono sembrare, cioe' una nota in fondo.
   .sf-notice p invece non serve blindarla: vale (0,1,1) come la regola del
   contenuto ma sta dopo nel foglio, quindi vince gia'.
   -------------------------------------------------------------------------- */
.entry-content .sf-dati p{
  font-size:.92rem;
  line-height:1.6;
  color:var(--sf-muted);
  margin:0;
}
.entry-content p.sf-updated{
  font-family:var(--sf-sans);
  font-size:.82rem;
  line-height:1.6;
  color:var(--sf-muted);
}

/* --------------------------------------------------------------------------
   Pagina 404, audit del 2026-07-29

   Quella del tema si fermava a "Oops! La pagina non e' stata trovata", senza
   un solo link: chi ci finisce esce dal sito. Il blocco lo stampa il mu-plugin
   sf-ritocchi.php, qui c'e' solo il vestito. Niente classi nuove inventate:
   i link riprendono il colore brand e il ritmo delle altre note.
   -------------------------------------------------------------------------- */

.sf-404-aiuto{
  max-width:640px;
  margin:28px auto 0;
}
.sf-404-aiuto p{
  color:var(--sf-body);
  margin:0 0 14px;
}
.sf-404-aiuto .sf-404-link{
  font-family:var(--sf-sans);
  font-weight:600;
  line-height:2.2;
}
.sf-404-aiuto a{
  color:var(--sf-brand);
  text-decoration:underline;
  text-underline-offset:2px;
}
.sf-404-aiuto a:hover{color:var(--sf-ink);}