/* ===========================================================================
   SCALA TIPOGRAFICA DEI TITOLI
   Prima c'erano sette dichiarazioni sparse e in conflitto (92, 83, 66, 58, 40,
   38.4, 35px) con l'H2 piu' grande dell'H1: gerarchia invertita.
   Qui c'e' una scala sola, decrescente, in quattro variabili.
   Per ritoccare le dimensioni si cambiano solo queste righe.
   =========================================================================== */
:root {
    --sv-h1:  clamp(2.75rem, 5.4vw, 5.25rem);   /* 44px -> 84px  titolo hero */
    --sv-h2:  clamp(2.25rem, 4.2vw, 4rem);      /* 36px -> 64px  titoli di sezione */
    --sv-h3:  clamp(1.5rem,  2.1vw, 2.125rem);  /* 24px -> 34px  titoli di scheda */
    --sv-sub: clamp(1.25rem, 1.7vw, 1.75rem);   /* 20px -> 28px  sottotitoli */
}
/*
Theme Name: GeneratePress Child - Supervantaggio
Theme URI: https://supervantaggio.com
Description: Child di GeneratePress per la ricostruzione in blocchi di supervantaggio.com. Porta con se il CSS della home a blocchi (.sv-home-gb) dal child hello-elementor.
Template: generatepress
Version: 1.0.0
Text Domain: generatepress-child
*/

/* >>> CSS custom qui <<< */

/* Font self-hosted, subset latino (dal tema supervantaggio-blocks) */
/* ---------------------------------------------------------------------------
   HOME IN BLOCCHI GUTENBERG
   Tutto sotto .sv-home-gb: finche' nessuna pagina usa quella classe queste
   regole non toccano niente del sito esistente.
   Token presi dal kit Elementor 8621: nero #0C0C0C, lime #D8FD45,
   fondo chiaro #F7F6F3, display Fjalla One, testo Manrope.
   --------------------------------------------------------------------------- */

.sv-home-gb {
    font-family: "Manrope", "Inter", system-ui, sans-serif;
    color: #010101;
}
.sv-home-gb .sv-display {
    font-family: "Fjalla One", "Arial Narrow", sans-serif;
    /* la produzione usa Fjalla One con weight 800: il browser sintetizza
       il grassetto, ed e quello che da ai titoli il tratto pieno */
    font-weight: 800;
    text-transform: uppercase;
    line-height: 1.1;
    letter-spacing: 0.01em;
    margin-bottom: 1rem;
}
/* misure prese dal sito in produzione a 1366px:
   h1 hero 66px, h2 sezione 92px, canali 58px, sbancobet 83px */
.sv-home-gb h1.sv-display {
    font-size: var(--sv-h1);
}
.sv-home-gb h2.sv-display {
    font-size: var(--sv-h2);
}
.sv-home-gb h3.sv-display {
    font-size: var(--sv-h3);
}
.sv-home-gb .sv-display-sub {
    font-size: var(--sv-sub);
}
/* Hero */
.sv-home-gb .sv-hero {
    text-align: center;
}
.sv-home-gb .sv-hero .sv-display {
    color: #fff;
    max-width: 24ch;
    margin-inline: auto;
}
.sv-home-gb .sv-hero .sv-lead {
    color: #fff;
    max-width: 52ch;
    margin-inline: auto;
    font-size: 18px;
}
/* Pulsanti: squadrati, come nel design Elementor */
.sv-home-gb .wp-block-button__link {
    border-radius: 0;
    padding: 1rem 1.75rem;
    font-weight: 700;
    text-align: center;
}
/* Schede canali e guide */
.sv-home-gb .sv-card-title {
    font-family: "Manrope", sans-serif;
    font-size: var(--sv-h3);
    font-weight: 400;
}
.sv-home-gb .sv-card-title strong {
    display: block;
    font-weight: 800;
}
.sv-home-gb .sv-guide .sv-display {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}
.sv-home-gb .sv-guide-link a {
    color: #e43e59;
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: 0.04em;
    text-decoration: none;
}
/* Fascia recensioni: sostituisce il carosello Elementor Pro con una griglia.
   Su mobile diventa scorrevole in orizzontale con lo scroll-snap, cosi' il
   gesto resta quello dello swipe senza bisogno di JavaScript. */
.sv-home-gb .sv-eyebrow {
    font-style: italic;
    opacity: 0.75;
    font-size: 0.95rem;
}
.sv-home-gb .sv-review {
    background: #ffffff;
    color: #0c0c0c;
    border: 1px solid #e5e5e5;
    padding: 1.25rem;
}
.sv-home-gb .sv-review-name {
    font-weight: 800;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 0.5rem;
}
.sv-home-gb .sv-review-text {
    font-size: 0.82rem;
    line-height: 1.5;
    opacity: 0.9;
}
@media (max-width: 781px) {
    .sv-home-gb .sv-review-grid {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 1rem;
        padding-bottom: 0.5rem;
    }
.sv-home-gb .sv-review-grid > .wp-block-column {
        flex: 0 0 82%;
        scroll-snap-align: center;
    }
}
/* Video */
.sv-home-gb .sv-video {
    margin-top: 2.5rem;
}
/* CTA finale, con il motivo a palloni del design originale.
   L'immagine e' una piastrella 600x600: va ripetuta, non scalata a cover.
   Sta su uno pseudo-elemento cosi' l'opacita' sfuma il motivo senza
   trascinarsi dietro anche il testo. */
.sv-home-gb .sv-final {
    position: relative;
    isolation: isolate;
}
.sv-home-gb .sv-final::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background-image: url("../../uploads/2024/02/bg_soccer_ball_pattern-2.jpg");
    background-repeat: repeat;
    background-size: 380px auto;
    opacity: 0.12;
}
/* Copertina del video: riproduce l'overlay con immagine del widget Elementor.
   Il pulsante rimanda a YouTube invece di aprire il player in pagina, che
   e' la sola differenza di comportamento rispetto all'originale. */
.sv-home-gb .sv-video {
    margin-top: 2.5rem;
}
.sv-home-gb .sv-play .wp-block-button__link {
    background: #ffffff;
    color: #0c0c0c;
    border-radius: 999px;
    padding: 1rem 2.25rem 1rem 3.25rem;
    position: relative;
}
.sv-home-gb .sv-play .wp-block-button__link::before {
    content: "";
    position: absolute;
    left: 1.6rem;
    top: 50%;
    transform: translateY(-50%);
    border-left: 0.85rem solid #0c0c0c;
    border-top: 0.55rem solid transparent;
    border-bottom: 0.55rem solid transparent;
}
/* ---------------------------------------------------------------------------
   PARITA CON LA PRODUZIONE (misure computate a 1366px, 31/08/2026)
   --------------------------------------------------------------------------- */

/* La sezione canali ha il titolo piu piccolo delle altre: 58px */

/* Sezione Sbancobet: 83px, interlinea 1 */

/* Titoli delle schede canali: 35px Manrope 700 */
.sv-home-gb .sv-card-title {
    font-size: var(--sv-h3);
    font-weight: 700;
    line-height: 1.1;
}
/* Titoli delle guide: Fjalla, grandi (in produzione 35-50px col fit-text) */
.sv-home-gb .sv-guide h3 {
    font-family: "Fjalla One", "Arial Narrow", sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    /* !important perche il markup porta has-large-font-size, che e !important */
    font-size: var(--sv-h3) !important;
    line-height: 1.1;
}
/* Hero piu scuro, come l overlay Elementor */
.sv-home-gb .sv-hero .wp-block-cover__background {
    opacity: 0.8 !important;
}
/* Pagine interne (chi-sono e prossime) */
.sv-home-gb h1.sv-h1-big {
    font-size: var(--sv-h1);
}
.sv-home-gb .sv-subhead {
    font-family: "Manrope", sans-serif;
    font-size: var(--sv-sub);
    font-weight: 700;
    line-height: 1.1;
    text-transform: none;
}
/* Glossario e titoli pagina "editoriali" (Manrope, non Fjalla) */
.sv-home-gb h1.sv-page-title {
    font-family: "Manrope", sans-serif;
    font-weight: 800;
    font-size: var(--sv-h1);
    line-height: 1.1;
}
.sv-glossario h2 {
    font-family: "Manrope", sans-serif;
    font-weight: 800;
    font-size: 1.75rem;
    margin-top: 1.5rem;
}
.sv-glossario hr.wp-block-separator {
    border: none;
    border-top: 1px solid #1a1a1a;
    margin: 2rem 0;
}
.sv-glossario a {
    color: #c0392b;
}
/* Recensioni: schede post e gallery */
.sv-recensioni .sv-review-post-card h3 {
    font-family: "Manrope", sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 0.4rem;
}
.sv-recensioni .sv-review-post-card h3 a {
    color: #2178dd;
    text-decoration: none;
}
.sv-recensioni .sv-review-post-card time {
    font-size: 0.78rem;
    color: #6b6b6b;
}
.sv-recensioni .sv-review-post-card .wp-block-read-more {
    display: inline-block;
    margin-top: 0.6rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: #2178dd;
    text-decoration: none;
}
/* Risorse gratuite */
.sv-home-gb .sv-h-58 {
    font-size: clamp(2rem, 4.4vw, 3.625rem) !important;
}
.sv-home-gb .sv-h-45 {
    font-size: clamp(1.8rem, 3.4vw, 2.8125rem) !important;
}
.sv-home-gb .sv-res-title {
    font-family: "Manrope", sans-serif;
    font-size: 2.1875rem;
    font-weight: 400;
    line-height: 1.15;
    text-transform: none;
}
.sv-home-gb .sv-res-title strong {
    font-weight: 800;
}
/* Checklist con spunta tonda nera (pagine prodotto) */
.sv-home-gb .sv-checklist {
    list-style: none;
    padding-left: 0;
}
.sv-home-gb .sv-checklist li {
    position: relative;
    padding-left: 2rem;
    margin-bottom: 0.5rem;
}
.sv-home-gb .sv-checklist li::before {
    content: "\2713";
    position: absolute;
    left: 0;
    top: 0.1em;
    width: 1.3em;
    height: 1.3em;
    border-radius: 50%;
    background: #0c0c0c;
    color: #ffffff;
    font-size: 0.85em;
    line-height: 1.3em;
    text-align: center;
    font-weight: 700;
}
/* nelle sezioni scure la spunta si inverte */
.sv-home-gb .wp-block-group[style*="background-color:#1b1b1b"] .sv-checklist li::before {
    background: #ffffff;
    color: #0c0c0c;
}
.sv-home-gb hr.sv-divider {
    border: none;
    border-top: 1px solid #d8d5cc;
    max-width: 260px;
    margin: 0 auto;
}
/* ---------------------------------------------------------------------------
   HEADER E FOOTER NATIVI (parts/, resi via do_blocks in functions.php)
   --------------------------------------------------------------------------- */

.sv-topbar a,
.sv-footer a {
    text-decoration: none;
}
.sv-footer-links {
    list-style: none;
    padding-left: 0;
}
.sv-footer-links li {
    margin-bottom: 0.55rem;
}
.sv-disclaimer {
    font-size: 0.85rem;
    line-height: 1.55;
}
/* CTA sopra il footer: pattern doodle in tile come in produzione */
.sv-cta-footer {
    position: relative;
    background: #ffffff;
}
/* pattern rimosso: 176 KB scaricati su ogni pagina per una
   decorazione che non si vedeva piu'. content:none non basta,
   Chrome carica lo sfondo lo stesso. */

.sv-cta-footer > * {
    position: relative;
}
/* da telefono il paragrafo arrivava a 6px dal bordo: il gruppo a tutta
   larghezza non aveva margini laterali */
.sv-cta-footer.alignfull {
    padding-left: 24px;
    padding-right: 24px;
}
/* colonne footer a tutta larghezza del contenitore */
.sv-footer > .wp-block-columns {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
}
/* overlay mobile del menu di navigazione (senza theme.json i preset contrast/base mancano) */

/* ---------------------------------------------------------------------------
   ARTICOLI (template single nativo)
   --------------------------------------------------------------------------- */

.single .sv-breadcrumb {
    margin: 1.5rem 0 0; /* a sinistra, sullo stesso bordo del titolo */
    font-size: 0.85rem;
    color: #6b6b6b;
}
.single .sv-post-meta {
    font-size: 0.85rem;
    color: #6b6b6b;
    margin-bottom: 1.25rem;
}
.single .entry-meta {
    display: none;
}
.sv-single-after {
    margin-top: 2.5rem;
}
.sv-share {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin: 1rem 0;
}
.sv-share a {
    padding: 0.55rem 1.4rem;
    color: #ffffff;
    font-weight: 700;
    font-size: 0.85rem;
    text-decoration: none;
}
.sv-share-fb { background: #3b5998; }
.sv-share-tw { background: #1da1f2; }
.sv-share-in { background: #0077b5; }
/* Guide correlate in coda all'articolo (meta sv_correlati) */
.sv-correlati {
    margin-top: 3rem;
    padding-top: 1.5rem;
    border-top: 2px solid #0c0c0c;
}
.sv-correlati__k {
    margin: 0 0 0.25rem;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #5f5f5f;
}
.sv-correlati__t {
    margin: 0 0 1rem;
    font-size: 1.75rem;
    line-height: 1.1;
}
.sv-correlati__lista {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 2rem;
}
.sv-correlati__voce {
    margin: 0;
    border-top: 1px solid rgba(12, 12, 12, 0.18);
}
.sv-correlati__voce a {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 1rem 0 1.1rem;
    color: #0c0c0c;
    text-decoration: none;
}
.sv-correlati__cat {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #5f5f5f;
}
.sv-correlati__titolo {
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: underline;
    text-decoration-color: transparent;
    text-decoration-thickness: 3px;
    text-underline-offset: 4px;
    transition: text-decoration-color 0.2s;
}
.sv-correlati__voce a:hover .sv-correlati__titolo,
.sv-correlati__voce a:focus-visible .sv-correlati__titolo {
    text-decoration-color: #d8fd45;
}
.sv-correlati__meta {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: #5f5f5f;
}
.sv-correlati__meta svg {
    width: 1em;
    height: 1em;
    transition: transform 0.2s;
}
.sv-correlati__voce a:hover .sv-correlati__meta svg {
    transform: translateX(4px);
}
@media (max-width: 768px) {
    .sv-correlati__lista { grid-template-columns: 1fr; }
    .sv-correlati__t { font-size: 1.5rem; }
}
/* ===========================================================================
   BARRA SUPERIORE
   GeneratePress registra una sola posizione di menu e GP Premium (che
   porterebbe la barra superiore nativa) qui non e' installato: la posizione
   "sv_top" e' registrata nel functions.php del child e stampata sull'hook
   generate_before_header. Il menu principale invece e' quello nativo di GP,
   con i colori impostati dalle sue opzioni.
   =========================================================================== */

.sv-topbar {
    background: #0c0c0c;
    border-bottom: 1px solid #1e1e1e;
}
.sv-topbar__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0.45rem 1.25rem;
}
.sv-topmenu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-end;
    gap: 1.4rem;
}
.sv-topmenu a {
    color: #b5c1cf;
    font-size: 0.82rem;
    text-decoration: none;
}
.sv-topmenu a:hover,
.sv-topmenu a:focus-visible {
    color: #fff;
    text-decoration: underline;
}
@media (max-width: 640px) {
    .sv-topmenu {
        justify-content: center;
        gap: 1rem;
    }
}
/* ===========================================================================
   BLOCCHI A PIENA LARGHEZZA
   Le pagine sono costruite con sezioni "alignfull" che gestiscono da sole la
   propria larghezza interna. Il contenitore di GeneratePress le teneva dentro
   i 1400px, lasciando i margini chiari ai lati. Qui le facciamo uscire e
   togliamo padding e cornice all'articolo, cosi le sezioni vanno da bordo a
   bordo come nel sito originale.
   =========================================================================== */

.page .site-content .content-area,
.page .site-content .site-main {
    margin: 0;
    padding: 0;
}
.page .inside-article {
    padding: 0;
}
.page .entry-content {
    margin: 0;
}
.page .entry-content > .alignfull {
    width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}
/* Niente ombre o bordi sul contenitore dell articolo nelle pagine */
.page .inside-article,
.page .site-main > article {
    background: transparent;
    box-shadow: none;
    border: 0;
}
/* Il wrapper delle pagine convertite (.sv-home-gb e simili) riceveva dal
   contenitore a blocchi un max-width di 1400px, che teneva dentro anche le
   sezioni alignfull: i fondali si fermavano prima del bordo. Le sezioni
   gestiscono da sole la propria larghezza interna, quindi qui il tappo va via. */
.sv-home-gb > .wp-block-group__inner-container,
.entry-content > .wp-block-group > .wp-block-group__inner-container {
    max-width: none;
}
/* ===========================================================================
   CORPO DEL TESTO E SEZIONI A SCHEDE
   =========================================================================== */

/* Paragrafi a 18px, con l'interlinea proporzionata */
.sv-home-gb p,
.entry-content p {
    font-size: 18px;
    line-height: 1.6;
}
.sv-home-gb .sv-review-text,
.sv-home-gb .sv-eyebrow {
    font-size: 1rem;
}
/* Le schede erano di altezze diverse e con le icone di dimensioni scomposte:
   colonne alte uguali, icone normalizzate, contenuto distribuito. */
.sv-home-gb .wp-block-columns:has(.sv-card) {
    align-items: stretch;
}
.sv-home-gb .sv-card {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.sv-home-gb .sv-card .wp-block-buttons {
    margin-top: auto;
    padding-top: 1rem;
}
/* Icone dei canali: stessa area visiva per YouTube e Telegram */
.sv-home-gb .sv-channel-logo {
    margin: 0 auto 0.6rem;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sv-home-gb .sv-channel-logo img {
    max-height: 64px;
    width: auto;
    max-width: 150px;
    object-fit: contain;
}
/* Titoli delle schede: niente a capo casuali a meta' frase */
.sv-home-gb .sv-card-title {
    text-wrap: balance;
    margin-bottom: 0.3rem;
}
.sv-home-gb .sv-card p {
    max-width: 46ch;
    margin-inline: auto;
}
/* ===========================================================================
   SISTEMA DELLE CHIAMATE ALL'AZIONE
   Prima l'azione che vale di piu' (l'iscrizione) era bianca, cioe' il
   trattamento visivo piu' debole, mentre il lime del marchio era speso su una
   CTA secondaria. Qui ci sono tre livelli dichiarati:
     primaria   lime, la piu' grande      -> iscrizione
     secondaria nera                       -> azioni di supporto
     terziaria  contorno                   -> rimandi e approfondimenti
   =========================================================================== */

.sv-home-gb .wp-block-button__link,
.sv-home-gb .sv-btn .wp-block-button__link {
    display: inline-block;
    font-weight: 700;
    letter-spacing: 0.01em;
    padding: 1rem 1.85rem;
    border: 2px solid transparent;
    transition: background-color .15s ease, color .15s ease, transform .15s ease;
}
/* Primaria: iscrizione. Lime pieno, corpo maggiore, piu' aria. */
.sv-home-gb .sv-btn-primaria .wp-block-button__link {
    background-color: #d8fd45;
    color: #0c0c0c;
    font-size: 1.05rem;
    padding: 1.15rem 2.4rem;
    border-color: #d8fd45;
}
.sv-home-gb .sv-btn-primaria .wp-block-button__link strong {
    display: block;
    font-size: 1.15em;
    letter-spacing: 0.02em;
}
.sv-home-gb .sv-btn-primaria .wp-block-button__link:hover,
.sv-home-gb .sv-btn-primaria .wp-block-button__link:focus-visible {
    background-color: #c2e63a;
    transform: translateY(-2px);
}
/* Secondaria: nera */
.sv-home-gb .sv-btn:not(.sv-btn-primaria) .wp-block-button__link {
    background-color: #0c0c0c;
    color: #fff;
    border-color: #0c0c0c;
}
.sv-home-gb .sv-btn:not(.sv-btn-primaria) .wp-block-button__link:hover,
.sv-home-gb .sv-btn:not(.sv-btn-primaria) .wp-block-button__link:focus-visible {
    background-color: #d8fd45;
    color: #0c0c0c;
    border-color: #d8fd45;
}
/* Sulla fascia scura le secondarie si invertono, altrimenti spariscono */
.sv-home-gb .sv-reviews .wp-block-button__link {
    background-color: transparent;
    color: #fff;
    border-color: #4a4a4a;
}
.sv-home-gb .sv-reviews .wp-block-button__link:hover,
.sv-home-gb .sv-reviews .wp-block-button__link:focus-visible {
    background-color: #d8fd45;
    color: #0c0c0c;
    border-color: #d8fd45;
}
/* Il play sul video resta una pillola chiara sopra l'immagine */
.sv-home-gb .sv-play .wp-block-button__link {
    border-radius: 999px;
    background-color: #fff;
    color: #0c0c0c;
    border-color: #fff;
}
.sv-home-gb .sv-play .wp-block-button__link:hover {
    background-color: #d8fd45;
    border-color: #d8fd45;
}
/* Area toccabile minima e focus sempre visibile */
.sv-home-gb .wp-block-button__link:focus-visible {
    outline: 3px solid #0c0c0c;
    outline-offset: 3px;
}
@media (max-width: 640px) {
    .sv-home-gb .sv-btn-primaria .wp-block-button__link {
        width: 100%;
        padding-inline: 1rem;
    }
}
/* ===========================================================================
   SIDEBAR: scheda autore e liste di approfondimento
   =========================================================================== */

/* ===========================================================================
   ALLINEAMENTO BARRA SUPERIORE
   La barra usava un contenitore proprio (max 1200px) mentre la testata di GP
   e' fluida: le voci finivano 100px prima del menu e il logo partiva prima
   della barra. Qui i due bordi coincidono.
   =========================================================================== */
.sv-topbar__inner {
    max-width: none;
    padding-inline: 50px;
}
@media (max-width: 768px) {
    .sv-topbar__inner {
        padding-inline: 20px;
    }
}
/* ===========================================================================
   PALETTE UNIFICATA
   Il censimento della pagina trovava 8 sfondi e 8 colori di testo, con due
   famiglie in conflitto: il beige caldo del fondo contro le schede grigio
   azzurre fredde (#F3F5F8), piu' il blu di default dei link (#1B78E2) che non
   apparteneva a nessuna delle due.
   Qui resta una famiglia sola, calda, con il lime del marchio come unico
   accento e il nero per i link.
   =========================================================================== */
:root {
    --sv-fondo:     #faf8f3;   /* fondo pagina */
    --sv-superficie:#f2efe6;   /* schede e riquadri, stesso asse caldo */
    --sv-bordo:     #e6e1d5;
    --sv-inchiostro:#0c0c0c;
    --sv-secondario:#5f5a50;   /* grigio caldo, non piu' grigio azzurro */
    --sv-accento:   #d8fd45;
}
/* Superfici: dal grigio azzurro freddo al beige della stessa famiglia */
.sv-side-cta,
.sv-home-gb .sv-card,
.sv-home-gb .sv-guide {
    background: var(--sv-superficie);
    border-color: var(--sv-bordo);
}
/* Link: niente piu' blu di sistema, nero con sottolineatura lime */
.entry-content a:not(.wp-block-button__link):not(.sv-autore__link) {
    color: var(--sv-inchiostro);
    text-decoration: underline;
    text-decoration-color: var(--sv-accento);
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}
.entry-content a:not(.wp-block-button__link):hover {
    text-decoration-color: var(--sv-inchiostro);
}
/* Testo secondario sullo stesso asse caldo */
.entry-meta {
    color: var(--sv-secondario);
}
/* I pulsanti social prendevano i colori dei tre marchi, tre blu diversi che
   spaccavano la palette: uniformati al nero con hover lime. */
.sv-share a,
.sv-share-fb,
.sv-share-tw,
.sv-share-in {
    background: var(--sv-inchiostro) !important;
    color: #fff !important;
}
.sv-share a:hover,
.sv-share-fb:hover,
.sv-share-tw:hover,
.sv-share-in:hover {
    background: var(--sv-accento) !important;
    color: var(--sv-inchiostro) !important;
}
/* La barra superiore segue lo stesso gutter della testata e del contenuto:
   logo, voci del menu, testo dell'articolo e sidebar sullo stesso asse. */
.sv-topbar__inner {
    padding-inline: 90px;
}
@media (max-width: 768px) {
    .sv-topbar__inner {
        padding-inline: 20px;
    }
}
/* Sfondo alleggerito: il beige precedente era troppo carico.
   Le superfici restano un gradino sotto per staccare senza pesare. */
:root {
    --sv-fondo: #fcfbf8;
    --sv-superficie: #f6f4ee;
    --sv-bordo: #ebe7dd;
}
/* ===========================================================================
   MENU MOBILE A SCHERMO INTERO
   Resta il meccanismo nativo di GeneratePress: il suo pulsante aggiunge la
   classe .toggled e nessun JavaScript viene aggiunto qui. Cambia solo la
   forma: da riquadro a tendina a pannello che copre tutto lo schermo.
   =========================================================================== */

@media (max-width: 768px) {

    /* Il pulsante resta sopra al pannello e diventa la X per chiudere */
    .main-navigation .menu-toggle {
        position: relative;
        z-index: 1002;
        background: transparent;
        color: #0c0c0c;
    }
.main-navigation.toggled .menu-toggle {
        position: fixed;
        top: 8px;
        right: 12px;
        color: #ffffff;
    }
.main-navigation.toggled .menu-toggle .gp-icon svg {
        width: 26px;
        height: 26px;
    }
/* Il pannello copre tutta la finestra */
    .main-navigation.toggled .main-nav {
        position: fixed;
        inset: 0;
        z-index: 1001;
        background: #0c0c0c;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow-y: auto;
        padding: 5rem 1.5rem 3rem;
        animation: sv-menu-entra .22s ease-out;
    }
@keyframes sv-menu-entra {
        from { opacity: 0; transform: translateY(-8px); }
to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
        .main-navigation.toggled .main-nav { animation: none; }
}
.main-navigation.toggled .main-nav > ul {
        width: 100%;
        max-width: 26rem;
        display: flex;
        flex-direction: column;
        gap: 0.15rem;
    }
.main-navigation.toggled .main-nav .menu-item {
        border-bottom: 1px solid #1e1e1e;
        text-align: center;
    }
.main-navigation.toggled .main-nav .menu-item > a {
        display: block;
        padding: 1rem 0.5rem;
        font-family: "Fjalla One", "Arial Narrow", sans-serif;
        font-size: 1.55rem;
        text-transform: uppercase;
        letter-spacing: 0.02em;
        color: #ffffff;
        line-height: 1.2;
    }
.main-navigation.toggled .main-nav .menu-item > a:hover,
    .main-navigation.toggled .main-nav .menu-item > a:focus-visible {
        color: #d8fd45;
    }
/* Sottovoci: sempre aperte, piu' piccole, leggermente rientrate */
    .main-navigation.toggled .main-nav .sub-menu {
        width: 100% !important;
        min-width: 0;
        float: none;
        margin: 0;
        box-shadow: none;
        text-align: center;
        opacity: 1;
        visibility: visible;
        left: auto;
        height: auto;
        pointer-events: auto;
        display: block !important;
        position: static;
        background: transparent;
        border: 0;
        padding: 0 0 0.5rem;
        width: auto;
    }
.main-navigation.toggled .main-nav .sub-menu .menu-item {
        border-bottom: 0;
    }
.main-navigation.toggled .main-nav .sub-menu a {
        font-family: "Manrope", sans-serif;
        text-transform: none;
        font-size: 1rem;
        font-weight: 500;
        color: #b5c1cf;
        padding: 0.45rem 0;
    }
/* Niente freccette di apertura: le sottovoci sono gia' visibili */
    .main-navigation.toggled .main-nav .dropdown-menu-toggle {
        display: none;
    }
/* La pagina dietro non scorre mentre il pannello e' aperto */
    html:has(.main-navigation.toggled) {
        overflow: hidden;
    }
/* I pulsanti di condivisione sbordavano di 3px a 320px: ora vanno a capo */
    .sv-share {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        justify-content: center;
    }
.sv-share a {
        flex: 0 1 auto;
        min-width: 0;
    }
}
/* ===========================================================================
   TESTATA: logo e menu sulla stessa linea verticale
   .inside-header era display:block, quindi logo (centro 69) e menu (centro 83)
   non erano allineati. Con flex e align-items:center coincidono.
   =========================================================================== */
.site-header .inside-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
}
.site-header .inside-header > .site-branding,
.site-header .inside-header > .site-logo {
    flex: none;
}
.site-header .inside-header > .main-navigation {
    flex: 1 1 auto;
}
/* La copia della barra superiore serve solo da mobile */
.sv-top-in-mobile {
    display: none;
}
@media (max-width: 768px) {

    /* Da mobile la barra superiore sparisce: le sue voci stanno nel pannello */
    .sv-topbar {
        display: none;
    }
/* Logo e hamburger sulla stessa riga, il pulsante a destra del logo */
    .site-header .inside-header {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
    }
.site-header .inside-header > .main-navigation {
        flex: 0 0 auto;
        margin-left: auto;
    }
.main-navigation .menu-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0.35rem 0.5rem;
        margin: 0;
        width: auto;
    }
/* Dentro il pannello: le voci della barra superiore in coda, piu' piccole */
    .main-navigation.toggled .sv-top-in-mobile {
        display: block;
        width: 100%;
        max-width: 26rem;
        margin: 1.25rem auto 0;
        padding-top: 1rem;
        border-top: 1px solid #2a2a2a;
    }
.sv-topmenu-mobile {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.5rem 1.5rem;
    }
.sv-topmenu-mobile a {
        color: #b5c1cf;
        font-size: 0.95rem;
        text-decoration: none;
        padding: 0.4rem 0;
    }
.sv-topmenu-mobile a:hover,
    .sv-topmenu-mobile a:focus-visible {
        color: #d8fd45;
    }
}
/* ===========================================================================
   CORREZIONI PANNELLO MOBILE
   .sv-top-in-mobile e' fratello di .main-nav, non figlio: siccome l'overlay
   rende .main-nav fisso, quelle voci restavano fuori dal pannello. Le fissiamo
   anche noi, in fondo allo schermo e sopra il pannello.
   =========================================================================== */
@media (max-width: 768px) {

    .main-navigation.toggled .sv-top-in-mobile {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1002;
        display: block;
        margin: 0;
        padding: 1.1rem 1.5rem calc(1.1rem + env(safe-area-inset-bottom, 0px));
        background: #0c0c0c;
        border-top: 1px solid #2a2a2a;
        max-width: none;
    }
/* Il pannello lascia spazio in fondo per non finirci sotto */
    .main-navigation.toggled .main-nav {
        padding-bottom: 7rem;
    }
/* Logo e hamburger sulla stessa linea: stessa altezza e centratura */
    .site-header .inside-header > .site-logo,
    .site-header .inside-header > .site-branding {
        display: flex;
        align-items: center;
        margin: 0;
    }
.site-header .inside-header > .site-logo img {
        display: block;
    }
.main-navigation .menu-toggle {
        height: auto;
        line-height: 1;
    }
.site-header .inside-header > .main-navigation {
        display: flex;
        align-items: center;
    }
}
@media (max-width: 768px) {
    .main-navigation.toggled .sv-top-in-mobile {
        box-sizing: border-box;
        width: 100%;
    }
}
/* La lista della barra superiore dentro il pannello mobile era spenta da una
   regola di GeneratePress piu' specifica (le ul dentro .main-navigation).
   Qui la riaccendiamo con la specificita' necessaria. */
@media (max-width: 768px) {
    .main-navigation.toggled .sv-top-in-mobile ul.sv-topmenu-mobile {
        display: flex !important;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.4rem 1.5rem;
        list-style: none;
        margin: 0;
        padding: 0;
    }
.main-navigation.toggled .sv-top-in-mobile ul.sv-topmenu-mobile li {
        border: 0;
        width: auto;
    }
.main-navigation.toggled .sv-top-in-mobile ul.sv-topmenu-mobile a {
        display: inline-block;
        font-family: "Manrope", sans-serif;
        font-size: 0.95rem;
        text-transform: none;
        color: #b5c1cf;
        padding: 0.3rem 0;
    }
}
/* Menu principale centrato nello spazio fra logo e bordo destro */
@media (min-width: 769px) {
    .site-header .inside-header > .main-navigation .inside-navigation {
        justify-content: center;
    }
.site-header .inside-header > .main-navigation .main-nav {
        margin-inline: auto;
    }
}
/* Menu centrato sulla pagina, non sullo spazio che avanza dopo il logo:
   logo e uno spaziatore invisibile occupano la stessa frazione ai due lati. */
@media (min-width: 769px) {
    .site-header .inside-header::after {
        content: "";
        flex: 1 1 0;
    }
.site-header .inside-header > .site-logo,
    .site-header .inside-header > .site-branding {
        flex: 1 1 0;
    }
.site-header .inside-header > .main-navigation {
        flex: 0 0 auto;
    }
}
/* Nel pannello scuro la voce corrente ereditava il fondo bianco pensato per il
   menu chiaro del desktop, diventando un rettangolo illeggibile.
   Qui dentro resta trasparente, con il lime a segnalare la pagina attiva. */
@media (max-width: 768px) {
    .main-navigation.toggled .main-nav .menu-item.current-menu-item > a,
    .main-navigation.toggled .main-nav .menu-item.current_page_item > a,
    .main-navigation.toggled .main-nav .menu-item.current-menu-ancestor > a,
    .main-navigation.toggled .main-nav .menu-item > a:hover,
    .main-navigation.toggled .main-nav .menu-item > a:focus {
        background: transparent !important;
        color: #d8fd45 !important;
    }
.main-navigation.toggled .main-nav .sub-menu .menu-item > a:hover,
    .main-navigation.toggled .main-nav .sub-menu .current-menu-item > a {
        background: transparent !important;
        color: #d8fd45 !important;
    }
}
/* ===========================================================================
   SEZIONI A TUTTA LARGHEZZA, CONTENUTO CONTENUTO
   Togliendo il tappo al wrapper per far arrivare i fondali a bordo schermo
   era sparito anche il limite del contenuto: su 1900px il contenitore interno
   arrivava a 1868, con righe di testo troppo lunghe.
   Il fondale resta da bordo a bordo, il contenuto si ferma a 1200px centrati.
   =========================================================================== */
.sv-home-gb .alignfull > .wp-block-group__inner-container,
.sv-home-gb .alignfull > .wp-block-cover__inner-container,
.entry-content .alignfull > .wp-block-group__inner-container,
.entry-content .alignfull > .wp-block-cover__inner-container {
    max-width: 1200px;
    margin-inline: auto;
    padding-inline: 1.5rem;
    box-sizing: border-box;
}
/* Le colonne dentro le sezioni seguono lo stesso limite */
.sv-home-gb .alignfull > .wp-block-columns,
.entry-content .alignfull > .wp-block-columns {
    max-width: 1200px;
    margin-inline: auto;
}
/* Alcuni elementi stanno come figli diretti della sezione, senza contenitore
   interno: il limite vale anche per loro. */
.sv-home-gb .alignfull > p,
.sv-home-gb .alignfull > h1,
.sv-home-gb .alignfull > h2,
.sv-home-gb .alignfull > h3,
.sv-home-gb .alignfull > .wp-block-buttons,
.entry-content .alignfull > p,
.entry-content .alignfull > h1,
.entry-content .alignfull > h2,
.entry-content .alignfull > h3,
.entry-content .alignfull > .wp-block-buttons {
    max-width: 1200px;
    margin-inline: auto;
    box-sizing: border-box;
}
/* ===========================================================================
   NEUTRALIZZA IL CALCOLO CON 100vw
   GeneratePress allarga le .alignfull con margini negativi calcolati su 100vw.
   100vw comprende la barra di scorrimento, 100% no: su un browser con barra
   classica quel calcolo produce 15-17px di sbordamento orizzontale.
   Qui non serve: il contenitore e' gia' a piena larghezza (container_alignment
   impostato su "full"), quindi le sezioni arrivano al bordo senza trucchi.
   =========================================================================== */
.no-sidebar .entry-content .alignfull,
.entry-content .alignfull,
.sv-home-gb .alignfull {
    margin-left: 0;
    margin-right: 0;
    width: auto;
    max-width: none;
}
/* ===========================================================================
   TIPOGRAFIA: SOLO FONT LOCALI
   GeneratePress aveva font_body su Raleway e lo scaricava da Google con tutti
   i 18 pesi: 836 ms di blocco del render per un font che il sito non usa.
   Manrope e Fjalla One sono gia' in assets/fonts, quindi qui non parte piu'
   nessuna richiesta verso l'esterno.
   =========================================================================== */
body,
button,
input,
select,
textarea {
    font-family: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
}
h1, h2, h3, h4, h5, h6,
.site-title,
.main-navigation a {
    font-family: "Fjalla One", "Arial Narrow", system-ui, sans-serif;
}
.main-navigation a {
    font-family: "Manrope", system-ui, sans-serif;
}
/* ===========================================================================
   IMMAGINI: MAI PIU' GRANDI DEL LORO ORIGINALE
   Su /sistemi-scommesse/ tre mockup da 300px di lato venivano stirati a 561:
   ingranditi oltre la risoluzione, quindi sgranati.
   width:auto le riporta alla misura naturale, il max-width le tiene dentro
   la colonna sugli schermi stretti.
   =========================================================================== */
.entry-content .wp-block-image img,
.sv-home-gb .wp-block-image img {
    width: auto;
    max-width: 100%;
    height: auto;
}
.entry-content .wp-block-image,
.sv-home-gb .wp-block-image {
    text-align: center;
}
.entry-content .wp-block-image img,
.sv-home-gb .wp-block-image img {
    margin-inline: auto;
}
/* I mockup di prodotto restano leggibili senza dominare la colonna */
.entry-content .wp-block-column .wp-block-image img {
    max-width: min(100%, 420px);
}
/* ===========================================================================
   PULSANTI PIU' GRANDI
   =========================================================================== */
.sv-home-gb .wp-block-button__link,
.entry-content .wp-block-button__link,
.sv-btn .wp-block-button__link {
    font-size: 1.05rem;
    padding: 1.25rem 2.4rem;
}
.sv-home-gb .sv-btn-primaria .wp-block-button__link,
.entry-content .sv-btn-primaria .wp-block-button__link {
    font-size: 1.2rem;
    padding: 1.5rem 3rem;
}
.sv-home-gb .sv-btn-primaria .wp-block-button__link strong,
.entry-content .sv-btn-primaria .wp-block-button__link strong {
    font-size: 1.1em;
}
/* Anche le CTA scritte come link semplici dentro il contenuto */

@media (max-width: 640px) {
    .sv-home-gb .wp-block-button__link,
    .entry-content .wp-block-button__link {
        font-size: 1rem;
        padding: 1.1rem 1.4rem;
        width: 100%;
    }
}
/* I loghi dei canali erano ritagli piccoli (YouTube 100px, Telegram 60px)
   stirati a 120: alla loro misura restano nitidi. */
.sv-home-gb .sv-channel-logo img {
    width: auto;
    max-width: 100%;
    max-height: 48px;
}
/* Pulsanti: corpo e area piu' generosi, come richiesto */
.sv-home-gb .wp-block-button__link,
.entry-content .wp-block-button__link,
.sv-btn .wp-block-button__link {
    font-size: 1.15rem;
    padding: 1.4rem 2.6rem;
    min-height: 4rem;
    letter-spacing: 0.015em;
}
.sv-home-gb .sv-btn-primaria .wp-block-button__link,
.entry-content .sv-btn-primaria .wp-block-button__link {
    font-size: 1.3rem;
    padding: 1.6rem 3.2rem;
    min-height: 4.6rem;
}
@media (max-width: 640px) {
    .sv-home-gb .wp-block-button__link,
    .entry-content .wp-block-button__link {
        font-size: 1.05rem;
        padding: 1.2rem 1.4rem;
        min-height: 3.6rem;
    }
}
/* I due loghi dei canali hanno una larghezza inline di 120px scritta nel
   blocco, che vinceva sulla regola: alla loro misura naturale (100 e 60px)
   restano nitidi invece di essere ingranditi. */
.sv-home-gb .sv-channel-logo img {
    width: auto !important;
    max-width: 100px;
    max-height: 48px;
}
/* Briciole di pane in coda alle pagine, prima della CTA finale */
.sv-briciole-fondo {
    max-width: 1200px;
    margin: 2.5rem auto 0;
    padding: 1.25rem 1.5rem 0;
    border-top: 1px solid var(--sv-bordo, #ebe7dd);
    font-size: 0.9rem;
    color: var(--sv-secondario, #5f5a50);
}
.sv-briciole-fondo a {
    color: var(--sv-inchiostro, #0c0c0c);
    text-decoration: underline;
    text-decoration-color: #0c0c0c;
}
/* ===========================================================================
   CODA DELL'ARTICOLO
   Dentro gli articoli il lime era troppo aggressivo: sul riquadro nero il
   pulsante diventa bianco, che stacca senza gridare. Il lime resta all'hover.
   =========================================================================== */

.sv-single-after .sv-cta-sbanco .wp-block-button__link,
.entry-content .sv-cta-sbanco .wp-block-button__link {
    background-color: #ffffff !important;
    color: #0c0c0c !important;
    border-color: #ffffff !important;
}
.sv-single-after .sv-cta-sbanco .wp-block-button__link:hover,
.sv-single-after .sv-cta-sbanco .wp-block-button__link:focus-visible {
    background-color: #d8fd45 !important;
    color: #0c0c0c !important;
    border-color: #d8fd45 !important;
}
/* Il riquadro nero respira di piu' e non tocca i bordi */
.sv-single-after .sv-cta-sbanco {
    padding: 2.75rem 2rem;
    margin-block: 2.5rem;
    border-radius: 0;
}
.sv-single-after .sv-cta-sbanco p {
    max-width: 58ch;
    margin-inline: auto;
    font-size: 1.05rem;
    line-height: 1.6;
}
/* Box autore: separato dal testo e allineato meglio */
.sv-single-after .sv-authorbox {
    align-items: center;
    gap: 1.5rem;
    padding-top: 2rem;
    margin-top: 2.5rem;
    border-top: 1px solid var(--sv-bordo, #ebe7dd);
}
.sv-single-after .sv-authorbox img {
    border-radius: 50%;
}
/* Condivisione: pulsanti allineati e piu' respirati */
.sv-single-after .wp-block-social-links,
.sv-share {
    justify-content: center;
    gap: 0.6rem;
    margin-block: 1rem 2rem;
}
.sv-share a {
    padding: 0.85rem 1.6rem;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.sv-single-after .sv-divider {
    max-width: 1200px;
    margin-inline: auto;
    border: 0;
    border-top: 1px solid var(--sv-bordo, #ebe7dd);
    height: 0;
    opacity: 1;
}
/* Il blocco YouTube in coda: meno enfasi, piu' ordine */
.sv-single-after > .wp-block-paragraph,
.sv-single-after > p {
    text-align: center;
    max-width: 62ch;
    margin-inline: auto;
}
/* ===========================================================================
   BRICIOLE DI PANE
   Rank Math le stampa con l'etichetta "Sei in:" e un trattino come separatore.
   Qui diventano una riga discreta con la freccia, l'ultima voce non cliccabile
   e in evidenza. Nessun secondo sistema: resta il markup di Rank Math, con il
   suo schema strutturato.
   =========================================================================== */

.rank-math-breadcrumb {
    margin-bottom: 1.5rem;
}
.rank-math-breadcrumb p {
    margin: 0;
    font-size: 0.82rem;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: var(--sv-secondario, #5f5a50);
}
/* Via l'etichetta "Sei in:", non aggiunge nulla */
.rank-math-breadcrumb .label {
    display: none;
}
/* Separatore: freccia al posto del trattino */
.rank-math-breadcrumb .separator {
    font-size: 0;
    margin-inline: 0.45rem;
    color: #b3ada0;
}
.rank-math-breadcrumb .separator::after {
    content: "›";
    font-size: 0.95rem;
    line-height: 1;
}
.rank-math-breadcrumb a {
    color: var(--sv-secondario, #5f5a50);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.rank-math-breadcrumb a:hover,
.rank-math-breadcrumb a:focus-visible {
    color: var(--sv-inchiostro, #0c0c0c);
    border-bottom-color: var(--sv-inchiostro, #0c0c0c);
}
/* L'ultima voce e' la pagina corrente: piu' scura e non cliccabile */
.rank-math-breadcrumb .last {
    color: var(--sv-inchiostro, #0c0c0c);
    font-weight: 600;
}
@media (max-width: 640px) {
    .rank-math-breadcrumb p {
        font-size: 0.78rem;
    }
}
/* Le briciole in coda alle pagine usano lo stesso stile di quelle in cima */
.sv-briciole-fondo {
    max-width: 1200px;
    margin: 2.5rem auto 0;
    padding: 1.25rem 1.5rem 0;
    border-top: 1px solid var(--sv-bordo, #ebe7dd);
}
.sv-briciole-fondo .rank-math-breadcrumb {
    margin-bottom: 0;
}
/* ===========================================================================
   DM SANS SU TUTTO IL SITO
   Un solo file variabile copre l'intero arco dei pesi da 300 a 700: quattro
   dichiarazioni separate avrebbero scaricato quattro volte lo stesso font
   (61 KB l'una, perche' DM Sans e' variabile). Qui sono 61 KB in tutto, piu'
   28 KB per il corsivo. Self-hosted: nessuna richiesta verso Google.
   =========================================================================== */
@font-face {
    font-family: "DM Sans";
    font-style: normal;
    font-weight: 300 700;
    font-display: swap;
    src: url("assets/fonts/dmsans-variable-latin.woff2") format("woff2-variations");
}
@font-face {
    font-family: "DM Sans";
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url("assets/fonts/dmsans-400-italic-latin.woff2") format("woff2");
}
:root {
    --sv-font-testo: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
    --sv-font-titoli: "DM Sans", system-ui, sans-serif;
}
body,
button,
input,
select,
textarea,
.sv-home-gb,
.entry-content,
.sidebar,
.site-footer,
.sv-topbar,
.main-navigation {
    font-family: var(--sv-font-testo);
}
/* Titoli: DM Sans con peso pieno e tracciatura stretta, cosi' tengono
   l'impatto che prima veniva dal condensato */
h1, h2, h3, h4, h5, h6,
.sv-display,
.sv-card-title,
.sv-lista__t,
.sv-autore__nome,
.widget-title,
.entry-title {
    font-family: var(--sv-font-titoli);
    font-weight: 700;
    letter-spacing: -0.02em;
}
.sv-display,
.sv-home-gb h1,
.sv-home-gb h2 {
    text-transform: uppercase;
    letter-spacing: -0.01em;
}
.main-navigation a,
.sv-topmenu a,
.sv-topmenu-mobile a {
    font-family: var(--sv-font-testo);
    font-weight: 500;
}
.wp-block-button__link,
.sv-cta,
.sv-side-cta__b {
    font-family: var(--sv-font-testo);
    font-weight: 700;
}
/* ===========================================================================
   DM SANS ANCHE SUI TITOLI DELLA HOME
   Le regole di .sv-display imponevano ancora Fjalla One con una specificita'
   maggiore. Qui vince DM Sans, con peso pieno e tracciatura stretta per
   tenere l'impatto che prima veniva dal carattere condensato.
   =========================================================================== */
.sv-home-gb .sv-display,
.sv-home-gb h1.sv-display,
.sv-home-gb h2.sv-display,
.sv-home-gb h3.sv-display,
.sv-home-gb .sv-display-sub,
.sv-home-gb .sv-card-title,
.sv-home-gb .sv-guide h3,
.sv-single-after .sv-display,
.sv-lista__t,
.sv-autore__nome,
.sv-side-cta__t {
    font-family: "DM Sans", system-ui, sans-serif !important;
    font-weight: 700;
    letter-spacing: -0.025em;
}
/* Il condensato allargava le maiuscole: con DM Sans servono meno spazi */
.sv-home-gb .sv-display {
    line-height: 1.08;
}
/* ===========================================================================
   PAGINA "CHI SONO" (ID 69)
   Il testo era centrato su tutta la larghezza: righe lunghissime, faticose da
   leggere, e paragrafi centrati accanto a liste allineate a sinistra.
   Qui la colonna di lettura ha una misura sensata, la foto ha un trattamento
   suo, e le due liste diventano griglie invece di elenchi puntati di link.
   =========================================================================== */

.page-id-69 .entry-content {
    max-width: 760px;
    margin-inline: auto;
    padding-inline: 1.25rem;
}
.page-id-69 .entry-content p {
    text-align: left;
    max-width: 68ch;
    margin-inline: auto;
    font-size: 18px;
    line-height: 1.7;
}
/* Il titolo resta centrato, il resto no */
.page-id-69 .entry-content h1 {
    text-align: center;
    margin-bottom: 2rem;
}
.page-id-69 .entry-content h2,
.page-id-69 .entry-content h3 {
    text-align: left;
    margin-top: 2.5rem;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--sv-accento, #d8fd45);
    display: inline-block;
}
/* Il ritratto: piu' grande, tondo, staccato dal testo */
.page-id-69 .entry-content img {
    display: block;
    width: 190px;
    height: 190px;
    object-fit: cover;
    border-radius: 50%;
    margin: 0 auto 2rem;
    border: 4px solid #fff;
    box-shadow: 0 4px 18px rgba(12, 12, 12, 0.14);
}
/* Corsi e prodotti: da elenco puntato a griglia di schede */
.page-id-69 .entry-content ul {
    list-style: none;
    margin: 1.25rem 0 2rem;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.6rem;
}
.page-id-69 .entry-content ul li {
    margin: 0;
    padding: 0;
    border: 0;
}
.page-id-69 .entry-content ul li a,
.page-id-69 .entry-content ul li strong {
    display: block;
    background: var(--sv-superficie, #f6f4ee);
    border: 1px solid var(--sv-bordo, #ebe7dd);
    padding: 0.85rem 1rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--sv-inchiostro, #0c0c0c);
    text-decoration: none;
    height: 100%;
    box-sizing: border-box;
    transition: background-color .15s ease, border-color .15s ease;
}
.page-id-69 .entry-content ul li a:hover,
.page-id-69 .entry-content ul li a:focus-visible {
    background: #fff;
    border-color: var(--sv-inchiostro, #0c0c0c);
}
/* Il richiamo alle recensioni diventa un pulsante vero */
.page-id-69 .entry-content p > strong > a,
.page-id-69 .entry-content p > a > strong {
    display: inline-block;
    background: var(--sv-inchiostro, #0c0c0c);
    color: #fff;
    padding: 1.1rem 2rem;
    text-decoration: none;
    font-size: 1.05rem;
}
/* Icone social: piu' grandi e centrate */
.page-id-69 .entry-content .wp-block-social-links,
.page-id-69 .entry-content figure.wp-block-image + p {
    justify-content: center;
    margin-top: 2rem;
}
@media (max-width: 640px) {
    .page-id-69 .entry-content ul {
        grid-template-columns: 1fr;
    }
}
/* ===========================================================================
   PULSANTI, STATO DEFINITIVO
   Erano finiti in inline-flex: con le etichette su due righe (<strong> piu'
   <br>) i due pezzi diventavano elementi affiancati e si accavallavano.
   Qui tornano a blocco con testo centrato, che impila correttamente.
   =========================================================================== */
.wp-block-button__link,
.sv-btn .wp-block-button__link,
.sv-home-gb .wp-block-button__link,
.entry-content .wp-block-button__link {
    display: inline-block;
    text-align: center;
    text-decoration: none;
    border-radius: 0;
    border: 2px solid transparent;
    font-weight: 700;
    font-size: 1.05rem;
    padding: 1.15rem 2.2rem;
    min-height: 0;
}
.wp-block-button__link strong {
    display: block;
    font-size: 1.08em;
    letter-spacing: 0.01em;
}
/* Primaria: lime pieno */
.sv-btn-primaria .wp-block-button__link {
    background-color: #d8fd45;
    color: #0c0c0c;
    border-color: #d8fd45;
    font-size: 1.15rem;
    padding: 1.35rem 2.8rem;
}
.sv-btn-primaria .wp-block-button__link:hover,
.sv-btn-primaria .wp-block-button__link:focus-visible {
    background-color: #c2e63a;
    border-color: #c2e63a;
}
/* Secondaria: nera */
.wp-block-button:not(.sv-btn-primaria) .wp-block-button__link {
    background-color: #0c0c0c;
    color: #ffffff;
    border-color: #0c0c0c;
}
.wp-block-button:not(.sv-btn-primaria) .wp-block-button__link:hover,
.wp-block-button:not(.sv-btn-primaria) .wp-block-button__link:focus-visible {
    background-color: #d8fd45;
    color: #0c0c0c;
    border-color: #d8fd45;
}
/* Sopra l'hero scuro serve il contrasto inverso */
.sv-home-gb .sv-hero .wp-block-button__link {
    background-color: #ffffff;
    color: #0c0c0c;
    border-color: #ffffff;
}
.sv-home-gb .sv-hero .wp-block-button__link:hover {
    background-color: #d8fd45;
    border-color: #d8fd45;
}
/* Sulla fascia recensioni, contorno chiaro */
.sv-home-gb .sv-reviews .wp-block-button__link {
    background-color: transparent;
    color: #ffffff;
    border-color: #4a4a4a;
}
@media (max-width: 640px) {
    .wp-block-button__link,
    .sv-btn-primaria .wp-block-button__link {
        width: 100%;
        padding-inline: 1rem;
        font-size: 1rem;
    }
}
/* Sfondo del sito */
:root {
    --sv-fondo: #fafafa;
    --sv-superficie: #f2f2f2;
    --sv-bordo: #e6e6e6;
}
body,
.site-content,
.page .site-content {
    background-color: #fafafa;
}
/* ===========================================================================
   BREADCRUMB ALLINEATA AL CONTENUTO
   Era gia' a sinistra, ma rientrata di una ventina di pixel rispetto al bordo
   del testo. Qui parte esattamente dove parte il contenuto.
   =========================================================================== */
.rank-math-breadcrumb,
.rank-math-breadcrumb p {
    text-align: left;
    margin-left: 0;
    padding-left: 0;
}
.sv-briciole-fondo {
    padding-left: 0;
    padding-right: 0;
    text-align: left;
}
.page-id-69 .entry-content .rank-math-breadcrumb,
.entry-content .rank-math-breadcrumb {
    margin-inline: 0;
    max-width: none;
}
/* ===========================================================================
   RIGA META DELL'ARTICOLO
   Le emoji sono sostituite da tracciati Phosphor inline, e la firma porta il
   ritratto dell'autore. Il separatore non e' piu' un carattere nel testo ma
   un bordo, cosi' non finisce nei lettori di schermo.
   =========================================================================== */
.sv-post-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1.4rem;
    margin: 0.75rem 0 1.5rem;
    font-size: 0.9rem;
    color: var(--sv-secondario, #5f5a50);
}
.sv-meta-voce {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}
.sv-post-meta .sv-ico {
    width: 17px;
    height: 17px;
    flex: none;
    fill: currentColor;
    opacity: 0.65;
}
.sv-meta-autore img {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    flex: none;
    border: 1px solid var(--sv-bordo, #e6e6e6);
}
.sv-post-meta strong {
    color: var(--sv-inchiostro, #0c0c0c);
    font-weight: 600;
}
.sv-post-meta a {
    color: inherit;
    text-decoration: none;
}
.sv-post-meta a:hover strong {
    text-decoration: underline;
}
/* GeneratePress stampa una sua riga con data e autore: e' un doppione */
.single .entry-meta {
    display: none;
}
/* ===========================================================================
   PAGINA CONTATTI
   Il layout stava dentro Elementor e con il plugin spento restava testo
   grezzo. Ricostruita a blocchi: tre recapiti come schede cliccabili, con
   icone Phosphor inline. Il modulo di Elementor Pro non c'e' piu': al suo
   posto il contatto diretto via email, che funziona senza plugin.
   =========================================================================== */

.sv-contatti-intro {
    font-size: 1.1rem;
    line-height: 1.65;
    margin-bottom: 2rem;
}
.sv-contatti-griglia {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}
.sv-contatto {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 1.5rem 1.25rem;
    background: #ffffff;
    border: 1px solid var(--sv-bordo, #e6e6e6);
    text-decoration: none;
    color: var(--sv-inchiostro, #0c0c0c);
    transition: border-color .15s ease, transform .15s ease;
}
.sv-contatto:hover,
.sv-contatto:focus-visible {
    border-color: var(--sv-inchiostro, #0c0c0c);
    transform: translateY(-2px);
}
.sv-contatto svg {
    width: 26px;
    height: 26px;
    fill: currentColor;
    margin-bottom: 0.4rem;
}
.sv-contatto-et {
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--sv-secondario, #5f5a50);
}
.sv-contatto-val {
    font-size: 1.05rem;
    font-weight: 700;
    word-break: break-word;
}
.sv-contatti-nota {
    font-size: 0.95rem;
    color: var(--sv-secondario, #5f5a50);
    border-left: 3px solid var(--sv-accento, #d8fd45);
    padding-left: 1rem;
}
@media (max-width: 600px) {
    .sv-contatti-griglia { grid-template-columns: 1fr; }
}
/* ===========================================================================
   PULSANTI A DUE RIGHE
   La prima riga (<strong>) e' l'azione e va piu' grande della seconda, che
   la accompagna. Interlinea a 1 per tenere le due righe vicine.
   =========================================================================== */
.wp-block-button__link {
}
.wp-block-button__link strong {
    display: block;
    font-size: 1.35em;
    margin-bottom: 0.32em;
}
/* La seconda riga: piu' piccola, peso normale, senza gridare */
.wp-block-button__link strong + br + * ,
.wp-block-button__link {
    letter-spacing: 0.01em;
}
.sv-btn-primaria .wp-block-button__link {
    font-size: 0.95rem;
    font-weight: 500;
    padding-block: 1.3rem;
}
.sv-btn-primaria .wp-block-button__link strong {
    font-size: 1.45em;
    font-weight: 700;
}
/* Interlinea a 1: serve la stessa specificita' delle regole scritte prima,
   altrimenti quelle con il prefisso .sv-home-gb continuano a vincere. */
.sv-home-gb .wp-block-button__link,
.entry-content .wp-block-button__link,
.sv-btn .wp-block-button__link,
.sv-btn-primaria .wp-block-button__link {
}
.sv-home-gb .wp-block-button__link strong,
.entry-content .wp-block-button__link strong,
.sv-btn .wp-block-button__link strong,
.sv-btn-primaria .wp-block-button__link strong {
    display: block;
    font-size: 1.45em;
    margin-bottom: 0.3em;
    font-weight: 700;
}

/* ===========================================================================
   PULSANTI: REGOLA UNICA PER LE DUE RIGHE
   Le dichiarazioni di interlinea si erano accumulate in sei punti diversi e
   si annullavano fra loro. Qui c'e' una regola sola, con la specificita'
   necessaria a vincere su tutte quelle del tema.
   =========================================================================== */
.sv-home-gb .sv-btn .wp-block-button__link,
.sv-home-gb .wp-block-button__link,
.entry-content .wp-block-button__link,
.wp-block-button .wp-block-button__link {
    line-height: 1;
}

.sv-home-gb .sv-btn .wp-block-button__link strong,
.sv-home-gb .wp-block-button__link strong,
.entry-content .wp-block-button__link strong,
.wp-block-button .wp-block-button__link strong {
    display: block;
    font-size: 1.45em;
    line-height: 1;
    margin-bottom: 0.34em;
    font-weight: 700;
}

/* Lo <strong> della prima riga e' gia' a blocco e va a capo da solo: il <br>
   che lo segue nel markup aggiungeva una riga vuota. Neutralizzato qui, cosi'
   il contenuto resta intatto e continua a funzionare anche in altri contesti. */
.wp-block-button__link br {
    display: none;
}

/* Il titolo della pagina arriva dal tema ed e' a piena larghezza, mentre il
   contenuto sta in una colonna da 760px centrata: i due non si allineavano.
   Qui il titolo segue la stessa colonna. */
.page .entry-header,
.page .entry-header .entry-title {
    max-width: 760px;
    margin-inline: auto;
    padding-inline: 1.25rem;
    box-sizing: border-box;
}

.page .entry-header {
    margin-bottom: 1.5rem;
}

/* Il padding va al contenitore, non al titolo: applicandolo a entrambi il
   titolo rientrava di 20px rispetto al testo. */
.page .entry-header .entry-title {
    max-width: none;
    margin-inline: 0;
    padding-inline: 0;
}

/* Il contenuto della pagina sta in una colonna da 760px senza padding:
   l'intestazione deve avere la stessa misura, altrimenti il titolo rientra. */
.page .entry-header {
    max-width: 760px;
    margin-inline: auto;
    padding-inline: 0;
}

/* ===========================================================================
   CODA DELL'ARTICOLO A PIENA COLONNA
   I blocchi sotto l'articolo erano capati a 760px dentro una colonna da 884,
   quindi rientravano di una sessantina di pixel rispetto al testo.
   =========================================================================== */
.sv-single-after,
.sv-single-after > *,
.sv-single-after .sv-authorbox,
.sv-single-after .sv-cta-sbanco,
.sv-single-after .sv-share,
.sv-single-after .sv-divider,
.sv-single-after > p {
    max-width: none;
    width: auto;
    margin-inline: 0;
}

/* ===========================================================================
   BOX AUTORE
   =========================================================================== */
.sv-single-after .sv-authorbox {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: #ffffff;
    border: 1px solid var(--sv-bordo, #e6e6e6);
    padding: 1.6rem;
    margin: 2.5rem 0;
}

.sv-single-after .sv-authorbox > .wp-block-column {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0;
}

.sv-single-after .sv-authorbox > .wp-block-column:first-child {
    flex: 0 0 auto;
    width: auto;
}

.sv-single-after .sv-authorbox img {
    width: 104px;
    height: 104px;
    object-fit: cover;
    border-radius: 50%;
    display: block;
    border: 3px solid #fff;
    box-shadow: 0 2px 12px rgba(12, 12, 12, .14);
}

.sv-single-after .sv-authorbox h2,
.sv-single-after .sv-authorbox h3,
.sv-single-after .sv-authorbox .wp-block-heading {
    font-size: 1.15rem;
    margin: 0 0 .35rem;
    letter-spacing: -0.01em;
}

.sv-single-after .sv-authorbox p {
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
    color: var(--sv-secondario, #5f5a50);
    max-width: none;
}

/* Etichetta sopra il nome, per dire che ruolo ha chi scrive */
.sv-single-after .sv-authorbox > .wp-block-column:last-child::before {
    content: "Scritto da";
    display: block;
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sv-secondario, #5f5a50);
    margin-bottom: 0.2rem;
}

/* Riquadro CTA e condivisione a piena colonna */
.sv-single-after .sv-cta-sbanco {
    padding: 2.5rem 2rem;
    margin: 2.5rem 0;
}

@media (max-width: 600px) {
    .sv-single-after .sv-authorbox {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    .sv-single-after .sv-authorbox img { margin-inline: auto; }
    .sv-single-after .sv-authorbox > .wp-block-column:last-child::before { text-align: center; }
}

/* ===========================================================================
   VOCI DI MENU LEGGERMENTE PIU' GRANDI
   Da 15 a 16,5px: il menu occupava 711px su 1500 di viewport, quindi lo
   spazio per crescere c'era senza rischiare che vada a capo.
   =========================================================================== */
.main-navigation .menu-item > a,
.main-navigation .menu > li > a {
    font-size: 16.5px;
}

.sv-topmenu a {
    font-size: 14px;
}

/* ===========================================================================
   RECENSIONI SU MOBILE: UNA PER RIGA
   La galleria e' impostata su tre colonne e su telefono ne metteva due per
   riga, larghe 191px: uno screenshot di recensione a quella misura non si
   legge. Sotto i 768px va a colonna singola.
   =========================================================================== */
@media (max-width: 768px) {
    .entry-content .wp-block-gallery.has-nested-images,
    .sv-recensioni .wp-block-gallery.has-nested-images {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    .entry-content .wp-block-gallery.has-nested-images > figure.wp-block-image,
    .sv-recensioni .wp-block-gallery.has-nested-images > figure.wp-block-image {
        width: 100%;
        max-width: 100%;
        flex: 0 0 auto;
        margin: 0;
    }

    .entry-content .wp-block-gallery.has-nested-images > figure.wp-block-image img {
        width: 100%;
        height: auto;
    }
}

/* La regola di WordPress per le gallerie usa la classe columns-N: senza
   quella nel selettore la larghezza calcolata a un terzo continuava a vincere. */
@media (max-width: 768px) {
    .wp-block-gallery.has-nested-images.columns-1 > figure.wp-block-image,
    .wp-block-gallery.has-nested-images.columns-2 > figure.wp-block-image,
    .wp-block-gallery.has-nested-images.columns-3 > figure.wp-block-image,
    .wp-block-gallery.has-nested-images.columns-4 > figure.wp-block-image,
    .wp-block-gallery.has-nested-images.columns-default > figure.wp-block-image {
        width: 100%;
        max-width: 100%;
        flex-basis: 100%;
        flex-grow: 0;
    }

    .wp-block-gallery.has-nested-images > figure.wp-block-image img {
        width: 100%;
        height: auto;
        max-width: 100%;
    }
}

/* ===========================================================================
   GALLERIA A COLONNA SINGOLA SU MOBILE
   WordPress impone width: calc(50% - gap) con il selettore
   figure.wp-block-image:not(#individual-image), che ha la specificita' di un
   ID: nessuna regola a sole classi puo' batterlo. Qui si usa la stessa
   tecnica, cosi' non serve !important.
   =========================================================================== */
@media (max-width: 768px) {
    .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
        width: 100%;
        max-width: 100%;
        flex-basis: 100%;
        flex-grow: 0;
    }
}

/* ===========================================================================
   TESTATA SU MOBILE: LOGO A SINISTRA, HAMBURGER A DESTRA
   =========================================================================== */
@media (max-width: 768px) {
    .site-header .inside-header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        padding-inline: 20px;
    }

    .site-header .inside-header::after {
        content: none;
    }

    .site-header .inside-header > .site-logo,
    .site-header .inside-header > .site-branding {
        flex: 0 0 auto;
        margin: 0;
        order: 1;
    }

    .site-header .inside-header > .main-navigation {
        flex: 0 0 auto;
        margin-left: auto;
        order: 2;
    }

    .main-navigation .menu-toggle {
        margin: 0;
        padding: 0.4rem;
    }
}

/* ===========================================================================
   FAQ A FISARMONICA (blocco core/details)
   Il blocco nativo esce senza stile: solo il triangolino del browser e un
   testo della stessa dimensione del corpo, quindi le domande non si
   distinguono dalle risposte. Qui diventano righe separate da un filetto,
   con un marcatore + / - disegnato in CSS.
   =========================================================================== */
.entry-content details.wp-block-details {
    border-top: 1px solid var(--sv-bordo);
    margin: 0;
    padding: 0;
    background: none;
}
.entry-content details.wp-block-details:last-of-type {
    border-bottom: 1px solid var(--sv-bordo);
}
.entry-content details.wp-block-details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    cursor: pointer;
    list-style: none;
    padding: 1.15rem 0;
    font-family: var(--sv-font-titoli);
    font-size: 1.15rem;
    font-weight: 600;
    line-height: 1.35;
    color: var(--sv-inchiostro);
    transition: color 0.15s ease;
}
.entry-content details.wp-block-details > summary::-webkit-details-marker {
    display: none;
}
.entry-content details.wp-block-details > summary:hover {
    color: var(--sv-secondario);
}
/* marcatore + che diventa - quando la riga e' aperta */
.entry-content details.wp-block-details > summary::after {
    content: "";
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    background:
        linear-gradient(var(--sv-inchiostro), var(--sv-inchiostro)) center/14px 2px no-repeat,
        linear-gradient(var(--sv-inchiostro), var(--sv-inchiostro)) center/2px 14px no-repeat;
    transition: transform 0.2s ease;
}
.entry-content details.wp-block-details[open] > summary::after {
    background: linear-gradient(var(--sv-inchiostro), var(--sv-inchiostro)) center/14px 2px no-repeat;
    transform: rotate(180deg);
}
.entry-content details.wp-block-details[open] > summary {
    padding-bottom: 0.5rem;
}
.entry-content details.wp-block-details > :not(summary) {
    margin: 0 0 1.15rem;
    max-width: 62ch;
    color: var(--sv-secondario);
    line-height: 1.65;
}
@media (prefers-reduced-motion: reduce) {
    .entry-content details.wp-block-details > summary,
    .entry-content details.wp-block-details > summary::after { transition: none; }
}

/* ===========================================================================
   PANNELLO "AGGIORNAMENTO": la CTA dentro gli articoli
   Prima era #f9f9f9 su una pagina #fafafa, un punto di differenza: di fatto
   invisibile. Ora usa il verde acido del sito a piena superficie, che finora
   compariva solo sui pulsanti, cosi' si stacca dal testo senza inventare
   colori nuovi. Il testo passa a sinistra: centrato in un box largo
   somigliava a un banner pubblicitario.
   =========================================================================== */
.entry-content .wp-block-columns.aggiornamento {
    background: var(--sv-accento);
    padding: 2.5rem 2.75rem;
    margin: 3rem 0;
    gap: 0;
}
.entry-content .aggiornamento .wp-block-column {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
}
.entry-content .aggiornamento p {
    color: var(--sv-inchiostro);
    margin: 0;
    max-width: 60ch;
}
.entry-content .aggiornamento p.has-text-align-center {
    text-align: left;
}
.entry-content .aggiornamento p.has-large-font-size {
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.5rem, 2.4vw, 1.95rem);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.015em;
}
.entry-content .aggiornamento .wp-block-buttons {
    justify-content: flex-start;
    margin-top: 0.5rem;
}
.entry-content .aggiornamento .wp-block-button__link {
    background: var(--sv-inchiostro);
    color: #fff;
    border-radius: 0;
    padding: 1.05rem 2.1rem;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.15;
    text-decoration: none;
    transition: background 0.15s ease;
}
.entry-content .aggiornamento .wp-block-button__link:hover {
    background: #2e2e2e;
}
@media (max-width: 600px) {
    .entry-content .wp-block-columns.aggiornamento {
        padding: 1.75rem 1.5rem;
    }
    .entry-content .aggiornamento .wp-block-button__link {
        display: block;
        width: 100%;
        text-align: center;
    }
}

/* ===========================================================================
   GUIDE A DUE COLONNE (.sv-guida)
   Le due colonne non dichiarano una larghezza, quindi WordPress le fa 50/50:
   l'articolo occupa mezza pagina e la colonna di supporto pesa quanto il
   testo. Le proporzioni si sistemano qui, senza toccare il contenuto.
   Sotto i 782px WordPress impila da solo, quindi la regola vale solo sopra.
   =========================================================================== */
@media (min-width: 783px) {
    .sv-guida > .wp-block-group > .wp-block-columns {
        gap: 3.5rem;
        align-items: flex-start;
    }
    .sv-guida > .wp-block-group > .wp-block-columns > .wp-block-column:first-child {
        flex-basis: 65%;
        max-width: 65%;
    }
    .sv-guida > .wp-block-group > .wp-block-columns > .wp-block-column:last-child {
        flex-basis: calc(35% - 3.5rem);
        max-width: calc(35% - 3.5rem);
        position: sticky;
        top: 2rem;
    }
}


/* ===========================================================================
   PAGINA AUTORE
   Tutto resta dentro il contenitore del tema: le fasce a tutta larghezza
   richiedono margini negativi su 100vw, la regola che ha gia' causato
   overflow altrove sul sito.
   =========================================================================== */
.sv-autore-testata {
    background: var(--sv-inchiostro);
    color: #fff;
    margin-bottom: 2.5rem;
}
.sv-autore-testata__interno {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 3rem;
    align-items: center;
    padding: 3rem 3rem 3rem 2.5rem;
}
.sv-autore-testata__foto {
    background: var(--sv-accento);
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    /* 30px per lato su un riquadro da 260: la foto resta ai suoi 200px
       nativi, l'unica versione esistente. Ingrandirla la sfoca. */
    padding: 1.875rem;
}
.sv-autore-testata__foto img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
}
.sv-autore-testata__occhiello {
    color: var(--sv-accento);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin: 0 0 0.5rem;
}
.sv-autore-testata__nome {
    font-family: var(--sv-font-titoli);
    font-size: clamp(2.2rem, 4.2vw, 3.4rem);
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: -0.02em;
    color: #fff;
    margin: 0 0 0.4rem;
    text-wrap: balance;
}
.sv-autore-testata__ruolo {
    color: var(--sv-accento);
    font-size: 1.05rem;
    font-weight: 500;
    margin: 0 0 1.25rem;
}
.sv-autore-testata__bio p {
    color: rgba(255, 255, 255, 0.82);
    font-size: 1rem;
    line-height: 1.65;
    max-width: 62ch;
    margin: 0 0 0.75rem;
}
.sv-autore-testata__bio a {
    color: #fff;
    text-decoration-color: var(--sv-accento);
}
.sv-autore-testata__canali {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1.5rem;
}
.sv-canale {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.7rem 1.15rem;
    border: 1px solid rgba(255, 255, 255, 0.28);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.sv-canale:hover {
    background: var(--sv-accento);
    border-color: var(--sv-accento);
    color: var(--sv-inchiostro);
}

/* striscia dei numeri: sono conteggi reali, non cifre decorative */
.sv-autore-numeri__interno {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--sv-bordo);
    border-bottom: 1px solid var(--sv-bordo);
}
.sv-numero {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 1.5rem 1.25rem;
}
.sv-numero + .sv-numero {
    border-left: 1px solid var(--sv-bordo);
}
.sv-numero svg {
    color: var(--sv-secondario);
    margin-bottom: 0.35rem;
}
.sv-numero__v {
    font-family: var(--sv-font-titoli);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.sv-numero__e {
    color: var(--sv-secondario);
    font-size: 0.92rem;
}

.sv-autore-sezione {
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.4rem, 2.2vw, 1.9rem);
    font-weight: 700;
    letter-spacing: -0.015em;
    margin: 2.75rem 0 1.25rem;
}
.sv-aree-lista {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}
.sv-aree-lista a {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 1rem;
    border: 1px solid var(--sv-bordo);
    background: #fff;
    color: var(--sv-inchiostro);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.98rem;
    transition: border-color 0.15s ease;
}
.sv-aree-lista a:hover {
    border-color: var(--sv-inchiostro);
}
.sv-area__c {
    color: var(--sv-secondario);
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
}

.sv-griglia-autore {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: var(--sv-bordo);
    border: 1px solid var(--sv-bordo);
}
.sv-scheda-autore {
    background: #fff;
    padding: 1.5rem 1.6rem;
}
.sv-scheda-autore__cat {
    color: var(--sv-secondario);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin: 0 0 0.5rem;
}
.sv-scheda-autore__t {
    font-family: var(--sv-font-titoli);
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 0.6rem;
}
.sv-scheda-autore__t a {
    color: var(--sv-inchiostro);
    text-decoration: none;
}
.sv-scheda-autore__t a:hover {
    text-decoration: underline;
    text-decoration-color: var(--sv-accento);
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}
.sv-scheda-autore__d {
    color: var(--sv-secondario);
    font-size: 0.88rem;
    margin: 0;
}
.sv-autore-paginazione {
    margin: 2rem 0 3rem;
}

@media (max-width: 880px) {
    .sv-autore-testata__interno {
        grid-template-columns: 1fr;
        gap: 1.75rem;
        padding: 2rem 1.5rem;
    }
    .sv-autore-testata__foto {
        max-width: 200px;
        min-height: 0;
    }
    .sv-autore-numeri__interno {
        grid-template-columns: 1fr;
    }
    .sv-numero + .sv-numero {
        border-left: 0;
        border-top: 1px solid var(--sv-bordo);
    }
    .sv-griglia-autore {
        grid-template-columns: 1fr;
    }
}
@media (prefers-reduced-motion: reduce) {
    .sv-canale, .sv-aree-lista a { transition: none; }
}

/* Testata della pagina articoli: prima non c'era alcun h1. */
.sv-testata-blog {
    margin: 0 0 2rem;
}
.sv-testata-blog .page-title {
    font-family: var(--sv-font-titoli);
    font-size: var(--sv-h1);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.05;
    margin: 0;
}

/* ===========================================================================
   MODULI DI CATTURA CONTATTI
   =========================================================================== */
.sv-modulo {
    max-width: 520px;
    margin: 2rem 0;
    padding: 1.75rem;
    background: #ffffff;
    border: 1px solid var(--sv-bordo);
}
.sv-campo {
    margin: 0 0 1.1rem;
}
.sv-campo label {
    display: block;
    font-weight: 600;
    font-size: 0.95rem;
    margin-bottom: 0.35rem;
}
.sv-campo input[type="text"],
.sv-campo input[type="email"],
.sv-campo input[type="tel"] {
    width: 100%;
    padding: 0.8rem 0.9rem;
    border: 1px solid var(--sv-bordo);
    border-radius: 0;
    font-family: var(--sv-font-testo);
    font-size: 1rem;
    background: var(--sv-fondo);
    color: var(--sv-inchiostro);
}
.sv-campo input:focus-visible {
    outline: 2px solid var(--sv-inchiostro);
    outline-offset: 1px;
}
.sv-campo--consenso label {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    font-weight: 400;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--sv-secondario);
}
.sv-campo--consenso input {
    margin-top: 0.25rem;
    flex: 0 0 auto;
}
/* la trappola per i bot resta nel flusso ma fuori dallo schermo:
   display:none la renderebbe riconoscibile agli script piu' accorti */
.sv-trappola {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
.sv-invio button {
    display: inline-block;
    width: 100%;
    padding: 1.05rem 2rem;
    background: var(--sv-inchiostro);
    color: #fff;
    border: 0;
    border-radius: 0;
    font-family: var(--sv-font-titoli);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: background 0.15s ease;
}
.sv-invio button:hover {
    background: #2e2e2e;
}
.sv-modulo-esito {
    padding: 1.1rem 1.25rem;
    margin: 0 0 1.25rem;
    font-size: 0.97rem;
}
.sv-modulo-esito--ok {
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
}
.sv-modulo-esito--ko {
    background: #fdeceb;
    border-left: 3px solid #b32d2e;
    color: #6b1d16;
}
.sv-modulo-esito p { margin: 0; }
@media (prefers-reduced-motion: reduce) {
    .sv-invio button { transition: none; }
}

/* ===========================================================================
   PAGINA IPPS - "In Pensione Per Sempre"
   Ricostruzione della landing che Elementor rendeva e che, disattivandolo,
   era rimasta un muro di testo alto 25.000px con una sola immagine.
   Struttura e ritmo replicano la versione in produzione; la tipografia resta
   quella del sito (DM Sans) invece di reintrodurre Fjalla One solo qui.
   La pagina usa il template a tutta larghezza, quindi le fasce sono gia'
   larghe quanto lo schermo e il contenuto si stringe da dentro: nessun
   margine negativo su 100vw.
   =========================================================================== */
.sv-ipps-dentro {
    max-width: 1140px;
    margin-inline: auto;
    padding-inline: 24px;
}
.sv-ipps-stretto {
    max-width: 820px;
}
.page-id-11566 .entry-content > * {
    margin-block: 0;
}

/* --- testata --- */
.sv-ipps-hero {
    background: var(--sv-fondo);
    padding: 3.5rem 0 4rem;
    text-align: center;
}
.sv-ipps-occhiello {
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.4rem, 3.4vw, 2.6rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    line-height: 1;
    margin: 0 0 0.2rem;
}
.sv-ipps-titolo {
    font-family: var(--sv-font-titoli);
    font-size: clamp(2.4rem, 7vw, 5.2rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.035em;
    line-height: 0.95;
    margin: 0 0 1.25rem;
    text-wrap: balance;
}
.sv-ipps-sottotitolo {
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    line-height: 1.5;
    max-width: 46ch;
    margin: 0 auto 2.5rem;
}
.sv-ipps-video {
    position: relative;
    aspect-ratio: 16 / 9;
    max-width: 860px;
    margin-inline: auto;
    background: #000;
}
.sv-ipps-video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* --- titoli di sezione --- */
.sv-ipps-h2 {
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.8rem, 4.4vw, 3.1rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.03em;
    line-height: 1;
    text-align: center;
    margin: 0 0 1.25rem;
    text-wrap: balance;
}
.sv-ipps-h2--chiaro {
    color: #fff;
}

/* --- il numero in evidenza --- */
.sv-ipps-cifra {
    text-align: center;
    margin: 0 0 1.5rem;
}
.sv-ipps-cifra span {
    display: inline-block;
    background: #eaeaea;
    padding: 0.25em 0.5em;
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.7rem, 4.2vw, 3rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.03em;
    line-height: 1.05;
}

/* --- il pulsante verde a due righe --- */
.sv-ipps-bottone-riga {
    text-align: center;
    margin: 2rem 0;
}
.sv-ipps-bottone {
    display: inline-block;
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
    padding: 1.5rem 3.25rem; /* piu' grande su richiesta (era 1.1rem 2.25rem) */
    text-decoration: none;
    line-height: 1.25;
    transition: background 0.15s ease;
}
.sv-ipps-bottone strong {
    display: block;
    font-size: 1.35rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.01em;
}
.sv-ipps-bottone span {
    display: block;
    font-size: 1.05rem;
    margin-top: 0.2em;
    text-transform: uppercase;
}
.sv-ipps-bottone:hover {
    background: #c4e83a;
}

/* --- blocchi di testo --- */
.sv-ipps-testo {
    padding: 2.5rem 0;
}
.sv-ipps-testo p {
    font-size: 1.05rem;
    line-height: 1.65;
    margin: 0 0 1.1rem;
}
.sv-ipps-cta {
    padding: 3rem 0;
    text-align: center;
}
.sv-ipps-cta p {
    max-width: 58ch;
    margin-inline: auto;
}

/* --- schede con spunta --- */
.sv-ipps-punti {
    padding: 1rem 0 3rem;
}
.sv-ipps-griglia {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2.5rem;
    background: var(--sv-superficie);
    padding: 2.75rem;
}
.sv-ipps-punto h3 {
    font-family: var(--sv-font-titoli);
    font-size: 1.3rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.1;
    margin: 0.65rem 0 0.6rem;
}
.sv-ipps-punto p {
    font-size: 0.98rem;
    line-height: 1.6;
    margin: 0;
    color: var(--sv-secondario);
}

/* --- fasce nere --- */
.sv-ipps-nero {
    background: var(--sv-inchiostro);
    color: #fff;
    padding: 4rem 0;
}
.sv-ipps-nero .sv-ipps-griglia {
    background: none;
    padding: 2rem 0 0;
    text-align: center;
}
.sv-ipps-griglia--3 {
    grid-template-columns: repeat(3, 1fr);
    gap: 2.75rem;
}
.sv-ipps-punto--chiaro h3 {
    color: #fff;
}
.sv-ipps-punto--chiaro p {
    color: rgba(255, 255, 255, 0.78);
}

/* --- confronto fra i due corsi --- */
.sv-ipps-confronto {
    padding: 1rem 0 3.5rem;
}
.sv-ipps-duo {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.sv-ipps-colonna {
    padding: 2.5rem 2rem;
    text-align: center;
}
.sv-ipps-colonna h3 {
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.5rem, 2.6vw, 2rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.025em;
    line-height: 1;
    margin: 0.75rem 0 1.25rem;
}
.sv-ipps-colonna p {
    text-align: left;
    font-size: 0.98rem;
    line-height: 1.6;
    margin: 0 0 1rem;
}
.sv-ipps-colonna--no {
    background: var(--sv-superficie);
}
.sv-ipps-colonna--si {
    background: var(--sv-inchiostro);
    color: #fff;
}
.sv-ipps-colonna--si svg {
    color: var(--sv-accento);
}

/* --- tecniche --- */
.sv-ipps-tecniche {
    padding: 0 0 3.5rem;
}
.sv-ipps-tecniche .sv-ipps-griglia {
    background: none;
    padding: 0;
    gap: 2.5rem 3rem;
}
.sv-ipps-tecnica h3 {
    font-family: var(--sv-font-titoli);
    font-size: 1.25rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.1;
    margin: 0 0 0.6rem;
}
.sv-ipps-tecnica p {
    font-size: 0.98rem;
    line-height: 1.6;
    margin: 0;
    color: var(--sv-secondario);
}

.sv-ipps-teams-icona {
    margin-block: 1.5rem 2rem;
}

/* --- prenotazione --- */
.sv-ipps-prenota {
    padding-bottom: 2rem;
    scroll-margin-top: 90px;
}
.sv-ipps-avviso {
    text-align: center;
    font-size: 1.05rem;
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
    text-transform: uppercase;
    font-weight: 600;
    line-height: 1.4;
}
/* Il modulo vive dentro la fascia nera. core/shortcode non genera alcun
   contenitore, quindi lo shortcode e' stato spostato dentro il blocco HTML
   della sezione invece di provare a colorarne il wrapper, che non esiste. */
.sv-ipps-prenota .sv-modulo {
    max-width: 620px;
    margin: 2rem auto 0;
    border: 0;
    padding: 2rem 2.25rem 2.5rem;
}
.sv-ipps-prenota .sv-invio button {
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
}
.sv-ipps-prenota .sv-invio button:hover {
    background: #c4e83a;
}
.page-id-11566 .sv-ipps-nota {
    padding-top: 1.5rem;
}

@media (max-width: 860px) {
    .sv-ipps-griglia,
    .sv-ipps-griglia--3,
    .sv-ipps-duo {
        grid-template-columns: 1fr;
    }
    .sv-ipps-griglia {
        gap: 2rem;
        padding: 1.75rem;
    }
    .sv-ipps-hero { padding: 2.5rem 0 3rem; }
    .sv-ipps-nero { padding: 3rem 0; }
    .sv-ipps-bottone { display: block; padding: 1.3rem 1.25rem; }
    .sv-ipps-bottone strong { font-size: 1.2rem; }
    .sv-ipps-bottone span { font-size: 0.95rem; }
}
@media (prefers-reduced-motion: reduce) {
    .sv-ipps-bottone { transition: none; }
}

/* Segnaposto di Cookie Sentinel dentro il riquadro del video: il fondo nero
   del contenitore rendeva illeggibile l'avviso di consenso. */
.sv-ipps-video .csnt-embed {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.9rem;
    padding: 1.5rem;
    background: var(--sv-superficie);
    color: var(--sv-inchiostro);
    text-align: center;
}
.sv-ipps-video .csnt-embed p {
    margin: 0;
    max-width: 44ch;
    font-size: 0.97rem;
    line-height: 1.5;
    color: var(--sv-secondario);
}
.sv-ipps-video .csnt-embed button,
.sv-ipps-video .csnt-embed a {
    background: var(--sv-inchiostro);
    color: #fff;
    border: 0;
    padding: 0.8rem 1.6rem;
    font-family: var(--sv-font-testo);
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
}

/* I titoli della landing ereditavano il grigio del corpo del testo (#3a3a3a)
   invece del nero dei titoli: qui si dichiara, come fa la CTA del footer. */
.sv-ipps-titolo,
.sv-ipps-occhiello,
.sv-ipps-h2:not(.sv-ipps-h2--chiaro),
.sv-ipps-cifra span,
.sv-ipps-punto h3,
.sv-ipps-tecnica h3,
.sv-ipps-colonna--no h3 {
    color: var(--sv-inchiostro);
}

/* La fascia nera dichiara color:#fff e il modulo, che sta su scheda bianca,
   lo ereditava: le etichette sparivano, bianco su bianco. */
.sv-ipps-prenota .sv-modulo {
    color: var(--sv-inchiostro);
}
.sv-ipps-prenota .sv-campo label {
    color: var(--sv-inchiostro);
}
.sv-ipps-prenota .sv-campo--consenso label {
    color: var(--sv-secondario);
}
.sv-ipps-prenota .sv-modulo a {
    color: var(--sv-inchiostro);
}

/* ===========================================================================
   PAGINA CORSO VINCI SEMPRE (id 11408)
   Ricostruzione in blocchi della landing Elementor: stessa struttura e stesso
   ritmo della produzione (testata con pattern calcio, fascia "come si
   svolge" con bordi inclinati, testo, scheda "in particolare imparerai",
   upgrade opzionale, modulo su fondo nero). Tipografia del sito (DM Sans),
   come per /ipps/. Le icone sono quelle di Font Awesome Free (CC BY 4.0)
   gia' usate dalla versione Elementor, incorporate come SVG.
   =========================================================================== */
.sv-cvs-dentro {
    max-width: 1140px;
    margin-inline: auto;
    padding-inline: 24px;
}
.sv-cvs-stretto {
    max-width: 980px;
}
.page-id-11408 .entry-content > * {
    margin-block: 0;
}

/* --- testata --- */
.sv-cvs-hero {
    position: relative;
    isolation: isolate;
    background: #f0f0f0 url("/wp-content/uploads/2024/02/bg_soccer_ball_pattern-2.jpg") center top / 900px auto repeat;
    padding: 2.75rem 0 4.5rem;
    text-align: center;
}
.sv-cvs-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: #fcfcfc;
    opacity: 0.97;
    z-index: -1;
}
.sv-cvs-occhiello {
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.25rem, 2.5vw, 2.1rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    line-height: 1.1;
    max-width: 22em;
    margin: 0 auto 0.6rem;
    text-wrap: balance;
}
.sv-cvs-titolo {
    font-family: var(--sv-font-titoli);
    font-size: clamp(2.6rem, 6.8vw, 5.5rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.035em;
    line-height: 0.95;
    margin: 0 0 1.75rem;
}

/* video con locandina e pulsante play; l'iframe arriva solo al clic */
.sv-cvs-video {
    position: relative;
    aspect-ratio: 16 / 9;
    max-width: 840px;
    margin: 0 auto 1.75rem;
    background: #000;
    border: 2px solid var(--sv-inchiostro);
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.35);
    overflow: hidden;
}
.sv-cvs-video img,
.sv-cvs-video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.sv-cvs-video img {
    object-fit: cover;
    display: block;
}
.sv-cvs-play {
    position: absolute;
    inset: 0;
    margin: auto;
    width: clamp(110px, 32vw, 200px);
    height: clamp(110px, 32vw, 200px);
    padding: 0;
    border: 0;
    background: none;
    color: #fff;
    cursor: pointer;
    border-radius: 50%;
}
.sv-cvs-play svg {
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0.85;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.45));
    transition: transform 0.3s ease, opacity 0.3s ease;
}
.sv-cvs-play__onda {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 3px solid rgba(255, 255, 255, 0.75);
    animation: sv-cvs-onda 2.2s ease-out infinite;
    pointer-events: none;
}
.sv-cvs-play__onda::after {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    border: 3px solid rgba(255, 255, 255, 0.55);
    animation: sv-cvs-onda 2.2s ease-out 0.7s infinite;
}
@keyframes sv-cvs-onda {
    0%   { transform: scale(0.9); opacity: 0.9; }
    100% { transform: scale(1.6); opacity: 0; }
}
.sv-cvs-video:hover .sv-cvs-play svg,
.sv-cvs-play:focus-visible svg {
    transform: scale(1.08);
    opacity: 1;
}
.sv-cvs-play:focus-visible {
    outline: 3px solid var(--sv-accento);
    outline-offset: 6px;
}

/* --- pulsante verde a due righe, col bordo nero della produzione --- */
.sv-cvs-bottone-riga {
    text-align: center;
    margin: 0;
}
.sv-cvs-bottone {
    display: inline-block;
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
    border: 2px solid var(--sv-inchiostro);
    border-radius: 5px;
    padding: 1rem 2.4rem;
    text-decoration: none;
    line-height: 1.2;
    box-shadow: 0 3px 15px 1px rgba(0, 0, 0, 0.19);
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.sv-cvs-bottone strong {
    display: block;
    font-size: 1.3rem;
    font-weight: 700;
    text-transform: uppercase;
}
.sv-cvs-bottone span {
    display: block;
    font-size: 1.2rem;
    text-transform: uppercase;
}
.sv-cvs-bottone:hover {
    background: #020202;
    color: #fff;
    border-color: #b4b4b4;
}

/* --- come si svolge: fascia chiara con i bordi inclinati --- */
.sv-cvs-modalita {
    background: var(--sv-superficie);
    padding: 5rem 0 5.5rem;
    margin-top: -44px;
    clip-path: polygon(0 44px, 100% 0, 100% 100%, 0 calc(100% - 44px));
    text-align: center;
}
.sv-cvs-griglia-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
}
.sv-cvs-modo svg {
    width: 56px;
    height: 56px;
    color: var(--sv-inchiostro);
}
.sv-cvs-modo h3 {
    font-family: var(--sv-font-titoli);
    font-size: 1.35rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.1;
    margin: 0.75rem 0 0.5rem;
    color: var(--sv-inchiostro);
}
.sv-cvs-modo p {
    font-size: 1.05rem;
    line-height: 1.5;
    margin: 0;
    color: var(--sv-secondario);
}

/* --- testo introduttivo --- */
.sv-cvs-testo {
    padding: 4rem 0 2.5rem;
}
.sv-cvs-testo p {
    font-size: 1.25rem;
    line-height: 1.55;
    margin: 0 0 1rem;
}

/* --- titoli di sezione --- */
.sv-cvs-h2 {
    font-family: var(--sv-font-titoli);
    font-size: clamp(2.2rem, 4.2vw, 3.2rem);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.03em;
    line-height: 1;
    text-align: center;
    margin: 0 0 1.5rem;
    color: var(--sv-inchiostro);
    text-wrap: balance;
}

/* --- in particolare imparerai: scheda con gradiente --- */
.sv-cvs-impari {
    padding: 2rem 0 3rem;
}
.sv-cvs-scheda {
    background: linear-gradient(180deg, #f1f1f1 0%, #ffffff 80%);
    border-radius: 20px;
    padding: 2.5rem 2rem;
}
.sv-cvs-griglia-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2.5rem 3rem;
}
.sv-cvs-voce {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}
.sv-cvs-voce svg {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    color: var(--sv-inchiostro);
}
.sv-cvs-voce h3 {
    font-family: var(--sv-font-titoli);
    font-size: 1.4rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.15;
    margin: 0.35rem 0 0.5rem;
    color: var(--sv-inchiostro);
}
.sv-cvs-voce p {
    font-size: 1.05rem;
    line-height: 1.55;
    margin: 0;
    color: var(--sv-secondario);
}

/* --- upgrade opzionale: due elenchi con la spunta --- */
.sv-cvs-upgrade {
    padding: 2rem 0 4rem;
}
.sv-cvs-upgrade .sv-cvs-griglia-2 {
    gap: 1rem 3rem;
}
.sv-cvs-lista {
    list-style: none;
    margin: 0;
    padding: 0;
}
.sv-cvs-lista li {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    font-size: 1.1rem;
    line-height: 1.5;
    margin: 0 0 0.9rem;
}
.sv-cvs-lista svg {
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    margin-top: 0.1em;
    color: var(--sv-inchiostro);
}

/* --- prenota: fondo nero con le forme, scheda chiara col modulo --- */
.sv-cvs-prenota {
    background: var(--sv-inchiostro) url("/wp-content/uploads/2025/05/a-shape.svg") center / cover no-repeat;
    padding: 4.5rem 0;
    scroll-margin-top: 90px;
    color: #fff;
}
.sv-cvs-scheda-modulo {
    max-width: 620px;
    margin: 0 auto;
    background: var(--sv-fondo);
    color: var(--sv-inchiostro);
    border: 2px solid var(--sv-inchiostro);
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.32);
    padding: 2rem 2rem 1.5rem;
}
.sv-cvs-h2--modulo {
    font-size: clamp(1.4rem, 2.2vw, 1.7rem);
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.15;
    margin-bottom: 1.5rem;
}
.sv-cvs-scheda-modulo .sv-modulo {
    max-width: none;
    margin: 0;
    border: 0;
    padding: 0;
    color: var(--sv-inchiostro);
}
.sv-cvs-scheda-modulo .sv-campo label,
.sv-cvs-scheda-modulo .sv-modulo a {
    color: var(--sv-inchiostro);
}
.sv-cvs-scheda-modulo .sv-campo--consenso label {
    color: var(--sv-secondario);
}
.sv-cvs-scheda-modulo .sv-invio button {
    width: 100%;
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
    border: 2px solid var(--sv-inchiostro);
    border-radius: 5px;
}
.sv-cvs-scheda-modulo .sv-invio button:hover {
    background: #fff;
}
.sv-cvs-nb {
    font-size: 1rem;
    line-height: 1.5;
    margin: 1.25rem 0 0;
}

@media (max-width: 860px) {
    .sv-cvs-griglia-3,
    .sv-cvs-griglia-2 {
        grid-template-columns: 1fr;
    }
    .sv-cvs-griglia-3 { gap: 2rem; }
    .sv-cvs-hero { padding: 2rem 0 3.5rem; }
    .sv-cvs-modalita {
        padding: 4rem 0 4.5rem;
        margin-top: -30px;
        clip-path: polygon(0 30px, 100% 0, 100% 100%, 0 calc(100% - 30px));
    }
    .sv-cvs-scheda { padding: 1.75rem 1.25rem; }
    .sv-cvs-bottone { display: block; }
    .sv-cvs-bottone strong { font-size: 1.15rem; }
    .sv-cvs-bottone span { font-size: 1.05rem; }
    .sv-cvs-voce { align-items: flex-start; }
    .sv-cvs-scheda-modulo { padding: 1.5rem 1.25rem 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
    .sv-cvs-play__onda,
    .sv-cvs-play__onda::after { animation: none; }
    .sv-cvs-play svg,
    .sv-cvs-bottone { transition: none; }
}

/* Correzione /ipps/: nella fascia nera i titoli delle tre schede erano neri
   su nero, perche' la regola generale dei titoli veniva dopo quella chiara. */
.sv-ipps-nero .sv-ipps-punto--chiaro h3 {
    color: #fff;
}

/* Testata /corso-vinci-sempre/: con DM Sans (piu' larga di Fjalla One)
   l'occhiello andava su quattro righe e il titolo su tre; si stringono le
   misure perche' restino, come in produzione, su due righe ciascuno. */
.sv-cvs-occhiello {
    font-size: clamp(1.15rem, 2.3vw, 1.95rem);
    max-width: 36em;
    color: var(--sv-inchiostro);
}
.sv-cvs-titolo {
    font-size: clamp(2.3rem, 5.1vw, 4.4rem);
    letter-spacing: -0.04em;
    color: var(--sv-inchiostro);
}

/* L'occhiello e' un <p>: la regola generale ".entry-content p" (18px) ha
   specificita' maggiore della sola classe, quindi qui si aggiunge il
   contenitore per farlo prevalere. */
.sv-cvs-hero .sv-cvs-occhiello {
    font-size: clamp(1.1rem, 2vw, 1.7rem);
    line-height: 1.15;
    max-width: 40em;
}

/* Testata piu' ariosa: spazio fra occhiello, titolo e video, titolo meno
   compresso. */
.sv-cvs-hero {
    padding-top: 3.5rem;
}
.sv-cvs-hero .sv-cvs-occhiello {
    margin-bottom: 1.5rem;
}
.sv-cvs-titolo {
    letter-spacing: -0.03em;
    line-height: 1;
    margin-bottom: 2.75rem;
}
.sv-cvs-video {
    margin-bottom: 2.25rem;
}
@media (max-width: 860px) {
    .sv-cvs-hero { padding-top: 2.5rem; }
    .sv-cvs-hero .sv-cvs-occhiello { margin-bottom: 1.1rem; }
    .sv-cvs-titolo { margin-bottom: 2rem; }
    .sv-cvs-video { margin-bottom: 1.75rem; }
}

/* Briciola in fondo pagina su fondo bianco a tutta larghezza: fra la fascia
   nera del modulo e la CTA bianca del footer restava una striscia grigia
   (fondo del sito). Il nav prende il bianco per intero e la riga sopra
   resta allineata ai 1200px del contenuto. */
.sv-briciole-fondo {
    max-width: none;
    margin: 0;
    padding: 2.5rem 0 0;
    background: #fff;
    border-top: 0;
}
.sv-briciole-fondo .rank-math-breadcrumb {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.25rem 1.5rem 0;
    border-top: 1px solid var(--sv-bordo, #ebe7dd);
}

/* ===========================================================================
   AVVISO IN TESTA A UN ARTICOLO
   Per contenuti che restano online come riferimento ma descrivono qualcosa
   che non funziona piu'. Volutamente diverso dalle CTA verdi: qui il verde
   direbbe "fai questo", mentre serve un "attenzione, leggi prima".
   =========================================================================== */
.entry-content .sv-avviso {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: #fdf6e3;
    border-left: 3px solid #b2620a;
    padding: 1.25rem 1.5rem;
    margin: 0 0 2rem;
}
.entry-content .sv-avviso svg {
    flex: 0 0 auto;
    color: #b2620a;
    margin-top: 0.15rem;
}
.entry-content .sv-avviso p {
    margin: 0;
    font-size: 0.98rem;
    line-height: 1.6;
    color: #5c4a26;
}
.entry-content .sv-avviso__t {
    font-family: var(--sv-font-titoli);
    font-weight: 700;
    font-size: 1.05rem;
    color: #6b3d05;
    margin-bottom: 0.35rem !important;
}
/* La regola dei link del sito usa due :not(), che pesano come classi: e'
   (0,3,1) contro il (0,2,1) di un semplice discendente. Serve un :not() anche
   qui per pareggiare, altrimenti la sottolineatura resta verde. */
.entry-content .sv-avviso a:not(.wp-block-button__link) {
    color: #6b3d05;
    text-decoration-color: #b2620a;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}
@media (max-width: 600px) {
    .entry-content .sv-avviso {
        padding: 1.1rem 1.15rem;
        gap: 0.75rem;
    }
}

/* Il campo messaggio del modulo contatti. */
.sv-campo textarea {
    width: 100%;
    padding: 0.8rem 0.9rem;
    border: 1px solid var(--sv-bordo);
    border-radius: 0;
    font-family: var(--sv-font-testo);
    font-size: 1rem;
    line-height: 1.5;
    background: var(--sv-fondo);
    color: var(--sv-inchiostro);
    resize: vertical;
}
.sv-campo textarea:focus-visible {
    outline: 2px solid var(--sv-inchiostro);
    outline-offset: 1px;
}

/* ===========================================================================
   LANDING RICOSTRUITE A BLOCCHI (.sv-lp)
   Le pagine che Elementor impaginava e che, disattivandolo, erano rimaste
   testo sfuso. Stessa struttura della pagina IPPS ma con nomi neutri, perche'
   vale per una ventina di pagine diverse.
   Usano il template a tutta larghezza: la fascia e' gia' larga quanto lo
   schermo e il contenuto si stringe da dentro, senza margini negativi su 100vw.
   =========================================================================== */
.sv-lp {
    padding: 2.5rem 0 3rem;
}
.sv-lp-dentro {
    max-width: 860px;
    margin-inline: auto;
    padding-inline: 24px;
}
.sv-lp-largo .sv-lp-dentro {
    max-width: 1140px;
}
.sv-lp h2.sv-lp-h2 {
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.6rem, 3.6vw, 2.5rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.03em;
    line-height: 1.05;
    color: var(--sv-inchiostro);
    margin: 2.25rem 0 1rem;
    text-wrap: balance;
}
.sv-lp h2.sv-lp-h2:first-child {
    margin-top: 0;
}
.sv-lp h3.sv-lp-h3 {
    font-family: var(--sv-font-titoli);
    font-size: 1.25rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.15;
    color: var(--sv-inchiostro);
    margin: 1.75rem 0 0.6rem;
}
.sv-lp p {
    font-size: 1.05rem;
    line-height: 1.68;
    margin: 0 0 1.1rem;
}
.sv-lp ul, .sv-lp ol {
    font-size: 1.05rem;
    line-height: 1.68;
    margin: 0 0 1.3rem;
    padding-left: 1.3rem;
}
.sv-lp li {
    margin-bottom: 0.5rem;
}
.sv-lp figure {
    margin: 1.75rem 0;
}
.sv-lp-bottone-riga {
    text-align: center;
    margin: 2rem 0;
}
.sv-lp-bottone {
    display: inline-block;
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
    padding: 1.05rem 2.1rem;
    font-family: var(--sv-font-titoli);
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.2;
    text-decoration: none;
    transition: background 0.15s ease;
}
.sv-lp-bottone:hover {
    background: #c4e83a;
}
/* schede: erano gli icon-box di Elementor */
.sv-lp-schede {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.5rem;
    margin: 2rem 0;
}
.sv-lp-scheda {
    background: #ffffff;
    border: 1px solid var(--sv-bordo);
    padding: 1.5rem 1.6rem;
}
.sv-lp-scheda h3 {
    font-family: var(--sv-font-titoli);
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    margin: 0 0 0.5rem;
    color: var(--sv-inchiostro);
}
.sv-lp-scheda p {
    font-size: 0.98rem;
    margin: 0;
    color: var(--sv-secondario);
}
.sv-lp-video {
    position: relative;
    aspect-ratio: 16 / 9;
    margin: 2rem 0;
    background: var(--sv-superficie);
}
.sv-lp-video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.sv-lp-social {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 1.5rem 0;
    list-style: none;
    padding: 0;
}
.sv-lp-social a {
    display: inline-block;
    border: 1px solid var(--sv-bordo);
    padding: 0.6rem 1.1rem;
    text-decoration: none;
    color: var(--sv-inchiostro);
    font-weight: 600;
    font-size: 0.95rem;
}
.sv-lp-social a:hover {
    border-color: var(--sv-inchiostro);
}
@media (max-width: 600px) {
    .sv-lp { padding: 1.75rem 0 2.25rem; }
    .sv-lp-bottone { display: block; }
}
@media (prefers-reduced-motion: reduce) {
    .sv-lp-bottone { transition: none; }
}

/* ===========================================================================
   SIDEBAR: UN BLOCCO SOLO
   Le regole della colonna erano sparse in sette punti del file e si
   sovrascrivevano a vicenda. Il risultato: due stili di titolo (h2 nativo
   senza filetto, paragrafo custom con filetto ed emoji), due corpi per i
   link (1.05rem nelle liste native, 0.9rem in quelle custom), sottolineatura
   nera su ogni voce e il nome dell'autore sottolineato per errore.
   Qui c'e' tutto, una volta sola: titoli uguali per i quattro elenchi,
   voci separate da un filetto, link senza sottolineatura (compare al
   passaggio del mouse), riquadro autore bianco e invito YouTube su fondo
   nero con il pulsante lime, come la fascia CTA in fondo all'articolo.
   Vale anche per la sidebar incorporata dallo shortcode [sv_sidebar_blog].
   =========================================================================== */
.sidebar .widget,
.sidebar .widget_custom_html,
.sidebar .widget_block {
    background: transparent;
    border: 0;
    padding: 0;
    box-shadow: none;
    margin: 0 0 2.5rem;
    font-size: 1rem;
}
.sidebar .widget:last-child {
    margin-bottom: 0;
}

/* Titoli degli elenchi: h2 nativi e paragrafi custom, stesso disegno */
.sidebar .widget-title,
.sidebar .sv-lista__t {
    font-family: var(--sv-font-titoli);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.3;
    color: var(--sv-inchiostro);
    margin: 0;
    padding: 0 0 0.6rem;
    border-bottom: 2px solid var(--sv-inchiostro);
}

/* Elenchi: una voce per riga, filetto tra le righe, niente sottolineatura */
.sidebar .widget ul,
.sidebar .sv-lista ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.sidebar .widget ul li,
.sidebar .sv-lista li {
    margin: 0;
    padding: 0;
    border-bottom: 1px solid var(--sv-bordo);
    font-size: 0.95rem;
    line-height: 1.4;
}
.sidebar .widget ul li a,
.sidebar .sv-lista a {
    display: block;
    padding: 0.7rem 0;
    color: var(--sv-inchiostro);
    font-weight: 500;
    text-decoration: none;
}
.sidebar .widget ul li a:hover,
.sidebar .widget ul li a:focus-visible,
.sidebar .sv-lista a:hover,
.sidebar .sv-lista a:focus-visible {
    text-decoration: underline;
    text-decoration-color: var(--sv-inchiostro);
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}
/* L'articolo aperto e' segnato nella lista */
.sidebar .widget ul li a[aria-current="page"] {
    font-weight: 700;
    padding-left: 0.75rem;
    border-left: 3px solid var(--sv-inchiostro);
}

/* Riquadro autore: bianco, bordo 1px, foto tonda su fondo neutro */
.sidebar .sv-autore {
    text-align: center;
    background: #fff;
    border: 1px solid var(--sv-bordo);
    padding: 1.75rem 1.25rem 1.5rem;
}
.sidebar .sv-autore p {
    margin: 0;
    font-size: inherit;
    line-height: inherit;
}
.sidebar .sv-autore__foto {
    display: inline-block;
    line-height: 0;
}
.sidebar .sv-autore__foto img {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 50%;
    border: 0;
    box-shadow: none;
    background: var(--sv-superficie);
}
.sidebar .sv-autore__nome {
    font-family: var(--sv-font-titoli);
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    text-transform: none;
    line-height: 1.2;
    margin: 1rem 0 0.25rem;
}
.sidebar .sv-autore__nome a {
    color: var(--sv-inchiostro);
    text-decoration: none;
}
.sidebar .sv-autore__nome a:hover,
.sidebar .sv-autore__nome a:focus-visible {
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}
.sidebar .sv-autore__ruolo {
    font-size: 0.9rem;
    line-height: 1.4;
    color: var(--sv-secondario);
    margin: 0 0 1rem;
}
.sidebar .sv-autore__link {
    display: inline-block;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--sv-inchiostro);
    text-decoration: none;
    border-bottom: 2px solid var(--sv-inchiostro);
    padding-bottom: 2px;
}
.sidebar .sv-autore__link:hover,
.sidebar .sv-autore__link:focus-visible {
    border-bottom-color: var(--sv-secondario);
}

/* Invito YouTube: pannello nero pieno con il pulsante lime */
.sidebar .sv-side-cta {
    background: var(--sv-inchiostro);
    color: #fff;
    border: 0;
    padding: 1.75rem 1.25rem;
    text-align: center;
}
.sidebar .sv-side-cta p {
    margin: 0 0 0.6rem;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #fff;
}
.sidebar .sv-side-cta p:last-child {
    margin: 0.4rem 0 0;
}
.sidebar .sv-side-cta__t {
    font-family: var(--sv-font-titoli);
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
    text-transform: none;
    color: #fff;
}
.sidebar .sv-side-cta__b {
    display: inline-block;
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: 0.04em;
    padding: 0.8rem 1.5rem;
    text-decoration: none;
}
.sidebar .sv-side-cta__b:hover,
.sidebar .sv-side-cta__b:focus-visible {
    background: #fff;
    color: var(--sv-inchiostro);
}

/* Sotto i 768px la colonna scende sotto l'articolo: un filetto la separa */
@media (max-width: 768px) {
    .is-right-sidebar .inside-right-sidebar {
        margin-top: 2.5rem;
        padding-top: 2.5rem;
        border-top: 1px solid var(--sv-bordo);
    }
}

/* Dentro l'articolo (shortcode [sv_sidebar_blog]) la regola dei link del
   contenuto ha una specificita' maggiore e rimetterebbe la sottolineatura su
   ogni voce: qui vince la colonna, con lo stesso passaggio del mouse. */
.entry-content .sv-sidebar-incorporata a:not(.sv-side-cta__b):not(.sv-autore__link) {
    text-decoration: none;
}
.entry-content .sv-sidebar-incorporata a:not(.sv-side-cta__b):not(.sv-autore__link):hover,
.entry-content .sv-sidebar-incorporata a:not(.sv-side-cta__b):not(.sv-autore__link):focus-visible {
    text-decoration: underline;
    text-decoration-color: var(--sv-inchiostro);
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

/* ===========================================================================
   BOTTONE SBANCOBET NEGLI ARTICOLI (.sv-cta-sbancobet)
   Dal 22/09/2026 vale anche per il bottone del riquadro in fondo a ogni pagina
   (parts/footer-cta.php), scritto direttamente con classe, span e freccia.
   Il filtro in functions.php riconosce il blocco Pulsante che porta a
   sbancobet.net, gli toglie raggio e padding inline e gli aggiunge classe,
   span del testo e freccia. Prima: angoli a 5px estranei al sistema, testo
   gonfiato a 24px dalla regola dei pulsanti a due righe, nessuna reazione
   oltre al cursore. Ora: angoli vivi, bordo 2px, corpo normale; al passaggio
   il nero entra da sinistra e il testo diventa lime, la freccia scorre; ogni
   quattro secondi la freccia fa due piccoli scatti per richiamare l'occhio;
   entrando nella finestra il pulsante sale di 16px (solo nei browser con
   animation-timeline, gli altri lo vedono fermo). Con prefers-reduced-motion
   resta tutto fermo.
   =========================================================================== */
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.7em;
    width: auto;
    max-width: 100%;
    min-height: 0;
    padding: 1.15rem 2rem;
    border: 2px solid var(--sv-inchiostro);
    border-radius: 0;
    background-color: var(--sv-accento);
    color: var(--sv-inchiostro) !important; /* .has-black-color di WP e' !important */
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.02em;
    text-align: center;
    text-decoration: none;
    transition: color .3s ease;
}
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--sv-inchiostro);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .35s cubic-bezier(.65, 0, .35, 1);
}
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet:hover,
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet:focus-visible {
    color: var(--sv-accento) !important;
}
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet:hover::before,
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet:focus-visible::before {
    transform: scaleX(1);
}
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet:focus-visible {
    outline: 3px solid var(--sv-inchiostro);
    outline-offset: 3px;
}
/* Il testo: la regola dei pulsanti a due righe lo portava a 1.45em a blocco */
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet .sv-cta-sbancobet__testo,
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet strong {
    display: inline;
    font-size: 1em;
    line-height: inherit;
    margin: 0;
    font-weight: 700;
}
.sv-cta-sbancobet__ico {
    flex: 0 0 auto;
    width: 1.15em;
    height: 1.15em;
    fill: currentColor;
    transition: transform .3s cubic-bezier(.65, 0, .35, 1);
    animation: sv-cta-freccia 4s ease-in-out infinite;
}
/* Richiamo: due piccoli scatti della freccia ogni quattro secondi */
@keyframes sv-cta-freccia {
    0%, 62%, 76%, 100% { transform: translateX(0); }
    68% { transform: translateX(6px); }
    84% { transform: translateX(4px); }
}
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet:hover .sv-cta-sbancobet__ico,
:is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet:focus-visible .sv-cta-sbancobet__ico {
    animation: none;
    transform: translateX(6px);
}
/* Ingresso: sale di 16px mentre entra nella finestra */
@keyframes sv-cta-entra {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: none; }
}
@supports (animation-timeline: view()) {
    :is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet {
        animation: sv-cta-entra linear both;
        animation-timeline: view();
        animation-range: entry 0% cover 20%;
    }
}
@media (prefers-reduced-motion: reduce) {
    :is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet,
    :is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet::before,
    .sv-cta-sbancobet__ico {
        animation: none;
        transition: none;
    }
}
@media (max-width: 640px) {
    :is(.entry-content, .sv-cta-footer) .wp-block-button__link.sv-cta-sbancobet {
        width: 100%;
        padding: 1.05rem 1.1rem;
        font-size: 1rem;
        gap: 0.6em;
    }
}

/* ===========================================================================
   CITAZIONI (.sv-citazione)
   Paragrafi interamente in corsivo, marcati dal filtro in functions.php.
   Con i 18px e l'interlinea 1.6 del testo, da mobile occupavano troppo:
   corpo di un punto piu' piccolo, interlinea piu' stretta, e un filetto a
   sinistra che li fa leggere come citazione. Il margine sotto resta quello
   dei paragrafi (lo impone .entry-content > [class*="wp-block-"] con
   specificita' 0,4,0): ogni paragrafo ha il suo tratto di filetto.
   =========================================================================== */
.entry-content p.sv-citazione {
    font-size: 1.0625rem;
    line-height: 1.55;
    padding-left: 1rem;
    border-left: 2px solid var(--sv-secondario);
}
@media (max-width: 768px) {
    .entry-content p.sv-citazione {
        font-size: 1rem;
        line-height: 1.5;
    }
}

/* ===========================================================================
   PARAGRAFI GRANDI (.has-large-font-size)
   Sono la citazione d'apertura di alcune recensioni e qualche riga in
   evidenza (4 articoli). Il preset "large" e' 36px e il paragrafo ereditava
   l'interlinea 1.6 del testo: 57px di riga, e su mobile un blocco alto 400px.
   Interlinea da titolo a tutte le misure; sotto i 768px il corpo scende a
   24px. Il preset di WordPress e' !important, quindi serve anche qui.
   =========================================================================== */
.entry-content p.has-large-font-size {
    line-height: 1.3;
}
@media (max-width: 768px) {
    .entry-content p.has-large-font-size {
        font-size: 1.5rem !important;
    }
}

/* ===========================================================================
   LOGHI DEI CANALI NELLA HOME: SVG INLINE
   Le due immagini puntavano alla cache delle miniature di Elementor
   (/uploads/elementor/thumbs/), sparita con Elementor: 404 e testo
   alternativo a vista. Al loro posto i glifi Phosphor youtube-logo e
   telegram-logo come tracciati inline nel contenuto della home, nel nero
   del sistema; il contenitore .sv-channel-logo (64px, flex) resta quello.
   =========================================================================== */
.sv-home-gb .sv-channel-logo .sv-channel-ico {
    width: 56px;
    height: 56px;
    fill: var(--sv-inchiostro);
    display: block;
}

/* ===========================================================================
   ARCHIVI: BLOG, CATEGORIE, RICERCA
   Il loop di GeneratePress stampava titoli blu, pulsante "Leggi Articolo" blu e
   meta con l'autore vuoto. Il child ha ora un content.php proprio (scheda con
   immagine, categoria, titolo, data, tempo di lettura, estratto); qui lo stile.
   Le colonne restano quelle di GeneratePress (due, con la sidebar).
   =========================================================================== */
.blog .page-header, .archive .page-header { margin-bottom: 2rem; }
.blog .page-title, .archive .page-title, .search .page-title { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.05; color: var(--sv-inchiostro); margin-bottom: 0.4rem; }
.archive .taxonomy-description { max-width: 70ch; color: var(--sv-secondario); font-size: 1.05rem; }
.generate-columns-container { display: flex; flex-wrap: wrap; gap: 24px; margin: 0; }
.generate-columns-container .generate-columns { display: flex; padding: 0; margin: 0; float: none; }
.generate-columns-container .generate-columns.grid-50 { width: calc(50% - 12px); }
@media (max-width: 768px) { .generate-columns-container .generate-columns.grid-50 { width: 100%; } }
.sv-scheda-articolo { display: flex; flex-direction: column; width: 100%; background: #fff; border: 1px solid var(--sv-bordo); margin-bottom: 0; }
.sv-scheda__immagine { display: block; aspect-ratio: 16 / 9; background: #f2f2f2; overflow: hidden; border-bottom: 1px solid var(--sv-bordo); }
.sv-scheda__immagine img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sv-scheda__segnaposto { display: flex; align-items: flex-end; height: 100%; padding: 1.25rem 1.5rem; box-sizing: border-box; background: #f2f2f2; }
.sv-scheda__segnaposto span { font-family: var(--sv-font-titoli); font-weight: 700; font-size: 1.35rem; line-height: 1.15; text-transform: uppercase; letter-spacing: -0.01em; color: var(--sv-inchiostro); box-shadow: inset 0 -0.55em 0 var(--sv-accento); }
.sv-scheda__corpo { display: flex; flex-direction: column; gap: 0.55rem; padding: 1.25rem 1.5rem 1.5rem; flex: 1; }
.sv-scheda__categoria { align-self: flex-start; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sv-inchiostro); text-decoration: none; border-bottom: 2px solid var(--sv-accento); }
.sv-scheda__categoria:hover { border-bottom-color: var(--sv-inchiostro); }
.sv-scheda__titolo { font-size: 1.4rem; line-height: 1.2; margin: 0; font-weight: 700; letter-spacing: -0.01em; }
.sv-scheda__titolo a { color: var(--sv-inchiostro); text-decoration: none; }
.sv-scheda__titolo a:hover { text-decoration: underline; text-decoration-color: var(--sv-accento); text-decoration-thickness: 3px; text-underline-offset: 3px; }
.sv-scheda__meta { margin: 0; font-size: 0.9rem; color: var(--sv-secondario); }
.sv-scheda__estratto { margin: 0; font-size: 1rem; line-height: 1.55; color: #2b2925; }
.sv-scheda__link { margin-top: auto; padding-top: 0.75rem; display: inline-flex; align-items: center; gap: 0.45em; font-weight: 700; color: var(--sv-inchiostro); text-decoration: none; }
.sv-scheda__link .sv-ico { width: 1.05em; height: 1.05em; transition: transform 0.2s ease; }
.sv-scheda__link:hover .sv-ico { transform: translateX(4px); }
.sv-scheda__link:hover { text-decoration: underline; text-decoration-color: var(--sv-accento); text-decoration-thickness: 3px; text-underline-offset: 3px; }
/* Paginazione: numeri squadrati, corrente in nero */
.paging-navigation { margin-top: 2rem; }
.paging-navigation .nav-links { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.paging-navigation .nav-links > * { padding: 0.55rem 0.9rem; border: 1px solid var(--sv-inchiostro); text-decoration: none; font-weight: 600; color: var(--sv-inchiostro); background: #fff; }
.paging-navigation .nav-links .current { background: var(--sv-inchiostro); color: #fff; }
.paging-navigation .nav-links a:hover { background: var(--sv-accento); }
@media (max-width: 768px) { .sv-scheda__corpo { padding: 1rem 1.15rem 1.25rem; } .sv-scheda__titolo { font-size: 1.25rem; } }

/* Footer da mobile: le colonne si impilano e il gruppo non ha piu' il
   rientro laterale; testo e titoli finivano attaccati al bordo. */
@media (max-width: 781px) {
    .sv-footer {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }
    .sv-footer > .wp-block-columns {
        gap: 1.5rem;
    }
    .sv-footer-links li {
        padding-left: 0;
    }
}
@media (max-width: 781px) {
    /* gli elenchi del footer non usano .sv-footer-links: via il rientro dell ul */
    .sv-footer .wp-block-column ul {
        padding-left: 0;
        margin-left: 0;
    }
}

/* ---------------------------------------------------------------------------
   LANDING A BLOCCHI: TITOLO PROPRIO
   Il titolo del tema (.entry-title, incolonnato a 760px) e' spento sulle
   pagine .sv-lp che aprono con un'intestazione: quella diventa l'h1.
   --------------------------------------------------------------------------- */
.sv-lp h1.sv-lp-h1 {
    font-family: var(--sv-font-titoli);
    font-size: clamp(2rem, 4.6vw, 3.25rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.03em;
    line-height: 1.02;
    color: var(--sv-inchiostro);
    margin: 0 0 1.25rem;
    text-wrap: balance;
}
.sv-lp .sv-lp-sopra {
    font-weight: 400;
}
/* variante centrata (risorse gratuite): testata e sezioni al centro,
   paragrafi in colonna da 760px */
.sv-lp-centro .sv-lp-h1,
.sv-lp-centro h2.sv-lp-h2,
.sv-lp-centro .sv-lp-intro {
    text-align: center;
}
.sv-lp-centro .sv-lp-dentro > p {
    max-width: 760px;
    margin-inline: auto;
}
/* schede centrate con icona Phosphor e bottone dentro */
.sv-lp-schede-centro .sv-lp-scheda {
    text-align: center;
    padding: 2rem 1.6rem;
}
.sv-lp-schede-centro .sv-lp-scheda h3 {
    font-size: 1.35rem;
    letter-spacing: -0.02em;
}
.sv-lp-schede-centro .sv-lp-scheda h3 span {
    display: block;
    font-weight: 400;
    font-size: 0.85em;
}
.sv-lp-scheda .sv-lp-icona {
    display: block;
    width: 52px;
    height: 52px;
    margin: 0 auto 1rem;
    fill: var(--sv-inchiostro);
}
.sv-lp-scheda .sv-lp-bottone-riga {
    margin: 1.4rem 0 0;
}
.sv-lp-scheda .sv-lp-bottone {
    font-size: 0.9rem;
    padding: 0.85rem 1.4rem;
}

/* loghi veri dei canali (originali in uploads/2026/03) al posto delle icone */
.sv-lp-scheda .sv-lp-logo {
    display: block;
    height: 52px;
    width: auto;
    margin: 0 auto 1rem;
}

/* ===========================================================================
   SCHEDE PRODOTTO (.sv-prodotti) - 11/09/2026
   /sistemi-scommesse/ (12708) e /corsi-di-betting-e-trading-sportivo/ (5459):
   griglia di schede con immagine, etichetta, nome, descrizione, tre righe di
   dati separate da filetti e pulsante a tutta larghezza in fondo (le schede di
   una riga finiscono alla stessa altezza). Angoli vivi, niente ombre.
   Le immagini "scatola" (mockup dei pacchetti) stanno intere su fondo bianco,
   le copertine riempiono il riquadro.
   =========================================================================== */
.sv-lp .sv-lp-intro {
    font-size: 1.2rem;
    line-height: 1.6;
    max-width: 780px;
}
.sv-lp h2[id] {
    scroll-margin-top: 6rem;
}
.sv-prodotti {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
    margin: 2.25rem 0 2.5rem;
}
.sv-prodotti--tre {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}
.sv-prodotto {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--sv-bordo);
}
.sv-lp .sv-prodotto-img {
    margin: 0;
    aspect-ratio: 16 / 9;
    background: #fff;
    border-bottom: 1px solid var(--sv-bordo);
    overflow: hidden;
}
.sv-prodotto-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.sv-prodotto-img--scatola img {
    object-fit: contain;
    padding: 1.1rem;
}
.sv-prodotto-corpo {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 1.6rem 1.75rem 1.75rem;
}
.sv-lp .sv-prodotto-corpo p {
    font-size: 1.0625rem;
    line-height: 1.6;
    margin: 0;
}
.sv-lp .sv-prodotto-corpo .sv-prodotto-etichetta {
    align-self: flex-start;
    margin: 0 0 0.9rem;
    padding: 0.3rem 0.6rem;
    background: var(--sv-inchiostro);
    color: #fff;
    font-family: var(--sv-font-titoli);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.2;
    text-transform: uppercase;
}
.sv-lp .sv-prodotto-corpo .sv-prodotto-etichetta--premium {
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
}
.sv-lp .sv-prodotto .sv-prodotto-nome {
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.5rem, 2.3vw, 1.9rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.025em;
    line-height: 1.05;
    color: var(--sv-inchiostro);
    margin: 0 0 0.8rem;
    text-wrap: balance;
}
.sv-prodotti--tre .sv-prodotto .sv-prodotto-nome {
    font-size: clamp(1.4rem, 1.9vw, 1.65rem);
}
.sv-lp .sv-prodotto-dati {
    margin: 1.25rem 0 1.6rem;
    padding: 0;
    border-top: 1px solid var(--sv-bordo);
    font-size: 1rem;
    line-height: 1.45;
}
.sv-prodotto-dati div {
    display: grid;
    grid-template-columns: 7rem minmax(0, 1fr);
    gap: 1rem;
    padding: 0.65rem 0;
    border-bottom: 1px solid var(--sv-bordo);
}
.sv-prodotto-dati dt {
    margin: 0;
    padding-top: 0.2em;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--sv-inchiostro);
}
.sv-prodotto-dati dd {
    margin: 0;
    color: var(--sv-secondario);
}
.sv-lp .sv-prodotto-corpo .sv-lp-bottone-riga {
    margin: auto 0 0;
    text-align: left;
}
.sv-prodotto .sv-lp-bottone {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    width: 100%;
    border: 2px solid var(--sv-inchiostro);
    transition: background 0.15s ease, color 0.15s ease;
}
.sv-prodotto .sv-lp-bottone svg {
    flex: 0 0 auto;
    width: 1.3em;
    height: 1.3em;
    fill: currentColor;
    transition: transform 0.2s ease;
}
.sv-prodotto .sv-lp-bottone:hover {
    background: var(--sv-inchiostro);
    color: var(--sv-accento);
}
.sv-prodotto .sv-lp-bottone:hover svg {
    transform: translateX(4px);
}
/* salti alle sezioni (pagina corsi) */
.sv-lp .sv-prodotti-salti {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    list-style: none;
    margin: 1.75rem 0 0;
    padding: 0;
}
.sv-lp .sv-prodotti-salti li {
    margin: 0;
}
.sv-prodotti-salti a {
    display: inline-block;
    border: 2px solid var(--sv-inchiostro);
    padding: 0.65rem 1.2rem;
    font-family: var(--sv-font-titoli);
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--sv-inchiostro);
    text-decoration: none;
}
.sv-prodotti-salti a:hover {
    background: var(--sv-inchiostro);
    color: #fff;
}
.sv-lp .sv-prodotti-contatto {
    text-align: left;
    margin: 1.5rem 0 2.5rem;
}
/* avvertenza in coda: filetto a sinistra come le citazioni degli articoli */
.sv-lp .sv-prodotti-nota {
    max-width: 780px;
    margin: 2.5rem 0 0;
    padding-left: 1rem;
    border-left: 2px solid var(--sv-inchiostro);
    font-size: 1rem;
    line-height: 1.6;
    color: var(--sv-secondario);
}
@media (max-width: 1024px) {
    .sv-prodotti--tre {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 760px) {
    .sv-prodotti,
    .sv-prodotti--tre {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.5rem;
    }
    .sv-prodotto-corpo {
        padding: 1.35rem 1.25rem 1.5rem;
    }
    .sv-prodotto-dati div {
        grid-template-columns: 6.25rem minmax(0, 1fr);
        gap: 0.75rem;
    }
    .sv-lp .sv-lp-intro {
        font-size: 1.1rem;
    }
}
@media (prefers-reduced-motion: reduce) {
    .sv-prodotto .sv-lp-bottone,
    .sv-prodotto .sv-lp-bottone svg {
        transition: none;
    }
}

/* ---------------------------------------------------------------------------
   CORSO VINCI SEMPRE: FONDI A TINTA UNITA (11/09/2026)
   La testata aveva il pattern di palloni disegnati sotto un velo bianco al
   97%: da vicino sembrava un grigio sporco. Ora e' nera piena, col nome del
   corso in lime (span .sv-cvs-titolo-nome nel contenuto); la fascia inclinata
   che segue lascia vedere il nero nel taglio. Via anche la sfumatura con
   angoli tondi della scheda "in particolare imparerai" e le forme generate
   (a-shape.svg) dietro al modulo.
   --------------------------------------------------------------------------- */
.sv-cvs-hero {
    background: var(--sv-inchiostro);
    color: #fff;
}
.sv-cvs-hero::before {
    content: none;
}
.sv-cvs-hero .sv-cvs-occhiello {
    color: #e6e6e6;
}
.sv-cvs-hero .sv-cvs-titolo {
    color: #fff;
}
.sv-cvs-titolo .sv-cvs-titolo-nome {
    color: var(--sv-accento);
}
.sv-cvs-hero .sv-cvs-video {
    border: 1px solid #3a3a3a;
    border-radius: 0;
    box-shadow: none;
}
.sv-cvs-hero .sv-cvs-bottone {
    box-shadow: none;
}
.sv-cvs-hero .sv-cvs-bottone:hover {
    background: #fff;
    color: var(--sv-inchiostro);
    border-color: #fff;
}
.sv-cvs-scheda {
    background: #fff;
    border: 1px solid var(--sv-bordo);
    border-radius: 0;
}
.sv-cvs-prenota {
    background: var(--sv-inchiostro);
}
.sv-cvs-scheda-modulo {
    border-color: #fff;
    border-radius: 0;
    box-shadow: none;
}

/* ---------------------------------------------------------------------------
   PAGINA 404 (content-404.php del child) - 11/09/2026
   "4 pallone 4": il pallone Phosphor su disco lime entra rotolando e ogni
   4 secondi fa un palleggio. Fermo con prefers-reduced-motion.
   --------------------------------------------------------------------------- */
.error404 .inside-article.sv-404 {
    max-width: 820px;
    margin-inline: auto;
    padding: 3.5rem 24px 4.5rem;
    background: transparent;
    text-align: center;
}
.sv-404 .sv-404-numero {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.03em;
    margin: 0 0 1.75rem;
    font-family: var(--sv-font-titoli);
    font-size: clamp(7rem, 22vw, 13rem);
    font-weight: 800;
    letter-spacing: -0.05em;
    line-height: 0.85;
    color: var(--sv-inchiostro);
}
.sv-404-palla {
    flex: 0 0 auto;
    width: 0.74em;
    height: 0.74em;
    animation: sv-404-rotola 1.2s cubic-bezier(0.2, 0.8, 0.3, 1) both,
               sv-404-palleggio 4s ease-in-out 1.8s infinite;
}
.sv-404-palla circle {
    fill: var(--sv-accento);
}
.sv-404-palla path {
    fill: var(--sv-inchiostro);
}
@keyframes sv-404-rotola {
    from { transform: translateX(-1.6em) rotate(-420deg); opacity: 0; }
    35%  { opacity: 1; }
    to   { transform: none; opacity: 1; }
}
@keyframes sv-404-palleggio {
    0%, 80%, 100% { transform: none; }
    86% { transform: translateY(-0.16em); }
    92% { transform: none; }
    96% { transform: translateY(-0.05em); }
}
.sv-404 .sv-404-titolo {
    font-family: var(--sv-font-titoli);
    font-size: clamp(2rem, 4.8vw, 3.25rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.03em;
    line-height: 1.02;
    color: var(--sv-inchiostro);
    margin: 0 0 1rem;
    text-wrap: balance;
}
.sv-404 .sv-404-testo {
    max-width: 36em;
    margin: 0 auto 2rem;
    font-size: 1.2rem;
    line-height: 1.6;
    color: var(--sv-secondario);
}
.sv-404-cerca {
    display: flex;
    max-width: 560px;
    margin: 0 auto 2.25rem;
    border: 2px solid var(--sv-inchiostro);
    background: #fff;
}
.sv-404-cerca input[type="search"] {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    padding: 1rem 1.1rem;
    font-size: 1.0625rem;
    color: var(--sv-inchiostro);
    outline-offset: -4px;
}
.sv-404-cerca button {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border: 0;
    border-left: 2px solid var(--sv-inchiostro);
    border-radius: 0;
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
    padding: 0 1.3rem;
    font-family: var(--sv-font-titoli);
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
}
.sv-404-cerca button svg {
    width: 1.2em;
    height: 1.2em;
    fill: currentColor;
}
.sv-404-cerca button:hover,
.sv-404-cerca button:focus-visible {
    background: var(--sv-inchiostro);
    color: var(--sv-accento);
}
.sv-404 .sv-404-link {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem 1.75rem;
    list-style: none;
    margin: 0;
    padding: 0;
}
.sv-404-link li {
    margin: 0;
}
.sv-404-link a {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding-bottom: 0.15rem;
    border-bottom: 2px solid var(--sv-inchiostro);
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--sv-inchiostro);
    text-decoration: none;
}
.sv-404-link a svg {
    width: 1em;
    height: 1em;
    fill: currentColor;
    transition: transform 0.2s ease;
}
.sv-404-link a:hover svg {
    transform: translateX(3px);
}
@media (max-width: 600px) {
    .error404 .inside-article.sv-404 {
        padding: 2.5rem 16px 3.5rem;
    }
    .sv-404 .sv-404-testo {
        font-size: 1.1rem;
    }
    .sv-404-cerca button {
        padding: 0 1rem;
    }
}
@media (prefers-reduced-motion: reduce) {
    .sv-404-palla {
        animation: none;
    }
    .sv-404-link a svg {
        transition: none;
    }
}

/* Schede prodotto: il pulsante a tutta larghezza sommava il padding al 100%
   e usciva dal bordo della scheda (e su mobile allargava la pagina a 417px). */
.sv-prodotto .sv-lp-bottone {
    box-sizing: border-box;
    max-width: 100%;
}

/* Footer: titoli sopra le tre colonne di link (guide, sito, note legali). */
.sv-footer .sv-footer-titolo {
    margin: 0 0 1.1rem;
}

/* Footer: GeneratePress da ai ul un margine sinistro di 3em; col titolo sopra
   ogni colonna il rientro si vedeva anche su desktop (prima era tolto solo
   sotto i 781px). */
.sv-footer .wp-block-column ul {
    margin-left: 0;
}

/* /risorse-gratuite/: la prima sezione (titolo, tre risorse, iscrizione) sta su
   una fascia di tono appena diverso dal fondo pagina, chiusa da un filetto; le
   schede bianche ci si staccano sopra. (11/09/2026) */
.sv-lp.sv-lp-fascia {
    background: var(--sv-superficie);
    border-bottom: 1px solid var(--sv-bordo);
    padding-block: 3rem 3.25rem;
}
@media (max-width: 600px) {
    .sv-lp.sv-lp-fascia {
        padding-block: 2.25rem 2.5rem;
    }
}

/* ===========================================================================
   SISTEMI SCOMMESSE: INTRODUZIONE (.sv-sis) - 17/09/2026
   /sistemi-scommesse/ (12708) e' un'introduzione da leggere, impaginata come
   una rivista: testata centrata (niente indice, tolto su richiesta), testo in una
   colonna con i titoletti delle leve appesi nel margine sinistro, una frase
   chiave in grande, tabella e prodotti a filetti. Niente riquadri, fondi
   colorati o immagini (la versione a blocchi e' stata bocciata). I testi
   senza nulla nel margine stanno sempre in una colonna centrata.
   Sotto i 1000px il margine sparisce e tutto torna in colonna.
   =========================================================================== */
.sv-sis {
    --sis-margine: 14rem;
    --sis-spazio: clamp(2.5rem, 4.5vw, 4.5rem);
}
.sv-lp.sv-sis {
    padding: 4rem 0 5rem;
}
/* sezioni separate dal colore di fondo invece che dai filetti (21/09/2026):
   bianco e grigio alternati, l'ultima grigia per staccarsi dal riquadro
   Sbancobet del footer, che e' bianco */
.sv-lp.sv-sis.sv-sis-sezione {
    padding-block: clamp(3rem, 6vw, 4.75rem);
    background: #fff;
}
/* fasce attaccate: GeneratePress e i blocchi mettono un margine fra i gruppi,
   che lasciava una striscia del fondo pagina fra una fascia e l'altra */
.entry-content > .wp-block-group.sv-lp.sv-sis-sezione {
    margin-block: 0;
}
.sv-lp.sv-sis.sv-sis-sezione--grigia {
    background: var(--sv-superficie);
    /* sul grigio i filetti di tabella e prodotti vanno un tono piu' scuri */
    --sv-bordo: #dadada;
}
.sv-sis.sv-sis-sezione h2.sv-lp-h2 {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}
.sv-sis.sv-sis-sezione h3.sv-lp-h3,
.sv-sis.sv-sis-sezione h3.sv-lp-h3 + p {
    padding-top: 0;
    border-top: 0;
}
.sv-sis.sv-sis-sezione .sv-sis-prodotti {
    border-top: 1px solid var(--sv-bordo);
}
.sv-sis.sv-sis-sezione .sv-lp-dentro > :last-child {
    margin-bottom: 0;
}
.sv-sis .sv-lp-dentro {
    max-width: 1188px;
}
@media (min-width: 1000px) {
    .sv-sis .sv-lp-dentro {
        display: grid;
        grid-template-columns: [margine] minmax(0, var(--sis-margine)) [testo] minmax(0, 46rem);
        column-gap: var(--sis-spazio);
        justify-content: center;
    }
    /* tutto cio' che non ha nulla nel margine sta in una colonna centrata */
    .sv-sis .sv-lp-dentro > * {
        grid-column: 1 / -1;
        justify-self: center;
        width: 100%;
        max-width: 46rem;
        min-width: 0;
    }
    .sv-sis .sv-lp-dentro > h1 {
        max-width: none;
    }
    /* il filetto dei titoli di sezione attraversa tutta la griglia,
       il testo resta allineato alla colonna centrata */
    .sv-sis .sv-lp-dentro > h2 {
        box-sizing: border-box;
        max-width: none;
        padding-inline: calc((100% - 46rem) / 2);
    }
    /* le uniche righe a due colonne: le quattro leve con il titoletto nel margine */
    .sv-sis .sv-lp-dentro > h3 + p {
        grid-column: testo;
        max-width: none;
    }
    .sv-sis .sv-lp-dentro > h3 {
        grid-column: margine;
        max-width: none;
    }
}

/* --- titolo --- */
/* testata centrata: titolo e introduzione */
.sv-sis h1.sv-lp-h1 {
    font-size: clamp(2rem, 3.4vw, 3rem);
    line-height: 1;
    margin: 0 0 1.75rem;
    text-align: center;
    /* righe di lunghezza simile: niente "e' la" in fondo e "chiave per" da solo */
    text-wrap: balance;
}
/* parola chiave sottolineata a pennarello, non in un riquadro */
.sv-sis .sv-sis-evidenza {
    background: linear-gradient(var(--sv-accento), var(--sv-accento)) 0 90% / 100% 0.2em no-repeat;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

/* --- testo --- */
.sv-sis p {
    font-size: 1.0625rem;
    line-height: 1.7;
    margin: 0 0 1.25rem;
}
.sv-sis p.sv-lp-intro {
    max-width: 40rem;
    margin: 0 auto;
    font-size: clamp(1.15rem, 1.4vw, 1.3rem);
    line-height: 1.55;
    text-align: center;
    color: var(--sv-inchiostro);
}

/* --- titoli --- */
.sv-sis h2.sv-lp-h2 {
    font-size: clamp(1.45rem, 2.2vw, 1.85rem);
    margin: 3.75rem 0 1.25rem;
    padding-top: 1.1rem;
    border-top: 2px solid var(--sv-inchiostro);
}
.sv-sis h3.sv-lp-h3 {
    font-size: 1.15rem;
    margin: 2rem 0 0.4rem;
}
@media (min-width: 1000px) {
    .sv-sis h3.sv-lp-h3 {
        margin: 0.2rem 0 0;
        padding-top: 0.9rem;
        border-top: 1px solid var(--sv-bordo);
    }
    .sv-sis h3.sv-lp-h3 + p {
        padding-top: 0.75rem;
        border-top: 1px solid var(--sv-bordo);
        margin-bottom: 1.75rem;
    }
}

/* --- tabella dell'esempio: solo filetti --- */
.sv-sis .sv-sis-tabella {
    width: 100%;
    table-layout: fixed;
    margin: 2rem 0 2.5rem;
    border: 0;
    border-collapse: collapse;
    border-top: 2px solid var(--sv-inchiostro);
    line-height: 1.3;
}
.sv-sis .sv-sis-tabella caption {
    caption-side: top;
    text-align: left;
    padding: 0 0 0.75rem;
    font-size: 1rem;
    color: var(--sv-secondario);
}
.sv-sis .sv-sis-tabella th,
.sv-sis .sv-sis-tabella td {
    border: 0;
    border-bottom: 1px solid var(--sv-bordo);
    padding: 1rem 1rem 1rem 0;
    text-align: left;
    vertical-align: baseline;
}
.sv-sis .sv-sis-tabella thead th,
.sv-sis .sv-sis-tabella thead td {
    padding-top: 1.25rem;
    border-bottom-color: var(--sv-inchiostro);
    vertical-align: top;
}
.sv-sis .sv-sis-tabella thead th {
    font-family: var(--sv-font-titoli);
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    line-height: 1.1;
    color: var(--sv-inchiostro);
}
/* con table-layout fixed le larghezze le decide la riga d'intestazione */
.sv-sis .sv-sis-tabella thead td {
    width: 24%;
}
.sv-sis .sv-sis-tabella thead th {
    width: 38%;
}
/* la colonna del sistema e' segnata da un filetto lime sotto l'intestazione */
.sv-sis .sv-sis-tabella thead th:last-child {
    border-bottom: 4px solid var(--sv-accento);
}
.sv-sis .sv-sis-tabella tbody th {
    width: 24%;
    font-size: 1rem;
    font-weight: 600;
    color: var(--sv-secondario);
}
.sv-sis .sv-sis-tabella td {
    width: 38%;
    font-family: var(--sv-font-titoli);
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--sv-inchiostro);
}
.sv-sis .sv-sis-tabella td:last-child {
    font-weight: 700;
}

/* --- prodotti: righe a filetti, tutta la riga e' il link --- */
.sv-sis .sv-sis-prodotti {
    list-style: none;
    margin: 2rem 0 0;
    padding: 0;
    border-top: 2px solid var(--sv-inchiostro);
}
.sv-sis .sv-sis-prodotti li {
    margin: 0;
    border-bottom: 1px solid var(--sv-bordo);
}
.entry-content .sv-sis-prodotti a.sv-sis-prodotto:not(.wp-block-button__link) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 1.5rem;
    padding: 1.3rem 0;
    color: var(--sv-inchiostro);
    text-decoration: none;
}
.sv-sis-prodotto-nome,
.sv-sis-prodotto-desc {
    grid-column: 1;
}
.sv-sis-prodotto-nome {
    margin: 0 0 0.35rem;
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.15rem, 1.6vw, 1.35rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.1;
    text-decoration: underline;
    text-decoration-color: transparent;
    text-decoration-thickness: 3px;
    text-underline-offset: 5px;
    transition: text-decoration-color 0.15s ease;
}
.sv-sis-prodotto-desc {
    font-size: 1rem;
    line-height: 1.55;
    color: var(--sv-secondario);
}
.sv-sis-prodotto svg {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    width: 1.4rem;
    height: 1.4rem;
    fill: currentColor;
    transition: transform 0.15s ease;
}
.sv-sis-prodotto:hover .sv-sis-prodotto-nome,
.sv-sis-prodotto:focus-visible .sv-sis-prodotto-nome {
    text-decoration-color: var(--sv-accento);
}
.sv-sis-prodotto:hover svg,
.sv-sis-prodotto:focus-visible svg {
    transform: translateX(4px);
}

/* --- rimando alla guida e avvertenza --- */
.sv-sis p.sv-sis-rimando {
    margin-top: 1rem;
}
.sv-sis p.sv-sis-avvertenza {
    margin: 2rem 0 0;
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--sv-secondario);
}

@media (max-width: 760px) {
    .sv-lp.sv-sis {
        padding: 2.5rem 0 3rem;
    }
    .sv-sis h1.sv-lp-h1 {
        margin-bottom: 1.5rem;
    }
    .sv-sis p.sv-lp-intro {
        font-size: 1.1rem;
    }
    .sv-sis p {
        font-size: 1.0625rem;
        line-height: 1.68;
    }
    .sv-sis h2.sv-lp-h2 {
        margin-top: 3rem;
        padding-top: 1.1rem;
    }
    .sv-sis .sv-sis-tabella thead th {
        font-size: 0.95rem;
    }
    .sv-sis .sv-sis-tabella thead td {
        width: 32%;
    }
    .sv-sis .sv-sis-tabella thead th {
        width: 34%;
    }
    .sv-sis .sv-sis-tabella tbody th {
        width: 32%;
        font-size: 0.95rem;
    }
    .sv-sis .sv-sis-tabella td {
        width: 34%;
        font-size: 1rem;
    }
    .sv-sis .sv-sis-tabella th,
    .sv-sis .sv-sis-tabella td {
        padding-right: 0.6rem;
    }
    .entry-content .sv-sis-prodotti a.sv-sis-prodotto:not(.wp-block-button__link) {
        column-gap: 1rem;
        padding: 1.3rem 0;
    }
    .sv-sis-prodotto svg {
        width: 1.25rem;
        height: 1.25rem;
    }
}
@media (prefers-reduced-motion: reduce) {
    .sv-sis-prodotto-nome,
    .sv-sis-prodotto svg {
        transition: none;
    }
}

/* ===========================================================================
   INVITI NEGLI ARTICOLI (.sv-invito) - 17/09/2026
   Sostituiscono i template Elementor richiamati con [elementor-template]
   (9933 Telegram, 9423 Sbancobet, 9525 e 9558 sistemi), che con Elementor
   spento comparivano come codice in 46 contenuti. Sono pattern sincronizzati
   ("Invito canale Telegram", "Invito Sbancobet", "Invito sistemi Sbancobet"):
   si modificano una volta sola. Filetti, niente fondi. Il bottone verso
   sbancobet.net prende lo stile .sv-cta-sbancobet dal filtro in functions.php.
   Il gruppo puo' avere o no il wp-block-group__inner-container: la griglia
   va sull'elemento che contiene direttamente l'icona.
   =========================================================================== */
.entry-content .sv-invito {
    margin: 2.75rem 0;
    padding: 1.5rem 0 1.75rem;
    border-top: 2px solid var(--sv-inchiostro, #0c0c0c);
    border-bottom: 1px solid var(--sv-bordo, #e6e6e6);
}
.entry-content :is(.sv-invito, .sv-invito > .wp-block-group__inner-container):has(> .sv-invito-ico) {
    display: grid;
    grid-template-columns: 3.25rem minmax(0, 1fr);
    column-gap: 1.25rem;
    align-items: start;
}
.entry-content .sv-invito :is(.sv-invito-titolo, .sv-invito-testo, .wp-block-buttons) {
    grid-column: 2;
}
.entry-content .sv-invito .sv-invito-ico {
    grid-column: 1;
    grid-row: 1 / span 3;
    width: 3.25rem;
    height: 3.25rem;
    fill: var(--sv-inchiostro, #0c0c0c);
}
.entry-content .sv-invito p.sv-invito-titolo {
    margin: 0 0 0.45rem;
    font-family: var(--sv-font-titoli);
    font-size: clamp(1.35rem, 2.2vw, 1.65rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    color: var(--sv-inchiostro, #0c0c0c);
}
.entry-content .sv-invito p.sv-invito-testo {
    margin: 0 0 1.15rem;
}
.entry-content .sv-invito .wp-block-buttons {
    margin: 0;
}
.entry-content .sv-invito-bottone .wp-block-button__link {
    display: inline-block;
    padding: 0.95rem 1.5rem;
    border: 2px solid var(--sv-inchiostro, #0c0c0c);
    border-radius: 0;
    background: var(--sv-inchiostro, #0c0c0c);
    color: #fff;
    font-family: var(--sv-font-titoli);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}
.entry-content .sv-invito-bottone .wp-block-button__link:hover,
.entry-content .sv-invito-bottone .wp-block-button__link:focus-visible {
    background: var(--sv-accento, #d8fd45);
    color: var(--sv-inchiostro, #0c0c0c);
}
@media (max-width: 600px) {
    .entry-content :is(.sv-invito, .sv-invito > .wp-block-group__inner-container):has(> .sv-invito-ico) {
        grid-template-columns: 2.5rem minmax(0, 1fr);
        column-gap: 0.9rem;
    }
    .entry-content .sv-invito .sv-invito-ico {
        width: 2.5rem;
        height: 2.5rem;
    }
    .entry-content .sv-invito-bottone .wp-block-button__link {
        display: block;
        text-align: center;
    }
}
@media (prefers-reduced-motion: reduce) {
    .entry-content .sv-invito-bottone .wp-block-button__link {
        transition: none;
    }
}

/* ===========================================================================
   PAGINE SISTEMATE DOPO IL CHECK (17/09/2026)
   Numeri a filetti al posto dei contatori Elementor (/prodotto-non-piu-
   disponibile/), griglia di video YouTube (/le-mie-giocate-sistemultiplo/),
   box del codice sistema nelle recensioni (shortcode sistema_box).
   =========================================================================== */
.sv-lp .sv-numeri {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 2rem 0;
    border-top: 2px solid var(--sv-inchiostro, #0c0c0c);
    border-bottom: 1px solid var(--sv-bordo, #e6e6e6);
}
.sv-lp .sv-numeri div {
    display: flex;
    flex-direction: column-reverse;
    justify-content: flex-end;
    padding: 1.1rem 1rem 1.25rem 0;
}
.sv-lp .sv-numeri dd {
    margin: 0;
    font-family: var(--sv-font-titoli);
    font-size: clamp(2.25rem, 4.5vw, 3.5rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--sv-inchiostro, #0c0c0c);
}
.sv-lp .sv-numeri dt {
    margin: 0.5rem 0 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--sv-secondario, #5f5a50);
}
.sv-video-griglia {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
    gap: 1.5rem;
    margin: 2rem 0;
}
.sv-video-griglia .sv-lp-video {
    margin: 0;
}
.entry-content .sv-sistema-box {
    margin: 1.75rem 0;
    padding: 1.25rem 0 1.35rem;
    border-top: 2px solid var(--sv-inchiostro, #0c0c0c);
    border-bottom: 1px solid var(--sv-bordo, #e6e6e6);
}
.entry-content .sv-sistema-box p {
    margin: 0;
}
.entry-content .sv-sistema-box p.sv-sistema-box__tipo {
    margin-bottom: 0.55rem;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--sv-secondario, #5f5a50);
}
.entry-content .sv-sistema-box p.sv-sistema-box__codice {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.4rem 0.9rem;
}
.sv-sistema-box__codice span {
    font-size: 1rem;
    color: var(--sv-secondario, #5f5a50);
}
.sv-sistema-box__codice strong {
    font-family: var(--sv-font-titoli);
    font-size: clamp(2rem, 4vw, 2.75rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.04em;
    font-variant-numeric: tabular-nums;
    color: var(--sv-inchiostro, #0c0c0c);
}
@media (max-width: 600px) {
    .sv-lp .sv-numeri {
        grid-template-columns: minmax(0, 1fr);
    }
    .sv-lp .sv-numeri div {
        padding: 0.9rem 0;
        border-bottom: 1px solid var(--sv-bordo, #e6e6e6);
    }
    .sv-lp .sv-numeri div:last-child {
        border-bottom: 0;
    }
}
/* Video bloccato da Cookie Sentinel: il contenitore segue l'altezza dell'avviso
   invece di restare 16:9 con un'area grigia vuota sotto. Accettato il consenso,
   l'avviso lascia il posto all'iframe e torna la proporzione del video. */
.sv-lp-video:has(> .csnt-embed) {
    aspect-ratio: auto;
    background: none;
}

/* ===========================================================================
   CATALOGO A RIGHE ALTERNATE (.sv-catalogo) - 18/09/2026
   /metodi-sistemi/ (3239): la versione con miniature in riquadri bianchi e
   freccia isolata e' stata bocciata ("uno schifo"). Ogni prodotto ha
   l'immagine grande su meta' riga, alternata a sinistra e a destra, su un
   fondo grigio pieno senza bordo (multiply: i bianchi delle confezioni si
   fondono col fondo), nome grande, descrizione in nero e un bottone lime
   come quello di Sbancobet. Su mobile immagine sopra e testo sotto.
   =========================================================================== */
@media (min-width: 1000px) {
    .sv-sis .sv-lp-dentro > .sv-catalogo {
        max-width: 64rem;
    }
}
.sv-sis .sv-catalogo {
    list-style: none;
    margin: 2.5rem 0 1rem;
    padding: 0;
    border-top: 2px solid var(--sv-inchiostro, #0c0c0c);
}
.sv-sis .sv-catalogo li {
    margin: 0;
    padding: 3rem 0;
    border-bottom: 1px solid var(--sv-bordo, #e6e6e6);
}
.entry-content .sv-catalogo a.sv-catalogo-voce:not(.wp-block-button__link) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3.5rem;
    align-items: center;
    color: var(--sv-inchiostro, #0c0c0c);
    text-decoration: none;
}
.sv-catalogo li:nth-child(even) .sv-catalogo-img {
    order: 2;
}
.sv-catalogo-img {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--sv-superficie, #f2f2f2);
}
.sv-catalogo-img img {
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: 100%;
    padding: 1.75rem;
    object-fit: contain;
    mix-blend-mode: multiply;
    transition: transform 0.35s ease;
}
.sv-catalogo-img--foto img {
    padding: 0;
    object-fit: cover;
    mix-blend-mode: normal;
}
.sv-catalogo-voce:hover .sv-catalogo-img img,
.sv-catalogo-voce:focus-visible .sv-catalogo-img img {
    transform: scale(1.03);
}
.sv-catalogo-testo,
.sv-catalogo-tipo,
.sv-catalogo-nome,
.sv-catalogo-desc {
    display: block;
}
.sv-catalogo-tipo {
    margin-bottom: 0.6rem;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--sv-secondario, #5f5a50);
}
.sv-catalogo-nome {
    margin-bottom: 1rem;
    font-family: var(--sv-font-titoli);
    font-size: clamp(2rem, 3.4vw, 2.9rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.03em;
    text-transform: uppercase;
}
.sv-catalogo-desc {
    margin-bottom: 1.6rem;
    font-size: 1.1rem;
    line-height: 1.65;
    color: #2b2b2b;
}
.sv-catalogo-cta {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.95rem 1.4rem;
    border: 2px solid var(--sv-inchiostro, #0c0c0c);
    background: var(--sv-accento, #d8fd45);
    color: var(--sv-inchiostro, #0c0c0c);
    font-family: var(--sv-font-titoli);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
    transition: background-color 0.15s ease, color 0.15s ease;
}
.sv-catalogo-cta svg {
    width: 1.2em;
    height: 1.2em;
    fill: currentColor;
    transition: transform 0.15s ease;
}
.sv-catalogo-voce:hover .sv-catalogo-cta,
.sv-catalogo-voce:focus-visible .sv-catalogo-cta {
    background: var(--sv-inchiostro, #0c0c0c);
    color: var(--sv-accento, #d8fd45);
}
.sv-catalogo-voce:hover .sv-catalogo-cta svg,
.sv-catalogo-voce:focus-visible .sv-catalogo-cta svg {
    transform: translateX(4px);
}
@media (max-width: 760px) {
    .sv-sis .sv-catalogo li {
        padding: 2rem 0 2.25rem;
    }
    .entry-content .sv-catalogo a.sv-catalogo-voce:not(.wp-block-button__link) {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.4rem;
    }
    .sv-catalogo li:nth-child(even) .sv-catalogo-img {
        order: 0;
    }
    .sv-catalogo-img:not(.sv-catalogo-img--foto) img {
        padding: 1.25rem;
    }
    .sv-catalogo-desc {
        font-size: 1.05rem;
    }
}
@media (prefers-reduced-motion: reduce) {
    .sv-catalogo-img img,
    .sv-catalogo-cta,
    .sv-catalogo-cta svg {
        transition: none;
    }
}

/* ===========================================================================
   /risorse-gratuite/ (12642) - 18/09/2026
   La pagina spiega l'iscrizione gratuita all'area riservata: occhiello sopra
   l'h1, nota sotto il bottone con il link al login, tre passi dell'iscrizione
   a filetti (niente scatole), numeri grandi in nero.
   =========================================================================== */
.sv-lp .sv-ris-occhiello {
    display: block;
    margin: 0 0 1rem;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.2;
    color: var(--sv-secondario, #5f5a50);
}
.sv-lp .sv-lp-bottone-riga:has(+ .sv-ris-nota) {
    margin-bottom: 1rem;
}
.sv-lp.sv-lp-centro .sv-lp-dentro > p.sv-ris-nota {
    margin: 0 auto;
    font-size: 1rem;
    text-align: center;
    color: var(--sv-secondario, #5f5a50);
}
.sv-lp .sv-ris-passi {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem;
    max-width: 1040px;
    margin: 1.5rem auto 0;
    padding: 0;
    text-align: left;
}
.sv-lp .sv-ris-passi li {
    margin: 0;
    padding-top: 1.1rem;
    border-top: 2px solid var(--sv-inchiostro, #0c0c0c);
}
.sv-lp .sv-ris-passo {
    display: block;
    margin-bottom: 0.6rem;
    font-family: var(--sv-font-titoli);
    font-size: 3rem;
    font-weight: 700;
    line-height: 1;
    color: var(--sv-inchiostro, #0c0c0c);
}
.sv-lp .sv-ris-passi p {
    margin: 0;
    font-size: 1.05rem;
    line-height: 1.6;
}
@media (max-width: 760px) {
    .sv-lp .sv-ris-passi {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.5rem;
    }
    .sv-lp .sv-ris-passo {
        font-size: 2.4rem;
    }
}
/* /risorse-gratuite/: spazio fra i tre passi e il bottone che segue; su mobile
   l'h1 contiene "Supervantaggio.com" e a corpo pieno lo spezzava a meta'. */
.sv-lp .sv-ris-passi {
    margin-bottom: 2.5rem;
}
@media (max-width: 600px) {
    .sv-lp h1.sv-lp-h1:has(.sv-ris-occhiello) {
        font-size: 1.7rem;
        overflow-wrap: normal;
        word-break: normal;
    }
}
/* /risorse-gratuite/: piu' aria fra le sezioni (18/09/2026). */
.page-id-12642 .sv-lp.sv-lp-fascia {
    padding-block: 4rem 4.25rem;
}
.page-id-12642 .sv-lp:not(.sv-lp-fascia) {
    padding-top: 4.5rem;
    padding-bottom: 5rem;
}
.page-id-12642 .sv-lp h2.sv-lp-h2:not(:first-child) {
    margin-top: 6rem;
}
.page-id-12642 .sv-lp h2.sv-lp-h2 {
    margin-bottom: 1.75rem;
}
@media (max-width: 600px) {
    .page-id-12642 .sv-lp.sv-lp-fascia {
        padding-block: 2.75rem 3rem;
    }
    .page-id-12642 .sv-lp:not(.sv-lp-fascia) {
        padding-top: 3rem;
        padding-bottom: 3.5rem;
    }
    .page-id-12642 .sv-lp h2.sv-lp-h2:not(:first-child) {
        margin-top: 4.25rem;
    }
}

/* ---------------------------------------------------------------------------
   CORSI (/corsi-di-betting-e-trading-sportivo/, pagina 5459): bottoni neri,
   come il bottone del box Telegram (.sv-invito-bottone). Sulle altre landing
   .sv-lp-bottone resta lime. Il selettore pesa quanto la regola generale dei
   link (.entry-content a:not(...):not(...), 0,3,1) e viene dopo: con meno
   peso il testo restava nero su nero.
   ------------------------------------------------------------------------ */
.page-id-5459 .entry-content a.sv-lp-bottone {
    border: 2px solid var(--sv-inchiostro);
    background: var(--sv-inchiostro);
    color: #fff;
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}
.page-id-5459 .entry-content a.sv-lp-bottone:hover,
.page-id-5459 .entry-content a.sv-lp-bottone:focus-visible {
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
}
@media (prefers-reduced-motion: reduce) {
    .page-id-5459 .entry-content a.sv-lp-bottone {
        transition: none;
    }
}

/* ---------------------------------------------------------------------------
   CARD (.sv-aree): tre siti su /scegli-area-riservata/, affiancate da 1000px in
   su; con .sv-aree--due (prodotti di /sistemi-scommesse/) due per riga da 700px,
   dentro la colonna di testo. Sul fondo grigio delle fasce le card sono bianche. Il contenitore esce dalla
   colonna di testo da 46rem di .sv-sis, altrimenti "SOLUZIONISCOMMESSE.COM"
   non starebbe su una riga. Bottone nero come su Corsi; il selettore del link
   pesa quanto la regola generale dei link (0,3,1) e viene dopo.
   ------------------------------------------------------------------------ */
.sv-sis .sv-lp-dentro > .sv-aree {
    max-width: 64rem;
}
.sv-aree {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
    margin: 2.5rem 0 2.25rem;
}
@media (min-width: 1000px) {
    .sv-aree {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
/* il rimando sotto le card segue la testata centrata, non la colonna a sinistra */
.sv-sis .sv-aree + p.sv-sis-rimando {
    text-align: center;
}
.sv-sis .sv-lp-dentro > .sv-aree.sv-aree--due {
    max-width: 46rem;
}
.sv-aree.sv-aree--due {
    grid-template-columns: minmax(0, 1fr);
    margin-top: 2rem;
}
@media (min-width: 700px) {
    .sv-aree.sv-aree--due {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.sv-sis-sezione--grigia .sv-area {
    background: #fff;
}
.sv-area {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 1.75rem 1.5rem 1.6rem;
    background: var(--sv-superficie);
}
.sv-sis .sv-area .sv-area-nome {
    margin: 0 0 0.6rem;
    font-family: var(--sv-font-titoli);
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.01em;
    text-transform: uppercase;
    color: var(--sv-inchiostro);
}
.sv-sis .sv-area p.sv-area-desc {
    flex: 1 1 auto;
    margin: 0 0 1.5rem;
    font-size: 1rem;
    line-height: 1.55;
    color: var(--sv-secondario);
}
.entry-content .sv-area a.sv-area-bottone {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.85rem 1.3rem;
    border: 2px solid var(--sv-inchiostro);
    background: var(--sv-inchiostro);
    color: #fff;
    font-family: var(--sv-font-titoli);
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.2;
    text-transform: uppercase;
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}
.entry-content .sv-area a.sv-area-bottone:hover,
.entry-content .sv-area a.sv-area-bottone:focus-visible {
    background: var(--sv-accento);
    color: var(--sv-inchiostro);
}
.sv-area-bottone svg {
    width: 1.1em;
    height: 1.1em;
    fill: currentColor;
    transition: transform 0.15s ease;
}
.sv-area-bottone:hover svg,
.sv-area-bottone:focus-visible svg {
    transform: translateX(4px);
}
@media (prefers-reduced-motion: reduce) {
    .entry-content .sv-area a.sv-area-bottone,
    .sv-area-bottone svg {
        transition: none;
    }
}

/* ===========================================================================
   PRODOTTO NON PIU' DISPONIBILE (.sv-pnd) - pagina 9986
   Ricostruzione fedele della landing Elementor che sta in produzione su
   supervantaggio.com/prodotto-non-piu-disponibile/ (richiesta del 23/09/2026:
   "graficamente deve essere IDENTICA, tranne il font").
   Misure rilevate con Chrome sulla pagina vera a 1440px e a 390px:
   fasce #0c0c0c e #030b30, lime #d8fd45, pannelli #f8f8f8 raggio 10 padding 25,
   contenitore 900px, titolo hero 72px (64 da telefono), h2 50px, h2 minori 35px,
   contatori 69px, corpo 18px, bottone 25px raggio 5.
   L'unica differenza voluta e' il carattere: qui DM Sans del sito nuovo al
   posto di Manrope/Inter/Fjalla One. DM Sans arriva a 700, non a 800.
   La pagina usa il template canvas-pnd.php: niente testata, niente footer del
   sito, quindi queste regole non incontrano quelle di .entry-content.
   =========================================================================== */

.sv-pnd-contenuto {
    --pnd-nero: #0c0c0c;
    --pnd-lime: #d8fd45;
    --pnd-blu: #030b30;
    --pnd-hero: #f5f5f5;
    --pnd-pannello: #f8f8f8;
    --pnd-etichetta: #f5f3ee;

    color: var(--pnd-nero);
    font-size: 18px;
    line-height: 1.5;
    /* Il sito nuovo tiene il corpo a 500: in produzione questa pagina e' a 400
       e con DM Sans il 500 si vede subito piu' nero del dovuto. */
    font-weight: 400;
}

/* --- fasce a tutta larghezza, contenuto a 900px ------------------------- */
.sv-pnd-fascia {
    width: 100%;
}
.sv-pnd-dentro {
    max-width: 900px;
    margin-inline: auto;
    padding: 40px 20px;
}
.sv-pnd-nera {
    background: var(--pnd-nero);
}
.sv-pnd-blu {
    background: var(--pnd-blu);
}
.sv-pnd-chiaro {
    color: #fff;
}

/* --- hero: fondo grigio col pattern di palloni -------------------------- */
.sv-pnd-hero {
    position: relative;
    background-color: var(--pnd-hero);
    background-image: url("/wp-content/uploads/2024/02/bg_soccer_ball_pattern-2.jpg");
    background-repeat: repeat;
    text-align: center;
}
/* In produzione il disegno non si vede quasi: sopra c'e' un velo quasi pieno
   (::before #fcfcfc, opacita' 0.97). Senza, il pattern esce nero e pesante. */
.sv-pnd-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: #fcfcfc;
    opacity: 0.97;
    pointer-events: none;
}
.sv-pnd-hero .sv-pnd-dentro {
    position: relative;
    padding-block: 20px 28px;
}
.sv-pnd-occhiello {
    font-size: 36px;
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin: 0 0 24px;
    color: var(--pnd-nero);
}
.sv-pnd-display {
    font-size: 72px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -0.07em;
    text-transform: uppercase;
    margin: 0 0 28px;
    text-wrap: balance;
}
.sv-pnd-hero-testo {
    font-size: 25px;
    line-height: 1.1;
    margin: 0 0 14px;
}
.sv-pnd-hero-testo:last-child {
    margin-bottom: 0;
}

/* --- titoli ------------------------------------------------------------- */
.sv-pnd-h2 {
    font-size: 50px;
    line-height: 0.9;
    font-weight: 700;
    letter-spacing: -0.03em;
    text-align: center;
    margin: 0 0 24px;
    text-wrap: balance;
}
.sv-pnd-h2-media {
    font-size: 35px;
    line-height: 1.1;
}
.sv-pnd-h2-lime {
    color: var(--pnd-lime);
}
.sv-pnd-sommario {
    font-size: 26px;
    line-height: 1.1;
    font-weight: 700;
    text-align: center;
    color: var(--pnd-lime);
    margin: 0 0 32px;
}
.sv-pnd-testo {
    font-size: 18px;
    line-height: 1.1;
    text-align: center;
    margin: 0 0 24px;
}

/* --- contatori ---------------------------------------------------------- */
.sv-pnd-numeri {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin: 0 0 32px;
    text-align: center;
}
.sv-pnd-numero dd {
    margin: 0;
    font-size: 69px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: -0.03em;
    color: var(--pnd-lime);
}
.sv-pnd-numero dt {
    font-size: 19px;
    line-height: 2.5;
    color: var(--pnd-etichetta);
}

/* --- bottone lime ------------------------------------------------------- */
.sv-pnd-riga {
    text-align: center;
    margin: 0;
}
a.sv-pnd-bottone {
    display: inline-block;
    background: var(--pnd-lime);
    color: #000;
    font-size: 25px;
    line-height: 1;
    font-weight: 700;
    text-decoration: none;
    padding: 15px 20px;
    border-radius: 5px;
    transition: background-color 0.15s ease, color 0.15s ease;
}
a.sv-pnd-bottone:hover,
a.sv-pnd-bottone:focus-visible {
    background: #000;
    color: var(--pnd-lime);
}

/* --- pannello chiaro dentro le fasce scure ------------------------------ */
.sv-pnd-pannello {
    background: var(--pnd-pannello);
    border-radius: 10px;
    padding: 25px;
}
.sv-pnd-pannello .sv-pnd-h2 {
    margin-bottom: 28px;
}
.sv-pnd-chiusa {
    font-size: 22px;
    line-height: 1;
    font-weight: 700;
    text-align: center;
    margin: 28px 0 20px;
}

/* --- schede 2x2 --------------------------------------------------------- */
.sv-pnd-schede {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}
.sv-pnd-scheda {
    background: #fff;
    padding: 10px;
    text-align: center;
}
.sv-pnd-scheda img {
    display: block;
    width: 100%;
    height: auto;
}
.sv-pnd-scheda h3 {
    font-size: 30px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin: 16px 0 12px;
}
.sv-pnd-scheda p {
    font-size: 18px;
    line-height: 1.5;
    margin: 0;
}

/* --- immagini a tutta colonna ------------------------------------------ */
.sv-pnd-figura {
    margin: 0 0 24px;
    text-align: center;
}
.sv-pnd-figura img {
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}
/* Due immagini in produzione sono mostrate piu' piccole del file: 660 e 675.
   Si fissa "width", non "max-width": il max-width al 100% qui sopra deve
   restare l'ultima parola, altrimenti da telefono l'immagine sborda. */
.sv-pnd-figura--660 img {
    width: 660px;
}
.sv-pnd-figura--675 img {
    width: 675px;
}

/* --- elenco delle statistiche, due colonne con la spunta ---------------- */
.sv-pnd-elenco {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 30px;
    list-style: none;
    margin: 0 0 28px;
    padding: 0;
    max-width: 700px;
    margin-inline: auto;
}
.sv-pnd-elenco li {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 18px;
    line-height: 1.5;
    color: #fff;
    padding-bottom: 2px;
}
.sv-pnd-elenco svg {
    flex: none;
    width: 25px;
    height: 25px;
    fill: #fff;
}

/* --- recensioni --------------------------------------------------------- */
.sv-pnd-griglia-rec {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 48px 20px;
    justify-items: center;
    align-items: start;
}
.sv-pnd-griglia-rec img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 16px;
}

/* --- footer legale minimo, come quello della landing in produzione ------ */
.sv-pnd-footer {
    background: #fff;
    padding: 40px 20px;
    text-align: center;
    font-size: 14px;
    line-height: 1.5;
    color: var(--pnd-nero);
}
.sv-pnd-footer p {
    max-width: 700px;
    margin: 0 auto 14px;
}
.sv-pnd-footer p:last-child {
    margin-bottom: 0;
}
.sv-pnd-footer a {
    color: #c36;
}
.sv-pnd-eta {
    display: inline-block;
    border: 2px solid var(--pnd-nero);
    border-radius: 999px;
    padding: 1px 9px;
    font-weight: 700;
    margin-right: 6px;
}

/* --- telefono ----------------------------------------------------------- */
@media (max-width: 767px) {
    /* La landing in produzione, a 390px, rimpicciolisce pochissimo: restano
       h2 a 50px, sommario a 26px, contatori a 69px e bottone a 25px; scendono
       a 16px solo il corpo, i testi delle schede e l'elenco, e il titolo hero
       passa da 72 a 64. Qui si fa lo stesso, piu' le colonne che si impilano. */
    .sv-pnd-contenuto {
        font-size: 16px;
    }
    .sv-pnd-dentro {
        padding: 32px 20px;
    }
    .sv-pnd-display {
        font-size: 64px;
    }
    .sv-pnd-numeri,
    .sv-pnd-schede,
    .sv-pnd-elenco,
    .sv-pnd-griglia-rec {
        grid-template-columns: minmax(0, 1fr);
    }
    .sv-pnd-numeri {
        gap: 24px;
    }
    .sv-pnd-numero dt {
        line-height: 1.4;
    }
    .sv-pnd-griglia-rec {
        gap: 28px;
    }
    .sv-pnd-testo,
    .sv-pnd-scheda p,
    .sv-pnd-elenco li {
        font-size: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    a.sv-pnd-bottone {
        transition: none;
    }
}