/* ============================================================
   GLS DESIGN SYSTEM
   Gavriel La Stella
   v1.1.11 · 27 settembre 2026 · base: kit edizione 02
   1.1.11: il ritaglio del body vale solo in orizzontale (overflow-x clip, overflow-y
   visible): con overflow clip su entrambi gli assi, dove html non scorre, la pagina
   non si scorreva con la rotella.
   1.1.10: body in overflow clip al posto di hidden (Salient): stesso ritaglio, ma
   position: sticky torna a funzionare (colonna ferma di Cosa include).
   1.1.9: gls-fill, riempimento progressivo che resta (punteggi a quadrati, avanzamento OKR).
   1.1.7: due animazioni generiche per le visual delle pagine sottoservizio, una per
   pagina: gls-turn (un elemento di una serie si evidenzia a turno, ciclo 12s) e
   gls-breathe (respiro di scala 1 -> 1,12, ciclo lento).
   1.1.4: tre animazioni per la sezione Il metodo delle pagine servizio: gls-node (il
   nodo si accende al passaggio dell identificativo), gls-settle (la cifra si assesta),
   gls-phase (il filetto della fase attiva si traccia e sfuma, ciclo 12s).
   1.1.3: animazioni delle pagine servizio (kit GLS Servizi, specifica sez. 4) portate
   qui dalla prima pagina pubblicata (Marketing B2B): nove @keyframes gls-* condivise,
   colori a variabile. Le pagine le richiamano senza ridefinirle.
   1.1.2: breadcrumb Yoast allineato al wordmark di testata e piede (stesso contenitore
   1200 + gutter 24), Schibsted 14px, voce corrente in ink-body, link in ink-muted.
   1.1.1: mega menu v5 in edizione 02: via le 40 icone dei sottoservizi (brandbook p. 06
   regola 01 e p. 26), voci a 15px, filetto di sezione Royal Blue che si traccia sotto il
   titolo della colonna puntata al posto del filetto in cima al pannello.
   1.1.0: edizione 02 del brandbook: Royal Blue #001088 (--gls-royal) per wordmark,
   occhielli, filetti di sezione e azioni primarie; Navy #141E55 resta --gls-primary
   per titoli, testo forte e fondi. Hover del primario in Navy. Wordmark Spectral
   Regular in cassa mista, 168px in testata e nel piede. Voci di menu in occhiello.
   Focus 2px Royal Blue con scostamento 2px (brandbook p. 16). Conservati dalla
   1.0.x: alias token, ink-muted sotto i 24px, override tema, header, mega menu,
   icone, menu mobile.
   Storia 1.0.x (17-24 settembre 2026):
   1.0.1: ink-subtle tolto dai testi sotto 24px; alias token; focus visibile sui campi.
   1.0.2: override tipografico con !important contro Salient (Open Sans).
   1.0.3: reset liste e immagini dentro .gls-page contro main-styles di Salient.
   1.0.4-1.0.8: header, animated underline, mega menu Servizi, 45 icone.
   1.0.9-1.0.16: mega menu v3 e v4 a colonne, righe a passo fisso, filetti animati.
   1.0.17-1.0.19: prove di colonna in evidenza, pannello bianco definitivo.
   1.0.20: modulo schema JSON-LD in inc/ (nessuna modifica CSS).
   Prefisso classi: gls-
   Caricato dal child theme (gls-salient-child/functions.php).
   Unico file CSS globale del progetto. Ogni altro CSS vive nel
   blocco <style> in testa alla singola pagina.
   Riferimento normativo: Brandbook Gavriel La Stella, ed. 01.
   ============================================================ */

/* ---------- FONT ---------- */
/* Spectral e Schibsted Grotesk, Google Fonts, display=swap.
   Se si passa a font self-hosted, sostituire questo @import con
   @font-face che puntano a fonts/ nel child theme. */
@import url('https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,300;0,400;0,500;1,300&family=Schibsted+Grotesk:wght@400;500;600&display=swap');

:root {
  /* ---------- COLORE · marca (vincolante) ---------- */
  --gls-primary:            #141E55;  /* Navy. Titoli, testo forte, fondi istituzionali, card scure */
  --gls-royal:              #001088;  /* Royal Blue. Wordmark, occhielli, filetti di sezione, azioni primarie. Mai sul Navy (1,1:1) */
  --gls-secondary:          #FFFFFF;  /* Bianco. Fondo di lettura predefinito */
  --gls-accent:             #CCD0D1;  /* Iron. Filetti, bordi, separatori. MAI per il testo */

  /* ---------- COLORE · scala derivata (funzionale) ---------- */
  /* Tinta costante 273 gradi in OKLCH: varia solo la luminosita */
  --gls-blue-900:           #0C1236;
  --gls-blue-800:           #141E55;  /* = primary */
  --gls-blue-700:           #2A3673;  /* hover azioni primarie */
  --gls-blue-600:           #4A5795;  /* contrasto 6,4:1 su bianco, AA */
  --gls-blue-400:           #8F99C0;  /* contrasto 2,8:1 su bianco, NON per testo */
  --gls-blue-200:           #D2D7E8;
  --gls-blue-050:           #F2F4FA;

  /* ---------- COLORE · testo ---------- */
  --gls-ink-brand:          #141E55;  /* 16,9:1 su bianco, AAA */
  --gls-ink-body:           #22262F;  /* 14,4:1 su bianco, AAA */
  --gls-ink-muted:          #5A6172;  /*  6,3:1 su bianco, AA  */
  --gls-ink-subtle:         #8A93A8;  /*  3,1:1 su bianco. Solo da 24px in su */
  --gls-ink-inverse:        #FFFFFF;  /* 16,9:1 su primary, AAA */

  /* ---------- COLORE · superfici ---------- */
  --gls-surface-base:       #FFFFFF;
  --gls-surface-raised:     #F4F5F6;
  --gls-surface-inverse:    #141E55;

  /* ---------- COLORE · tratti ---------- */
  --gls-line-strong:        #CCD0D1;
  --gls-line-hairline:      #EDEEF0;

  /* ---------- COLORE · semantici ---------- */
  --gls-success:            #2F6B4F;  /* bianco su questo fondo: 5,3:1, AA */
  --gls-warning:            #8A6A3A;
  --gls-error:              #9B2C2C;
  /* Gli stati non si comunicano mai col solo colore: sempre segno o etichetta */

  /* ---------- TIPOGRAFIA ---------- */
  --gls-font-display: 'Spectral', Georgia, 'Times New Roman', serif;
  --gls-font-body:    'Schibsted Grotesk', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --gls-font-mono:    ui-monospace, Menlo, Consolas, monospace;

  /* Scala: nove gradini, rapporto 1,25. Nessun valore intermedio */
  --gls-text-display:   4rem;    /* 64px stampa e desktop ampio */
  --gls-text-display-s: 3rem;    /* 48px schermo sotto 900px */
  --gls-text-h1:        2.5rem;  /* 40px */
  --gls-text-h1-s:      2.125rem;/* 34px */
  --gls-text-h2:        2rem;    /* 32px */
  --gls-text-h2-s:      1.75rem; /* 28px */
  --gls-text-h3:        1.5rem;  /* 24px */
  --gls-text-lg:        1.1875rem;/* 19px */
  --gls-text-base:      1rem;    /* 16px */
  --gls-text-sm:        0.875rem;/* 14px */
  --gls-text-eyebrow:   0.75rem; /* 12px */
  --gls-text-micro:     0.625rem;/* 10px */

  /* Interlinee: tutte multipli di 4px, allineate alla griglia di base */
  --gls-leading-display: 1.04;
  --gls-leading-h1:      1.10;
  --gls-leading-h2:      1.18;
  --gls-leading-h3:      1.30;
  --gls-leading-lg:      1.55;
  --gls-leading-base:    1.62;
  --gls-leading-sm:      1.50;
  --gls-leading-tight:   1.20;

  /* Tracking */
  --gls-track-display: -0.02em;
  --gls-track-h1:      -0.012em;
  --gls-track-h2:      -0.01em;
  --gls-track-zero:     0;
  --gls-track-eyebrow:  0.18em;
  --gls-track-micro:    0.14em;
  --gls-track-wordmark: -0.01em;
  --gls-track-mono:     0.12em;  /* monogramma GLS */

  /* Pesi. Il 700 non si usa */
  --gls-weight-light:   300;
  --gls-weight-regular: 400;
  --gls-weight-medium:  500;
  --gls-weight-semi:    600;

  /* ---------- SPAZIATURE · base 8px ---------- */
  --gls-space-1:  8px;
  --gls-space-2:  16px;
  --gls-space-3:  24px;
  --gls-space-4:  32px;
  --gls-space-5:  40px;
  --gls-space-6:  48px;
  --gls-space-7:  56px;
  --gls-space-8:  64px;
  --gls-space-9:  72px;
  --gls-space-10: 80px;
  --gls-space-11: 88px;
  --gls-space-12: 96px;
  --gls-space-half: 4px;  /* solo interno pill e coppie icona+testo */
  --gls-space-air:  104px; /* respiro di apertura e chiusura di pagina */

  /* ---------- LAYOUT ---------- */
  --gls-max-width: 1200px;
  --gls-gutter:    24px;
  --gls-columns:   12;

  /* Geometria: spigoli per la struttura, curva solo per le etichette */
  --gls-radius-0:    0;      /* contenitori, card, immagini */
  --gls-radius-btn:  2px;    /* bottoni */
  --gls-radius-pill: 999px;  /* pill e badge, non cliccabili */

  /* Ombre: nessuna. Le variabili esistono per rendere esplicito il divieto */
  --gls-shadow-none: none;

  /* Tratti */
  --gls-border-hairline: 1px solid var(--gls-line-hairline);
  --gls-border-strong:   1px solid var(--gls-line-strong);
  --gls-rule-section:    1.5px solid var(--gls-royal);

  /* ---------- MOTION ---------- */
  --gls-ease:          cubic-bezier(0.3, 0, 0.2, 1);    /* standard: stati e colori */
  --gls-ease-in:       cubic-bezier(0.05, 0.7, 0.1, 1); /* entrata: comparse e pannelli */
  --gls-ease-out:      cubic-bezier(0.4, 0, 1, 1);      /* uscita: piu rapida dell entrata */
  --gls-ease-linear:   linear;                          /* solo avanzamenti e zoom continui */
  --gls-duration-instant:   80ms;
  --gls-duration-quick:     160ms;
  --gls-duration-base:      280ms;
  --gls-duration-slow:      480ms;
  --gls-duration-editorial: 1200ms;
  --gls-motion-shift: 8px;  /* scostamento unico per le comparse */

  /* ---------- TOCCO ---------- */
  --gls-touch-min: 44px;

  /* ---------- ALIAS · nomi usati nel brandbook, pagine 15 e 24 ---------- */
  --gls-ink-accent:      var(--gls-royal);      /* wordmark, occhielli, filetti di sezione */
  --gls-action-primary:  var(--gls-royal);      /* azioni primarie */
  --gls-action-hover:    var(--gls-primary);    /* hover del primario: Navy (brandbook p. 15) */
  --gls-state-positive:  var(--gls-success);
  --gls-state-warning:   var(--gls-warning);
  --gls-state-negative:  var(--gls-error);
  --gls-dur-instant:     var(--gls-duration-instant);
  --gls-dur-quick:       var(--gls-duration-quick);
  --gls-dur-base:        var(--gls-duration-base);
  --gls-dur-slow:        var(--gls-duration-slow);
  --gls-dur-editorial:   var(--gls-duration-editorial);
}

/* Breakpoint dichiarati una volta sola. Non si inventano per pagina:
   380 / 480 / 600 / 680 / 768 / 980 / 1200. Mobile first. */

/* ---------- RESET MIRATO ---------- */
/* Solo sugli elementi che il design system usa. Nessun reset globale */
.gls-page { margin: 0; color: var(--gls-ink-body); font-family: var(--gls-font-body);
  font-size: var(--gls-text-base); line-height: var(--gls-leading-base);
  background: var(--gls-surface-base); -webkit-font-smoothing: antialiased;
  text-wrap: pretty; }
.gls-page *, .gls-page *::before, .gls-page *::after { box-sizing: border-box; }
.gls-page h1, .gls-page h2, .gls-page h3, .gls-page h4, .gls-page p,
.gls-page ul, .gls-page ol, .gls-page figure { margin: 0; padding: 0; }
.gls-page ul, .gls-page ol { list-style: none; }
.gls-page img, .gls-page svg { display: block; max-width: 100%; }
.gls-page p, .gls-page li { orphans: 3; widows: 3; }

/* ---------- TIPOGRAFIA APPLICATA ---------- */
.gls-display, .gls-h1, .gls-h2 { font-family: var(--gls-font-display);
  font-weight: var(--gls-weight-light); color: var(--gls-ink-brand);
  text-wrap: balance; }
.gls-display { font-size: var(--gls-text-display-s); line-height: var(--gls-leading-display);
  letter-spacing: var(--gls-track-display); }
.gls-h1 { font-size: var(--gls-text-h1-s); line-height: var(--gls-leading-h1);
  letter-spacing: var(--gls-track-h1); }
.gls-h2 { font-size: var(--gls-text-h2-s); line-height: var(--gls-leading-h2);
  letter-spacing: var(--gls-track-h2); }
.gls-h3 { font-family: var(--gls-font-body); font-weight: var(--gls-weight-semi);
  font-size: var(--gls-text-h3); line-height: var(--gls-leading-h3);
  color: var(--gls-ink-brand); }
.gls-lead { font-size: var(--gls-text-lg); line-height: var(--gls-leading-lg);
  color: var(--gls-ink-muted); max-width: 62ch; }
.gls-body { font-size: var(--gls-text-base); line-height: var(--gls-leading-base);
  max-width: 68ch; }
.gls-small { font-size: var(--gls-text-sm); line-height: var(--gls-leading-sm);
  color: var(--gls-ink-muted); }
.gls-eyebrow { font-size: var(--gls-text-eyebrow); line-height: var(--gls-leading-tight);
  letter-spacing: var(--gls-track-eyebrow); text-transform: uppercase;
  font-weight: var(--gls-weight-semi); color: var(--gls-royal); }
.gls-micro { font-size: var(--gls-text-micro); line-height: var(--gls-leading-tight);
  letter-spacing: var(--gls-track-micro); text-transform: uppercase;
  font-weight: var(--gls-weight-semi); color: var(--gls-ink-muted); }  /* 1.0.1: 6,3:1, era ink-subtle 3,1:1 */
.gls-num { font-variant-numeric: tabular-nums; }
.gls-figure { font-family: var(--gls-font-display); font-weight: var(--gls-weight-light);
  color: var(--gls-ink-brand); font-variant-numeric: tabular-nums; line-height: 1; }

/* Titoli grandi solo da 980px in su */
@media (min-width: 980px) {
  .gls-display { font-size: var(--gls-text-display); }
  .gls-h1 { font-size: var(--gls-text-h1); }
  .gls-h2 { font-size: var(--gls-text-h2); }
}

/* Regola di confine: niente display sotto i 20px, niente body sopra i 28px */
.gls-inverse { color: var(--gls-ink-inverse); }
.gls-inverse .gls-display, .gls-inverse .gls-h1,
.gls-inverse .gls-h2, .gls-inverse .gls-h3 { color: var(--gls-ink-inverse); }
.gls-inverse .gls-lead, .gls-inverse .gls-small { color: rgba(255,255,255,0.78); }
.gls-inverse .gls-eyebrow { color: rgba(255,255,255,0.65); }

/* ---------- WORDMARK E MONOGRAMMA ---------- */
/* Il wordmark si riproduce dal file SVG. Questa classe serve solo dove
   il testo deve restare selezionabile (firma email, footer, fallback) */
.gls-wordmark { font-family: var(--gls-font-display); font-weight: var(--gls-weight-regular);
  letter-spacing: var(--gls-track-wordmark); text-transform: none;
  color: var(--gls-royal); white-space: nowrap; }
.gls-inverse .gls-wordmark { color: var(--gls-ink-inverse); }
/* Misure minime: 140px di larghezza a schermo, 36mm in stampa.
   Sotto questa soglia si usa il monogramma, non il wordmark ridotto */
.gls-monogram { display: inline-flex; align-items: center; justify-content: center;
  background: var(--gls-primary); color: var(--gls-ink-inverse);
  font-family: var(--gls-font-display); font-weight: var(--gls-weight-light);
  letter-spacing: var(--gls-track-mono); border-radius: var(--gls-radius-0);
  width: 64px; height: 64px; font-size: 20px; }

/* ---------- LAYOUT ---------- */
.gls-container { width: 100%; max-width: var(--gls-max-width);
  margin-inline: auto; padding-inline: var(--gls-gutter); }
.gls-section { padding-block: var(--gls-space-8); }
@media (min-width: 768px) { .gls-section { padding-block: var(--gls-space-12); } }
.gls-section--inverse { background: var(--gls-surface-inverse); color: var(--gls-ink-inverse); }
.gls-section--raised { background: var(--gls-surface-raised); }
.gls-grid { display: grid; gap: var(--gls-space-3); }
@media (min-width: 768px) {
  .gls-grid--2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .gls-grid--3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .gls-grid--4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
}
.gls-stack { display: flex; flex-direction: column; gap: var(--gls-space-2); }
.gls-row { display: flex; flex-wrap: wrap; gap: var(--gls-space-2); }
.gls-rule { height: 1px; background: var(--gls-line-strong); border: 0; }
.gls-rule--section { height: 0; border: 0; border-top: var(--gls-rule-section); }

/* ---------- BOTTONI ---------- */
/* Un solo bottone primario per schermata. Etichetta da due a quattro parole,
   verbo all imperativo, nessun punto esclamativo, nessun MAIUSCOLO */
.gls-btn { display: inline-flex; align-items: center; justify-content: center;
  gap: var(--gls-space-1); min-height: var(--gls-touch-min);
  padding: 10px 20px; border-radius: var(--gls-radius-btn);
  font-family: var(--gls-font-body); font-size: 15px;
  font-weight: var(--gls-weight-medium); line-height: 1.2;
  text-decoration: none; cursor: pointer; border: 1px solid transparent;
  box-shadow: var(--gls-shadow-none);
  transition: background-color var(--gls-duration-quick) var(--gls-ease),
              color var(--gls-duration-quick) var(--gls-ease),
              border-color var(--gls-duration-quick) var(--gls-ease); }
.gls-btn--primary { background: var(--gls-royal); color: var(--gls-ink-inverse); }
.gls-btn--primary:hover { background: var(--gls-primary); }
.gls-btn--primary[disabled], .gls-btn--primary.is-disabled {
  background: var(--gls-blue-200); color: var(--gls-ink-subtle); cursor: not-allowed; }
.gls-btn--secondary { background: var(--gls-surface-base); color: var(--gls-primary);
  border-color: var(--gls-primary); }
.gls-btn--secondary:hover { background: var(--gls-blue-050); }
.gls-btn--secondary[disabled], .gls-btn--secondary.is-disabled {
  color: var(--gls-ink-subtle); border-color: var(--gls-blue-200); cursor: not-allowed; }
.gls-btn--text { min-height: 0; padding: 0; background: none; color: var(--gls-primary);
  border: 0; border-bottom: 1px solid transparent; border-radius: 0; }
.gls-btn--text:hover { color: var(--gls-blue-700); border-bottom-color: currentColor; }
.gls-inverse .gls-btn--primary { background: var(--gls-surface-base); color: var(--gls-primary); }
.gls-inverse .gls-btn--primary:hover { background: var(--gls-blue-200); }
.gls-inverse .gls-btn--secondary { background: transparent; color: var(--gls-ink-inverse);
  border-color: rgba(255,255,255,0.6); }
.gls-inverse .gls-btn--secondary:hover { background: rgba(255,255,255,0.12); }

/* ---------- PILL E BADGE ---------- */
/* La pill e una etichetta, non un comando. Curva completa proprio per
   distinguersi da tutto cio che e cliccabile. Massimo due per elemento */
.gls-pill { display: inline-flex; align-items: center; gap: 6px;
  height: 24px; padding: 4px 12px; border-radius: var(--gls-radius-pill);
  background: var(--gls-blue-050); border: 1px solid var(--gls-blue-200);
  color: var(--gls-primary); font-size: 11px; font-weight: var(--gls-weight-semi);
  letter-spacing: 0.10em; text-transform: uppercase; white-space: nowrap;
  box-shadow: var(--gls-shadow-none); }
.gls-pill--solid { background: var(--gls-primary); border-color: var(--gls-primary);
  color: var(--gls-ink-inverse); }
.gls-pill--state { background: var(--gls-surface-base); border-color: var(--gls-line-strong);
  color: var(--gls-ink-muted); }
.gls-pill--state .gls-dot { width: 5px; height: 5px; border-radius: var(--gls-radius-pill);
  background: var(--gls-success); }
.gls-pill--meta { height: 20px; padding: 3px 10px; text-transform: none;
  letter-spacing: 0.08em; font-variant-numeric: tabular-nums;
  background: var(--gls-surface-base); border-color: var(--gls-line-strong);
  color: var(--gls-ink-muted); }
.gls-pill--pos { background: #F3F7F4; border-color: #BFD6C8; color: var(--gls-success);
  text-transform: none; font-variant-numeric: tabular-nums; }
.gls-pill--neg { background: #FBF4F4; border-color: #E0C2C2; color: var(--gls-error);
  text-transform: none; font-variant-numeric: tabular-nums; }
.gls-inverse .gls-pill { background: rgba(255,255,255,0.16);
  border-color: rgba(255,255,255,0.4); color: var(--gls-ink-inverse); }
/* Il badge e numerico e circolare, applicato a una icona. Non sostituisce la pill */
.gls-badge { display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--gls-radius-pill);
  background: var(--gls-primary); color: var(--gls-ink-inverse);
  font-size: 11px; font-weight: var(--gls-weight-semi); font-variant-numeric: tabular-nums; }

/* ---------- CARD ---------- */
/* Definita da un filetto superiore e dallo spazio. Nessun bordo completo,
   nessun raggio, nessuna ombra. Gerarchia: pill, titolo, sommario, meta, azione */
.gls-card { display: flex; flex-direction: column; gap: var(--gls-space-2);
  padding-top: var(--gls-space-2); border-top: var(--gls-rule-section);
  background: transparent; border-radius: var(--gls-radius-0);
  box-shadow: var(--gls-shadow-none); }
.gls-card__title { font-family: var(--gls-font-display); font-weight: var(--gls-weight-light);
  font-size: 22px; line-height: 1.25; color: var(--gls-ink-brand); }
.gls-card__meta { display: flex; gap: var(--gls-space-2); font-size: 11px;
  color: var(--gls-ink-muted); font-variant-numeric: tabular-nums; }  /* 1.0.1: era ink-subtle */

/* ---------- TABELLE E DATI ---------- */
/* Nessuna riga a fondo alternato, nessun bordo verticale.
   Cifre tabellari allineate a destra, segno sempre presente */
.gls-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.gls-table thead th { text-align: left; padding: 8px 0; font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase; font-weight: var(--gls-weight-semi);
  color: var(--gls-ink-muted); border-bottom: 1px solid var(--gls-primary); }  /* 1.0.1: era ink-subtle */
.gls-table tbody td { padding: 10px 0; border-bottom: var(--gls-border-hairline); }
.gls-table .gls-td--num { text-align: right; font-variant-numeric: tabular-nums; }
.gls-table tbody tr:last-child td { border-bottom: 1px solid var(--gls-primary); }

/* ---------- FORM ---------- */
/* Campi a riga singola, senza riquadro: la sottolineatura e l unico contenitore.
   font-size 16px obbligatorio: sotto i 16px iOS Safari fa auto-zoom */
.gls-field { display: flex; flex-direction: column; gap: var(--gls-space-1); }
.gls-label { font-size: 11px; letter-spacing: 0.10em; text-transform: uppercase;
  font-weight: var(--gls-weight-semi); color: var(--gls-ink-muted); }
.gls-input, .gls-select, .gls-textarea {
  width: 100%; min-height: var(--gls-touch-min); padding: 10px 0;
  font-family: var(--gls-font-body); font-size: 16px; color: var(--gls-ink-body);
  background: transparent; border: 0; border-bottom: 1px solid var(--gls-line-strong);
  border-radius: var(--gls-radius-0); appearance: none;
  transition: border-color var(--gls-duration-quick) var(--gls-ease); }
.gls-input:focus, .gls-select:focus, .gls-textarea:focus {
  border-bottom: 1.5px solid var(--gls-royal); } /* 1.0.1: il contorno :focus-visible resta; campo attivo in Royal Blue (brandbook p. 23) */
.gls-field.is-invalid .gls-label { color: var(--gls-error); }
.gls-field.is-invalid .gls-input { border-bottom: 1.5px solid var(--gls-error); }
.gls-field__error { font-size: 11px; color: var(--gls-error); }
.gls-textarea { min-height: 120px; padding-top: 12px; resize: vertical; }

/* ---------- FOCUS DA TASTIERA ---------- */
/* Contorno 2px in Royal Blue con scostamento 2px. Mai rimosso,
   mai sostituito da un semplice cambio di colore */
.gls-page :focus-visible { outline: 2px solid var(--gls-primary); outline-offset: 2px; }
.gls-inverse :focus-visible { outline-color: var(--gls-ink-inverse); }
.gls-skip-link { position: absolute; left: -9999px; }
.gls-skip-link:focus { left: var(--gls-space-2); top: var(--gls-space-2);
  z-index: 999; padding: 12px 16px; background: var(--gls-primary);
  color: var(--gls-ink-inverse); }

/* ---------- LINK NEL TESTO ---------- */
.gls-page a { color: var(--gls-primary); text-decoration: underline;
  text-underline-offset: 2px; }
.gls-page a:hover { color: var(--gls-blue-700); }
.gls-inverse a { color: var(--gls-ink-inverse); }

/* ---------- MOTION ---------- */
/* Rivelare, non annunciare: dissolvenza piu scostamento di 8px.
   Nessuna entrata da fuori schermo, nessun rimbalzo, nessuna scala */
.gls-reveal { opacity: 0; transform: translateY(var(--gls-motion-shift));
  transition: opacity var(--gls-duration-slow) var(--gls-ease-in),
              transform var(--gls-duration-slow) var(--gls-ease-in); }
.gls-reveal.is-visible { opacity: 1; transform: none; }
/* Sequenze: scarto 60ms fra elementi affini, massimo cinque */
.gls-reveal--d1 { transition-delay: 60ms; }
.gls-reveal--d2 { transition-delay: 120ms; }
.gls-reveal--d3 { transition-delay: 180ms; }
.gls-reveal--d4 { transition-delay: 240ms; }

@media (prefers-reduced-motion: reduce) {
  /* Restano solo le dissolvenze a 80ms: scostamenti e zoom azzerati, non accorciati */
  .gls-page *, .gls-page *::before, .gls-page *::after {
    animation-duration: var(--gls-duration-instant) !important; /* vince su transizioni di tema e builder */
    animation-iteration-count: 1 !important;
    transition-duration: var(--gls-duration-instant) !important;
    transition-delay: 0ms !important; }
  .gls-reveal { transform: none; }
}

/* ---------- FOCUS DA TASTIERA (brandbook p. 16) ---------- */
.gls-page :focus-visible, .gls-footer :focus-visible {
  outline: 2px solid var(--gls-royal); outline-offset: 2px; }

/* ---------- UTILITY MINIME ---------- */
.gls-vh { position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap; }
.gls-nowrap { white-space: nowrap; }

/* ============================================================
   OVERRIDE TEMA · TIPOGRAFIA · Salient 18.2.1
   Richiesta cliente 17/09/2026: imporre i caratteri del brandbook
   (pagina 17) con !important, senza toccare le opzioni di Salient.
   Regole Open Sans censite nel tema: main-styles (body x2, ::before
   delle citazioni, #nectar-ocm-ht-line-check), skin-material (menu
   off-canvas), dynamic-css (campo ricerca), nectar-ocm-core (4 regole
   off-canvas). Tutto il resto eredita da body.
   Dentro .gls-page non si applica: li valgono le classi del sistema.
   Nota: il file Open Sans viene ancora scaricato finche Salient lo
   mette in coda. L override cambia cio che si vede, non cio che si
   scarica.
   ============================================================ */

/* Testo corrente: vince su main-styles "body" (Open Sans, Helvetica) */
body { font-family: var(--gls-font-body) !important; }

/* Controlli di modulo: non ereditano da body per default del browser,
   e dynamic-css forza Open Sans sul campo ricerca #search-outer */
body :is(input, textarea, select, button):not(.gls-page *),
#search-outer #search input[type="text"] {
  font-family: var(--gls-font-body) !important; } /* vince su UA e dynamic-css */

/* Menu off-canvas mobile: skin-material e nectar-ocm-core scrivono
   Open Sans direttamente su li > a, small e sul pulsante di chiusura */
#slide-out-widget-area .off-canvas-menu-container li a,
#slide-out-widget-area .menuwrapper li small,
#slide-out-widget-area .slide_out_area_close,
#nectar-ocm-ht-line-check {
  font-family: var(--gls-font-body) !important; } /* vince su skin-material e nectar-ocm-core */

/* Titoli di livello 1-3 fuori dalle pagine GLS: voce della marca.
   Salient li lascia ereditare da body e imposta pesi propri */
body :is(h1, h2, h3):not(.gls-page *) {
  font-family: var(--gls-font-display) !important;  /* brandbook: graziato sopra i 28px */
  font-weight: var(--gls-weight-light) !important;  /* Spectral Light, vince sui pesi di Salient */
}

/* Titoli di livello 4-6: corpi piccoli, voce del sistema */
body :is(h4, h5, h6):not(.gls-page *) {
  font-family: var(--gls-font-body) !important;     /* brandbook: lineare sotto i 28px */
  font-weight: var(--gls-weight-semi) !important;   /* 600, il 700 non si usa */
}

/* Il glifo delle citazioni nei blog masonry usa Open Sans in main-styles */
.masonry .post.quote .quote-wrap::before,
.single .post.format-quote .quote-wrap::before {
  font-family: var(--gls-font-display) !important; } /* vince su main-styles */

/* Peso 700 escluso dal brandbook: grassetti a 600 ovunque */
b, strong { font-weight: var(--gls-weight-semi) !important; } /* vince sul bold UA e di Salient */

/* ---------- OVERRIDE TEMA · SCORRIMENTO (1.1.10) ---------- */
/* Salient mette overflow: hidden sul body: il body diventa contenitore di
   ritaglio e ogni position: sticky smette di funzionare. clip ritaglia allo
   stesso modo senza creare un contenitore di scorrimento. Restano validi gli
   stati di Salient che bloccano lo scorrimento (html.no-overflow-y body, piu
   specifico) e quello di fancybox (escluso). Browser senza clip: resta hidden. */
body:not(.compensate-for-scrollbar) { overflow-x: clip; overflow-y: visible; }

/* ---------- OVERRIDE TEMA · LISTE E IMMAGINI (Salient main-styles) ---------- */
/* main-styles scrive "ul li { list-style: outside disc }" sul li, non sul ul:
   il reset su ul non basta. .gls-page li (0,1,1) vince su ul li (0,0,2) */
.gls-page li { list-style: none; }
/* main-styles: ".row .col img { margin-bottom: 15px }" su ogni immagine dentro
   una riga WPBakery. Specificita 0,3,1 per vincere senza !important */
.row .col .gls-page img { margin-bottom: 0; }

/* ============================================================
   OVERRIDE TEMA · HEADER, MENU E MEGA MENU · Salient 18.2.1
   Richiesta cliente 17/09/2026: header in branding, animated underline
   di Salient ridisegnato, mega menu Servizi, icone dei pilastri.
   Opzioni Salient gia allineate (deploy 009): accent #141E55, ombre
   header e dropdown a none, colori header custom, padding 28.
   Qui solo cio che le opzioni non coprono. Ogni !important vince su
   skin-material, main-styles o dynamic-css, come indicato riga per riga.
   ============================================================ */

/* ---------- HEADER ---------- */
/* Nessuna ombra (brandbook p. 20): filetto hairline come unico confine */
#header-outer {
  box-shadow: none !important;                        /* vince su data-box-shadow di skin-material */
  border-bottom: var(--gls-border-hairline) !important; } /* Salient non prevede un bordo inferiore */

/* ---------- VOCI DI PRIMO LIVELLO ---------- */
#header-outer #top nav > ul > li:not([class*="button_"]) > a {
  font-family: var(--gls-font-body) !important;      /* vince su dynamic-css (tipografia tema) */
  font-size: var(--gls-text-eyebrow) !important;       /* 12px: menu in occhiello (declinazione, Sito · testata) */
  font-weight: var(--gls-weight-semi) !important;      /* 600, occhiello */
  letter-spacing: var(--gls-track-eyebrow) !important; /* +0,18em, vince sul tracking di skin-material */
  text-transform: uppercase !important;                /* occhiello: l unico maiuscolo ammesso (brandbook p. 19) */
  color: var(--gls-ink-body) !important;               /* vince su header-font-color inline */
  transition: color var(--gls-duration-quick) var(--gls-ease) !important; } /* 160ms standard */
#header-outer #top nav > ul > li:not([class*="button_"]) > a:hover,
#header-outer #top nav > ul > li.sfHover:not([class*="button_"]) > a,
#header-outer #top nav > ul > li.current-menu-item > a,
#header-outer #top nav > ul > li.current-menu-ancestor > a {
  color: var(--gls-royal) !important; }               /* voce attiva in Royal Blue (declinazione); vince su header-font-hover-color inline */

/* Filetto al posto dell animated underline: Royal Blue #001088 1,5px, parte da
   sinistra, 280ms curva standard. Salient anima scaleX sul ::after */
#header-outer[data-lhe="animated_underline"] #top nav > ul > li:not([class*="button_"]) > a .menu-title-text::after {
  border-top-width: 1.5px !important;                  /* vince su animated-underline-thickness */
  border-color: var(--gls-royal) !important;           /* filetto in Royal Blue; vince sull accent di dynamic-css */
  bottom: -6px !important;                             /* vince su bottom -3px di skin-material */
  transform-origin: left center !important;            /* vince su transform-origin 0 0 */
  transition: transform var(--gls-duration-base) var(--gls-ease) !important; } /* vince su 0.35s cubic-bezier(0.52,...) */

/* Focus da tastiera visibile su tutto il menu (brandbook p. 16) */
#header-outer #top nav a:focus-visible,
#header-outer #logo:focus-visible {
  outline: 2px solid var(--gls-royal) !important;      /* brandbook p. 16; vince sull outline none di main-styles */
  outline-offset: 2px; }

/* ---------- CTA NEL MENU ---------- */
/* Salient disegna il fondo del bottone su a::before con raggio 4px */
#header-outer #top nav > ul > li.gls-nav-cta > a {
  font-family: var(--gls-font-body) !important;        /* vince su dynamic-css */
  font-size: 15px !important;                          /* brandbook p. 21 */
  font-weight: var(--gls-weight-medium) !important;    /* 500 */
  letter-spacing: 0 !important;
  color: var(--gls-ink-inverse) !important; }          /* vince sul colore bottone di skin-material */
#header-outer #top nav > ul > li.gls-nav-cta > a::before {
  background-color: var(--gls-royal) !important;       /* azione primaria in Royal Blue; vince sull accent di dynamic-css */
  border-radius: var(--gls-radius-btn) !important;     /* 2px, vince su button-styling-roundness 4 */
  box-shadow: none !important;                         /* vince su slightly_rounded_shadow */
  height: var(--gls-touch-min) !important;             /* 44px, brandbook p. 21 */
  transform: translateY(-50%) !important;              /* centratura con altezza nuova */
  top: 50% !important;
  transition: background-color var(--gls-duration-quick) var(--gls-ease) !important; }
#header-outer #top nav > ul > li.gls-nav-cta > a:hover::before {
  background-color: var(--gls-action-hover) !important; } /* vince su hover scale di Salient */

/* ---------- HEADER COMPRESSO E SIMMETRICO AL FOOTER ---------- */
/* Stesso contenitore del footer (1200px + gutter 24), stesso wordmark
   (168px a ogni viewport: altezza maiuscola circa 17px, declinazione 16-18px,
   minimo 140px del brandbook p. 09) e quindi stesso bordo sinistro */
#header-outer #top > .container {
  width: 100% !important;                              /* vince su 88% di main-styles sotto 1000px */
  max-width: var(--gls-max-width) !important;          /* vince su 1425px di main-styles */
  padding-left: var(--gls-gutter) !important;          /* vince su 90px di main-styles */
  padding-right: var(--gls-gutter) !important; }
#header-outer #logo img {
  width: 168px !important;                             /* vince sull altezza inline da logo-height */
  height: auto !important; }

/* ---------- MEGA MENU SERVIZI · v5 (edizione 02) ---------- */
/* Pannello a tutta larghezza (Salient: header-megamenu-width full-width): larghezza e
   padding laterale restano allo script Salient, che allinea il contenuto al logo.
   Registro a colonne: filetti verticali hairline, testata di colonna con icona Royal
   Blue, indice e titolo in Spectral; sotto il titolo un filetto hairline che in hover
   diventa il filetto di sezione Royal Blue 1,5px (brandbook p. 20). Sottoservizi solo
   testo: nessuna icona decorativa (p. 06 regola 01, p. 26). Chiusura del pannello con
   filetto di sezione 1,5px. */
#header-outer #top nav > ul > li.gls-mm-servizi { counter-reset: gls-pillar; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu {
  display: grid !important;                            /* vince su display table di main-styles */
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding-top: var(--gls-space-6) !important;          /* vince su 30px di main-styles */
  padding-bottom: var(--gls-space-8) !important;
  background: var(--gls-surface-base) !important;
  border-top: var(--gls-border-hairline) !important;
  border-bottom: var(--gls-rule-section) !important;   /* 1,5px Royal Blue: chiusura di sezione */
  box-shadow: none !important;                         /* vince su header-dropdown-box-shadow */
  border-radius: 0 !important; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li {
  position: relative;
  display: block !important;                           /* vince su table-cell */
  width: auto !important;
  padding: 0 var(--gls-space-2) !important;            /* vince su padding-left 30px */
  border: 0 !important; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li:first-child { padding-left: 0 !important; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li:last-child { padding-right: 0 !important; }
/* Filetto verticale di colonna: si traccia dall alto all apertura, una colonna dopo l altra */
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0;
  border-left: var(--gls-border-hairline);
  transform: scaleY(0); transform-origin: center top;
  transition: opacity var(--gls-duration-quick) var(--gls-ease); }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li:first-child::before { display: none; }
#header-outer #top nav > ul > li.gls-mm-servizi:hover > ul.sub-menu > li::before,
#header-outer #top nav > ul > li.gls-mm-servizi.sfHover > ul.sub-menu > li::before {
  animation: gls-mm-rule var(--gls-duration-slow) var(--gls-ease-in) both; }
/* Le colonne non puntate scendono in secondo piano; l opacita sta sui figli perche
   sul li vincerebbe il valore animato della comparsa */
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu:hover > li > a,
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu:hover > li > ul.sub-menu {
  opacity: 0.72;
  transition: opacity var(--gls-duration-quick) var(--gls-ease); }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu:hover > li:hover > a,
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu:hover > li:hover > ul.sub-menu { opacity: 1; }

/* SERVIZIO: icona 24px, indice 01-05, titolo Spectral Light, filetto di chiusura */
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro { counter-increment: gls-pillar; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro > a {
  display: grid !important;                            /* vince su display block */
  grid-template-columns: auto 1fr;
  grid-template-areas: "icon index" "title title";
  align-items: center;
  row-gap: var(--gls-space-2);
  margin: 0 0 var(--gls-space-2) !important;
  padding: 0 0 var(--gls-space-2) !important;          /* vince su padding 6px */
  border: 0 !important;
  border-bottom: var(--gls-border-hairline) !important;
  background: transparent !important;
  color: var(--gls-ink-brand) !important; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro > a::before {
  content: ""; grid-area: icon;
  width: 24px; height: 24px;                           /* griglia 24, brandbook p. 26 */
  background-color: var(--gls-royal);                  /* icone in Royal Blue (brandbook p. 26) */
  -webkit-mask: var(--gls-mm-icon) left center / 24px 24px no-repeat;
          mask: var(--gls-mm-icon) left center / 24px 24px no-repeat; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro > a::after {
  content: counter(gls-pillar, decimal-leading-zero) !important; /* vince sulla freccia sf-with-ul */
  grid-area: index; justify-self: end;
  position: static !important; border: 0 !important; transform: none !important;
  width: auto !important; height: auto !important; background: none !important;
  font-family: var(--gls-font-body); font-size: var(--gls-text-micro);
  font-weight: var(--gls-weight-semi); letter-spacing: var(--gls-track-micro);
  font-variant-numeric: tabular-nums; color: var(--gls-ink-muted);
  transition: color var(--gls-duration-quick) var(--gls-ease); }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li:hover > a::after { color: var(--gls-royal); }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro > a .menu-title-text {
  grid-area: title; display: block; position: relative;
  font-family: var(--gls-font-display) !important;     /* voce della marca per il servizio */
  font-weight: var(--gls-weight-light) !important;
  font-size: 20px !important;                          /* soglia minima del graziato, brandbook p. 17 */
  line-height: 1.2 !important;
  letter-spacing: -0.005em !important;
  text-transform: none !important;
  white-space: nowrap;
  color: var(--gls-ink-brand) !important; }
/* Filetto di sezione Royal Blue che si traccia da sinistra sotto il titolo della colonna puntata,
   esattamente sopra il filetto hairline di testata: e l unico accento in movimento del pannello */
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro > a .menu-title-text::after {
  content: ""; display: block !important; position: absolute; left: 0; right: 0;
  bottom: calc(-1 * var(--gls-space-2) - 1px);        /* padding inferiore della testata + spessore hairline */
  border: 0 !important; border-top: var(--gls-rule-section) !important;
  transform: scaleX(0); transform-origin: left center;
  transition: transform var(--gls-duration-base) var(--gls-ease); }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li:hover > a .menu-title-text::after,
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.current-menu-ancestor > a .menu-title-text::after { transform: scaleX(1); }

/* SOTTOSERVIZI: solo testo, Schibsted 15px, passo fisso 32px, niente icone e niente filetti */
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li > ul.sub-menu {
  position: static !important; display: block !important; /* vince sul dropdown annidato di Salient */
  visibility: visible !important; opacity: 1 !important; transform: none !important;
  width: auto !important; padding: 0 !important; margin: 0 !important;
  background: transparent !important; box-shadow: none !important; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li > ul.sub-menu > li { padding: 0 !important; border: 0 !important; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li > ul.sub-menu > li > a {
  display: flex !important; align-items: center;
  min-height: 32px;                                    /* passo fisso: le cinque colonne combaciano riga per riga */
  padding: 4px 0 !important;
  font-family: var(--gls-font-body) !important;
  font-size: 15px !important;                          /* declinazione: testo mai sotto 15px; vince su 12px di main-styles */
  font-weight: var(--gls-weight-regular) !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;                      /* nessuna voce su due righe */
  letter-spacing: 0 !important; text-transform: none !important;
  color: var(--gls-ink-body) !important;               /* vince su header-dropdown-font-color */
  background: transparent !important;
  text-decoration: none !important;
  transition: color var(--gls-duration-quick) var(--gls-ease) !important; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li > ul.sub-menu > li > a::before { display: none !important; } /* 1.1.1: nessuna icona sui sottoservizi */
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li > ul.sub-menu > li > a::after { display: none !important; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li > ul.sub-menu > li > a .menu-title-text::after { display: none !important; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li > ul.sub-menu > li > a:hover,
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li > ul.sub-menu > li > a:focus-visible,
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li > ul.sub-menu > li.current-menu-item > a { color: var(--gls-royal) !important; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li > ul.sub-menu > li > a:hover .menu-title-text {
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* 1.1.1: il filetto in cima al pannello e stato sostituito dal filetto sotto il titolo (vedi testata) */
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li::after { display: none; }

/* Comparsa: dissolvenza piu 8px, colonne in sequenza a 60ms, massimo cinque passi */
@keyframes gls-mm-in { from { opacity: 0; transform: translateY(var(--gls-motion-shift)); } to { opacity: 1; transform: none; } }
@keyframes gls-mm-rule { from { transform: scaleY(0); } to { transform: scaleY(1); } }
#header-outer #top nav > ul > li.gls-mm-servizi:hover > ul.sub-menu > li,
#header-outer #top nav > ul > li.gls-mm-servizi.sfHover > ul.sub-menu > li { animation: gls-mm-in var(--gls-duration-base) var(--gls-ease-in) both; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro:nth-child(2) { animation-delay: 60ms; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li:nth-child(2)::before { animation-delay: 60ms; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li:nth-child(3)::before { animation-delay: 120ms; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li:nth-child(4)::before { animation-delay: 180ms; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li:nth-child(5)::before { animation-delay: 240ms; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro:nth-child(3) { animation-delay: 120ms; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro:nth-child(4) { animation-delay: 180ms; }
#header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro:nth-child(5) { animation-delay: 240ms; }
@media (prefers-reduced-motion: reduce) {
  #header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li { animation: none !important; } /* nessuno scostamento */
  #header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li::before { animation: none !important; transform: scaleY(1); } /* filetti gia tracciati */
  #header-outer #top nav > ul > li.gls-mm-servizi > ul.sub-menu > li.gls-mm-pilastro > a .menu-title-text::after { transition: none; }
  #header-outer #top nav > ul > li > a .menu-title-text::after { transition-duration: var(--gls-duration-instant) !important; }
}

/* ---------- ICONE · SERVIZI E SOTTOSERVIZI ---------- */
/* Griglia 24, area utile 20, tratto 1,5px, terminali e giunzioni vivi,
   nessun riempimento, nessun cliche (brandbook p. 26). Colore via mask.
   Sorgenti SVG: brand-assets/icone/ */
.gls-mm-strategia { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 20h5v-5h5v-5h5V4h3'/%3E%3Cpath d='M3 4h6M3 4v6'/%3E%3C/svg%3E"); }
.gls-mm-seo { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5L21 21'/%3E%3C/svg%3E"); }
.gls-mm-ads { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 9h4l9-5v16l-9-5H3z'/%3E%3Cpath d='M7 15l2 6M20 9v6'/%3E%3C/svg%3E"); }
.gls-mm-ai { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M7 7h10v10H7z'/%3E%3Cpath d='M10 3v4M14 3v4M10 17v4M14 17v4M3 10h4M3 14h4M17 10h4M17 14h4'/%3E%3C/svg%3E"); }
.gls-mm-web { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 4h18v16H3zM3 8h18'/%3E%3Cpath d='M10 12l-2.5 2.5L10 17M14 12l2.5 2.5L14 17'/%3E%3C/svg%3E"); }
.gls-ic-piano-marketing { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M6 3h9l3 3v15H6z'/%3E%3Cpath d='M9 10h6M9 14h6M9 18h3'/%3E%3C/svg%3E"); }
.gls-ic-analisi-mercato { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 20h18'/%3E%3Cpath d='M7 20v-6M12 20V8M17 20v-10'/%3E%3C/svg%3E"); }
.gls-ic-brand-positioning { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 1v3M12 20v3M1 12h3M20 12h3'/%3E%3C/svg%3E"); }
.gls-ic-marketing-b2b { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 21V9h7v12M14 21V4h7v17M2 21h20'/%3E%3Cpath d='M6 13h1M6 17h1M17 8h1M17 12h1M17 16h1'/%3E%3C/svg%3E"); }
.gls-ic-growth-hacking { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M13 3L5 14h6l-1 7 8-11h-6z'/%3E%3C/svg%3E"); }
.gls-ic-funnel-marketing { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 4h18l-7 9v6l-4 2v-8z'/%3E%3C/svg%3E"); }
.gls-ic-digital-strategy { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15.5 8.5l-2 5-5 2 2-5z'/%3E%3C/svg%3E"); }
.gls-ic-consulenza-startup { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M12 21v-9'/%3E%3Cpath d='M12 12C12 7.5 9 5 4 5c0 5 3 7 8 7z'/%3E%3Cpath d='M12 10c0-3.5 2-6 7-6 0 4-2.5 6-7 6z'/%3E%3C/svg%3E"); }
.gls-ic-audit-seo { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M8 3h8v3H8z'/%3E%3Cpath d='M8 5H5v16h14V5h-3'/%3E%3Cpath d='M9 14l2 2 4-4'/%3E%3C/svg%3E"); }
.gls-ic-seo-tecnica { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M8 7l-5 5 5 5M16 7l5 5-5 5M13.5 4l-3 16'/%3E%3C/svg%3E"); }
.gls-ic-seo-locale { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M12 21s-7-6.2-7-12a7 7 0 0 1 14 0c0 5.8-7 12-7 12z'/%3E%3Ccircle cx='12' cy='9' r='2.5'/%3E%3C/svg%3E"); }
.gls-ic-link-building { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M10 14a4 4 0 0 0 5.7 0l3-3a4 4 0 0 0-5.7-5.7l-1 1'/%3E%3Cpath d='M14 10a4 4 0 0 0-5.7 0l-3 3a4 4 0 0 0 5.7 5.7l1-1'/%3E%3C/svg%3E"); }
.gls-ic-seo-ecommerce { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M5 8h14l-1 13H6z'/%3E%3Cpath d='M9 8V6a3 3 0 0 1 6 0v2'/%3E%3C/svg%3E"); }
.gls-ic-content-seo { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16z'/%3E%3Cpath d='M13 7l4 4M12 20h8'/%3E%3C/svg%3E"); }
.gls-ic-seo-internazionale { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='M12 3c3.5 3.5 3.5 14.5 0 18M12 3c-3.5 3.5-3.5 14.5 0 18'/%3E%3C/svg%3E"); }
.gls-ic-ottimizzazione-aeo { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M4 4h16v11H9l-5 4z'/%3E%3Cpath d='M12 6.5l1 2.5 2.5 1-2.5 1-1 2.5-1-2.5-2.5-1 2.5-1z'/%3E%3C/svg%3E"); }
.gls-ic-google-ads { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M5 3l13 7.5-5.5 1.5-2.5 5.5z'/%3E%3Cpath d='M12.5 12l6 6'/%3E%3C/svg%3E"); }
.gls-ic-facebook-ads { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M4 4h16v16H4z'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M16.5 7.5h1'/%3E%3C/svg%3E"); }
.gls-ic-linkedin-ads { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 8h18v12H3z'/%3E%3Cpath d='M9 8V5h6v3M3 13h18'/%3E%3C/svg%3E"); }
.gls-ic-remarketing { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M20 12a8 8 0 1 1-2.3-5.7'/%3E%3Cpath d='M20 3v5h-5'/%3E%3C/svg%3E"); }
.gls-ic-google-shopping { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M2 4h3l2.5 11h11L21 7H6.2'/%3E%3Ccircle cx='9' cy='19.5' r='1.5'/%3E%3Ccircle cx='17' cy='19.5' r='1.5'/%3E%3C/svg%3E"); }
.gls-ic-cro-ottimizzazione-conversioni { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M4 6h9M17 6h3M4 12h3M11 12h9M4 18h11M19 18h1'/%3E%3Cpath d='M15 4v4M9 10v4M17 16v4'/%3E%3C/svg%3E"); }
.gls-ic-analytics-tracking { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 12h4l3-7 4 14 3-7h4'/%3E%3C/svg%3E"); }
.gls-ic-performance-marketing { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M4 17a8 8 0 1 1 16 0'/%3E%3Cpath d='M12 17l4-5M3 21h18'/%3E%3C/svg%3E"); }
.gls-ic-corso-chatgpt-aziendale { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 4h12v9H8l-5 4z'/%3E%3Cpath d='M18 8h3v11l-3-2h-7v-2'/%3E%3C/svg%3E"); }
.gls-ic-ai-marketing { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M12 3l2 6 6 2-6 2-2 6-2-6-6-2 6-2z'/%3E%3Cpath d='M19 17v4M17 19h4'/%3E%3C/svg%3E"); }
.gls-ic-automazione-marketing { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 4h6v6H3zM15 14h6v6h-6z'/%3E%3Cpath d='M9 7h5v10h1M6 10v7h9'/%3E%3C/svg%3E"); }
.gls-ic-prompt-engineering { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 5h18v14H3z'/%3E%3Cpath d='M7 10l3 2-3 2M12 15h5'/%3E%3C/svg%3E"); }
.gls-ic-ai-content-creation { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M4 20h4L18 10l-4-4L4 16z'/%3E%3Cpath d='M18 2v4M16 4h4'/%3E%3C/svg%3E"); }
.gls-ic-ai-analytics { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M12 3v9h9'/%3E%3Cpath d='M21 14.5A9 9 0 1 1 9.5 3.3'/%3E%3C/svg%3E"); }
.gls-ic-workshop-ai { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 4h18v11H3z'/%3E%3Cpath d='M12 15v3M8 21l4-3 4 3'/%3E%3C/svg%3E"); }
.gls-ic-strategia-ai-aziendale { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M12 3l9 5-9 5-9-5z'/%3E%3Cpath d='M3 13l9 5 9-5'/%3E%3C/svg%3E"); }
.gls-ic-sito-wordpress { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 4h18v16H3z'/%3E%3Cpath d='M3 9h18M9 9v11'/%3E%3C/svg%3E"); }
.gls-ic-ecommerce { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 4h18l-1 6H4z'/%3E%3Cpath d='M5 10v10h14V10M10 20v-5h4v5'/%3E%3C/svg%3E"); }
.gls-ic-landing-page { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M5 3h14v18H5z'/%3E%3Cpath d='M8 7h8M8 10h8M9 14h6v3H9z'/%3E%3C/svg%3E"); }
.gls-ic-restyling-sito-web { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M14 3l7 7-8 8H6v-7z'/%3E%3Cpath d='M3 21l3-3M11 6l7 7'/%3E%3C/svg%3E"); }
.gls-ic-sito-headless { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M4 3h16v6H4zM4 15h16v6H4z'/%3E%3Cpath d='M8 9v6M16 9v6'/%3E%3C/svg%3E"); }
.gls-ic-ottimizzazione-velocita-sito { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Ccircle cx='12' cy='13' r='8'/%3E%3Cpath d='M12 13l3.5-3.5M10 2h4M12 2v3'/%3E%3C/svg%3E"); }
.gls-ic-web-app-pwa { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M7 2h10v20H7z'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E"); }
.gls-ic-manutenzione-sito-web { --gls-mm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E"); }

/* ---------- BREADCRUMB (Yoast, stampato da Salient nel contenitore main-content) ---------- */
/* Il contenitore di Salient e 1425px con 90px di padding: il breadcrumb esce da quel ritmo e si
   centra sul viewport con la stessa larghezza del contenuto di testata e piede, cosi il primo
   carattere e a filo del wordmark (144px a 1440, 24px sotto 1200). */
.container-wrap .container.main-content > .row > #breadcrumbs.yoast {
  position: relative; left: 50%; transform: translateX(-50%);
  width: min(calc(100vw - 2 * var(--gls-gutter)), calc(var(--gls-max-width) - 2 * var(--gls-gutter)));
  margin: 0 !important; padding: var(--gls-space-3) 0 !important; /* vince sui margini dei paragrafi di main-styles */
  font-family: var(--gls-font-body); font-size: var(--gls-text-sm); line-height: var(--gls-leading-sm);
  color: var(--gls-ink-body); }
.container-wrap .container.main-content > .row > #breadcrumbs.yoast a {
  color: var(--gls-ink-muted); text-decoration: none;
  transition: color var(--gls-duration-quick) var(--gls-ease); }
.container-wrap .container.main-content > .row > #breadcrumbs.yoast a:hover,
.container-wrap .container.main-content > .row > #breadcrumbs.yoast a:focus-visible { color: var(--gls-royal); }
.container-wrap .container.main-content > .row > #breadcrumbs.yoast .breadcrumb_last { color: var(--gls-ink-body); }

/* ---------- MENU MOBILE (off-canvas material) ---------- */
#slide-out-widget-area.slide-out-from-right,
#slide-out-widget-area-bg.slide-out-from-right {
  background-color: var(--gls-surface-inverse) !important; } /* vince sul fondo di skin-material */
#slide-out-widget-area .off-canvas-menu-container li a {
  font-weight: var(--gls-weight-medium) !important;
  letter-spacing: 0 !important;
  color: var(--gls-ink-inverse) !important; }          /* vince su nectar-ocm-core */

/* ============================================================
   ANIMAZIONI DELLE PAGINE SERVIZIO (1.1.3)
   Definite una volta sola: le pagine le richiamano con animation: gls-<nome>.
   Solo transform e opacity (piu il colore di fondo nel campo dei clic), curva
   cubic-bezier(.4,0,.2,1), cicli lenti. Il blocco prefers-reduced-motion in testa
   le riduce a 80ms e a una sola iterazione.
   ============================================================ */
@keyframes gls-cell {                 /* campo dei clic dell hero: onda diagonale, 6s */
  0%, 40% { opacity: .1; background: var(--gls-primary); }
  48%     { opacity: 1;  background: var(--gls-royal); }
  58%, 100% { opacity: .1; background: var(--gls-primary); } }
@keyframes gls-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }   /* slider referenze, 48s */
@keyframes gls-rise    { from { transform: scaleY(0); }  to { transform: scaleY(1); } }              /* scala a gradini, in sequenza */
@keyframes gls-shrink  { from { transform: scaleY(1); }  to { transform: scaleY(.6); } }             /* colonne del report, in controfase */
@keyframes gls-grow    { from { transform: scaleY(.65); } to { transform: scaleY(1); } }
@keyframes gls-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }             /* barra dei box Altri servizi, 6s */
@keyframes gls-storyA {                /* alternanza dei due servizi in un box, 12s */
  0%, 46% { opacity: 1; }
  50%, 96% { opacity: 0; pointer-events: none; }
  100% { opacity: 1; } }
@keyframes gls-storyB {
  0%, 46% { opacity: 0; pointer-events: none; }
  50%, 96% { opacity: 1; }
  100% { opacity: 0; } }
@keyframes gls-write {                 /* righe del report che si scrivono, 9s */
  0% { transform: scaleX(0); }
  28%, 80% { transform: scaleX(1); }
  92%, 100% { transform: scaleX(0); } }
@keyframes gls-node {                  /* 1.1.4: nodo che si accende al passaggio dell identificativo, 6s */
  0%, 12%   { background: var(--gls-surface-base); color: var(--gls-royal); }
  18%, 30%  { background: var(--gls-royal); color: var(--gls-ink-inverse); }
  40%, 100% { background: var(--gls-surface-base); color: var(--gls-royal); } }
@keyframes gls-settle {                /* 1.1.4: cifra che si assesta, solo transform */
  0%, 12%   { transform: scale(1); }
  20%       { transform: scale(1.06); }
  34%, 100% { transform: scale(1); } }
@keyframes gls-phase {                 /* 1.1.4: filetto della fase attiva: si traccia, resta, sfuma; ciclo 12s su quattro fasi */
  0%        { transform: scaleX(0); opacity: 1; }
  16%, 22%  { transform: scaleX(1); opacity: 1; }
  28%, 100% { transform: scaleX(1); opacity: 0; } }
@keyframes gls-turn {                  /* 1.1.7: evidenza a turno in una serie di cinque (ritardo k x 2,4s su 12s) */
  0%, 16%   { opacity: 1; }
  22%, 100% { opacity: 0; } }
@keyframes gls-breathe {               /* 1.1.7: respiro, solo transform */
  0%, 100%  { transform: scale(1); }
  50%       { transform: scale(1.12); } }
@keyframes gls-fill {                  /* 1.1.9: si riempie e resta, poi si azzera; ritardo per quadrato */
  0%, 12%   { opacity: .12; }
  22%, 84%  { opacity: 1; }
  94%, 100% { opacity: .12; } }

/* ============================================================
   CONTRASTI VERIFICATI (WCAG 2.2, strumento non a occhio)
   primary (Navy) su bianco   16,9:1  AAA
   bianco su primary          16,9:1  AAA
   royal su bianco            14,7:1  AAA
   bianco su royal            14,7:1  AAA
   royal su primary            1,1:1  MAI: Royal Blue e Navy non si sovrappongono
   ink-body  su bianco        14,4:1  AAA
   ink-muted su bianco         6,3:1  AA
   ink-subtle su bianco        3,1:1  solo testo da 24px in su
   blue-600  su bianco         6,4:1  AA
   blue-400  su bianco         2,8:1  NON conforme, vietato per testo
   primary   su Iron          10,9:1  AAA
   bianco    su success        5,3:1  AA
   ============================================================ */