/* GANTRY5 DEVELOPMENT MODE ENABLED.
 *
 * WARNING: This file is automatically generated by Gantry5. Any modifications to this file will be lost!
 *
 * For more information on modifying CSS, please read:
 *
 * http://docs.gantry.org/gantry5/configure/styles
 * http://docs.gantry.org/gantry5/tutorials/adding-a-custom-style-sheet
 */

@charset "UTF-8";
/* ---------------------------------------------------------
   BOTTONE BASE INCA
   - Stile principale
   - Nessun arrotondamento (design INCA)
---------------------------------------------------------- */
/* ---------------------------------------------------------
   BOTTONE OUTLINE
   - Versione alternativa con bordo e sfondo trasparente
---------------------------------------------------------- */
/* ---------------------------------------------------------
   BOTTONE SMALL
   - Per menù, barra utility, pulsanti compatti
---------------------------------------------------------- */
/* ---------------------------------------------------------
   MIXIN BADGE (SOLIDO)
   - Badge con sfondo colorato
---------------------------------------------------------- */
/* ---------------------------------------------------------
   MIXIN BADGE OUTLINE
   - Versione con bordo e sfondo trasparente
---------------------------------------------------------- */
/* ---------------------------------------------------------
   DIMENSIONI BADGE
   - Utilities: sm / md / lg
---------------------------------------------------------- */
.badge-sm {
  padding: 2px 6px !important;
  font-size: 0.65rem !important;
}
.badge-md {
  padding: 4px 8px !important;
  font-size: 0.75rem !important;
}
.badge-lg {
  padding: 6px 12px !important;
  font-size: 0.85rem !important;
}
/* ---------------------------------------------------------
   BADGE SOLIDI
---------------------------------------------------------- */
.badge-red {
  display: inline-block;
  background-color: #e30613;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
.badge-blue {
  display: inline-block;
  background-color: #00b5e2;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
.badge-green {
  display: inline-block;
  background-color: #80ba27;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
.badge-violet {
  display: inline-block;
  background-color: #8a78b6;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
.badge-yellow {
  display: inline-block;
  background-color: #fbba00;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
.badge-gray {
  display: inline-block;
  background-color: #6e6e6e;
  color: #000;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
/* ---------------------------------------------------------
   BADGE OUTLINE
---------------------------------------------------------- */
.badge-outline-red {
  display: inline-block;
  color: #e30613;
  background-color: transparent;
  border: 1px solid #e30613;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
.badge-outline-blue {
  display: inline-block;
  color: #00b5e2;
  background-color: transparent;
  border: 1px solid #00b5e2;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
.badge-outline-green {
  display: inline-block;
  color: #80ba27;
  background-color: transparent;
  border: 1px solid #80ba27;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
.badge-outline-violet {
  display: inline-block;
  color: #8a78b6;
  background-color: transparent;
  border: 1px solid #8a78b6;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
.badge-outline-yellow {
  display: inline-block;
  color: #fbba00;
  background-color: transparent;
  border: 1px solid #fbba00;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
.badge-outline-gray {
  display: inline-block;
  color: #6e6e6e;
  background-color: transparent;
  border: 1px solid #6e6e6e;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1;
  text-transform: uppercase;
}
/* ==================================================
   Helper – Marker
   ================================================== */
.inca-marker {
  display: block;
  /* fondamentale */
  width: 100%;
  /* occupa tutto il content */
  box-sizing: border-box;
  padding: 16px 20px;
  border-radius: 4px;
  background-color: #e30613;
  border: 1px solid #a59292;
  color: #ffffff;
  /* eccezione per i bottoni */
}
.inca-marker h1, .inca-marker h2, .inca-marker h3, .inca-marker h4, .inca-marker h5, .inca-marker h6, .inca-marker p, .inca-marker span, .inca-marker strong, .inca-marker em, .inca-marker li {
  color: inherit;
}
.inca-marker a, .inca-marker a * {
  color: #fbba00;
}
.inca-marker .btn-inca-outline, .inca-marker .btn-inca-outline * {
  background-color: #ffffff;
  border: 2px solid #a59292;
  color: #e30613;
  padding: 8px 16px;
  border-radius: 0;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
/* ============================================================
   SEZIONE ACCESSIBILITÀ — TIPOGRAFIA CONTENUTI (WCAG 2.1 AA)
   Questa sezione gestisce: testo, titoli, liste, link, immagini
   per tutti i contenuti redazionali creati tramite JCE.
   ============================================================ */
/* ---------------------------
   1. PARAGRAFI
   --------------------------- */
p {
  line-height: 1.65;
  margin-bottom: 1.2rem;
  font-size: 1rem;
  color: var(--text-color, #222);
}
/* Riduce effetto "muri di testo" */
p + p {
  margin-top: 1rem;
}
em {
  color: #888;
}
/* ---------------------------
   2. TITOLI
   Garantiamo una gerarchia VISIVA chiara anche se la redazione
   usa gli heading in modo creativo.
   --------------------------- */
h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  line-height: 1.3;
  color: var(--heading-color, #111);
  margin-top: 1rem;
  margin-bottom: 1rem;
}
h1 {
  font-size: 2rem;
}
h2 {
  font-size: 1.8rem !important;
  text-transform: uppercase;
}
h3 {
  font-size: 1.5rem;
}
h4 {
  font-size: 1.3rem;
}
h5 {
  font-size: 1.15rem;
}
h6 {
  font-size: 1rem;
}
/* ---------------------------
   3. LISTE
   --------------------------- */
ul, ol {
  margin: 1.2rem 0 1.2rem 1.4rem;
  /* spazio esterno */
  padding-left: 1.2rem;
  /* indentazione reale */
}
li {
  margin-bottom: 0.45rem;
  line-height: 1.55;
}
/* Liste annidate */
ul ul, ol ol {
  margin-top: 0.5rem;
  margin-left: 1.2rem;
  /* ulteriore indentazione */
}
/* Differenziazione visiva (facoltativa ma consigliata) */
ul ul li {
  list-style-type: circle;
}
ol ol li {
  list-style-type: lower-alpha;
}
/* --------------------------------------------------
   LISTA DOCUMENTI – PDF (con icona)
   Accessibile, senza bullets, stile INCA
-------------------------------------------------- */
.inca-doc-list {
  list-style: none;
  /* Nessun bullet */
  margin: 0;
  padding: 0;
}
.inca-doc-list li {
  margin-bottom: 0.75rem;
  /* Spazio chiaro e leggibile tra i link */
}
/* Link stile INCA con icona */
.inca-doc-list .btn-inca-icon {
  display: inline-flex;
  /* Allineamento icona + testo */
  align-items: center;
  gap: 0.5rem;
  /* Spazio tra icona e testo */
  font-weight: 500;
  text-decoration: underline;
  /* Accessibile e coerente */
  color: #fff;
  /* Testo scuro, accessibile */
}
/* Icona PDF */
.inca-doc-list .btn-inca-icon i {
  font-size: 1rem;
}
/* Hover: rosso INCA */
.inca-doc-list .btn-inca-icon:hover, .inca-doc-list .btn-inca-icon:focus {
  color: #000000;
  text-decoration-color: #000000;
}
/* Active / focus visuale */
.inca-doc-list .btn-inca-icon:focus-visible {
  outline: 2px solid #c10510;
  outline-offset: 3px;
}
/* ---------------------------
   4. LINK ACCESSIBILI (INCA RED)
   --------------------------- */
a {
  color: #e30613;
  text-decoration: underline;
  font-weight: 500;
  transition: 0.2s ease;
}
a:hover, a:focus {
  color: #c10510;
  text-decoration: none;
}
a:focus-visible {
  outline: 3px solid #e30613;
  outline-offset: 2px;
}
/* ---------------------------
   5. IMMAGINI
   --------------------------- */
img {
  max-width: 100%;
  height: auto;
  display: block;
  /*margin: 1.2rem auto;*/
}
/* ---------------------------
   6. TABELLE (contenuti JCE)
   --------------------------- */
table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
}
th, td {
  padding: 0.6rem 0.8rem;
  border: 1px solid #ddd;
}
th {
  background: #f5f5f5;
  font-weight: 700;
}
/* ---------------------------
   7. EDITOR CLEANUP
   Corregge gli "errori tipici" che JCE può generare.
   --------------------------- */
/* Elimina spacing eccessivi da <br> multipli */
br + br {
  display: none;
}
/* Pulisce eventuali font-size inline inseriti dalla redazione */
*[style*="font-size"] {
  font-size: inherit !important;
}
/* Evita testi microscopici importati da Word */
*[style*="px"] {
  font-size: inherit !important;
}
/* ---------------------------
   FINE SEZIONE ACCESSIBILITÀ
   --------------------------- */
/* ============================================================
   FIX H1 — Forza la gerarchia tipografica sopra H2
   ============================================================ */
@media (min-width: 1200px) {
  .jl-article .jl-article-title, .jl-article h1.jl-article-title, .jl-article h1[itemprop="headline"].jl-article-title {
    font-size: 2rem;
    line-height: 1.25;
  }
}
/* ============================================================
   FIX FONT WEIGHT H1 — Titolo articolo Joomla
   ============================================================ */
.jl-article h1.jl-article-title, .jl-article h1[itemprop="headline"].jl-article-title {
  font-weight: 700 !important;
}
/* ==========================================================================
   SEZIONE: ANTEPRIME ARTICOLI / ARTICLE PREVIEW (INCA 2025)
   Struttura utilizzata per:
   - liste di articoli in verticale
   - rassegne editoriali con badge "nuovo numero"
   - pagine di comunicazione con PDF collegato
   Layout: badge → immagine → titolo → meta → testo → bottone PDF
   Accessibilità: WCAG 2.1 AA (contrasto e focus)
   ========================================================================== */
/* ------------------------------------------------------------
   1. RIGA ARTICOLO
   Gestisce il distanziamento tra un articolo e l’altro.
   È l’unità verticale dell'elenco (6 nel caso richiesto).
   ------------------------------------------------------------ */
.inca-article-row {
  padding-bottom: 30px;
}
/* ------------------------------------------------------------
   2. BOX CONTENITORE DEL SINGOLO ARTICOLO
   - Sfondo #f8f8f8 come richiesto
   - Padding interno costante 20px su ogni lato
   - Nessun bordo / nessun bordo arrotondato
   - Position: relative per collocare il badge assoluto
   ------------------------------------------------------------ */
.inca-article-box {
  background: #f8f8f8;
  padding: 20px;
  position: relative;
}
/* ------------------------------------------------------------
   3. BADGE (classe già esistente: badge-red)
   Si limita SOLO a posizionarlo, senza modificare stile colore/
   tipografia già definita nel progetto.
   Il badge compare in alto a sinistra e si sovrappone al box.
   ------------------------------------------------------------ */
/*.badge-red, .badge-blue, .badge-green, .badge-yellow, .badge-grey, .badge-violet {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 2; // garantisce che resti sopra l’immagine
}
*/
/* ------------------------------------------------------------
   4. IMMAGINE DI INTRODUZIONE
   Poiché il badge è assoluto, l’immagine necessita un margine-top
   per non essere coperta.
   ------------------------------------------------------------ */
.inca-thumb {
  margin-top: 30px;
}
.inca-thumb img {
  width: 100%;
  display: block;
  margin-bottom: 18px;
}
/* ------------------------------------------------------------
   5. TITOLO ARTICOLO
   Tipografia coerente con INCA 2025, forte leggibilità e contrasto.
   ------------------------------------------------------------ */
.inca-title {
  font-size: 22px;
  margin-bottom: 8px;
  color: #1a1a1a;
  line-height: 1.3;
}
/* ------------------------------------------------------------
   6. DATA DI PUBBLICAZIONE
   Deve essere visibile ma non dominante.
   ------------------------------------------------------------ */
.inca-date {
  font-size: 15px;
  color: #333;
  margin-bottom: 14px;
}
/* ------------------------------------------------------------
   7. TESTO INTRODUTTIVO
   Corpo leggibile, ottimo per riassunti brevi.
   ------------------------------------------------------------ */
.inca-text {
  font-size: 16px;
  color: #222;
  margin-bottom: 20px;
  line-height: 1.6;
}
/* ------------------------------------------------------------
   8. BOTTONE PDF
   Utilizza la classe globale "btn-inca".
   Qui gestiamo solo i casi particolari.
   ------------------------------------------------------------ */
.inca-pdf-btn {
  margin-top: auto;
}
/* ------------------------------------------------------------
   9. FOCUS ACCESSIBILE PER GLI ELEMENTI INTERATTIVI
   Alto contrasto, visibile anche per utenti con deficit visivi.
   ------------------------------------------------------------ */
.inca-article-box a:focus {
  outline: 3px solid #ffcc00;
  outline-offset: 3px;
}
.g-content {
  margin: 0.625rem;
  padding: 1.5rem;
}
.g-flushed .g-content {
  margin: 0;
  padding: 0;
}
body {
  font-size: 1rem;
  line-height: 1.5;
}
h1 {
  font-size: 2.25rem;
}
h2 {
  font-size: 1.9rem;
}
h3 {
  font-size: 1.5rem;
}
h4 {
  font-size: 1.15rem;
}
h5 {
  font-size: 1rem;
}
h6 {
  font-size: 0.85rem;
}
small {
  font-size: 0.875rem;
}
cite {
  font-size: 0.875rem;
}
sub, sup {
  font-size: 0.75rem;
}
code, kbd, pre, samp {
  font-size: 1rem;
  font-family: "Menlo", "Monaco", monospace;
}
textarea, select[multiple=multiple], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], input:not([type]) {
  border-radius: 0.1875rem;
}
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1000;
  background: #ffffff;
  padding: 8px 16px;
  border: 2px solid #000;
  border-radius: 4px;
  font-weight: bold;
}
.skip-link:focus {
  left: 10px;
  top: 10px;
}
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
@media (min-width: 960px) {
  .jl-navbar-nav {
    gap: 20px !important;
  }
}
.jl-navbar-dropdown {
  --jl-position-offset: 0px;
  --jl-position-shift-offset: 0;
  --jl-position-viewport-offset: 15px;
  --jl-inverse: dark;
  background: #fff;
  color: #222;
  padding: 25px 28px;
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.15);
}
/* LARGHEZZE PERSONALIZZATE DROPDOWN MENU */
/* Servizi → 300px */
#submenu-accessibilita-1 {
  width: 300px !important;
}
/* Servizi → 300px */
#submenu-accessibilita-2 {
  width: 300px !important;
}
/* Amministrazione trasparente → 250px */
#submenu-accessibilita-3 {
  width: 250px !important;
}
/* Tutti gli altri dropdown → 200px */
.jl-navbar-dropdown {
  width: 200px !important;
}
/* I due sopra sovrascrivono questo, quindi va messo dopo */
.jl-navbar-dropdown a {
  white-space: nowrap;
}
/* =====================================================================================
   LOGO MOBILE – su smartphone
   ===================================================================================== */
/* SPAZIARE IL LOGO MOBILE SOPRA E SOTTO */
@media (max-width: 959px) {
  /* JL usa questo breakpoint */
  /* Aggiunge aria nella versione MOBILE */
  /* Evita che il link schiacci il logo */
  /* Aggiunge aria anche dentro il container sticky */
  /* L'immagine non deve forzare altezze */
  .tm-header-mobile .jl-navbar-center {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .tm-header-mobile .jl-navbar-item.jl-logo {
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    line-height: 1 !important;
  }
  .tm-header-mobile .jl-navbar-container {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    min-height: auto !important;
  }
  .tm-header-mobile .jl-navbar-item.jl-logo img {
    display: block;
    margin: 0 auto;
    max-height: 90px !important;
  }
}
/* FINE LOGO MOBILE */
/* =====================================================================================
   TOGGLE MOBILE – personalizzazione
   ===================================================================================== */
@media (max-width: 959px) {
  /* Togli il padding sinistro interno del container mobile */
  /* Togli padding anche al nav, per sicurezza */
  /* Spingi il gruppo toggle ancora più a sinistra */
  /* Il toggle in sé non aggiunge altro margine */
  /* INGRANDIMENTO DEL TOGGLE */
  /* Contenitore del toggle (serve per non “spostare” il logo) */
  /* Linee del menu “hamburger” più spesse e visibili se vuoi */
  .tm-header-mobile .jl-navbar-container > .jl-container {
    padding-left: 0 !important;
  }
  .tm-header-mobile .jl-navbar {
    padding-left: 0 !important;
  }
  .tm-header-mobile .jl-navbar-left {
    margin-left: 16px !important;
    /* prova -6 / -8 / -10 a gusto */
    padding-left: 0 !important;
  }
  .tm-header-mobile .jl-navbar-toggle {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  .tm-header-mobile .jl-navbar-toggle svg {
    width: 24px !important;
    /* default era 20px */
    height: 24px !important;
    /* scala proporzionale */
  }
  .tm-header-mobile .jl-navbar-toggle {
    padding: 4px !important;
    /* aggiunge aria intorno */
  }
  .tm-header-mobile .jl-navbar-toggle rect {
    height: 2.4px !important;
    /* default è 2px */
  }
}
/* FINE TOGGLE MOBILE */
/* ---------------------------------------------------- */
/* CSS per Pulsante Dove Siamo Mobile (FAB) */
/* ---------------------------------------------------- */
.inca-mobile-fab {
  position: fixed;
  bottom: 85px;
  /* Posizionato in basso */
  right: 15px;
  /* Sempre a destra */
  z-index: 9999;
  /* Stile Quadrato */
  width: 50px;
  height: 50px;
  background-color: #e30613;
  color: #white;
  /* Questo imposta il colore del testo/icona di default (rosso) */
  border-radius: 0;
  border: 1px solid #e30613;
  /* Allineamento Icona al Centro */
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
}
/* REGOLA AGGIUNTA: Forziamo il colore dell'icona (anche se dovrebbe ereditarlo) */
.inca-mobile-fab i.fa {
  color: white !important;
  /* Forza il colore bianco dell'icona */
  margin-right: 0;
  font-size: 18px;
  /* Aumenta leggermente la dimensione per visibilità */
}
.inca-mobile-fab:hover {
  background-color: #cc0510;
  /* Rosso leggermente più scuro */
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
}
/* REGOLA AGGIUNTA: Quando si passa il mouse, l'icona deve diventare bianca */
.inca-mobile-fab:hover i.fa {
  color: white !important;
}
/* ---------------------------------------------------- */
/* Controllo della Visibilità (SOLO MOBILE)             */
/* ---------------------------------------------------- */
/* Regola: Nascondi il pulsante sui dispositivi desktop e tablet (schermi grandi/medi) */
@media (min-width: 960px) {
  /* Mantiene il breakpoint a 960px */
  .inca-mobile-fab {
    display: none !important;
  }
}
/* Regola: Assicura che sia visibile sui dispositivi mobile (sotto i 960px) */
@media (max-width: 959px) {
  /* Mantiene il breakpoint a 959px */
  .inca-mobile-fab {
    display: inline-flex;
    /* Usa inline-flex per un buon allineamento interno */
  }
}
/* FINE APPUNTAMENTO MOBILE*/
/* Linea superiore del menu */
.jl-navbar-container {
  border-top: 1px solid #cccccc;
}
/* Dotnav slideshow */
.jl-dotnav > * > * {
  display: block;
  box-sizing: border-box;
  width: 25px;
  height: 25px;
  border-radius: 0;
  background: #183d3d;
  border: 1px solid rgba(102, 102, 102, 0.4);
  text-indent: 100%;
  overflow: hidden;
  transition: 0.2s ease-in-out;
  transition-property: background-color, border-color;
}
ul.tm-nav.jl-slideshow-nav.jl-dotnav.jl-flex-center {
  margin-top: 10px;
}
/* Titolo con bullet rosso */
.jl-heading-bullet::before {
  content: "";
  display: inline-block;
  height: calc(4px + .7em);
  margin-right: calc(5px + .2em);
  border-left: calc(22px + .1em) solid #e30613;
  vertical-align: middle;
}
/* Overlay chiaro */
.jl-overlay.jl-flex-1.jl-tile-default.jl-padding-small.jl-margin-remove-first-child {
  background-color: rgba(255, 255, 255, 0.9);
}
/* ---------------------------------------------------- */
/* Controllo navigazione slide (SOLO MOBILE)             */
/* ---------------------------------------------------- */
/* 1. STILE PER IL CONTENITORE GENERALE DELLA NAVIGAZIONE MOBILE (SFONDO) */
@media (max-width: 959px) {
  /* Applica solo su schermi piccoli (mobile) */
  /* 2. FORZARE I LINK A DIVENTARE I QUADRATINI (NASCONDENDO IL TESTO) */
  /* 3. STILE PER IL QUADRATINO ATTIVO (ROSSO) */
  .jl-position-bottom-center.jl-position-small {
    /* Sfondo: Puoi cambiare il colore e l'opacità */
    background-color: rgba(0, 0, 0, 0.6);
    padding: 10px 15px;
    /* Spazio interno */
    border-radius: 5px 5px 0 0;
    /* Angoli arrotondati solo in alto */
    /* Assicura che l'elemento si estenda per la larghezza desiderata (se necessario) */
    width: 100%;
    /* Aggiusta la posizione se necessario (questo Particle è posizionato in basso) */
  }
  .jl-position-small .jl-slideshow-nav li > a {
    /* Ripristina lo stile del quadratino dal tuo codice .jl-dotnav */
    display: block;
    box-sizing: border-box;
    width: 25px;
    /* Larghezza del quadratino */
    height: 25px;
    /* Altezza del quadratino */
    border-radius: 0;
    /* Quadratino non arrotondato */
    background: #183d3d;
    /* Colore di sfondo del quadratino (inattivo) */
    border: 1px solid rgba(102, 102, 102, 0.4);
    /* NASCONDI IL TESTO DEL LINK: Essenziale per non far vedere la prima lettera */
    text-indent: 100%;
    overflow: hidden;
    /* Rimuovi i padding o stili che interferiscono con la dimensione 25x25 */
    padding: 0;
    margin: 0 auto;
  }
  .jl-position-small .jl-slideshow-nav .jl-active > a {
    background-color: #e51d20;
    /* Rosso come richiesto per l'attivo */
    border-color: #e51d20;
  }
}
/* ---------------------------------------------------- */
/* FINE - Controllo navigazione slide (SOLO MOBILE)             */
/* ---------------------------------------------------- */
.bottone-100 a {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  font-weight: bold;
}
.bottoni-tutele-home.jl-grid-row-medium > .jl-grid-margin {
  margin-top: 37px;
}
/* Bottone INCA standard */
.btn-inca {
  background-color: #e30613;
  color: #ffffff;
  padding: 8px 16px;
  border-radius: 0;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.btn-inca:hover {
  background-color: #c10510;
  color: #fbba00;
}
/* Bottone INCA compatto */
.btn-inca-small {
  background-color: #e30613;
  color: #ffffff;
  padding: 6px 12px;
  border-radius: 0;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  line-height: 1.4;
}
.btn-inca-small:hover {
  background-color: #c10510;
  color: #fbba00;
}
/* Bottone outline */
.btn-inca-outline {
  background-color: transparent;
  border: 2px solid #e30613;
  color: #e30613;
  padding: 8px 16px;
  border-radius: 0;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.btn-inca-outline:hover {
  background-color: #e30613;
  color: #fbba00;
}
/* Bottone wide (larga larghezza) */
.btn-inca-wide {
  background-color: #e30613;
  color: #ffffff;
  padding: 14px 24px;
  border-radius: 0;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 100%;
}
.btn-inca-wide:hover {
  background-color: #c10510;
  color: #fbba00;
}
/* Bottone INCA LARGE */
.btn-inca-large {
  background-color: #e30613;
  color: #ffffff;
  padding: 18px 32px;
  border-radius: 0;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  /* più grande */
  font-weight: 700;
  letter-spacing: 0.5px;
}
.btn-inca-large:hover {
  background-color: #c10510;
  color: #fbba00;
}
/* Bottone INCA LARGE con icona */
.btn-inca-large-icon {
  background-color: #e30613;
  color: #ffffff;
  padding: 18px 32px;
  border-radius: 0;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0.5px;
}
.btn-inca-large-icon svg, .btn-inca-large-icon i, .btn-inca-large-icon img {
  height: 1.2em;
  width: auto;
  display: inline-block;
}
.btn-inca-large-icon:hover {
  background-color: #c10510;
  color: #fbba00;
}
/* Bottone INCA con icona */
.btn-inca-icon {
  background-color: #e30613;
  color: #ffffff;
  padding: 8px 16px;
  border-radius: 0;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.btn-inca-icon svg, .btn-inca-icon i, .btn-inca-icon img {
  height: 1.1em;
  width: auto;
  display: inline-block;
}
.btn-inca-icon:hover {
  background-color: #c10510;
  color: #fbba00;
}
/* ---------------------------------------------------------
   BOTTONE tag
   
---------------------------------------------------------- */
.btn-info {
  color: #fff;
  background-color: #e30613;
  border-color: #e30613;
}
.jl-search .jl-search-icon:not(a):not(button):not(input) {
  color: #ffffff;
}
.jl-search-input::placeholder {
  color: #ffffff;
}
.jl-search-navbar .jl-search-input {
  background: #fbba00;
  border: 1px solid #fbba00;
}
.jl-navbar-nav > li.menu-cta {
  margin-left: 8px;
}
.jl-navbar-nav > li.menu-cta > a {
  position: relative;
  color: #ffffff !important;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 0.85rem;
  text-decoration: none;
  padding: 0 18px;
}
.jl-navbar-nav > li.menu-cta > a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 60px;
  background-color: #e30613;
  z-index: -1;
}
.jl-navbar-nav > li.menu-cta > a:hover::after {
  background-color: #c10510;
}
.jl-navbar-nav > li.menu-cta > a::before {
  display: none !important;
  content: none !important;
}
/* =====================================================================================
   CTA MOBILE – “Prendi appuntamento” nel menu smartphone
   ===================================================================================== */
.jl-offcanvas-bar .jl-nav > li.menu-cta > a {
  background: #e30613 !important;
  color: #ffffff !important;
  font-weight: 600;
  text-transform: uppercase;
  display: block;
  text-align: center;
  padding: 14px 18px;
  margin-top: 10px;
  margin-bottom: 10px;
  border-radius: 0;
}
/* Hover */
.jl-offcanvas-bar .jl-nav > li.menu-cta > a:hover {
  background: #c10510 !important;
  color: #fbba00 !important;
}
/* =====================================================================================
   STILE ACCORDION – pagine interne
   ===================================================================================== */
/*STILE A*/
/* WRAPPER */
.inca-accordion {
  margin: 20px 0;
  border-top: 1px solid #ededed;
}
/* HEADER */
.inca-accordion-title {
  cursor: pointer;
  padding: 15px 0 15px 0;
  font-weight: 600;
  font-size: 1.9rem;
  color: #c20000;
  display: flex;
  align-items: center;
  gap: 12px;
  /* spazio tra simbolo e testo */
  border-bottom: 1px solid #ededed;
}
/* PIÙ / MENO BEN VISIBILI */
.inca-accordion-title .symbol {
  font-size: 28px;
  /* più grande */
  font-weight: 700;
  /* più spesso */
  line-height: 1;
  color: #c20000;
  /* rosso INCA per coerenza */
  width: 28px;
  text-align: center;
}
/* CONTENUTO */
.inca-accordion-content {
  display: none;
  padding: 15px 15px;
  border-bottom: 1px solid #ededed;
  line-height: 1.6;
  color: #333;
  background-color: #fafafa;
  /* grigio molto tenue, accessibile */
}
/* Effetto separatore come tuo accord. Joomla */
.inca-accordion > :nth-child(n + 2) {
  margin-top: 15px;
  padding-top: 15px;
  border-top: 1px solid #ededed;
}
/*STILE B*/
/* WRAPPER */
.inca-accordion-b {
  margin: 20px 0;
}
/* OGNI BLOCCO (con separatori tra gli elementi) */
.inca-accordion-b .inca-accordion-item {
  margin-top: 15px;
  padding-top: 15px;
  border-top: 1px solid #ededed;
}
/* HEADER DELL’ACCORDION */
.inca-accordion-b .inca-accordion-title {
  background-color: #f7f7f7;
  padding: 15px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 600;
  font-size: 18px;
  color: #000;
  /* testo sempre nero */
  text-decoration: none;
}
/* SIMBOLO + / – */
.inca-accordion-b .symbol {
  font-size: 26px;
  font-weight: 700;
  color: #666;
  line-height: 1;
  width: 26px;
  text-align: center;
  text-decoration: none;
}
/* CONTENUTO */
.inca-accordion-b .inca-accordion-content {
  display: none;
  padding: 15px;
  background-color: #fff;
  /* contenuto su bianco per miglior contrasto */
  color: #000;
  /* testo SEMPRE nero */
}
.inca-accordion-b .inca-accordion-content a {
  color: #000 !important;
  /* link neri */
  text-decoration: underline;
  /* se vuoi sottolineati */
}
.doc-section {
  margin-bottom: 40px;
}
.doc-box {
  border: 1px solid #ddd;
  padding: 20px;
  margin-bottom: 15px;
  background: #fafafa;
  border-radius: 6px;
}
.doc-title {
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 15px;
  color: #222;
}
.doc-label {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 8px;
}
.doc-code {
  background: #222;
  color: #0f0;
  padding: 15px;
  border-radius: 6px;
  overflow-x: auto;
  font-size: 14px;
  line-height: 1.4em;
}
/* ======================================================
   PAGINA NOTIZIE – VERSIONE "CARD LOOK"
   ====================================================== */
.jl-card-default {
  border-radius: 0;
}
/* ======================================================
   TABELLA CATEGORIA – VERSIONE "CARD LOOK"
   ====================================================== */
/* Contenitore tabella */
table.com-content-category__table.category.table {
  width: 100%;
  background-color: #f9fafb;
  /* background neutro e uniforme */
  /*border: 1px solid #cfd6dd;  bordo più scuro */
  border-radius: 0;
  /* no arrotondamenti */
  /*border-collapse: separate;  necessario per card look */
  border-spacing: 0;
  /* nessun gap */
}
/* Header */
table.com-content-category__table thead th {
  background-color: #f0f2f4;
  border-bottom: 1px solid #cfd6dd;
  color: #222;
  font-weight: 600;
  padding: 1rem 1.2rem;
  text-transform: none;
}
/* Celle body */
table.com-content-category__table tbody th, table.com-content-category__table tbody td {
  background-color: #ffffff !important;
  /* tutte le righe stesso colore */
  padding: 1rem 1.2rem;
  border-bottom: 1px solid #d4dce3;
  /* separatore più scuro */
  vertical-align: middle !important;
}
/* Titolo */
table.com-content-category__table .list-title a {
  display: inline-block;
  font-weight: 600;
  text-decoration: underline;
  color: #e30613;
}
table.com-content-category__table .list-title a:hover {
  color: #b7050f;
}
/* Colonna data ridotta */
table.com-content-category__table .list-date {
  width: 130px;
  min-width: 110px;
  white-space: nowrap;
  text-align: right;
  color: #333;
}
/* Hover "card style" */
table.com-content-category__table tbody tr:hover {
  background-color: #f5f7fa !important;
}
/* Mobile */
@media (max-width: 575.98px) {
  table.com-content-category__table thead {
    display: none;
  }
  table.com-content-category__table tbody tr {
    display: block;
    margin-bottom: 1rem;
    border: 1px solid #cfd6dd;
    background-color: #fff !important;
    padding: 0.2rem 0.5rem;
  }
  table.com-content-category__table tbody th, table.com-content-category__table tbody td {
    display: block;
    border: none;
    padding: 0.6rem 0.5rem;
    background: none !important;
  }
  table.com-content-category__table .list-date {
    text-align: left;
    margin-top: 0.2rem;
    font-size: 0.9rem;
  }
  table.com-content-category__table .list-date::before {
    content: "Aggiornato: ";
    font-weight: 600;
    color: #333;
  }
}
/* ======================================================
   PAGINA VIDEOTUTELE
   ====================================================== */
/* Rende il contenitore del contenuto alto al 100% dello spazio disponibile */
.video-card-content {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
}
/* Gestisce il blocco di testo sotto il video */
.video-text-wrapper {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}
/* Forza il titolo a spingere la data verso il basso */
.video-title-uniform {
  margin: 0 0 10px 0;
  line-height: 1.3;
  /* Opzionale: se vuoi limitare a 2 righe con i puntini ... */
  /* display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden; */
}
/* Stile per la data in fondo */
.video-date {
  margin-top: auto;
  /* Questa è la magia che spinge la data sempre in fondo */
  color: #666;
  font-size: 0.85rem;
}
/* Contenitore che permette la sovrapposizione del badge */
.video-badge-wrapper {
  position: relative;
  display: inline-block;
  width: 100%;
}
/* Badge sovrapposto */
.badge-overlay {
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 5;
  padding: 5px 10px;
  font-size: 0.85rem;
  font-weight: 700;
  color: #fff;
  border-radius: 4px;
  text-transform: uppercase;
  pointer-events: none;
  /* non blocca i controlli del video */
}
/* Stile badge rosso INCA */
.badge-red {
  background-color: #e30613;
}
#g-footer .g5-title:before {
  content: "";
  width: 9px;
  height: 9px;
  background: currentColor;
  border: 1px solid currentColor;
  border-radius: 0;
  box-sizing: border-box;
  margin-bottom: 1px;
}
/* ===========================
   GALLERIA FOTOGRAFICA
   =========================== */
ul.fields-container {
  list-style-type: none;
  margin-left: 0;
}
/* ===========================
   TROVA LA TUA TUTELA – SEARCH
   =========================== */
#js-search-module-jlsearch-196 .jl-search-input {
  background-color: #ffffff;
  color: #000000;
}
/* Placeholder visibile solo qui */
#js-search-module-jlsearch-196 .jl-search-input::placeholder {
  color: #6b6b6b;
  opacity: 1;
}
#js-search-module-jlsearch-196 .jl-search-input::-webkit-input-placeholder {
  color: #6b6b6b;
}
#js-search-module-jlsearch-196 .jl-search-input::-moz-placeholder {
  color: #6b6b6b;
  opacity: 1;
}
/*# sourceMappingURL=custom_12.css.map */