/* =====================================================================
   CDL Lavoro in rete - sistema grafico
   1. Variabili   2. Base   3. Tipografia   4. Utilita'   5. Testata
   6. Pie' di pagina   7. Blocchi di pagina   8. News   9. Soci
   10. Moduli   11. Cookie   12. Stampa
   ===================================================================== */

/* -- 1. Variabili --------------------------------------------------- */
:root{
  /* Correzione uguale per tutte le foto di contenuto (01/10/2026): colori
     naturali, appena meno saturi e un filo piu' contrastati, perche' scatti di
     archivi diversi stiano in serie. Il duotono resta solo nella fascia del
     titolo e nell'apertura della home, dove la foto fa da sfondo. Analisi in
     "Proposte colore/colore.html". */
  --foto-colore:saturate(.8) contrast(1.04) brightness(.98);
  --grafite:#0C1418;
  --petrolio:#11485C;
  --petrolio-chiaro:#5C93A6;
  --petrolio-scuro:#0D3746;
  --carta:#EDF0F2;
  --bianco:#FFFFFF;
  --ambra:#8F4715;

  --inchiostro:#0C1418;
  --inchiostro-tenue:#4C5F68;
  --linea:#D3DBDF;
  --linea-tenue:#E3E8EB;
  --fondo-tenue:#F5F7F8;
  --petrolio-velo:#E4EEF2;
  --ambra-velo:#F7ECE2;

  /* Un carattere solo. Titoli ed etichette restano due ruoli distinti, cosi'
     si possono ritoccare senza cercare regola per regola, ma puntano alla
     stessa famiglia: a distinguerli sono peso, corpo e spaziatura. */
  --testo:"Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --titolo:var(--testo);
  --etichetta:var(--testo);

  --gabbia:1220px;
  --gabbia-stretta:760px;
  --bordo-x:clamp(18px,5vw,48px);
  --ritmo:clamp(50px,7vw,104px);
  --ritmo-stretto:clamp(50px,5vw,72px);
  --ritmo-cucito:clamp(24px,2.8vw,42px);
  --piede-bassa:#7C939B;
  --piede-etichetta:#6F878F;
  /* Scala dei raggi. Un valore solo per tutto e' la cosa che fa sembrare
     un'interfaccia uscita da un generatore: non e' il valore, e' il fatto
     che non cambia mai. Qui il raggio cresce con l'elemento, piu' o meno un
     dodicesimo della sua altezza, e le superfici di struttura non ne hanno.
       0   fasce, testata, pie' di pagina, righe di tabella
       2   comandi dentro il testo, alti sui 26-32px
       3   pulsanti e campi, alti sui 38-46px
       7   card e riquadri
      12   lastre: mappa, fotografie, ritratto della scheda socio
     Gli angoli delle due misure grandi sono continui (corner-shape) invece
     che archi di cerchio: il passaggio dal dritto alla curva non ha lo
     scalino. Dove il browser non la conosce resta l'arco e non cambia nulla
     di importante. Un angolo continuo sembra piu' stretto di un arco dello
     stesso raggio, per questo 7 e 12 e non 6 e 10. */
  --raggio-nullo:0;
  --raggio-segno:2px;
  --raggio-comando:3px;
  --raggio-scatola:7px;
  --raggio-lastra:12px;
  /* Vecchio nome, tenuto per non lasciare regole scoperte. */
  --raggio:var(--raggio-comando);
  --ombra:0 1px 2px rgba(12,20,24,.05),0 8px 26px -14px rgba(12,20,24,.22);
  --ombra-alta:0 2px 4px rgba(12,20,24,.06),0 22px 48px -22px rgba(12,20,24,.34);
  --transizione:180ms cubic-bezier(.2,.6,.3,1);
}

/* Angoli continui invece di archi di cerchio, sulle due misure grandi: sotto
   i 6px la differenza non si vede e non vale la regola in piu'. Chrome e Edge
   recenti la applicano, gli altri restano all'arco e non perdono niente. */
@supports (corner-shape: squircle){
  .lir-mondo,.lir-scelta,.lir-scheda,.lir-socio,.lir-modulo,.lir-punto--link,
  .lir-numeri__voce,.lir-firma,.lir-anagrafica,.lir-nota,.lir-sub,.lir-mega,
  body .lir-numeri__voce,body a.lir-punto--link,
  .lir-mappa,.lir-scheda-socio__ritratto,.lir-foto .elementor-widget-container,
  .lir-foto .elementor-widget-container::after{
    corner-shape:squircle;
  }
}

/* Su tablet e desktop il respiro minimo fra le sezioni sale a 70px,
   su mobile resta 50px. */
@media (min-width:768px){
  :root{
    --ritmo:clamp(70px,7vw,104px);
    --ritmo-stretto:clamp(70px,5vw,80px);
  }
}

/* -- 2. Base -------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
/* Con la testata fissa gli ancoraggi devono fermarsi sotto di essa. */
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:clamp(110px,12vw,130px)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
body{
  margin:0;background:var(--bianco);color:var(--inchiostro);
  font-family:var(--testo);font-size:17px;line-height:1.66;
  font-weight:400;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-wrap:break-word;
}
img,svg,video{max-width:100%;height:auto;display:block}
/* Senza questo l'attributo hidden non ha effetto sulle card, che hanno
   un display dichiarato da una classe (filtri dei soci). */
[hidden]{display:none!important}
a{color:var(--petrolio);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--petrolio-scuro)}
/* Il contorno del fuoco segue gia' da solo il raggio dell'elemento: qui
   c'era anche un border-radius, che non disegnava il contorno ma cambiava la
   forma dell'elemento mentre e' a fuoco. */
:focus-visible{outline:2px solid var(--petrolio);outline-offset:3px}
hr{border:0;border-top:1px solid var(--linea);margin:2.4em 0}
::selection{background:var(--petrolio);color:#fff}

.lir-salta{
  position:absolute;left:-9999px;top:0;z-index:999;
  background:var(--grafite);color:#fff;padding:12px 20px;font-weight:600;
}
.lir-salta:focus{left:8px;top:8px}
/* Il collegamento di salto compare solo al fuoco da tastiera, sul fondo
   grafite: senza queste righe prende il petrolio dei link del kit di
   Elementor e resta quasi illeggibile proprio a chi gli serve. */
body a.lir-salta,
body a.lir-salta:focus,
body a.lir-salta:hover{color:#fff;background:var(--grafite)}

/* -- 3. Tipografia -------------------------------------------------- */
h1,h2,h3,h4,h5,h6,
.elementor-widget-heading .elementor-heading-title{
  font-family:var(--titolo);font-weight:600;line-height:1.14;
  letter-spacing:-.012em;color:var(--inchiostro);margin:0 0 .5em;
  text-wrap:balance;
}
h1,.lir-h1{font-size:clamp(2.1rem,1.35rem + 2.5vw,3.5rem);letter-spacing:-.022em}
h2,.lir-h2{font-size:clamp(1.65rem,1.2rem + 1.5vw,2.5rem);letter-spacing:-.018em}
h3,.lir-h3{font-size:clamp(1.22rem,1.08rem + .5vw,1.5rem)}
h4{font-size:1.09rem}
p{margin:0 0 1.15em}
p:last-child{margin-bottom:0}
strong,b{font-weight:600}
small{font-size:.84em}

.lir-occhiello{
  font-family:var(--etichetta);font-size:.79rem;font-weight:600;
  letter-spacing:.17em;text-transform:uppercase;color:var(--petrolio);
  display:block;margin:0 0 .85em;
}
.lir-occhiello--chiaro{color:var(--petrolio-chiaro)}
.lir-guida{
  font-size:clamp(1.05rem,1rem + .35vw,1.2rem);line-height:1.6;
  color:var(--inchiostro-tenue);max-width:62ch;
}
.lir-dato{font-family:var(--etichetta);font-variant-numeric:tabular-nums;letter-spacing:-.01em}

/* -- 4. Utilita' ---------------------------------------------------- */
.lir-gabbia{width:100%;max-width:var(--gabbia);margin-inline:auto;padding-inline:var(--bordo-x)}
.lir-stretta{max-width:var(--gabbia-stretta)}
.lir-sr{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.lir-chevron{
  --c:rgba(255,255,255,.055);
  background-image:repeating-linear-gradient(115deg,transparent 0 22px,var(--c) 22px 23px);
}
.lir-chevron--scuro{--c:rgba(12,20,24,.05)}

/* pulsanti */
.lir-btn,
.elementor-button.elementor-size-md{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-family:var(--testo);font-size:.98rem;font-weight:600;line-height:1.2;
  padding:.85em 1.5em;border-radius:var(--raggio-comando);border:1px solid var(--petrolio);
  background:var(--petrolio);color:#fff;text-decoration:none;cursor:pointer;
  transition:background var(--transizione),border-color var(--transizione),transform var(--transizione);
}
.lir-btn:hover{background:var(--petrolio-scuro);border-color:var(--petrolio-scuro);color:#fff}
.lir-btn:active{transform:translateY(1px)}
.lir-btn--vuoto{background:transparent;color:var(--petrolio);border-color:var(--linea)}
.lir-btn--vuoto:hover{background:var(--petrolio-velo);border-color:var(--petrolio-chiaro);color:var(--petrolio-scuro)}
.lir-btn--chiaro{background:#fff;color:var(--grafite);border-color:#fff}
.lir-btn--chiaro:hover{background:var(--carta);border-color:var(--carta);color:var(--grafite)}
.lir-btn--fantasma{background:transparent;color:#fff;border-color:rgba(255,255,255,.38)}
.lir-btn--fantasma:hover{background:rgba(255,255,255,.1);border-color:#fff;color:#fff}
.lir-btn .lir-freccia{transition:transform var(--transizione)}
.lir-btn:hover .lir-freccia{transform:translateX(3px)}

/* collegamento testuale con freccia */
.lir-link{
  display:inline-flex;align-items:center;gap:.45em;font-weight:600;
  text-decoration:none;color:var(--petrolio);border-bottom:1px solid currentColor;
  padding-bottom:1px;
}
.lir-link:hover{color:var(--petrolio-scuro)}
.lir-link svg{transition:transform var(--transizione)}
.lir-link:hover svg{transform:translateX(3px)}

/* etichette competenze */
.lir-tag{
  display:inline-block;font-family:var(--etichetta);font-weight:600;font-size:.73rem;letter-spacing:.04em;
  text-transform:uppercase;padding:.34em .68em;border:1px solid var(--linea);
  border-radius:var(--raggio-segno);color:var(--inchiostro-tenue);background:var(--fondo-tenue);
  text-decoration:none;
}
a.lir-tag:hover{border-color:var(--petrolio-chiaro);color:var(--petrolio);background:var(--petrolio-velo)}

/* avviso */
.lir-nota{
  border-left:3px solid var(--ambra);background:var(--ambra-velo);
  padding:1.05em 1.25em;border-radius:0 var(--raggio-scatola) var(--raggio-scatola) 0;
  font-size:.96rem;color:#5E2F0D;
}
.lir-nota strong{color:#4A250A}

/* -- 5. Testata ----------------------------------------------------- */
/* La testata resta in cima durante la navigazione: il pulsante Area clienti
   e' l'azione piu' cercata e non deve costringere a risalire la pagina.
   Lo sticky sta sulla testata intera: applicato alla sola barra principale
   non avrebbe spazio per scorrere dentro il proprio contenitore. */
.lir-testata{position:relative;z-index:200}
.lir-testata--fissa{position:sticky;top:0}
.lir-testata__servizio{
  background:var(--grafite);color:#AFC2CA;font-size:.82rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.lir-testata__servizio .lir-gabbia{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  min-height:40px;flex-wrap:wrap;
}
.lir-recapiti{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin:0;padding:0;list-style:none}
/* Ogni voce e' a sua volta un contenitore flessibile: lasciata come riga di
   testo, sotto il collegamento resterebbe lo spazio per le lettere discendenti
   e i recapiti apparirebbero piu' in alto del centro della fascia. */
.lir-recapiti li{display:flex;align-items:center}
.lir-recapiti a{color:#CFDDE3;text-decoration:none;display:inline-flex;align-items:center;gap:.45em}
.lir-recapiti a:hover{color:#fff}
.lir-recapiti svg{width:14px;height:14px;flex:none;opacity:.75}
.lir-recapiti .lir-dato{font-size:.8rem}

.lir-lingue{display:flex;align-items:center;gap:2px;margin:0;padding:0;list-style:none}
.lir-lingue li{margin:0}
/* 24x24 e' la misura minima di un bersaglio da toccare (WCAG 2.5.8): con il
   solo padding del testo le sigle restavano 21x19. */
.lir-lingue a,.lir-lingue span{
  display:flex;align-items:center;justify-content:center;
  min-width:26px;min-height:26px;
  font-family:var(--etichetta);font-size:.72rem;letter-spacing:.1em;
  padding:4px 7px;border-radius:var(--raggio-segno);text-decoration:none;color:#8FA6AF;
}
.lir-lingue a:hover{color:#fff;background:rgba(255,255,255,.08)}
.lir-lingue .lir-lingue__attiva{color:#fff;background:rgba(255,255,255,.14)}

.lir-testata__principale{
  background:#fff;border-bottom:1px solid var(--linea-tenue);
  transition:box-shadow var(--transizione);
}
.lir-testata__principale{position:relative;z-index:180}
body.lir-scorso .lir-testata__principale{box-shadow:0 1px 18px -6px rgba(12,20,24,.22)}
.lir-testata__principale .lir-gabbia{
  display:flex;align-items:center;gap:clamp(16px,3vw,40px);min-height:82px;
}
.lir-marchio{flex:none;display:block;line-height:0}
.lir-marchio img{width:clamp(186px,20vw,250px);height:auto}
.lir-testata__azioni{display:flex;align-items:center;gap:10px;margin-left:auto}

.lir-portale-btn{
  display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
  background:var(--petrolio);color:#fff;text-decoration:none;
  padding:.56em 1.15em;border-radius:var(--raggio-comando);line-height:1.15;
  transition:background var(--transizione);
}
.lir-portale-btn:hover{background:var(--petrolio-scuro);color:#fff}
.lir-portale-btn b{font-size:.95rem;font-weight:600;display:flex;align-items:center;gap:.45em}
.lir-portale-btn small{
  font-family:var(--etichetta);font-weight:600;font-size:.69rem;letter-spacing:.08em;
  text-transform:uppercase;opacity:.8;margin-top:2px;
}

/* menu principale */
.lir-nav{display:none}
@media (min-width:1080px){.lir-nav{display:block}}
.lir-nav__lista{display:flex;align-items:center;gap:clamp(4px,1.4vw,18px);margin:0;padding:0;list-style:none}
.lir-nav__lista > li{position:relative}
.lir-nav__lista{--voce-x:6px}
.lir-nav__lista > li > a{
  display:flex;align-items:center;gap:.4em;padding:12px var(--voce-x);font-size:.97rem;font-weight:600;
  color:var(--inchiostro);text-decoration:none;position:relative;white-space:nowrap;
}
.lir-nav__lista > li > a::after{
  content:"";position:absolute;left:var(--voce-x);right:var(--voce-x);bottom:4px;height:2px;
  background:var(--petrolio);transform:scaleX(0);transform-origin:left;
  transition:transform var(--transizione);
}
.lir-nav__lista > li:hover > a::after,
.lir-nav__lista > li.lir-corrente > a::after,
.lir-nav__lista > li:focus-within > a::after{transform:scaleX(1)}
.lir-nav__lista > li.lir-corrente > a{color:var(--petrolio)}
.lir-nav__freccia{width:9px;height:9px;opacity:.5;transition:transform var(--transizione)}
.lir-nav__lista > li:hover .lir-nav__freccia{transform:rotate(180deg)}

.lir-sub,.lir-mega{
  position:absolute;top:calc(100% - 2px);opacity:0;visibility:hidden;
  transform:translateY(6px);transition:opacity var(--transizione),transform var(--transizione),visibility var(--transizione);
  background:#fff;border:1px solid var(--linea-tenue);border-top:2px solid var(--petrolio);
  box-shadow:var(--ombra-alta);border-radius:0 0 var(--raggio-scatola) var(--raggio-scatola);
  /* La fascia in fondo al mega-menu ha un fondo suo e arriva al bordo: senza
     ritaglio dipingeva sopra gli angoli arrotondati e li squadrava. Ritagliare
     il contenitore vale per qualsiasi cosa ci si metta dentro, e segue anche
     l'angolo continuo; dare gli stessi raggi alla fascia funzionerebbe, ma
     sarebbero due valori da tenere allineati a mano. */
  overflow:hidden;
}
li:hover > .lir-sub,li:focus-within > .lir-sub,
li:hover > .lir-mega,li:focus-within > .lir-mega{opacity:1;visibility:visible;transform:translateY(0)}

/* La tendina parte dal bordo della voce, non dal bordo del <li>: così il suo
   filetto petrolio prosegue la sottolineatura della voce invece di sporgere
   a sinistra del padding. */
.lir-sub{left:var(--voce-x);min-width:258px;padding:8px;margin:0;list-style:none}
.lir-sub a{
  display:block;padding:9px 12px;font-size:.93rem;color:var(--inchiostro);
  text-decoration:none;border-radius:var(--raggio-segno);
}
.lir-sub a:hover{background:var(--petrolio-velo);color:var(--petrolio-scuro)}

.lir-mega{left:50%;transform:translate(-50%,6px);width:min(720px,92vw);padding:0}
li:hover > .lir-mega,li:focus-within > .lir-mega{transform:translate(-50%,0)}
.lir-mega__griglia{display:grid;grid-template-columns:1fr 1fr}
.lir-mega__col{padding:24px 26px}
.lir-mega__col + .lir-mega__col{border-left:1px solid var(--linea-tenue)}
.lir-mega__titolo{
  display:flex;align-items:center;gap:.5em;font-family:var(--etichetta);font-weight:600;font-size:.78rem;
  letter-spacing:.15em;text-transform:uppercase;color:var(--petrolio);
  text-decoration:none;margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--linea-tenue);
}
.lir-mega__titolo:hover{color:var(--petrolio-scuro)}
.lir-mega__voci{margin:0;padding:0;list-style:none;display:grid;gap:2px}
.lir-mega__voci a{display:block;padding:9px 10px;margin-inline:-10px;border-radius:var(--raggio-segno);text-decoration:none}
.lir-mega__voci a:hover{background:var(--petrolio-velo)}
.lir-mega__voci b{display:block;font-size:.96rem;font-weight:600;color:var(--inchiostro);margin-bottom:1px}
.lir-mega__voci span{display:block;font-size:.85rem;line-height:1.45;color:var(--inchiostro-tenue)}
.lir-mega__voci a:hover b{color:var(--petrolio-scuro)}
.lir-mega__piede{
  grid-column:1/-1;border-top:1px solid var(--linea-tenue);background:var(--fondo-tenue);
  padding:14px 26px;font-size:.89rem;display:flex;justify-content:space-between;
  align-items:center;gap:16px;flex-wrap:wrap;
}

/* apertura da tastiera / tocco */
.lir-nav__lista > li.lir-aperta > .lir-sub,
.lir-nav__lista > li.lir-aperta > .lir-mega{opacity:1;visibility:visible;transform:translateY(0)}
.lir-nav__lista > li.lir-aperta > .lir-mega{transform:translate(-50%,0)}

/* menu mobile */
.lir-hamburger{
  display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border:1px solid var(--linea);background:#fff;border-radius:var(--raggio-comando);cursor:pointer;
}
@media (min-width:1080px){.lir-hamburger{display:none}}
.lir-hamburger span{display:block;width:19px;height:1.5px;background:var(--inchiostro);position:relative}
.lir-hamburger span::before,.lir-hamburger span::after{
  content:"";position:absolute;left:0;width:19px;height:1.5px;background:var(--inchiostro);
  transition:transform var(--transizione),top var(--transizione);
}
.lir-hamburger span::before{top:-6px}
.lir-hamburger span::after{top:6px}
.lir-hamburger[aria-expanded=true] span{background:transparent}
.lir-hamburger[aria-expanded=true] span::before{top:0;transform:rotate(45deg)}
.lir-hamburger[aria-expanded=true] span::after{top:0;transform:rotate(-45deg)}

.lir-drawer{
  position:fixed;inset:0;z-index:300;background:#fff;overflow-y:auto;
  padding:0 0 40px;transform:translateX(100%);transition:transform 220ms ease;
  visibility:hidden;
}
.lir-drawer.lir-drawer--aperto{transform:translateX(0);visibility:visible}
@media (min-width:1080px){.lir-drawer{display:none}}
.lir-drawer__testa{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px var(--bordo-x);border-bottom:1px solid var(--linea-tenue);
  position:sticky;top:0;background:#fff;z-index:2;
}
.lir-drawer__chiudi{
  width:44px;height:44px;border:1px solid var(--linea);background:#fff;
  border-radius:var(--raggio-comando);cursor:pointer;font-size:20px;line-height:1;color:var(--inchiostro);
}
.lir-drawer nav{padding:8px var(--bordo-x) 0}
.lir-drawer ul{list-style:none;margin:0;padding:0}
.lir-drawer > nav > ul > li{border-bottom:1px solid var(--linea-tenue)}
.lir-drawer a{
  display:block;padding:14px 0;font-size:1.04rem;font-weight:600;
  color:var(--inchiostro);text-decoration:none;
}
.lir-drawer ul ul{padding:0 0 12px 14px;border-left:2px solid var(--linea-tenue)}
.lir-drawer ul ul a{font-size:.96rem;font-weight:400;padding:8px 0;color:var(--inchiostro-tenue)}
.lir-drawer ul ul ul{padding-left:12px;border-left-color:var(--carta)}
.lir-drawer__azioni{padding:22px var(--bordo-x) 0;display:grid;gap:10px}
.lir-drawer__azioni .lir-btn,.lir-drawer__azioni .lir-portale-btn{width:100%}
.lir-drawer__recapiti{
  padding:24px var(--bordo-x) 0;margin-top:22px;border-top:1px solid var(--linea-tenue);
  font-size:.92rem;color:var(--inchiostro-tenue);
}
.lir-drawer__recapiti a{display:inline;padding:0;font-weight:600;font-size:inherit;color:var(--petrolio)}
body.lir-bloccato{overflow:hidden}

/* -- 6. Pie' di pagina ---------------------------------------------- */
.lir-piede{background:var(--grafite);color:#A9BDC5;font-size:.94rem}
.lir-piede a{color:#CFDDE3;text-decoration:none}
.lir-piede a:hover{color:#fff;text-decoration:underline}
.lir-piede__alta{
  display:grid;gap:clamp(34px,5vw,60px);
  padding-block:max(var(--ritmo-stretto),50px);
}
@media (min-width:900px){.lir-piede__alta{grid-template-columns:minmax(0,1.05fr) minmax(0,1.25fr)}}
/* Il logo del pie' di pagina porta alla home della lingua in corso, come
   quello in testata. Nessun effetto al passaggio del mouse: basta il puntatore
   a manina, che i collegamenti hanno gia' di loro.
   La sottolineatura invece va tolta: `.lir-piede a:hover` la mette, e su un
   collegamento che contiene solo un'immagine non ha niente da sottolineare.
   Le due regole hanno la stessa specificita', quindi vince questa perche'
   arriva dopo: spostandola piu' su, la riga sotto al marchio ricompare. */
.lir-piede__logo{display:block;line-height:0;width:max-content;max-width:100%}
body .lir-piede__logo,
body .lir-piede__logo:hover{text-decoration:none}
.lir-piede__marchio img{width:clamp(250px,44vw,340px);margin-bottom:clamp(22px,2.2vw,28px)}
.lir-piede__ragione{color:#fff;font-weight:600;font-family:var(--titolo);font-size:1rem;letter-spacing:.005em}
.lir-piede__dati{margin:14px 0 0;display:grid;gap:7px}
.lir-piede__dati div{display:flex;gap:.6em;align-items:baseline}
.lir-piede__dati dt{
  flex:none;width:52px;font-family:var(--etichetta);font-weight:600;font-size:.75rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--piede-etichetta);padding-top:.15em;
}
.lir-piede__dati dd{margin:0}

.lir-piede__menu{display:grid;gap:26px 32px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.lir-piede__col h3{
  font-family:var(--etichetta);font-size:.76rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--piede-etichetta);font-weight:600;margin:0 0 12px;
}
.lir-piede__col ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.lir-piede__col ul ul{margin-top:8px;padding-left:12px;border-left:1px solid rgba(255,255,255,.12)}
.lir-piede__col a{font-size:.93rem}

.lir-social{display:flex;gap:8px;margin:28px 0 0;padding:0;list-style:none}
.lir-social a{
  display:flex;align-items:center;justify-content:center;width:38px;height:38px;
  border:1px solid rgba(255,255,255,.18);border-radius:var(--raggio-comando);color:#A9BDC5;
  transition:background var(--transizione),color var(--transizione),border-color var(--transizione);
}
.lir-social a:hover{background:#fff;color:var(--grafite);border-color:#fff}
.lir-social svg{width:17px;height:17px;fill:currentColor}

.lir-piede__bassa{
  border-top:1px solid rgba(255,255,255,.1);padding-block:20px;
  display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:center;align-items:center;
  text-align:center;font-size:.83rem;color:var(--piede-bassa);
}
.lir-piede__bassa .lir-dato{font-size:.8rem;letter-spacing:.02em}
.lir-piede__bassa .lir-sep{opacity:.4}

/* -- 7. Blocchi di pagina ------------------------------------------- */
.lir-corpo{display:block}
.lir-sezione{padding-block:var(--ritmo)}
.lir-sezione--carta{background:var(--carta)}
.lir-sezione--tenue{background:var(--fondo-tenue)}
.lir-sezione--scura{background:var(--grafite);color:#C3D2D8}
.lir-sezione--scura h2,.lir-sezione--scura h3,.lir-sezione--scura strong{color:#fff}
.lir-sezione--petrolio{background:var(--petrolio);color:#D5E6EC}
.lir-sezione--petrolio h2,.lir-sezione--petrolio h3,.lir-sezione--petrolio strong{color:#fff}

.lir-testa{max-width:66ch;margin-bottom:clamp(28px,3.5vw,46px)}
.lir-testa--centro{margin-inline:auto;text-align:center}
.lir-testa p{color:var(--inchiostro-tenue);font-size:clamp(1.02rem,.98rem + .3vw,1.16rem);margin-top:.2em}
.lir-sezione--scura .lir-testa p,.lir-sezione--petrolio .lir-testa p{color:inherit;opacity:.9}

/* apertura di pagina interna */
.lir-intestazione{
  background:var(--grafite);color:#C3D2D8;position:relative;overflow:hidden;
  padding-block:var(--ritmo-stretto);
}
.lir-intestazione::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(115deg,transparent 0 26px,rgba(255,255,255,.04) 26px 27px);
}
.lir-intestazione .lir-gabbia{position:relative;z-index:1}
.lir-intestazione h1{color:#fff;max-width:20ch;margin-bottom:0}
.lir-intestazione p{margin-top:16px;max-width:60ch;color:#AFC4CC;font-size:1.06rem}
.lir-briciole{
  font-family:var(--etichetta);font-weight:600;font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;
  color:#7B929B;margin-bottom:18px;display:flex;flex-wrap:wrap;gap:.5em;
}
.lir-briciole a{color:#9FB6BE;text-decoration:none}
.lir-briciole a:hover{color:#fff;text-decoration:underline}
.lir-briciole span[aria-hidden]{opacity:.5}

/* hero della home */
.lir-hero{
  background:var(--grafite);color:#C3D2D8;position:relative;overflow:hidden;
  /* La fotografia che si vede dentro al marchio. Un punto solo per cambiarla. */
  --apertura-foto:url(/wp-content/uploads/2026/09/postazione-di-lavoro.webp);
}
/* Il segno non e' appoggiato sopra il fondo: e' il ritaglio da cui si vede
   la fotografia. Fuori resta la grafite piena, dentro passa lo scatto in
   duotono, come nella fascia del titolo (grigi piu' tinta in mix-blend "color",
   qui ottenuto con background-blend-mode perche' sono sfondi dello stesso
   elemento).
   La maschera e' marchio-mascherina.svg: il marchio ricostruito in geometria
   (barre di spessore costante a 90 e 30 gradi, estremita' tonde), 608 byte e
   nitido a qualunque misura. Le versioni PNG ricavate da marchio.png avevano
   dei dentini lungo i bordi: sono nel file originale, residui lasciati dove
   l'ombra toccava il bianco, e ingranditi qui si vedevano. Quando arrivera' il
   logo vettoriale ufficiale, si confronta con questo e si tiene quello.
   Dal 02/10/2026 il segno e' intero, senza il gradiente che ne spegneva la
   meta' sinistra: misura e posizione restano quelle di prima. */
.lir-hero::after{
  content:"";position:absolute;top:-8%;right:-6%;width:min(680px,54vw);aspect-ratio:1;
  pointer-events:none;opacity:.85;
  background-image:linear-gradient(rgba(92,147,166,1),rgba(92,147,166,1)), var(--apertura-foto);
  background-size:cover,cover;background-position:center,30% 62%;
  background-blend-mode:color;
  -webkit-mask-image:url(../img/marchio-mascherina.svg);
  -webkit-mask-size:contain;
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
          mask-image:url(../img/marchio-mascherina.svg);
          mask-size:contain;
          mask-repeat:no-repeat;
          mask-position:center;
}
.lir-hero .lir-gabbia{position:relative;z-index:1;padding-block:var(--ritmo)}
/* Sotto all'occhiello ci vuole un po' d'aria, sopra al sommario molta meno:
   fra titolo e sommario il salto di corpo fa gia' da stacco, e lo spazio in
   piu' spezzava il blocco in due tronconi. Elementor azzera il margine dei
   widget con tre classi (.e-con .elementor-widget.elementor-widget), quindi
   per rimetterlo serve una specificita' piu' alta della sua. */
body .lir-hero .lir-occhiello.elementor-widget{margin-block-end:11px}
/* Su schermo stretto l'occhiello andava a capo: due righe di maiuscoletto
   spaziato pesano piu' del titolo che devono annunciare. */
@media (max-width:520px){
  .lir-hero .lir-occhiello{font-size:.64rem;letter-spacing:.12em}
}

/* La fotografia dentro al marchio ha bisogno di una colonna libera a destra.
   Sotto i 1100px non c'e': il testo si allarga fino al bordo e qualunque
   posizione si dia al segno finisce sotto a delle parole. Misurato, il punto
   piu' chiaro dentro al marchio da' 3,5 con il bianco, 2,0 con il sommario e
   1,0 con l'occhiello - cioe' invisibile.
   Quindi sotto i 1100px torna la filigrana piena, che e' talmente tenue da
   non togliere contrasto a niente, e comincia sotto all'occhiello. */
@media (max-width:1099px){
  .lir-hero::after{
    background-image:none;background-color:rgba(255,255,255,.09);
    opacity:1;top:88px;right:-12%;width:min(320px,64vw);
    -webkit-mask-image:url(../img/marchio-mascherina.svg);
    -webkit-mask-size:contain;
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-position:center;
    -webkit-mask-composite:source-over;
            mask-image:url(../img/marchio-mascherina.svg);
            mask-size:contain;
            mask-repeat:no-repeat;
            mask-position:center;
            mask-composite:add;
  }
}
/* Titolo dell'apertura: interlinea stretta, perche' a questo corpo l'1,14 dei
   titoli lascia fra le due righe un vuoto che le stacca. Il margine sotto e'
   azzerato: lo stacco dal sommario lo da' solo .lir-hero__testo. Il secondo
   selettore serve a battere la regola generale dei titoli, che con
   .elementor-widget-heading .elementor-heading-title pesa piu' di .lir-hero h1. */
.lir-hero h1{color:#fff;max-width:17ch;font-size:clamp(2.25rem,1.3rem + 3.2vw,3.85rem)}
.lir-hero h1,
.lir-hero h1.elementor-heading-title{line-height:1.04;margin-bottom:0}
.lir-hero__testo{max-width:56ch;font-size:clamp(1.06rem,1rem + .4vw,1.24rem);color:#B3C7CF;margin-top:clamp(18px,2vw,28px)}
.lir-hero__scelte{display:grid;gap:14px;margin-top:clamp(26px,2.8vw,36px)}
@media (min-width:720px){.lir-hero__scelte{grid-template-columns:1fr 1fr;max-width:760px}}
.lir-scelta{
  display:flex;flex-direction:column;gap:6px;padding:22px 24px;text-decoration:none;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.14);
  border-radius:var(--raggio-scatola);transition:background var(--transizione),border-color var(--transizione),transform var(--transizione);
}
.lir-scelta:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.34);transform:translateY(-2px);color:#fff}
.lir-scelta__et{font-family:var(--etichetta);font-weight:600;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--petrolio-chiaro)}
.lir-scelta__nome{display:block;font-family:var(--titolo);font-size:1.3rem;font-weight:600;color:#fff;line-height:1.2}
.lir-scelta__testo{display:block;font-size:.94rem;color:#A8BDC5;line-height:1.5}
/* margin-top:auto e non un valore fisso: due card affiancate hanno la stessa
   altezza ma non sempre lo stesso numero di righe, e senza questo il "vai"
   della piu' corta resterebbe a mezz'aria. */
.lir-scelta__vai{
  margin-top:auto;padding-top:8px;display:inline-flex;align-items:center;gap:.5em;
  font-size:.9rem;font-weight:600;color:var(--petrolio-chiaro);
}
.lir-scelta__vai::after{
  content:"";width:.46em;height:.46em;flex:none;
  border-right:1.6px solid currentColor;border-top:1.6px solid currentColor;
  transform:rotate(45deg);transition:transform var(--transizione);
}
.lir-scelta:hover .lir-scelta__vai::after{transform:rotate(45deg) translate(2px,-2px)}

/* numeri */
/* Quattro card con sfondo: la griglia si ridistribuisce da sola e non ci
   sono filetti da far combaciare con la colonna del sito. */
.lir-numeri{
  display:grid;gap:clamp(14px,1.6vw,20px);
  grid-template-columns:repeat(2,1fr);
}
@media (min-width:960px){
  .lir-numeri{grid-template-columns:repeat(4,1fr)}
}
.lir-numeri__voce{
  background:var(--carta);border-radius:var(--raggio-scatola);
  padding:clamp(26px,2.6vw,34px) clamp(14px,1.6vw,22px);
  text-align:center;
}
.lir-sezione--carta .lir-numeri__voce,
.lir-sezione--tenue .lir-numeri__voce{background:#fff}
.lir-numeri__cifra{
  display:block;font-family:var(--titolo);font-weight:600;letter-spacing:-.03em;
  font-size:clamp(2rem,1.5rem + 1.6vw,2.9rem);line-height:1;color:var(--petrolio);
  font-variant-numeric:tabular-nums;
}
.lir-numeri__et{
  display:block;margin-top:10px;font-size:.88rem;line-height:1.4;color:var(--inchiostro-tenue);
}

/* i due mondi */
.lir-mondi{display:grid;gap:clamp(18px,2.5vw,26px)}
@media (min-width:860px){.lir-mondi{grid-template-columns:1fr 1fr}}
.lir-mondo{
  background:#fff;border:1px solid var(--linea-tenue);border-top:3px solid var(--petrolio);
  border-radius:var(--raggio-scatola);padding:clamp(26px,3vw,36px);display:flex;flex-direction:column;
  box-shadow:var(--ombra);
}
.lir-mondo--privati{border-top-color:var(--petrolio-chiaro)}
.lir-mondo h3{font-size:clamp(1.3rem,1.15rem + .5vw,1.6rem);margin-bottom:.35em}
.lir-mondo > p{color:var(--inchiostro-tenue)}
/* Con la foto in testa le card erano diventate troppo alte: il distacco fra
   sommario ed elenco (margine del paragrafo + margine dell'elenco, circa 42px)
   e il respiro delle voci sono stati stretti. */
body .lir-mondo > p{margin-bottom:0}
.lir-mondo__elenco{list-style:none;margin:12px 0 12px;padding:0;display:grid;gap:1px;background:var(--linea-tenue)}
.lir-mondo__elenco li{background:#fff}
.lir-mondo__elenco a{
  display:flex;align-items:flex-start;gap:14px;padding:8px 4px;text-decoration:none;color:inherit;
}
.lir-mondo__elenco a:hover{background:var(--petrolio-velo)}
.lir-mondo__elenco b{display:block;font-size:1rem;font-weight:600;color:var(--inchiostro)}
.lir-mondo__elenco span{display:block;font-size:.9rem;color:var(--inchiostro-tenue);line-height:1.5;margin-top:2px}
.lir-mondo__elenco a:hover b{color:var(--petrolio)}
.lir-mondo__num{
  flex:none;font-family:var(--etichetta);font-size:.72rem;color:var(--petrolio-chiaro);
  padding-top:.3em;letter-spacing:.06em;
}
.lir-mondo__piede{margin-top:auto}

/* punti di forza */
.lir-punti{
  display:grid;gap:clamp(30px,3.4vw,52px);
  grid-template-columns:repeat(auto-fit,minmax(232px,1fr));
}
.lir-punto{padding:0}
.lir-punto__titolo{
  font-family:var(--titolo);font-size:1.12rem;font-weight:600;
  letter-spacing:-.008em;color:var(--inchiostro);margin:0 0 .4em;line-height:1.16;
}
.lir-punto__titolo::before{
  content:"";display:block;width:26px;height:2px;background:var(--petrolio);margin-bottom:18px;
}
.lir-punto__testo{font-size:.96rem;color:var(--inchiostro-tenue);margin:0}
/* Icone al posto della barretta (14/10/2026, "Perche' noi" in home).
   Si sceglie con una classe sul contenitore della card, in Elementor
   (Avanzate > Classi CSS): lir-icona-mondo, -insieme, -schermo, -dialogo.
   Linea sottile sulla griglia 24 delle altre icone del tema; il colore e'
   il fondo del ::before, il disegno la maschera, cosi' segue la palette. */
.lir-punto[class*="lir-icona-"] .lir-punto__titolo::before{
  width:40px;height:40px;background:var(--petrolio);margin-bottom:16px;
  -webkit-mask:var(--icona) center/contain no-repeat;
          mask:var(--icona) center/contain no-repeat;
}
.lir-icona-mondo{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cellipse cx='12' cy='12' rx='3.8' ry='9'/%3E%3Cpath d='M3 12h18M4.4 7.4h15.2M4.4 16.6h15.2'/%3E%3C/svg%3E")}
.lir-icona-insieme{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.1'%3E%3Ccircle cx='12' cy='8.6' r='5.2'/%3E%3Ccircle cx='8.4' cy='14.8' r='5.2'/%3E%3Ccircle cx='15.6' cy='14.8' r='5.2'/%3E%3C/svg%3E")}
.lir-icona-schermo{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='3.5' width='19' height='13' rx='1.5'/%3E%3Cpath d='M8.5 20.5h7M12 16.5v4M6 7.5l4 4 2.5-2.2 4.5 4.2M14.2 13.5H17v-2.8'/%3E%3C/svg%3E")}
.lir-icona-dialogo{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 4.5h17v11.5H10l-4.5 3.8V16H3.5z'/%3E%3Ccircle cx='8.2' cy='10.3' r='.9' fill='%23000' stroke='none'/%3E%3Ccircle cx='12' cy='10.3' r='.9' fill='%23000' stroke='none'/%3E%3Ccircle cx='15.8' cy='10.3' r='.9' fill='%23000' stroke='none'/%3E%3C/svg%3E")}

/* fascia area clienti */
.lir-portale{
  background:var(--petrolio);color:#D5E6EC;position:relative;overflow:hidden;
}
.lir-portale::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(115deg,transparent 0 24px,rgba(255,255,255,.055) 24px 25px);
}
.lir-portale .lir-gabbia{
  position:relative;z-index:1;padding-block:var(--ritmo-stretto);
  display:grid;gap:26px;align-items:center;
}
@media (min-width:860px){.lir-portale .lir-gabbia{grid-template-columns:minmax(0,1fr) auto}}
.lir-portale h2{color:#fff;font-size:clamp(1.45rem,1.2rem + 1vw,2rem);margin-bottom:.3em}
.lir-portale p{margin:0;color:#CBE0E8;max-width:56ch}
.lir-portale__elenco{
  list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;margin:16px 0 0;padding:0;
  font-family:var(--etichetta);font-weight:600;font-size:.81rem;letter-spacing:.09em;text-transform:uppercase;color:#A9CCD9;
}
.lir-portale__elenco li{display:flex;align-items:center;gap:.5em}
.lir-portale__elenco li::before{content:"";width:5px;height:5px;background:var(--petrolio-chiaro);flex:none}

/* blocchi di contenuto nelle pagine servizio */
.lir-blocchi{display:grid;gap:1px;background:var(--linea-tenue)}
.lir-blocco{background:#fff;padding:clamp(26px,3vw,38px) 0}
.lir-blocco__testa{display:flex;gap:16px;align-items:baseline;margin-bottom:.6em}
.lir-blocco__n{
  flex:none;font-family:var(--etichetta);font-size:.76rem;color:var(--petrolio-chiaro);letter-spacing:.06em;
}
.lir-blocco h3{margin:0}
.lir-blocco__testo{padding-left:38px}
@media (max-width:640px){.lir-blocco__testo{padding-left:0}}
.lir-blocco__testo p{color:var(--inchiostro-tenue)}

/* elenco puntato tecnico */
/* Elenco di dati: righe separate da un filetto, come una tabella.
   Il segno di elenco e' un quadratino e non un chevron: il chevron nel sito
   vuol dire "apri" o "vai", e qui non c'e' niente da aprire. */
.lir-elenco{
  list-style:none;margin:1.3em 0;padding:0;
  display:grid;gap:1px;background:var(--linea-tenue);
  border-block:1px solid var(--linea-tenue);
}
.lir-elenco li{
  background:#fff;margin:0;padding:12px 2px;font-size:.99rem;
  display:flex;align-items:flex-start;gap:13px;
}
.lir-elenco li::before{
  content:"";flex:none;width:6px;height:6px;margin-top:.66em;
  background:var(--petrolio-chiaro);
}
.lir-sezione--carta .lir-elenco{background:var(--linea);border-color:var(--linea)}
.lir-sezione--carta .lir-elenco li{background:var(--carta)}

/* Fotografia dietro il titolo di pagina */
/* Il velo e' una tinta piena della palette, non una trasparenza sulla foto:
   il contrasto del titolo non dipende da quanto e' chiara l'immagine. */
.lir-intestazione--foto{position:relative;isolation:isolate}
.lir-intestazione__foto{position:absolute;inset:0;overflow:hidden;z-index:-1}
body .lir-intestazione__foto img{
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.05);
}
.lir-intestazione__foto::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(12,20,24,.95) 0%,rgba(12,20,24,.88) 42%,rgba(17,72,92,.78) 100%);
}
.lir-intestazione--foto .lir-gabbia{position:relative;z-index:1}

/* linea del tempo */
/* L'anno in monospaziato e la riga verticale che li lega: la storia dello
   studio si legge nella colonna delle date, prima ancora dei testi. */
/* Una colonna sola: la riga verticale e' la spina della storia, e in due
   colonne si leggerebbe a zigzag invece che dall'alto in basso. */
/* La linea del tempo sta accanto alla sua testata, non sotto.
   Da sola occupava la colonna stretta del testo e lasciava vuota meta'
   pagina; spostarla nella colonna di destra come se fosse una barra
   laterale invece la declasserebbe, e questa e' la parte che il cliente
   voleva in evidenza. Cosi' resta un capitolo, con il titolo a sinistra e i
   fatti a destra, e la sezione si prende tutta la larghezza.
   Sotto i 980px torna in colonna sola. */
@media (min-width:980px){
  body .lir-sezione .lir-gabbia:has(.lir-tappe){
    display:grid;
    grid-template-columns:minmax(0,380px) minmax(0,1fr);
    gap:clamp(40px,5vw,72px);
    align-items:start;
  }
}

.lir-tappe{
  list-style:none;margin:0;padding:0;position:relative;
  display:grid;gap:clamp(26px,3vw,38px);max-width:var(--gabbia-stretta);
}
.lir-tappe::before{
  content:"";position:absolute;left:0;top:.6em;bottom:.6em;width:1px;
  background:var(--linea);
}
.lir-tappa{position:relative;padding-left:clamp(26px,4vw,52px)}
.lir-tappa::before{
  content:"";position:absolute;left:-3px;top:.55em;width:7px;height:7px;
  background:var(--petrolio);border-radius:50%;
}
.lir-tappa--ora::before{
  width:11px;height:11px;left:-5px;top:.45em;
  background:var(--petrolio);box-shadow:0 0 0 4px var(--petrolio-velo);
}
.lir-tappa__anno{
  display:block;font-family:var(--etichetta);font-weight:600;font-size:.86rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--petrolio);margin-bottom:6px;
}
.lir-tappa__titolo{
  font-size:clamp(1.06rem,1rem + .3vw,1.22rem);font-weight:600;
  color:var(--inchiostro);margin:0 0 .35em;line-height:1.3;
}
.lir-tappa__testo{color:var(--inchiostro-tenue);margin:0;max-width:64ch}

/* fotografie */
/* Le immagini arrivano da banche diverse: a tenerle in serie e' la stessa
   correzione leggera su tutte (--foto-colore). Fino al 01/10/2026 era un
   duotono petrolio, ora rimasto solo nella fascia del titolo e nell'apertura. */
.lir-foto,
.lir-foto .elementor-widget-container{position:relative;overflow:hidden;border-radius:var(--raggio-lastra)}
.lir-foto img{
  display:block;width:100%;height:auto;
  filter:var(--foto-colore);
}

/* Fascia a tutta larghezza: l'immagine e' decorazione, non contenuto, quindi
   ha un'altezza fissa e viene ritagliata al centro. */
.lir-fascia-foto{position:relative;overflow:hidden;background:var(--grafite)}
/* `body` davanti perche' Elementor porta `.elementor img{height:auto}`, che a
   parita' di specificita' arriva dopo il nostro foglio e vincerebbe. */
body .lir-fascia-foto img{
  display:block;width:100%;height:clamp(220px,28vw,380px);object-fit:cover;
  filter:var(--foto-colore);
}
/* La didascalia e' una frase, non un'etichetta: in mono maiuscoletto reggeva
   due parole, non due righe di testo. Resta piu' piccola del testo e in
   grigio, con un filetto che la lega all'immagine. */
.lir-foto figcaption,
.lir-didascalia{
  font-size:.86rem;line-height:1.5;color:var(--inchiostro-tenue);
  margin-top:12px;padding-left:12px;border-left:2px solid var(--linea);
  max-width:60ch;
}

/* domande frequenti */
.lir-faq{border-top:1px solid var(--linea)}
.lir-faq details{border-bottom:1px solid var(--linea)}
.lir-faq summary{
  cursor:pointer;list-style:none;padding:19px 44px 19px 0;position:relative;
  font-family:var(--titolo);font-size:1.07rem;font-weight:600;line-height:1.35;
}
.lir-faq summary::-webkit-details-marker{display:none}
.lir-faq summary::after{
  content:"";position:absolute;right:12px;top:50%;width:10px;height:10px;
  border-right:1.5px solid var(--petrolio);border-bottom:1.5px solid var(--petrolio);
  transform:translateY(-70%) rotate(45deg);transition:transform var(--transizione);
}
.lir-faq details[open] summary::after{transform:translateY(-20%) rotate(-135deg)}
.lir-faq summary:hover{color:var(--petrolio)}
.lir-faq__risposta{padding:0 8px 22px 0;color:var(--inchiostro-tenue);max-width:74ch}

/* schede contatto rapido */
.lir-contatti{display:grid;gap:clamp(20px,3vw,34px)}
@media (min-width:860px){.lir-contatti{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}
.lir-recapito{display:grid;gap:18px}
.lir-recapito__voce{display:flex;gap:14px;align-items:flex-start}
.lir-recapito__voce svg{flex:none;width:18px;height:18px;margin-top:4px;color:var(--petrolio)}
.lir-recapito__et{
  display:block;font-family:var(--etichetta);font-weight:600;font-size:.75rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--inchiostro-tenue);margin-bottom:3px;
}
.lir-recapito__voce b{font-weight:600;font-size:1.02rem;display:block}
/* La PEC e' lunghissima: in mono occupa una riga e mezza e sborda su schermo
   stretto. Prende il carattere del testo, come l'indirizzo sopra, e resta
   secondaria solo per corpo e colore. I numeri di telefono restano in mono,
   che li' la cifra tabellare serve. */
.lir-recapito__pec{
  display:block;font-family:var(--testo);font-size:.94rem;
  color:var(--inchiostro-tenue);overflow-wrap:anywhere;
}
.lir-recapito__voce a{text-decoration:none}
.lir-recapito__voce a:hover{text-decoration:underline}
.lir-mappa{border:1px solid var(--linea);border-radius:var(--raggio-lastra);overflow:hidden;min-height:320px;background:var(--carta)}
.lir-mappa iframe{display:block;width:100%;height:100%;min-height:320px;border:0}
.lir-mappa__consenso{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  text-align:center;padding:36px 24px;min-height:320px;color:var(--inchiostro-tenue);
}

/* -- 8. News -------------------------------------------------------- */
.lir-filtri{
  display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(26px,3vw,40px);
  padding-bottom:18px;border-bottom:1px solid var(--linea);
}
.lir-filtro{
  font-family:var(--etichetta);font-weight:600;font-size:.81rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.55em .95em;border:1px solid var(--linea);border-radius:var(--raggio-segno);
  text-decoration:none;color:var(--inchiostro-tenue);background:#fff;
  transition:all var(--transizione);
}
.lir-filtro:hover{border-color:var(--petrolio-chiaro);color:var(--petrolio)}
.lir-filtro--attivo{background:var(--petrolio);border-color:var(--petrolio);color:#fff}
.lir-filtro--attivo:hover{color:#fff;background:var(--petrolio-scuro)}

.lir-articoli{display:grid;gap:clamp(18px,2.4vw,26px);grid-template-columns:repeat(auto-fill,minmax(296px,1fr))}
.lir-scheda{
  display:flex;flex-direction:column;background:#fff;border:1px solid var(--linea-tenue);
  border-radius:var(--raggio-scatola);overflow:hidden;transition:box-shadow var(--transizione),transform var(--transizione);
}
.lir-scheda:hover{box-shadow:var(--ombra-alta);transform:translateY(-2px)}
/* Anche le copertine degli articoli entrano nella stessa serie: la
   correzione comune le avvicina alle altre anche se le carica lo studio. */
.lir-scheda__img{aspect-ratio:16/9;background:var(--carta);overflow:hidden;position:relative}
body .lir-scheda__img img{width:100%;height:100%;object-fit:cover;filter:var(--foto-colore)}
.lir-scheda__vuota{
  aspect-ratio:16/9;background:var(--grafite);position:relative;overflow:hidden;
  background-image:repeating-linear-gradient(115deg,transparent 0 18px,rgba(255,255,255,.06) 18px 19px);
}
.lir-scheda__corpo{padding:20px 22px 24px;display:flex;flex-direction:column;flex:1}
.lir-scheda__meta{
  display:flex;flex-wrap:wrap;gap:.55em;align-items:center;font-family:var(--etichetta);font-weight:600;
  font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--inchiostro-tenue);
  margin-bottom:12px;
}
.lir-scheda__cat{color:var(--petrolio);text-decoration:none;font-weight:500}
.lir-scheda__cat:hover{text-decoration:underline}
.lir-scheda h3{font-size:1.14rem;line-height:1.3;margin-bottom:.45em}
.lir-scheda h3 a{color:inherit;text-decoration:none}
.lir-scheda h3 a:hover{color:var(--petrolio)}
.lir-scheda p{font-size:.94rem;color:var(--inchiostro-tenue);margin-bottom:1em}
.lir-scheda__piede{margin-top:auto;padding-top:12px;font-size:.87rem}

.lir-articolo{max-width:var(--gabbia-stretta);margin-inline:0}
.lir-articolo__meta{
  display:flex;flex-wrap:wrap;gap:.6em 1.1em;align-items:center;font-family:var(--etichetta);font-weight:600;
  font-size:.79rem;letter-spacing:.09em;text-transform:uppercase;color:var(--inchiostro-tenue);
  padding-bottom:20px;border-bottom:1px solid var(--linea);margin-bottom:30px;
}
.lir-articolo__corpo{font-size:1.06rem;line-height:1.72}
.lir-articolo__corpo h2{margin-top:1.7em;font-size:1.55rem}
.lir-articolo__corpo h3{margin-top:1.5em}
.lir-articolo__corpo ul,.lir-articolo__corpo ol{padding-left:1.3em;margin:0 0 1.15em}
.lir-articolo__corpo li{margin-bottom:.4em}
.lir-articolo__corpo blockquote{
  margin:1.6em 0;padding:4px 0 4px 22px;border-left:3px solid var(--petrolio-chiaro);
  font-size:1.1rem;color:var(--inchiostro-tenue);
}
.lir-firma{
  display:flex;gap:16px;align-items:center;margin-top:44px;padding:22px 24px;
  background:var(--fondo-tenue);border:1px solid var(--linea-tenue);border-radius:var(--raggio-scatola);
}
.lir-firma__et{font-family:var(--etichetta);font-weight:600;font-size:.75rem;letter-spacing:.13em;text-transform:uppercase;color:var(--inchiostro-tenue)}
.lir-firma b{display:block;font-size:1.04rem}
.lir-correlati{margin-top:var(--ritmo)}

/* Precedente e successivo: non due card ma due colonne di testo, larghe
   quanto l'articolo e separate da un filetto. Stanno dentro la sezione
   dell'articolo, quindi non aggiungono una fascia ne' un fondo nuovo. */
.lir-vicini{
  max-width:var(--gabbia-stretta);margin-top:clamp(34px,4vw,48px);
  padding-top:clamp(20px,2.2vw,26px);border-top:1px solid var(--linea);
  display:grid;gap:22px;grid-template-columns:1fr;
}
@media (min-width:640px){
  .lir-vicini{grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px)}
  /* Se c'e' solo il successivo, va nella seconda colonna e resta a destra. */
  .lir-vicino--succ:only-child{grid-column:2}
}
.lir-vicino{display:flex;flex-direction:column;gap:5px;text-decoration:none;color:inherit}
.lir-vicino__et{
  display:inline-flex;align-items:center;gap:.4em;
  font-family:var(--etichetta);font-weight:600;font-size:.7rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--inchiostro-tenue);
}
.lir-vicino b{
  font-size:.99rem;font-weight:600;line-height:1.4;color:var(--inchiostro);
  transition:color var(--transizione);
}
.lir-vicino:hover b{color:var(--petrolio)}
.lir-vicino:hover .lir-vicino__et{color:var(--petrolio)}
.lir-vicino--prec .lir-freccia{transform:rotate(180deg)}
.lir-vicino--succ{text-align:right}
.lir-vicino--succ .lir-vicino__et{align-self:flex-end}
.lir-vicino .lir-freccia{width:.85em;height:.85em;transition:transform var(--transizione)}
.lir-vicino--succ:hover .lir-freccia{transform:translateX(3px)}
.lir-vicino--prec:hover .lir-freccia{transform:rotate(180deg) translateX(3px)}

.lir-paginazione{
  display:flex;gap:6px;justify-content:center;margin-top:clamp(34px,4vw,52px);flex-wrap:wrap;
}
.lir-paginazione .page-numbers{
  display:flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;
  border:1px solid var(--linea);border-radius:var(--raggio-comando);text-decoration:none;font-family:var(--etichetta);font-size:.84rem;
}
.lir-paginazione .current{background:var(--petrolio);border-color:var(--petrolio);color:#fff}
.lir-vuoto{padding:44px 0;color:var(--inchiostro-tenue);border-top:1px solid var(--linea)}

/* -- 9. Soci -------------------------------------------------------- */
/* Tre per riga: card piu' larghe, cosi' le competenze nel velo stanno su una
   riga sola invece di andare a capo dopo due parole. */
/* Il "Conosci i soci" sta in alto a destra, alla stessa altezza della testata.
   In fondo a sinistra, sotto la striscia, restava un pulsante sospeso in mezzo
   al bianco; qui chiude la riga del titolo e la sezione si legge come un
   blocco solo.
   Nei dati di Elementor il pulsante resta pero' l'ultimo widget: da tastiera
   si arriva prima alle persone e poi al "vedi tutti", che e' l'ordine giusto,
   e su telefono - dove questa griglia non si applica - si legge in fondo.
   A spostarlo e' solo la griglia, e solo da 860px in su. */
@media (min-width:860px){
  body .lir-gabbia:has(> .lir-persone__azione){
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    column-gap:clamp(24px,4vw,64px);
    /* Centrato sulla testata, non in fondo: allineato in basso restava sospeso
       fra il sommario e la striscia, allineato in alto finiva in riga con
       l'occhiello e lasciava un vuoto sotto. */
    align-items:center;
  }
  body .lir-gabbia:has(> .lir-persone__azione) > .lir-testa{grid-column:1;grid-row:1}
  body .lir-gabbia:has(> .lir-persone__azione) > .lir-persone__azione{
    grid-column:2;grid-row:1;justify-self:end;margin:0;
  }
  body .lir-gabbia:has(> .lir-persone__azione) > .lir-persone__lista{grid-column:1/-1;grid-row:2}
}

/* Striscia delle persone in home: solo ritratto, nome e ruolo.
   Non e' una card e non ha bordo: il ritratto e' gia' una scatola, mettergliene
   un'altra intorno vorrebbe dire due cornici concentriche. Il nome sta sotto,
   allineato al bordo dell'immagine. */
.lir-persone{
  list-style:none;margin:0;padding:0;display:grid;gap:clamp(14px,1.8vw,22px);
  grid-template-columns:repeat(2,1fr);
}
@media (min-width:620px){.lir-persone{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1000px){.lir-persone{grid-template-columns:repeat(5,1fr)}}
/* Il kit di Elementor colora tutti i collegamenti con la stessa specificita'
   della classe e arriva dopo: senza il body davanti i nomi diventano petrolio. */
body .lir-persone a{display:block;text-decoration:none;color:var(--inchiostro)}
body .lir-persone a:hover .lir-persona__nome{color:var(--petrolio)}
.lir-persona__ritratto{
  position:relative;aspect-ratio:1;overflow:hidden;background:var(--carta);
  border-radius:var(--raggio-scatola);margin-bottom:12px;
  transition:transform var(--transizione);
}
.lir-persona__ritratto img{width:100%;height:100%;object-fit:cover;display:block}
.lir-persone a:hover .lir-persona__ritratto{transform:translateY(-2px)}
.lir-persona__nome{display:block;font-weight:600;font-size:1rem;line-height:1.3}
.lir-persona__ruolo{
  display:block;font-family:var(--etichetta);font-weight:600;font-size:.68rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--inchiostro-tenue);margin-top:4px;
}
/* Il monogramma nella striscia e' piu' piccolo della card: la cella e' meta'. */
.lir-persona__ritratto .lir-monogramma span{font-size:clamp(1.6rem,2.6vw,2.1rem)}

.lir-soci{display:grid;gap:clamp(14px,1.8vw,20px);grid-template-columns:1fr}
@media (min-width:560px){.lir-soci{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.lir-soci{grid-template-columns:repeat(3,1fr)}}
/* Griglia e non flex: ritratto e velo delle competenze stanno nella stessa
   cella, cosi' il velo copre il ritratto al pixel senza doverne indovinare
   le proporzioni. Il corpo occupa la seconda riga e si allunga da solo. */
.lir-socio{
  display:grid;grid-template-rows:auto 1fr;background:#fff;border:1px solid var(--linea-tenue);
  border-radius:var(--raggio-scatola);overflow:hidden;transition:box-shadow var(--transizione),transform var(--transizione);
}
.lir-socio__ritratto{grid-area:1/1}
.lir-socio__corpo{grid-area:2/1}
.lir-socio:hover{box-shadow:var(--ombra-alta);transform:translateY(-2px)}
/* Ritratto quadrato e non 4/5: con tre card per riga sono larghe, e il
   formato verticale le farebbe tornare alte quanto prima. */
.lir-socio__ritratto{aspect-ratio:1/1;background:var(--carta);overflow:hidden;position:relative}
.lir-socio__ritratto img{width:100%;height:100%;object-fit:cover}
.lir-monogramma{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:var(--grafite);
  background-image:repeating-linear-gradient(115deg,transparent 0 20px,rgba(255,255,255,.055) 20px 21px);
}
.lir-monogramma span{
  font-family:var(--titolo);font-weight:600;font-size:clamp(2.4rem,4vw,3.2rem);
  letter-spacing:.02em;color:#fff;opacity:.92;
}
.lir-socio__corpo{padding:18px 18px 22px;display:flex;flex-direction:column;flex:1}
.lir-socio__ruolo{
  font-family:var(--etichetta);font-weight:600;font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--petrolio);margin-bottom:8px;display:block;
}
.lir-socio h3{font-size:1.1rem;margin-bottom:.3em;letter-spacing:-.005em}
.lir-socio h3 a{color:inherit;text-decoration:none}
.lir-socio h3 a:hover{color:var(--petrolio)}
.lir-socio__sintesi{font-size:.9rem;line-height:1.55;color:var(--inchiostro-tenue);margin-bottom:14px}
.lir-socio__tag{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto;padding-top:12px}

/* Le competenze coprono il ritratto al passaggio del mouse: erano il blocco
   piu' lungo della scheda e quello che meno serve a colpo d'occhio. Restano
   leggibili da tastiera (focus-within) e sulla pagina del socio. */
.lir-socio__competenze{
  grid-area:1/1;z-index:1;
  display:flex;flex-direction:column;justify-content:center;gap:14px;
  padding:22px 20px;background:rgba(12,20,24,.97);
  opacity:0;visibility:hidden;
  transition:opacity var(--transizione),visibility var(--transizione);
}
.lir-socio:hover .lir-socio__competenze,
.lir-socio:focus-within .lir-socio__competenze{opacity:1;visibility:visible}
.lir-socio__competenze-et{
  font-family:var(--etichetta);font-weight:600;font-size:.69rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--petrolio-chiaro);
}
.lir-socio__competenze .lir-socio__tag{margin-top:0;padding-top:0}
.lir-socio__competenze .lir-tag{
  background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.22);color:#DDE7EB;
}

/* Senza puntatore il velo non comparirebbe mai: le competenze tornano in
   fondo alla scheda, come un normale blocco di etichette. */
@media (hover:none){
  .lir-socio__competenze{
    grid-area:3/1;opacity:1;visibility:visible;
    background:none;padding:0 18px 20px;gap:8px;
  }
  .lir-socio__competenze-et{color:var(--inchiostro-tenue)}
  .lir-socio__competenze .lir-tag{
    background:var(--fondo-tenue);border-color:var(--linea);color:var(--inchiostro-tenue);
  }
}

.lir-scheda-socio{display:grid;gap:clamp(28px,4vw,52px)}
@media (min-width:880px){.lir-scheda-socio{grid-template-columns:minmax(0,300px) minmax(0,1fr);align-items:start}}
.lir-scheda-socio__lato{display:grid;gap:22px}
.lir-scheda-socio__ritratto{aspect-ratio:4/5;background:var(--carta);position:relative;border-radius:var(--raggio-lastra);overflow:hidden}
.lir-scheda-socio__ritratto img{width:100%;height:100%;object-fit:cover}
.lir-anagrafica{margin:0;display:grid;gap:1px;background:var(--linea-tenue);border:1px solid var(--linea-tenue);border-radius:var(--raggio-scatola);overflow:hidden}
.lir-anagrafica div{background:#fff;padding:12px 16px}
.lir-anagrafica dt{
  font-family:var(--etichetta);font-weight:600;font-size:.73rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--inchiostro-tenue);margin-bottom:3px;
}
.lir-anagrafica dd{margin:0;font-size:.97rem;font-weight:600}
.lir-scheda-socio__testo p{color:var(--inchiostro-tenue)}
.lir-scheda-socio__testo h2{font-size:1.4rem;margin-top:1.6em}
.lir-scheda-socio__testo h2:first-child{margin-top:0}

/* -- 10. Moduli ----------------------------------------------------- */
/* Il riquadro sta su fondo tenue: bianco, cosi' si stacca. I campi dentro
   prendono il grigio chiarissimo e diventano bianchi quando hanno il fuoco. */
.lir-modulo{
  background:#fff;border:1px solid var(--linea-tenue);border-top:3px solid var(--petrolio);
  border-radius:var(--raggio-scatola);padding:clamp(24px,3vw,38px);
  box-shadow:var(--ombra);
}
/* Moduli: widget Form di Elementor Pro dentro un modello salvato.
   `body .lir-modulo` davanti a tutto: il foglio del widget porta regole con
   due classi e quello del modello ne porta fino a quattro. */
body .lir-modulo.e-con{padding:clamp(24px,3vw,38px);gap:0}
body .lir-modulo .elementor-form{margin:0}
body .lir-modulo .elementor-field-label{
  display:block;font-size:.88rem;font-weight:600;line-height:1.35;
  color:var(--inchiostro);margin:0 0 7px;padding:0;
}
/* Asterisco dei campi obbligatori: lo mette Pro con un ::after, noi gli
   diamo il colore e il peso del sistema. */
body .lir-modulo .elementor-mark-required .elementor-field-label::after{
  content:"*";color:var(--ambra);font-weight:600;padding-inline-start:.25em;
}
body .lir-modulo .lir-obbl{color:var(--ambra);font-weight:600;margin-left:.25em}
body .lir-modulo .lir-legenda .lir-obbl{margin:0 .18em 0 0}
body .lir-modulo .elementor-field-textual{
  width:100%;min-height:0;font-family:var(--testo);font-size:1rem;line-height:1.4;
  color:var(--inchiostro);padding:.72em .85em;background:var(--fondo-tenue);
  border:1px solid var(--linea);border-radius:var(--raggio-comando);box-shadow:none;
  transition:border-color var(--transizione),background var(--transizione),box-shadow var(--transizione);
}
/* Il segnaposto e' testo e va letto: a #8A9BA3 sul grigio dei campi dava 2,7
   su 1, sotto il minimo di 4,5. A #5F7076 fa 4,81 e resta comunque piu'
   chiaro del valore digitato, che e' grafite pieno. */
body .lir-modulo .elementor-field-textual::placeholder{color:#5F7076;opacity:1}
body .lir-modulo textarea.elementor-field-textual{min-height:104px;resize:vertical}
body .lir-modulo .elementor-select-wrapper{background:none;border:0;padding:0}
body .lir-modulo .elementor-select-wrapper select.elementor-field-textual{
  height:auto;padding:.72em 2.4em .72em .85em;line-height:1.4;
}
/* Finche' resta sulla voce vuota la tendina si legge come un segnaposto */
body .lir-modulo select.elementor-field-textual:has(option[value=""]:checked){color:#5F7076}
body .lir-modulo select.elementor-field-textual option{color:var(--inchiostro)}
body .lir-modulo .elementor-select-wrapper .select-caret-down-wrapper{inset-inline-end:.9em;color:#4C5F68;font-size:11px}
body .lir-modulo .elementor-field-textual:focus{
  outline:none;background:#fff;border-color:var(--petrolio);box-shadow:0 0 0 3px rgba(17,72,92,.13);
}

/* La casella si centra sul testo, non sulla riga: centrandola sulla riga
   finisce 1,5px troppo in basso, perche' meta' riga cade sotto la linea di
   base, fra gli spazi per le discendenti. .2em la porta a meta' dell'altezza
   delle maiuscole, che e' dove l'occhio si aspetta di trovarla. */
body .lir-modulo .elementor-field-type-acceptance .elementor-field-option{
  display:flex;gap:11px;align-items:flex-start;
}
body .lir-modulo .elementor-field-type-acceptance input[type=checkbox]{
  flex:none;width:16px;height:16px;margin:.2em 0 0;accent-color:var(--petrolio);
}
body .lir-modulo .elementor-field-type-acceptance label{
  font-size:.89rem;font-weight:400;line-height:1.55;color:var(--inchiostro-tenue);margin:0;
}
body .lir-modulo .lir-legenda{margin:0;font-size:.84rem;color:var(--inchiostro-tenue)}

/* La chiusura del modulo - consenso, legenda, pulsante - e' un blocco solo.
   Fra i campi il passo e' 20px perche' ognuno e' una domanda a se'; qui sono
   tre righe della stessa cosa e stanno a 10, altrimenti si aprono tre vuoti
   in fila che sembrano errori di impaginazione. Il pulsante prende un po'
   piu' d'aria perche' e' l'azione, non un'altra riga di testo. Il body e
   le quattro classi servono a battere il passo scritto nel CSS del modello. */
body .lir-modulo .elementor-form .elementor-field-group.elementor-field-group-consenso,
body .lir-modulo .elementor-form .elementor-field-group.elementor-field-group-legenda{margin-bottom:10px}
body .lir-modulo .elementor-form .elementor-field-group.e-form__buttons{margin-top:12px}
body .lir-modulo .elementor-form .e-form__buttons{justify-content:flex-start}
body .lir-modulo .elementor-form .e-form__buttons .elementor-button{width:auto;flex:0 0 auto}

/* Messaggi: l'errore sotto il campo e' una riga di testo; l'esito
   dell'invio e' un riquadro, verde o rosso. */
body .lir-modulo .elementor-field-group .elementor-message.elementor-help-inline{
  display:block;margin:5px 0 0;padding:0;border:0;background:none;
  color:#9A2B1E;font-size:.84rem;line-height:1.4;
}
body .lir-modulo .elementor-field-group .elementor-message::before{display:none}
body .lir-modulo .elementor-form > .elementor-message{
  margin:20px 0 0;padding:.9em 1.1em;border:1px solid;border-radius:var(--raggio-comando);
  font-size:.94rem;line-height:1.5;
}
body .lir-modulo .elementor-form > .elementor-message::before{display:none}
body .lir-modulo .elementor-form > .elementor-message-success{border-color:#2E6B4F;background:#EAF4EE;color:#1F4D38}
body .lir-modulo .elementor-form > .elementor-message-danger{border-color:#9A2B1E;background:#FBEDEB;color:#7A2418}

/* -- 11. Cookie ------------------------------------------------------ */
.lir-cookie{
  position:fixed;left:0;right:0;bottom:0;z-index:400;background:var(--grafite);color:#C3D2D8;
  border-top:2px solid var(--petrolio);box-shadow:0 -10px 40px -18px rgba(0,0,0,.6);
}
.lir-cookie[hidden]{display:none!important}
.lir-cookie .lir-gabbia{padding-block:22px;display:grid;gap:18px}
@media (min-width:980px){.lir-cookie .lir-gabbia{grid-template-columns:minmax(0,1fr) auto;align-items:center}}
.lir-cookie h2{color:#fff;font-size:1.08rem;margin-bottom:.35em}
.lir-cookie p{margin:0;font-size:.92rem;color:#A9BDC5;max-width:78ch}
.lir-cookie p a{color:#CFDDE3;text-decoration:underline}
.lir-cookie__azioni{display:flex;gap:10px;flex-wrap:wrap}
.lir-cookie__azioni .lir-btn{font-size:.92rem;padding:.72em 1.25em}
.lir-cookie__dettagli{margin-top:14px;font-size:.88rem}
.lir-cookie__dettagli summary{cursor:pointer;color:#CFDDE3}
.lir-cookie__dettagli table{width:100%;margin-top:12px;border-collapse:collapse;font-size:.83rem}
.lir-cookie__dettagli th,.lir-cookie__dettagli td{
  text-align:left;padding:7px 10px;border:1px solid rgba(255,255,255,.14);vertical-align:top;
}
.lir-cookie__dettagli th{font-family:var(--etichetta);font-size:.77rem;letter-spacing:.1em;text-transform:uppercase;color:#8FA6AF;font-weight:600}
.lir-revoca{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}

/* -- 12. Tabelle e contenuti generici -------------------------------- */
.lir-testo-lungo{max-width:78ch}
.lir-testo-lungo h2{margin-top:1.9em;font-size:1.5rem}
.lir-testo-lungo h2:first-child{margin-top:0}
.lir-testo-lungo h3{margin-top:1.5em;font-size:1.15rem}
.lir-testo-lungo ul,.lir-testo-lungo ol{padding-left:1.25em;margin:0 0 1.15em}
.lir-testo-lungo li{margin-bottom:.4em}
.lir-tabella{width:100%;border-collapse:collapse;font-size:.95rem;margin:1.4em 0}
.lir-tabella th,.lir-tabella td{border:1px solid var(--linea);padding:10px 13px;text-align:left;vertical-align:top}
.lir-tabella th{background:var(--fondo-tenue);font-family:var(--etichetta);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600}
.lir-scorri{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* -- Elementor: neutralizza i margini di default ---------------------- */
.elementor-section.elementor-section-boxed > .elementor-container{max-width:var(--gabbia)}
.elementor-widget:not(:last-child){margin-block-end:0}
.elementor-widget-text-editor{font-size:inherit}
.lir-corpo .elementor-widget-shortcode{line-height:inherit}

/* -- Stampa ---------------------------------------------------------- */
@media print{
  .lir-testata,.lir-piede,.lir-cookie,.lir-drawer,.lir-filtri,.lir-paginazione{display:none!important}
  body{font-size:11pt;color:#000;background:#fff}
  a{color:#000;text-decoration:underline}
  .lir-sezione{padding-block:12pt}
}

/* -- Rimandi e pulsanti dentro Elementor ----------------------------- */
.lir-punti--rimandi{
  gap:clamp(18px,2.4vw,26px);
  grid-template-columns:repeat(auto-fit,minmax(248px,1fr));
}
.lir-punto--link{
  display:flex;flex-direction:column;text-decoration:none;color:inherit;position:relative;
  background:#fff;border:1px solid var(--linea-tenue);border-radius:var(--raggio-scatola);
  padding:clamp(24px,2.6vw,32px);box-shadow:var(--ombra);
  transition:background var(--transizione),border-color var(--transizione),box-shadow var(--transizione);
}
.lir-punto--link:hover{
  background:var(--petrolio-velo);border-color:var(--petrolio-chiaro);box-shadow:var(--ombra-alta);
}
.lir-punto--link .lir-punto__titolo{color:var(--inchiostro)}
.lir-punto--link:hover .lir-punto__titolo{color:var(--petrolio)}
/* Il testo si prende lo spazio che avanza e la freccia, ultimo elemento della
   colonna, finisce sul fondo: cosi' resta alla stessa altezza anche nelle card
   con una riga di testo in meno. Il gap tiene i 16px minimi. */
.lir-punto--link .lir-punto__testo{display:flex;flex-direction:column;flex:1;gap:16px}
.lir-punto--link .lir-punto__testo::after{
  content:"";display:block;width:9px;height:9px;margin-top:auto;
  border-right:1.6px solid var(--petrolio);border-top:1.6px solid var(--petrolio);
  transform:rotate(45deg);transition:transform var(--transizione);
}
.lir-punto--link:hover .lir-punto__testo::after{transform:rotate(45deg) translate(2px,-2px)}

.lir-btn-el .elementor-button{
  font-family:var(--testo);font-size:.98rem;font-weight:600;line-height:1.2;
  padding:.85em 1.5em;border-radius:var(--raggio-comando);border:1px solid var(--petrolio);
  background:var(--petrolio);color:#fff;transition:background var(--transizione);
}
.lir-btn-el .elementor-button:hover,
body .lir-btn-el a.elementor-button:hover{background:var(--petrolio-scuro);border-color:var(--petrolio-scuro);color:#fff}

/* La larghezza del testo lungo. La gabbia e le spaziature dei contenitori
   Elementor sono governate dal blocco "Gabbia e ritmo verticale". */
.lir-corpo .lir-testo-lungo{max-width:78ch;margin-inline:0}

/* =====================================================================
   Sovrascritture sul foglio globale di Elementor
   Le impostazioni globali del kit portano già la palette e i caratteri
   del sistema: qui restano solo i casi in cui il colore deve cambiare
   perché il fondo è scuro.
   ===================================================================== */

.lir-hero .elementor-heading-title,
.lir-intestazione h1,
.lir-sezione--scura .elementor-heading-title,
.lir-sezione--petrolio .elementor-heading-title,
.lir-portale .elementor-heading-title{color:#fff}

.lir-hero .elementor-widget-text-editor,
.lir-sezione--scura .elementor-widget-text-editor,
.lir-sezione--petrolio .elementor-widget-text-editor{color:#B3C7CF}

.lir-hero .elementor-widget-container a,
.lir-sezione--scura .elementor-widget-container a{color:#CFDDE3}

/* Le icone in linea seguono la dimensione del testo */
svg.lir-freccia,
.lir-scelta__vai svg,
.lir-link svg,
.lir-btn svg,
.lir-portale-btn svg,
.lir-mega__titolo svg,
.lir-recapiti svg,
.lir-el svg{width:1em;height:1em;flex:none;display:inline-block;vertical-align:-.1em}
.lir-nav__freccia{width:.62em!important;height:.62em!important}
.lir-recapito__voce svg{width:18px;height:18px;flex:none}
.lir-social svg{width:17px;height:17px}

/* Il pulsante del portale non va mandato a capo */
.lir-portale-btn b{white-space:nowrap}
.lir-portale-btn small{white-space:nowrap}

/* Spaziature dei widget dentro le sezioni del tema */
.lir-corpo .lir-testa > .e-con-inner > .elementor-widget{margin-block-end:0}
.lir-corpo .lir-testa .elementor-widget-text-editor + .elementor-widget-heading{margin-top:0}
/* Lo stacco fra titolo e sommario lo da' solo .lir-hero__testo: due sorgenti
   che si sommavano erano il motivo per cui era il doppio del previsto. */
.lir-corpo .lir-hero .elementor-widget-heading + .elementor-widget-text-editor{margin-top:0}
.lir-corpo .lir-testo-lungo > .e-con-inner > .elementor-widget + .elementor-widget{margin-top:0}

/* ---------------------------------------------------------------------
   Il kit di Elementor colora tutti i collegamenti: qui riprendiamo il
   controllo sui componenti del tema, con un livello di specificita' in
   piu' (prefisso "body").
   --------------------------------------------------------------------- */

body .lir-testata__servizio a{color:#CFDDE3}
body .lir-testata__servizio a:hover{color:#fff}
body .lir-lingue a{color:#8FA6AF}
body .lir-lingue a:hover{color:#fff}
body .lir-lingue .lir-lingue__attiva{color:#fff}

body .lir-nav__lista > li > a{color:var(--inchiostro)}
body .lir-nav__lista > li.lir-corrente > a,
body .lir-nav__lista > li > a:hover{color:var(--petrolio)}
body .lir-sub a{color:var(--inchiostro)}
body .lir-sub a:hover{color:var(--petrolio-scuro)}
body .lir-mega__voci a{color:inherit;text-decoration:none}
body .lir-mega__titolo{color:var(--petrolio)}

body a.lir-portale-btn,
body a.lir-portale-btn:hover{color:#fff}
body a.lir-btn{color:#fff}
body a.lir-btn--vuoto{color:var(--petrolio)}
body a.lir-btn--chiaro{color:var(--grafite)}
body a.lir-btn--fantasma,
body a.lir-btn--fantasma:hover{color:#fff}
body a.lir-link{color:var(--petrolio)}
body a.lir-link:hover{color:var(--petrolio-scuro)}

/* Anche qui il colore va ripetuto in hover, altrimenti vince la regola
   `a:hover` del kit di Elementor. */
body a.lir-scelta, body a.lir-scelta:hover{color:#fff;text-decoration:none}
body a.lir-scelta .lir-scelta__nome{color:#fff}
body a.lir-scelta .lir-scelta__testo{color:#A8BDC5}
body a.lir-scelta .lir-scelta__et,
body a.lir-scelta .lir-scelta__vai{color:var(--petrolio-chiaro)}
/* Elementor rende flessibili i widget dentro i contenitori e azzera
   l'allineamento: senza questa riga la freccia si appoggia in cima alla riga
   invece che a meta' del testo. */
body .lir-scelta .lir-scelta__vai{display:flex;align-items:center;gap:.5em}

body .lir-mondo__elenco a{color:inherit}
body .lir-mondo__elenco b{color:var(--inchiostro)}
body .lir-mondo__elenco a:hover b{color:var(--petrolio)}

body a.lir-punto--link{color:inherit;text-decoration:none}
body a.lir-vicino, body a.lir-vicino:hover{color:inherit;text-decoration:none}
body a.lir-vicino b{color:var(--inchiostro)}
body a.lir-vicino:hover b{color:var(--petrolio)}
body a.lir-vicino .lir-vicino__et{color:var(--petrolio)}
/* Elementor azzera il margine dei widget dentro i contenitori con una regola
   a tre classi (`.e-con .elementor-widget.elementor-widget`): il titolo della
   card restava attaccato al paragrafo. Per rimettere lo stacco voluto serve
   una specificita' piu' alta della sua, non basta la classe del componente. */
body .lir-punto .lir-punto__titolo.elementor-widget{margin-block-end:.4em}

body a.lir-punto--link .lir-punto__titolo{color:var(--inchiostro)}
body a.lir-punto--link:hover .lir-punto__titolo{color:var(--petrolio)}

body a.lir-tag{color:var(--inchiostro-tenue)}
body a.lir-filtro{color:var(--inchiostro-tenue)}
body a.lir-filtro--attivo{color:#fff}
body .lir-filtri button.lir-filtro{color:var(--inchiostro-tenue);cursor:pointer;font-family:var(--etichetta)}
body .lir-filtri button.lir-filtro--attivo{background:var(--petrolio);border-color:var(--petrolio);color:#fff}

body .lir-scheda h3 a,
body .lir-socio h3 a{color:inherit;text-decoration:none}
body .lir-scheda h3 a:hover,
body .lir-socio h3 a:hover{color:var(--petrolio)}
body .lir-scheda__cat{color:var(--petrolio)}

body .lir-briciole a{color:#9FB6BE}
body .lir-briciole a:hover{color:#fff}

body .lir-piede a{color:#CFDDE3;text-decoration:none}
body .lir-piede a:hover{color:#fff;text-decoration:underline}
/* Nella fascia bassa dati e link hanno lo stesso tono: il bianco solo in hover. */
body .lir-piede__bassa,
body .lir-piede__bassa a,
body .lir-piede__bassa .lir-revoca{color:var(--piede-bassa)}
body .lir-piede__bassa a:hover,
body .lir-piede__bassa .lir-revoca:hover{color:#fff}
/* Le icone social diventano scure sul fondo bianco: senza questa regola
   ereditano il bianco dei link del pie' di pagina e spariscono. */
body .lir-social a{color:#A9BDC5;text-decoration:none}
body .lir-social a:hover{
  color:var(--grafite);background:#fff;border-color:#fff;text-decoration:none;
}
body .lir-social a:hover svg{fill:var(--grafite)}

body .lir-drawer a{color:var(--inchiostro)}
body .lir-drawer ul ul a{color:var(--inchiostro-tenue)}
body .lir-drawer a.lir-portale-btn{color:#fff}
body .lir-drawer__recapiti a{color:var(--petrolio)}

body .lir-cookie p a{color:#CFDDE3}
body .lir-cookie .lir-btn--chiaro{color:var(--grafite)}
body .lir-cookie .lir-btn--fantasma{color:#fff}

body .lir-firma a{color:var(--petrolio)}
body .lir-portale .lir-btn--chiaro{color:var(--grafite)}
body .lir-mappa__consenso a{color:var(--petrolio)}

/* Il pulsante testuale delle preferenze cookie non e' un pulsante grafico */
body button.lir-revoca{
  background:none;border:0;padding:0;font:inherit;color:var(--piede-bassa);
  text-decoration:none;cursor:pointer;border-radius:0;
}
body button.lir-revoca:hover{color:#fff;background:none;text-decoration:underline}

/* ---------------------------------------------------------------------
   Componenti del tema: fondi, bordi e titoli su fondo scuro.
   Il kit di Elementor definisce uno stile globale per <button> e per i
   titoli: queste regole lo riportano al sistema grafico del sito.
   --------------------------------------------------------------------- */

/* Titoli su fondo scuro */
body .lir-hero h1, body .lir-hero h2, body .lir-scelta__nome,
body .lir-intestazione h1, body .lir-intestazione h2,
body .lir-cookie h2,
body .lir-portale h2, body .lir-portale h3,
body .lir-sezione--scura h2, body .lir-sezione--scura h3,
body .lir-sezione--petrolio h2, body .lir-sezione--petrolio h3,
body .lir-monogramma span{color:#fff}
body .lir-cookie h2{font-size:1.08rem}
body .lir-piede__col h3{color:var(--piede-etichetta);font-family:var(--etichetta);font-size:.76rem;letter-spacing:.15em;text-transform:uppercase;font-weight:600}
body .lir-piede__ragione{color:#fff}

/* Pulsanti del tema */
body a.lir-btn, body button.lir-btn{
  background:var(--petrolio);border:1px solid var(--petrolio);color:#fff;
  border-radius:var(--raggio-comando);
}
/* Il colore del testo va ripetuto anche in hover. Il kit globale di Elementor
   ha una regola `.elementor-kit-4 a:hover{color:...}` che con due classi e un
   tipo batte `.lir-btn:hover`: senza queste righe il testo del pulsante
   prendeva il petrolio scuro sul fondo petrolio scuro e spariva. */
body a.lir-btn:hover, body button.lir-btn:hover{background:var(--petrolio-scuro);border-color:var(--petrolio-scuro);color:#fff}
body a.lir-btn--vuoto, body button.lir-btn--vuoto{background:transparent;border-color:var(--linea);color:var(--petrolio)}
body a.lir-btn--vuoto:hover, body button.lir-btn--vuoto:hover{background:var(--petrolio-velo);border-color:var(--petrolio-chiaro);color:var(--petrolio-scuro)}
body a.lir-btn--chiaro, body button.lir-btn--chiaro{background:#fff;border-color:#fff;color:var(--grafite)}
body a.lir-btn--chiaro:hover, body button.lir-btn--chiaro:hover{background:var(--carta);border-color:var(--carta);color:var(--grafite)}
body a.lir-btn--fantasma, body button.lir-btn--fantasma{background:transparent;border-color:rgba(255,255,255,.38);color:#fff}
body a.lir-btn--fantasma:hover, body button.lir-btn--fantasma:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
body a.lir-portale-btn{background:var(--petrolio);border-radius:var(--raggio-comando)}
body a.lir-portale-btn:hover{background:var(--petrolio-scuro);color:#fff}

/* Pulsanti di servizio */
body button.lir-hamburger{background:#fff;border:1px solid var(--linea);border-radius:var(--raggio-comando);padding:0}
body button.lir-drawer__chiudi{background:#fff;border:1px solid var(--linea);border-radius:var(--raggio-comando);color:var(--inchiostro)}
body .lir-filtri button.lir-filtro{background:#fff;border:1px solid var(--linea);border-radius:var(--raggio-segno);padding:.55em .95em}
body .lir-filtri button.lir-filtro:hover{border-color:var(--petrolio-chiaro);color:var(--petrolio)}
body .lir-filtri button.lir-filtro--attivo{background:var(--petrolio);border-color:var(--petrolio);color:#fff}

/* =====================================================================
   Schermi piccoli
   ===================================================================== */

@media (max-width:1079px){
  .lir-testata__principale .lir-gabbia{min-height:68px;gap:12px}
  .lir-marchio img{width:clamp(148px,42vw,210px)}
  .lir-portale-btn{padding:.6em .8em}
  .lir-portale-btn b{font-size:.88rem}
  .lir-portale-btn small{display:none}
  .lir-drawer .lir-portale-btn small{display:block}
}

@media (max-width:719px){
  .lir-testata__servizio{font-size:.78rem}
  .lir-testata__servizio .lir-gabbia{min-height:36px;gap:6px 14px}
  .lir-recapiti{gap:6px 14px}
  .lir-recapiti li:nth-child(3){display:none}
  .lir-portale-btn b span{display:none}
}

@media (max-width:520px){
  /* Qui il testo del pulsante veniva sostituito con "Area clienti" scritto
     nel CSS: in inglese e rumeno usciva l'italiano. Basta il corpo ridotto. */
  .lir-portale-btn b{font-size:.86rem}
  .lir-hero .lir-gabbia{padding-block:44px 52px}
  .lir-piede__dati dt{width:44px}
  .lir-cookie .lir-gabbia{padding-block:18px}
  .lir-cookie__azioni .lir-btn{flex:1 1 auto;justify-content:center}
}

/* Niente scorrimento orizzontale, mai */
html,body{max-width:100%;overflow-x:clip}
.lir-corpo img,.lir-corpo iframe{max-width:100%}

/* L'elenco tecnico non eredita il rientro degli elenchi di testo */
.lir-testo-lungo ul.lir-elenco,
.lir-articolo__corpo ul.lir-elenco,
.lir-scheda-socio__testo ul.lir-elenco{padding-left:0;list-style:none;margin-left:0}
/* Senza questo le voci si portano dietro il margine degli elenchi di testo e
   i filetti fra le righe diventano fasce spesse. */
.lir-testo-lungo .lir-elenco li,
.lir-articolo__corpo .lir-elenco li,
.lir-scheda-socio__testo .lir-elenco li{margin:0}

/* La testata fissa non deve finire sotto la barra di amministrazione */
/* La barra di amministrazione e' fissa da 783px in su, sotto scorre via
   con la pagina: li' la testata deve ancorarsi al bordo dello schermo. */
.admin-bar .lir-testata--fissa{top:32px}
@media (max-width:782px){
  .admin-bar .lir-testata--fissa{top:0}
  .admin-bar .lir-drawer{top:0}
}

/* =====================================================================
   Blocchi a griglia costruiti con i contenitori di Elementor
   Stessa resa degli shortcode, ma ogni card è un contenitore e ogni testo
   un widget: si modificano cliccandoci sopra nell'editor.
   ===================================================================== */

/* I widget marcati .lir-el prendono forma dalla classe del sistema grafico
   che sta sul loro contenitore: l'elemento interno di Elementor eredita. */
.lir-el.elementor-widget-heading .elementor-heading-title,
.lir-el.elementor-widget-text-editor p{
  font:inherit;color:inherit;letter-spacing:inherit;line-height:inherit;margin:0;
}
.lir-el.elementor-widget-text-editor p + p{margin-top:.8em}
.lir-el svg{width:1em;height:1em;flex:none;display:inline-block;vertical-align:-.1em}

/* ---------------------------------------------------------------------
   Gabbia e ritmo verticale
   Elementor aggiunge a ogni contenitore un padding e un gap propri: senza
   questo blocco il sito avrebbe due margini di colonna diversi, uno per le
   sezioni costruite in Elementor e uno per le fasce disegnate dal tema.
   Qui li azzeriamo: il margine laterale lo dà solo .lir-gabbia, il respiro
   verticale solo .lir-sezione.
   --------------------------------------------------------------------- */

body .lir-sezione,
body .lir-gabbia,
body .lir-hero,
body .lir-fascia-portale,
body .lir-testa,
body .lir-testo-lungo,
body .lir-punti,
body .lir-numeri,
body .lir-mondi,
body .lir-articoli,
body .lir-soci,
body .lir-contatti,
body .lir-hero__scelte,
body .lir-blocchi{padding:0}

body .lir-sezione,
body .lir-gabbia,
body .lir-testa,
body .lir-testo-lungo{gap:0}

/* Elementor azzera anche i margini dei contenitori: rimettiamo quelli voluti */
body .lir-testa{margin-bottom:clamp(28px,3.5vw,46px)}
body .lir-hero__scelte{margin-top:clamp(26px,2.8vw,36px)}
body .lir-testa:last-child{margin-bottom:0}
body .lir-testa p:last-child{margin-bottom:0}
/* Una testata senza paragrafo di guida avrebbe 20px in piu' sotto, per via del
   margine del titolo: cosi' lo stacco dal blocco seguente e' sempre lo stesso. */
body .lir-testa > .elementor-widget:last-child .elementor-heading-title,
body .lir-testa > .elementor-widget:last-child p:last-child{margin-bottom:0}

body .lir-gabbia{
  width:100%;max-width:var(--gabbia);margin-inline:auto;
  padding-inline:var(--bordo-x);
}

/* Respiro verticale: mai sotto 70px su tablet e desktop, 50px su mobile. */
body .lir-sezione{padding-block:var(--ritmo)}

/* Due sezioni dello stesso tono di fondo: una sola spaziatura fra loro, non due
   sommate. Dove il fondo cambia il doppio stacco resta, perche' li' lo giustifica
   il salto di colore. */
/* Tutto sta sulla seconda sezione: azzera il proprio padding e con un margine
   negativo si tira su, cosi' lo stacco che resta e' --ritmo-cucito invece dei
   due ritmi sommati. Agire sul padding di quella sopra vorrebbe dire un :has
   dentro un :has, che non e' valido. */
body .lir-sezione:not(.lir-sezione--carta):not(.lir-sezione--tenue):not(.lir-sezione--scura):not(.lir-sezione--petrolio)
  + .lir-sezione:not(.lir-sezione--carta):not(.lir-sezione--tenue):not(.lir-sezione--scura):not(.lir-sezione--petrolio):not(:has(> * > .lir-testa:first-child)),
body .lir-sezione--carta + .lir-sezione--carta:not(:has(> * > .lir-testa:first-child)),
body .lir-sezione--tenue + .lir-sezione--tenue:not(:has(> * > .lir-testa:first-child)){
  padding-top:0;margin-top:calc(var(--ritmo-cucito) - var(--ritmo));
}

/* Dopo l'apertura della home le quattro cifre non aprono un discorso nuovo:
   sono la coda di quello sopra, e con il ritmo intero restavano staccate.
   Se invece la sezione che segue ha una testata, lo stacco resta pieno. */
body .lir-hero + .lir-sezione:not(:has(> * > .lir-testa:first-child)){padding-top:var(--ritmo-cucito)}

/* La fascia delle quattro cifre: stacco corto sopra, uno intero sotto. Sotto
   vale anche se la sezione seguente apre con una testata, che e' il caso sia
   in home sia in chi siamo. */
body .lir-sezione:has(> * > .lir-numeri:first-child) + .lir-sezione{padding-top:0;margin-top:0}
body .lir-hero .lir-gabbia{padding-block:var(--ritmo)}
body .lir-portale .lir-gabbia{padding-block:var(--ritmo-stretto)}
body .lir-intestazione .lir-gabbia{padding-block:0}

/* Le griglie, che Elementor renderebbe flex */
body .lir-numeri{
  display:grid;gap:clamp(14px,1.6vw,20px);grid-template-columns:repeat(2,1fr);
}
@media (min-width:960px){
  body .lir-numeri{grid-template-columns:repeat(4,1fr)}
}
body .lir-punti{
  display:grid;gap:clamp(30px,3.4vw,52px);
  grid-template-columns:repeat(auto-fit,minmax(232px,1fr));
}
body .lir-punti--rimandi{
  gap:clamp(18px,2.4vw,26px);
  grid-template-columns:repeat(auto-fit,minmax(248px,1fr));
}
body .lir-hero__scelte{display:grid;gap:14px}
@media (min-width:720px){
  body .lir-hero__scelte{grid-template-columns:1fr 1fr;max-width:760px}
}

/* Le card, che invece una spaziatura interna ce l'hanno per davvero */
body .lir-numeri__voce{
  display:block;background:var(--carta);border-radius:var(--raggio-scatola);
  padding:clamp(26px,2.6vw,34px) clamp(14px,1.6vw,22px);text-align:center;
}
body .lir-sezione--carta .lir-numeri__voce,
body .lir-sezione--tenue .lir-numeri__voce{background:#fff}

/* I punti di forza non sono scatole: il testo si allinea al titolo di sezione */
body .lir-punto{display:block;padding:0;gap:0;background:none}

/* I rimandi invece sono card cliccabili con il bordo a vista:
   si allinea il bordo, non il testo */
body a.lir-punto--link{
  display:flex;flex-direction:column;text-decoration:none;color:inherit;
  background:#fff;border:1px solid var(--linea-tenue);border-radius:var(--raggio-scatola);
  padding:clamp(24px,2.6vw,32px);box-shadow:var(--ombra);
}
body a.lir-punto--link .lir-punto__testo{display:flex;flex-direction:column;flex:1;gap:16px}
body a.lir-punto--link:hover{
  background:var(--petrolio-velo);border-color:var(--petrolio-chiaro);box-shadow:var(--ombra-alta);
}

body .lir-scelta{
  display:flex;flex-direction:column;gap:6px;padding:22px 24px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.14);
}
body a.lir-scelta:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.34)}

/* Campo esca anti-spam: fuori dallo schermo, non nascosto con display:none
   (i bot riconoscono display:none, e i lettori di schermo lo saltano per
   via di aria-hidden e tabindex) */
.lir-esca{
  position:absolute!important;left:-9999px;top:auto;
  width:1px;height:1px;overflow:hidden;
}

/* ---------------------------------------------------------------------
   Ritmo del testo lungo
   Dentro Elementor ogni paragrafo sta in un widget a sé e l'ultimo perde il
   margine inferiore: senza queste regole la fine di un testo resta attaccata
   al titolo o all'elenco che segue. Il passo di riferimento è quello fra due
   paragrafi dello stesso blocco, 20px.
   --------------------------------------------------------------------- */

body .lir-testo-lungo > .elementor-widget + .elementor-widget{margin-top:20px}
body .lir-testo-lungo > .elementor-widget + .elementor-widget-heading{margin-top:clamp(32px,3vw,46px)}
body .lir-testo-lungo > .elementor-widget-heading + .elementor-widget{margin-top:14px}
body .lir-testo-lungo .elementor-widget-heading .elementor-heading-title{margin-bottom:0}
body .lir-testo-lungo .elementor-widget-text-editor p:last-child{margin-bottom:0}
/* Dentro Elementor lo stacco sopra un elenco lo da' gia' .lir-testa (o il ritmo
   del testo lungo): il margine proprio dell'elenco si sommerebbe e basta. */
body .elementor-widget-shortcode .lir-elenco,
body .elementor-widget-shortcode .lir-faq,
body .elementor-widget-shortcode .lir-nota{margin-block:0}

/* Quando pero' sopra non c'e' la testata ma un altro blocco - un elenco seguito
   da una nota, per dire - lo stacco lo rimette il widget. */
body .lir-gabbia > .elementor-widget + .elementor-widget-shortcode{margin-top:clamp(24px,2.4vw,32px)}

/* Il chip attivo resta leggibile anche al passaggio del mouse: la regola
   generica di hover gli darebbe il petrolio del testo sul petrolio del fondo.
   Sta in fondo al foglio perche' deve vincere su quella. */
body .lir-filtri button.lir-filtro--attivo:hover,
body .lir-filtri a.lir-filtro--attivo:hover,
body a.lir-filtro--attivo:hover{
  background:var(--petrolio-scuro);border-color:var(--petrolio-scuro);color:#fff;
}

/* ---------------------------------------------------------------------
   Bersagli da toccare
   Su schermo tattile i recapiti e le voci in colonna restano righe di testo
   alte una ventina di pixel: sotto il minimo di 24px e scomodi da centrare.
   Il padding li alza senza cambiare la posizione del testo, perche' e'
   compensato da un margine negativo.
   --------------------------------------------------------------------- */
/* Nel menu a scomparsa le sigle delle lingue stanno dentro il blocco dei
   recapiti, che rende i collegamenti in linea: cosi' il bersaglio tornerebbe
   alto quanto il testo. */
.lir-drawer .lir-lingue a,
.lir-drawer .lir-lingue span{
  display:flex;align-items:center;justify-content:center;
  min-width:26px;min-height:26px;padding:4px 7px;
}

@media (pointer:coarse){
  .lir-recapiti a,
  .lir-drawer__recapiti a,
  .lir-piede__dati a,
  .lir-piede__col a,
  .lir-recapito__voce a,
  .lir-briciole a,
  .lir-articolo__meta a,
  .lir-scheda__meta a,
  .lir-scheda__piede a,
  .lir-piede__bassa a,
  .lir-anagrafica a,
  body button.lir-revoca{
    padding-block:4px;margin-block:-4px;
  }
  /* Il logo e' largo ma alto quanto il lettering: da toccare resta sottile. */
  .lir-marchio{display:flex;align-items:center;min-height:28px}
}

/* =====================================================================
   Fotografie in home: due pubblici, perche' noi, domande frequenti
   (stack/seed/44-foto-home.php). Stessa correzione di colore del resto del sito.
   ===================================================================== */

/* Riquadro fotografico costruito con il widget Immagine di Elementor. Con il
   markup ottimizzato attivo il widget non ha piu' .elementor-widget-container:
   l'immagine e' figlia diretta, quindi il velo sta sul widget stesso. Non
   si usa .lir-foto perche' li' il velo sul widget e' spento apposta. */
body .lir-riquadro{
  position:relative;overflow:hidden;border-radius:var(--raggio-lastra);
  background:var(--petrolio-scuro);
}
body .lir-riquadro > .elementor-widget-container{height:100%}
body .lir-riquadro img{
  display:block;width:100%;height:100%;object-fit:cover;
  filter:var(--foto-colore);
}

/* 1. Due pubblici. La foto arriva al bordo della card: margini negativi pari
   al padding, e la card ritaglia (regola del progetto: figlio a filo del
   bordo con un fondo suo = si ritaglia il contenitore). Il filetto colorato
   passa da sopra la card a sotto la foto, dove separa immagine e testo. */
.lir-mondo{--pad:clamp(26px,3vw,36px);padding:var(--pad);overflow:hidden}
.lir-mondo:has(> .lir-mondo__foto){border-top:1px solid var(--linea-tenue)}
.lir-mondo__foto{
  position:relative;margin:calc(var(--pad) * -1) calc(var(--pad) * -1) var(--pad);
  aspect-ratio:16/7;overflow:hidden;background:var(--petrolio-scuro);
  border-bottom:3px solid var(--petrolio);
}
.lir-mondo--privati .lir-mondo__foto{border-bottom-color:var(--petrolio-chiaro)}
body .lir-mondo__foto img{
  display:block;width:100%;height:100%;object-fit:cover;
  filter:var(--foto-colore);
}
/* Stessa cosa sui rimandi di Elementor (home e Servizi in inglese e rumeno) */
body a.lir-punto--link:has(> .lir-rimando__foto){--pad:clamp(24px,2.6vw,32px);overflow:hidden}
/* Due regole di Elementor pesano piu' di una classe sola:
   .e-con>.elementor-widget fissa la larghezza al contenuto della card (la foto
   restava corta di 2 x padding a destra) e .e-con .elementor-widget.elementor-widget
   azzera il margine sotto (il titolo finiva attaccato alla foto), e
   .elementor.elementor .e-con > .elementor-widget, quattro classi, tiene il
   max-width al 100%. Da qui la catena lunga del selettore. */
body .elementor a.lir-punto--link > .lir-rimando__foto.elementor-widget.elementor-widget{
  /* Larghezza esplicita e flex:none: con la sola larghezza da allungamento
     aspect-ratio non si applica, e su telefono la foto restava alta 3px. */
  align-self:stretch;width:calc(100% + var(--pad) * 2);max-width:none;flex:none;
  margin:calc(var(--pad) * -1) calc(var(--pad) * -1) var(--pad);
  aspect-ratio:16/7;border-radius:0;border-bottom:3px solid var(--petrolio);
}
body .lir-rimando__foto img{filter:var(--foto-colore)}
body a.lir-punto--link:has(> .lir-rimando__foto) + a.lir-punto--link .lir-rimando__foto{border-bottom-color:var(--petrolio-chiaro)}
/* Il filetto sotto la foto fa gia' da segno d'apertura: la barretta sopra
   il titolo sarebbe il secondo, a un dito di distanza. */
body a.lir-punto--link:has(> .lir-rimando__foto) .lir-punto__titolo::before{display:none}

/* 2. Perche' noi: foto a sinistra alta quanto il testo, testata e punti a
   destra, i punti in due per due. Nei dati la foto e' il primo widget della
   gabbia; sotto i 960px scende fra testata e punti con `order`. */
/* .elementor-widget ripetuto per battere l'azzeramento dei margini di Elementor */
body .lir-gabbia > .lir-perche__foto.elementor-widget{order:1;aspect-ratio:16/9;margin-bottom:clamp(28px,3.5vw,46px)}
body .lir-gabbia:has(> .lir-perche__foto) > .lir-punti{order:2}
@media (min-width:960px){
  body .lir-gabbia:has(> .lir-perche__foto){
    display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
    column-gap:clamp(40px,5vw,72px);align-items:stretch;
  }
  body .lir-gabbia:has(> .lir-perche__foto) > *{grid-column:2}
  body .lir-gabbia > .lir-perche__foto.elementor-widget{
    grid-column:1;grid-row:1 / span 2;aspect-ratio:auto;margin-bottom:0;min-height:100%;
  }
  body .lir-gabbia:has(> .lir-perche__foto) > .lir-punti{
    grid-template-columns:1fr 1fr;gap:clamp(30px,3vw,44px) clamp(28px,3vw,44px);
  }
}

/* 3. Domande frequenti: testata e foto a sinistra, domande a destra. La
   foto e' l'ultimo widget della testata. */
body .lir-faq__foto{aspect-ratio:16/9;margin-top:clamp(22px,2.6vw,32px)}
@media (min-width:960px){
  body .lir-gabbia:has(> .lir-testa .lir-faq__foto){
    display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);
    column-gap:clamp(40px,5vw,80px);align-items:start;
  }
  body .lir-gabbia:has(> .lir-testa .lir-faq__foto) > .lir-testa{margin-bottom:0}
  body .lir-faq__foto{aspect-ratio:4/3}
}

/* Per le aziende, "Compreso nel servizio": foto verticale accanto a testata ed
   elenco. Nei dati sta fra testata ed elenco, che e' dove resta sotto i 960px;
   da 960px va nella colonna di destra, alta quanto le altre due insieme. Il
   ritaglio tiene la parte bassa dello scatto, dove stanno mano e telefono. */
body .lir-gabbia > .lir-compreso__foto.elementor-widget{aspect-ratio:16/9;margin-bottom:clamp(28px,3.5vw,46px)}
body .lir-compreso__foto img{object-position:50% 72%}
@media (min-width:960px){
  /* Righe: la prima (testata) alta quanto serve, l'altezza in piu' della foto
     va in fondo. Senza, la griglia la divideva fra le righe e fra testata ed
     elenco si apriva un vuoto di quasi 200px. */
  body .lir-gabbia:has(> .lir-compreso__foto){
    display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);grid-template-rows:auto 1fr;
    column-gap:clamp(40px,5vw,80px);align-items:start;
  }
  body .lir-gabbia:has(> .lir-compreso__foto):has(> .lir-nota){grid-template-rows:auto auto 1fr}
  body .lir-gabbia:has(> .lir-compreso__foto) > *{grid-column:1}
  body .lir-gabbia > .lir-compreso__foto.elementor-widget{
    grid-column:2;grid-row:1 / span 2;aspect-ratio:auto;align-self:stretch;min-height:100%;margin-bottom:0;
  }
  /* Per i privati sotto l'elenco c'e' anche una nota: la foto copre tre righe */
  body .lir-gabbia:has(> .lir-nota) > .lir-compreso__foto.elementor-widget{grid-row:1 / span 3}
}

/* =====================================================================
   Card nei modelli Loop di Elementor Pro (stack/seed/46-loop.php)
   Le card hanno le classi di sempre; qui c'e' solo quello che serve in
   piu' per il markup di Elementor: ogni testo e' un widget (lir-el eredita
   la tipografia dalla classe), i contenitori portano padding e gap propri
   da azzerare, e gli stacchi verticali sono padding e non margini, perche'
   Elementor azzera il margine sotto dei widget con tre classi.
   ===================================================================== */

/* La griglia la fa Loop Grid (colonne e spazi nelle sue impostazioni): la
   classe sul widget serve solo al posizionamento, non deve rifare la griglia. */
body .elementor-widget-loop-grid.lir-articoli,
body .elementor-widget-loop-grid.lir-soci,
body .elementor-widget-loop-grid.lir-persone{display:block;gap:0;grid-template-columns:none;margin:0;padding:0}

body .e-loop-item > .lir-scheda.e-con,
body .e-loop-item > .lir-socio.e-con,
body .e-loop-item > .lir-persona.e-con{padding:0;gap:0}

/* -- Articolo -- */
body .lir-scheda__img a{display:block;height:100%}
body .lir-scheda__corpo.e-con{padding:20px 22px 24px;gap:0;flex:1}
body .lir-scheda__meta.e-con{flex-direction:row;flex-wrap:wrap;align-items:center;gap:.55em;padding:0 0 12px;margin:0}
body .lir-scheda__meta > .elementor-widget{width:auto}
body .lir-scheda__cat a{color:var(--petrolio);text-decoration:none}
body .lir-scheda__cat a:hover{text-decoration:underline}
.lir-scheda__data::before{content:"·";margin-right:.55em}
.lir-scheda__titolo{
  font-family:var(--titolo);font-weight:600;font-size:1.14rem;line-height:1.3;
  color:var(--inchiostro);padding-bottom:.45em;
}
body .lir-scheda__titolo a{color:inherit;text-decoration:none}
body .lir-scheda__titolo a:hover{color:var(--petrolio)}
/* Taglio a quattro righe con i puntini: il taglio a parole di Pro non li
   mette, e a parita' di parole le card uscivano di altezze diverse. */
.lir-scheda__estratto{font-size:.94rem;line-height:1.6;color:var(--inchiostro-tenue);padding-bottom:1em}
.lir-scheda__estratto p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;overflow:hidden}
/* La freccia della card piu' corta resta in basso come le altre */
/* Il colore sta sul widget e non sul collegamento: Elementor forza
   color:inherit sui collegamenti dentro i titoli con tre classi. */
body .lir-scheda .lir-scheda__leggi{margin-top:auto;padding-top:12px;font-size:.87rem;color:var(--petrolio)}
body .lir-scheda .lir-scheda__leggi:hover{color:var(--petrolio-scuro)}
body .lir-scheda__leggi a{
  display:inline-flex;align-items:center;gap:.45em;font-weight:600;text-decoration:none;
  border-bottom:1px solid currentColor;padding-bottom:1px;
}
body .lir-scheda__leggi a::after{
  content:"";width:.9em;height:.9em;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform var(--transizione);
}
body .lir-scheda__leggi a:hover::after{transform:translateX(3px)}

/* -- Socio: stessa griglia della card di prima, con i widget come celle -- */
body .e-loop-item > .lir-socio.e-con{display:grid;grid-template-rows:auto 1fr}
.lir-socio > .elementor-widget-lir_ritratto{grid-area:1/1}
.lir-socio > .lir-socio__corpo{grid-area:2/1}
body .lir-socio__corpo.e-con{padding:18px 18px 22px;gap:0}
.lir-socio > .elementor-widget-lir_competenze{grid-area:1/1;z-index:1;display:grid}
.lir-socio > .elementor-widget-lir_competenze > .elementor-widget-container{display:grid}
@media (hover:none){.lir-socio > .elementor-widget-lir_competenze{grid-area:3/1}}
body .lir-socio .lir-socio__ruolo{padding-bottom:8px;margin:0}
.lir-socio__nome{
  font-family:var(--titolo);font-weight:600;font-size:1.1rem;line-height:1.25;
  letter-spacing:-.005em;color:var(--inchiostro);padding-bottom:.3em;
}
body .lir-socio__nome a{color:inherit;text-decoration:none}
body .lir-socio__nome a:hover{color:var(--petrolio)}
body .lir-socio .lir-socio__sintesi{padding-bottom:14px;margin:0}

/* -- Persona (striscia in home): tutta la card e' il collegamento -- */
body .e-loop-item > a.lir-persona.e-con{display:block;text-decoration:none;color:var(--inchiostro)}
body a.lir-persona:hover .lir-persona__nome{color:var(--petrolio)}
body a.lir-persona:hover .lir-persona__ritratto{transform:translateY(-2px)}

/* -- Filtro per competenza di Pro, con l'aspetto dei filtri del sito -- */
body .lir-filtri.elementor-widget-taxonomy-filter{display:block}
body .lir-filtri .e-filter{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start}
body .lir-filtri .e-filter-item{
  font-family:var(--etichetta);font-weight:600;font-size:.81rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.55em .95em;border:1px solid var(--linea);border-radius:var(--raggio-segno);
  color:var(--inchiostro-tenue);background:#fff;cursor:pointer;line-height:1.3;
  transition:all var(--transizione);
}
body .lir-filtri .e-filter-item:hover{border-color:var(--petrolio-chiaro);color:var(--petrolio);background:#fff}
body .lir-filtri .e-filter-item[aria-pressed="true"]{background:var(--petrolio);border-color:var(--petrolio);color:#fff}
body .lir-filtri .e-filter-item[aria-pressed="true"]:hover{background:var(--petrolio-scuro);color:#fff}

/* =====================================================================
   Blocchi come modelli salvati e widget (stack/seed/47-modelli-blocchi.php)
   ===================================================================== */

/* -- Recapiti dello studio -- */
body .lir-contatti.e-con{display:grid;padding:0;gap:clamp(20px,3vw,34px)}
@media (min-width:860px){body .lir-contatti.e-con{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}
body .lir-recapito.e-con{display:grid;gap:18px;padding:0;align-content:start}
/* Ogni voce e' rientrata della larghezza dell'icona; l'icona la disegna
   l'etichetta, perche' i contenitori di Elementor usano il proprio ::before
   per lo sfondo. */
body .lir-recapito__voce.e-con{display:block;padding:0 0 0 32px;position:relative}
.lir-recapito__voce .lir-recapito__et{position:relative;margin:0;padding-bottom:3px}
.lir-recapito__voce .lir-recapito__et::before{
  content:"";position:absolute;left:-32px;top:1px;width:18px;height:18px;background:var(--petrolio);
  -webkit-mask:var(--icona) center/contain no-repeat;mask:var(--icona) center/contain no-repeat;
}
.lir-ico--luogo{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7z' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3Ccircle cx='12' cy='9' r='2.5' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E")}
.lir-ico--telefono{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a13.5 13.5 0 0 0 5.6 5.6l1.9-1.9a1 1 0 0 1 1-.24 11 11 0 0 0 3.5.56 1 1 0 0 1 1 1V19a1 1 0 0 1-1 1A16 16 0 0 1 3 4a1 1 0 0 1 1-1h3.2a1 1 0 0 1 1 1 11 11 0 0 0 .56 3.5 1 1 0 0 1-.25 1z'/%3E%3C/svg%3E")}
.lir-ico--posta{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h18v14H3z' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3Cpath d='m3.5 6 8.5 6 8.5-6' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E")}
.lir-ico--orologio{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3Cpath d='M12 7v5.2l3.4 2' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E")}
.lir-recapito__valore{display:block;font-weight:600;font-size:1.02rem;line-height:1.6;color:var(--inchiostro)}
.lir-recapito__riga{display:block;line-height:1.6;color:var(--inchiostro)}
body .lir-recapito__voce .lir-recapito__link{color:var(--petrolio)}
body .lir-recapito__link a{text-decoration:none}
body .lir-recapito__link a:hover{text-decoration:underline}
body .lir-recapito__voce .lir-recapito__pec{line-height:1.5}

/* -- Fascia Area clienti -- */
body .lir-portale.e-con{padding:0;gap:0;display:block}
body .lir-portale .lir-gabbia.e-con{gap:26px}
body .lir-portale__testi.e-con{padding:0;gap:0;display:block}
.lir-portale__titolo{
  font-family:var(--titolo);font-weight:600;line-height:1.14;letter-spacing:-.018em;
  font-size:clamp(1.45rem,1.2rem + 1vw,2rem);color:#fff;padding-bottom:.3em;
}
.lir-portale__testo{color:#CBE0E8;line-height:1.6}
/* 56 caratteri come nella fascia di prima (473px a 1440). Il max-width sta
   sul widget, e .elementor.elementor .e-con > .elementor-widget, quattro
   classi, lo riportava al 100%: il testo si stendeva per 936px. */
body .elementor .lir-portale__testi > .lir-portale__testo.elementor-widget.elementor-widget{max-width:56ch}
body .lir-portale__voci .lir-portale__elenco{margin:16px 0 0}
body .lir-portale__azione .elementor-button{
  background:#fff;color:var(--grafite);border:1px solid #fff;display:inline-flex;align-items:center;gap:.6em;
}
body .lir-portale__azione .elementor-button:hover,
body .lir-portale__azione .elementor-button:focus{background:var(--carta);border-color:var(--carta);color:var(--grafite)}
body .lir-portale__azione .elementor-button-content-wrapper::after{
  content:"";width:1em;height:1em;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 13v6H5V6h6' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 13v6H5V6h6' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") center/contain no-repeat;
}
body .lir-portale__azione .elementor-button-content-wrapper{display:inline-flex;align-items:center;gap:.6em}
/* L'icona del portale ha il segno da 4 a 20.8 su 24: a destra restano 3,2
   unita' vuote (circa 2px). Il margine le recupera, cosi' il segno sta alla
   stessa distanza dal bordo dell'inizio del testo. */
body .lir-portale__azione .elementor-button-content-wrapper::after{margin-right:-.13em}

/* -- Fotografia con didascalia: widget Immagine di Elementor --
   Il velo petrolio deve coprire la foto e non la didascalia: figura a
   griglia, foto e velo nella stessa cella, didascalia nella riga sotto. */
body .lir-foto.elementor-widget-image{overflow:visible;border-radius:0}
body .lir-foto figure.wp-caption{display:grid;margin:0;max-width:none;text-align:left}
body .lir-foto figure.wp-caption > img{grid-area:1/1;border-radius:var(--raggio-lastra)}
body .lir-foto figure.wp-caption > img{width:100%;height:auto}
body .lir-foto figure.wp-caption > figcaption{
  grid-area:2/1;text-align:left;font-style:normal;font-size:.86rem;line-height:1.5;color:var(--inchiostro-tenue);
  margin-top:12px;padding-left:12px;border-left:2px solid var(--linea);max-width:60ch;
}

/* -- Linea del tempo in contenitori: la riga e' uno sfondo del contenitore
   e il pallino sta sull'anno, non sui ::before dei contenitori -- */
body .lir-tappe.e-con{
  display:grid;gap:clamp(26px,3vw,38px);padding:0;max-width:var(--gabbia-stretta);
  background:linear-gradient(var(--linea),var(--linea)) no-repeat 0 .6em / 1px calc(100% - 1.2em);
}
body .lir-tappa.e-con{--rientro:clamp(26px,4vw,52px);display:block;padding:0 0 0 var(--rientro)}
.lir-tappa .lir-tappa__anno{position:relative;padding-bottom:6px}
.lir-tappa .lir-tappa__anno::before{
  content:"";position:absolute;left:calc(var(--rientro) * -1 - 3px);top:.55em;width:7px;height:7px;
  background:var(--petrolio);border-radius:50%;
}
.lir-tappa--ora .lir-tappa__anno::before{
  width:11px;height:11px;left:calc(var(--rientro) * -1 - 5px);top:.45em;box-shadow:0 0 0 4px var(--petrolio-velo);
}
.lir-tappa .lir-tappa__titolo{padding-bottom:.35em}

/* =====================================================================
   Theme Builder: testata, piede, articolo, scheda socio, elenco news
   (stack/seed/48-theme-builder.php)
   I modelli usano le classi di sempre; qui ci sono le correzioni per i
   contenitori di Elementor, che di loro vanno in colonna e hanno padding e
   gap propri, e per i testi, che sono widget titolo con lir-el.
   ===================================================================== */

/* Contenitori che fanno solo da involucro */
body .lir-tb-fascia.e-con{padding:0;gap:0;display:block}

/* -- Testata --------------------------------------------------------- */
/* Lo sticky va sull'involucro di Elementor, che e' figlio del body: sulla
   testata interna non avrebbe spazio per scorrere. */
.elementor-location-header{position:sticky;top:0;z-index:200}
.admin-bar .elementor-location-header{top:32px}
@media (max-width:782px){.admin-bar .elementor-location-header{top:0}}

body .lir-testata.e-con,
body .lir-testata__servizio.e-con,
body .lir-testata__principale.e-con{padding:0;gap:0;display:block}
body .lir-testata .lir-gabbia.e-con{flex-direction:row;flex-wrap:nowrap;align-items:center}
body .lir-testata__servizio .lir-gabbia.e-con{justify-content:space-between;flex-wrap:wrap;gap:18px;min-height:40px}
body .lir-testata__principale .lir-gabbia.e-con{gap:clamp(16px,3vw,40px);min-height:82px}
body .lir-testata .e-con > .elementor-widget{width:auto;flex:0 1 auto}

body .lir-recapiti.e-con{flex-direction:row;align-items:center;gap:20px;flex-wrap:wrap;padding:0;width:auto}
.lir-recapiti__voce{display:flex;align-items:center;gap:.45em;color:#CFDDE3}
.lir-recapiti__voce:hover{color:#fff}
.lir-recapiti__voce.lir-dato{font-size:.8rem}
body .lir-recapiti__voce a{text-decoration:none}
.lir-recapiti__voce.lir-ico--telefono::before,
.lir-recapiti__voce.lir-ico--posta::before{
  content:"";width:14px;height:14px;flex:none;background:currentColor;opacity:.75;
  -webkit-mask:var(--icona) center/contain no-repeat;mask:var(--icona) center/contain no-repeat;
}

body .lir-testata__azioni.e-con{flex-direction:row;align-items:center;gap:10px;margin-left:auto;padding:0;width:auto;flex:none}
body a.lir-portale-btn.e-con{
  padding:.56em 1.15em;gap:0;width:auto;flex:none;align-items:center;justify-content:center;
  background:var(--petrolio);color:#fff;border-radius:var(--raggio-comando);line-height:1.15;text-decoration:none;
}
body a.lir-portale-btn.e-con:hover{background:var(--petrolio-scuro);color:#fff}
.lir-portale-btn__et{font-size:.95rem;font-weight:600;display:flex;align-items:center;gap:.45em;color:#fff;white-space:nowrap}
.lir-portale-btn__et::after{
  content:"";width:1em;height:1em;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 13v6H5V6h6' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 13v6H5V6h6' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") center/contain no-repeat;
}
.lir-portale-btn__sotto{
  font-family:var(--etichetta);font-weight:600;font-size:.69rem;letter-spacing:.08em;
  text-transform:uppercase;opacity:.8;padding-top:2px;color:#fff;white-space:nowrap;
}
@media (max-width:1079px){
  body .lir-testata__principale .lir-gabbia.e-con{min-height:68px;gap:12px}
  body a.lir-portale-btn.e-con{padding:.6em .8em}
  .lir-portale-btn__et{font-size:.88rem}
  .lir-portale-btn__sotto{display:none}
}
@media (max-width:719px){
  body .lir-testata__servizio .lir-gabbia.e-con{min-height:36px;gap:6px 14px}
  body .lir-recapiti.e-con{gap:6px 14px}
  .lir-recapiti > .elementor-widget:nth-child(3){display:none}
}

/* -- Piede ----------------------------------------------------------- */
body .lir-piede.e-con,
body .lir-piede .lir-gabbia.e-con,
body .lir-piede__marchio.e-con,
body .lir-piede__col.e-con{padding:0;gap:0;display:block}
body .lir-piede .lir-gabbia.e-con{padding-inline:var(--bordo-x)}
body .lir-piede__alta.e-con{display:grid;gap:clamp(34px,5vw,60px);padding:max(var(--ritmo-stretto),50px) 0}
@media (min-width:900px){body .lir-piede__alta.e-con{grid-template-columns:minmax(0,1.05fr) minmax(0,1.25fr)}}
body .lir-piede__logo a{display:block;line-height:0;width:max-content;max-width:100%}
body .lir-piede__dati.e-con{display:grid;gap:7px;margin:14px 0 0;padding:0}
body .lir-piede__riga.e-con{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:.6em;padding:0}
.lir-piede__riga > .elementor-widget{width:auto}
.lir-piede__dt{
  flex:none;width:52px;font-family:var(--etichetta);font-weight:600;font-size:.75rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--piede-etichetta);padding-top:.15em;
}
@media (max-width:520px){.lir-piede__dt{width:44px}}
/* Icone al posto delle etichette Sede, Tel, Email, PEC (14/10/2026).
   La parola resta nella pagina per i lettori di schermo (stessa tecnica di
   .lir-sr) e al suo posto si vede l'icona, scelta con una classe sul widget:
   lir-icona-luogo, -telefono, -posta, -pec. Il primo rigo del valore e
   l'icona sono allineati a occhio con il margine in alto. */
body .lir-piede__dt[class*="lir-icona-"]{
  width:18px;height:18px;padding:0;align-self:flex-start;margin-top:.22em;position:relative;
}
body .lir-piede__dt[class*="lir-icona-"]::before{
  content:"";position:absolute;inset:0;background:var(--piede-etichetta);
  -webkit-mask:var(--icona) center/contain no-repeat;
          mask:var(--icona) center/contain no-repeat;
}
body .lir-piede__dt[class*="lir-icona-"] .elementor-heading-title{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.lir-icona-luogo{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6.5-6.2-6.5-11.2a6.5 6.5 0 0 1 13 0C18.5 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.8' r='2.4'/%3E%3C/svg%3E")}
.lir-icona-telefono{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.2 3.8 9.6 4l1.3 4.1-2.2 1.6a12.4 12.4 0 0 0 5.6 5.6l1.6-2.2 4.1 1.3.2 2.4a2 2 0 0 1-2 2.2A15.4 15.4 0 0 1 3.8 5.8a2 2 0 0 1 2.2-2z'/%3E%3C/svg%3E")}
.lir-icona-posta{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5.5' width='18' height='13' rx='1.5'/%3E%3Cpath d='m3.6 6.6 8.4 6.4 8.4-6.4'/%3E%3C/svg%3E")}
.lir-icona-pec{--icona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.5 18.5H4.5A1.5 1.5 0 0 1 3 17V7a1.5 1.5 0 0 1 1.5-1.5h15A1.5 1.5 0 0 1 21 7v5'/%3E%3Cpath d='m3.6 6.6 8.4 6.4 8.4-6.4'/%3E%3Ccircle cx='18' cy='17.5' r='3.5'/%3E%3Cpath d='m16.5 17.5 1.1 1.1 2-2.1'/%3E%3C/svg%3E")}
.lir-piede__dd{color:#A9BDC5}
body .lir-piede__dd:has(a){color:#CFDDE3}
body .lir-piede__dd:has(a):hover{color:#fff}
body .lir-piede__dd a:hover{text-decoration:underline}
.lir-piede__dd--segue{margin-left:-.25em}
.lir-piede__dd--segue::before{content:"·";margin-right:.35em;color:#A9BDC5}
.lir-piede__pec{overflow-wrap:anywhere}
body .lir-piede__menu.e-con{display:grid;gap:26px 32px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));padding:0}
.lir-piede__titolo{
  font-family:var(--etichetta);font-size:.76rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--piede-etichetta);font-weight:600;line-height:1.3;padding-bottom:12px;
}
.lir-piede__titolo--spazio{padding-top:22px}
.lir-piede__voce{font-size:.93rem;line-height:1.5;color:#CFDDE3;padding-bottom:8px}
.lir-piede__voce:hover{color:#fff}
body .lir-piede__voce a:hover{text-decoration:underline}
.lir-piede__iscrizione{color:#8FA6AF;font-size:.8rem;line-height:1.6}
body .lir-piede__bassa.e-con{
  flex-direction:row;flex-wrap:wrap;gap:8px 20px;justify-content:center;align-items:center;
  padding:20px 0;border-top:1px solid rgba(255,255,255,.1);
}
.lir-piede__bassa > .elementor-widget{width:auto}
.lir-piede__legale{color:var(--piede-bassa);font-size:.83rem}
.lir-piede__legale:hover{color:#fff}
.lir-piede__legale.lir-dato{font-size:.8rem;letter-spacing:.02em}
.lir-piede__legale:hover .lir-revoca{color:#fff}
/* Credits (14/10/2026): solo la parola, con una freccia obliqua che dice
   "porta fuori dal sito"; il nome dell'agenzia sta nel title del
   collegamento (attributi personalizzati del link, in Elementor). */
.lir-piede__credits a::after{
  content:"";display:inline-block;width:.8em;height:.8em;margin-left:.3em;vertical-align:-.04em;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E") center/contain no-repeat;
}
/* Il punto fra le voci della fascia legale: prima era uno span, ora e'
   disegnato prima di ogni voce tranne la prima. */
.lir-piede__bassa > .elementor-widget + .elementor-widget{display:flex;align-items:center}
.lir-piede__bassa > .elementor-widget + .elementor-widget::before{content:"·";margin-right:20px;opacity:.4;color:var(--piede-bassa)}

/* -- Articolo -------------------------------------------------------- */
body .lir-articolo.e-con{padding:0;gap:0;display:block}
body .lir-articolo__meta.e-con{
  flex-direction:row;flex-wrap:wrap;align-items:center;gap:.6em 1.1em;padding:0 0 20px;margin:0 0 30px;
}
.lir-articolo__meta > .elementor-widget{width:auto}
body .lir-articolo__cat a{color:var(--petrolio);text-decoration:none}
.lir-firma__ruolo{font-size:.92rem;color:var(--inchiostro-tenue)}
body .lir-sezione .lir-testa > .lir-occhiello{padding-bottom:.85em;margin:0}
.lir-testa__titolo{
  font-family:var(--titolo);font-weight:600;line-height:1.14;letter-spacing:-.018em;
  font-size:clamp(1.65rem,1.2rem + 1.5vw,2.5rem);color:var(--inchiostro);
}

/* -- Scheda socio ---------------------------------------------------- */
body .lir-scheda-socio.e-con{display:grid;gap:clamp(28px,4vw,52px);padding:0}
@media (min-width:880px){body .lir-scheda-socio.e-con{grid-template-columns:minmax(0,300px) minmax(0,1fr);align-items:start}}
body .lir-scheda-socio__lato.e-con{display:grid;gap:22px;padding:0}
body .lir-scheda-socio__testo.e-con{display:block;padding:0}
.lir-socio__tag--scheda{padding-top:0}
body .lir-scheda-socio__testo .lir-scheda-socio__torna{padding-top:34px;color:var(--petrolio)}
body .lir-scheda-socio__torna a{
  display:inline-flex;align-items:center;gap:.45em;font-weight:600;text-decoration:none;
  border-bottom:1px solid currentColor;padding-bottom:1px;
}
body .lir-scheda-socio__torna a::after{
  content:"";width:.9em;height:.9em;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* -- Elenco news: paginazione di Loop Grid con l'aspetto di prima ----- */
body .lir-articoli .elementor-pagination{
  display:flex;gap:6px;justify-content:center;margin-top:clamp(34px,4vw,52px);flex-wrap:wrap;
}
body .lir-articoli .elementor-pagination .page-numbers{
  display:flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;margin:0;
  border:1px solid var(--linea);border-radius:var(--raggio-comando);text-decoration:none;
  font-family:var(--etichetta);font-size:.84rem;color:var(--inchiostro);
}
body .lir-articoli .elementor-pagination .current{background:var(--petrolio);border-color:var(--petrolio);color:#fff}
body .lir-articoli .e-loop-nothing-found-message{padding:44px 0;color:var(--inchiostro-tenue);border-top:1px solid var(--linea)}
/* Da schermo largo il pulsante del cassetto e' nascosto, ma il widget che lo
   contiene restava nel flusso e si prendeva il gap: il pulsante Area clienti
   finiva 10px piu' a sinistra del bordo di colonna. */
@media (min-width:1080px){body .lir-testata__azioni > .elementor-widget-lir_cassetto{display:none}}
.lir-anagrafica .lir-anagrafica__albo{font-size:.9rem}
/* Nei widget "Aree di competenza" e "Articoli firmati" il titolo e' il primo
   figlio del proprio contenitore, e la regola che toglie lo spazio sopra al
   primo titolo della colonna lo azzerava. */
body .lir-scheda-socio__testo .elementor-widget-lir_aree h2:first-child,
body .lir-scheda-socio__testo .elementor-widget-lir_firmati h2:first-child{margin-top:1.6em}
/* Sotto i 960px la gabbia torna una colonna flex di Elementor, e le foto di
   "Perche' noi" e delle FAQ risultavano alte 0px finche' l'immagine non era
   scaricata - e con altezza zero il caricamento differito non la scaricava
   mai. La larghezza data dall'allungamento flex non conta come definita per
   aspect-ratio: serve width:100% esplicito. A 900px sembrava funzionare solo
   perche' l'immagine era gia' in memoria e dava lei l'altezza. */
body .e-con > .lir-perche__foto.elementor-widget,
body .e-con > .lir-faq__foto.elementor-widget,
body .e-con > .lir-compreso__foto.elementor-widget{flex:none;width:100%}

/* =====================================================================
   Chi siamo (proposta C, stack/seed/50-chi-siamo.php)
   Capitoli con una composizione diversa ciascuno, barra dei capitoli
   ferma sotto la testata, una fotografia per capitolo.
   ===================================================================== */

/* -- Barra dei capitoli: e' il contenitore, figlio diretto della pagina, a
   restare fermo; cosi' ha tutta la pagina in cui scorrere. L'altezza della
   testata la misura site.js in --lir-testata-h. */
body .lir-capitoli-fascia.e-con{
  position:sticky;top:var(--lir-testata-h,124px);z-index:150;padding:0;gap:0;display:block;
  background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  border-bottom:1px solid var(--linea-tenue);
}
.lir-capitoli .lir-gabbia{display:flex;gap:clamp(18px,3vw,32px);overflow-x:auto;scrollbar-width:none}
.lir-capitoli .lir-gabbia::-webkit-scrollbar{display:none}
body .lir-capitoli a{
  flex:none;display:flex;gap:8px;align-items:baseline;padding:15px 0 13px;
  font-size:.9rem;font-weight:600;color:var(--inchiostro-tenue);text-decoration:none;
  border-bottom:2px solid transparent;transition:color var(--transizione),border-color var(--transizione);
}
.lir-capitoli a b{font-size:.74rem;letter-spacing:.1em;color:var(--linea);font-variant-numeric:tabular-nums}
body .lir-capitoli a:hover,body .lir-capitoli a.lir-capitoli__attivo{color:var(--inchiostro);border-bottom-color:var(--petrolio)}
.lir-capitoli a.lir-capitoli__attivo b{color:var(--petrolio)}
/* Saltando a un capitolo il titolo si ferma 36px sotto la barra. Il capitolo
   comincia con il padding della sezione (--ritmo), che va tolto; e lo
   scroll-padding-top generale della pagina va azzerato, perche' si somma
   allo scroll-margin: prima i due insieme lasciavano quasi 300px di vuoto. */
html:has(.lir-capitoli-fascia){scroll-padding-top:0}
.lir-cs-capitolo{scroll-margin-top:calc(var(--lir-testata-h,124px) + var(--lir-capitoli-h,50px) - var(--ritmo) + 36px)}

/* -- Apertura del testo: frase guida e scheda */
body .lir-cs-intro.e-con{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(30px,5vw,70px);padding:0;align-items:start}
.lir-cs-lead{font-size:clamp(1.2rem,1.02rem + .7vw,1.5rem);line-height:1.45;color:var(--inchiostro)}
.lir-cs-lead strong{font-weight:600}
body .lir-cs-scheda.e-con{display:block;padding:12px 0 0;border-top:3px solid var(--petrolio)}
body .lir-cs-scheda__riga.e-con{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--linea-tenue)}
.lir-cs-scheda__et{font-family:var(--etichetta);font-weight:600;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--inchiostro-tenue);padding-top:3px}
.lir-cs-scheda__val{font-weight:600;font-size:.95rem;line-height:1.45;font-variant-numeric:tabular-nums}

/* -- Elementi comuni dei capitoli */
body .lir-cs-num{padding-bottom:10px;margin:0}
.lir-cs-titolo{font-family:var(--titolo);font-weight:600;line-height:1.14;color:var(--inchiostro);font-size:clamp(1.65rem,1.2rem + 1.4vw,2.3rem);letter-spacing:-.018em;max-width:20ch;padding-bottom:22px;text-wrap:balance}
.lir-cs-testo{color:var(--inchiostro-tenue);max-width:64ch}
.lir-cs-testo p{margin:0 0 1.05em}
.lir-cs-testo p:last-child{margin-bottom:0}
.lir-cs-testo strong{color:var(--inchiostro);font-weight:600}
body .lir-cs-colonna.e-con{display:block;padding:0}
body .lir-riquadro.lir-cs-foto{border-radius:var(--raggio-lastra)}

/* -- 01: testo e foto verticale, poi i tre fondatori */
body .lir-cs-c1.e-con{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(30px,5vw,64px);padding:0;align-items:stretch}
body .lir-cs-c1 > .lir-cs-foto.elementor-widget{min-height:300px;width:100%;flex:none}
/* La foto non detta l'altezza: l'immagine e' assoluta, quindi la riga la
   decide la colonna del testo e la foto la riempie, senza vuoto sotto il testo
   (14/10/2026). Taglio ancorato in alto al centro: le tre strade che si
   uniscono stanno nella parte alta dello scatto. */
body .lir-cs-c1 > .lir-cs-foto.elementor-widget img{position:absolute;inset:0;object-position:50% 0}
body .lir-cs-fondatori.e-con{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:0;margin-top:clamp(36px,4vw,50px);border-top:2px solid var(--inchiostro)}
body .lir-cs-fondatore.e-con{display:block;padding:20px 22px 4px 0;border-right:1px solid var(--linea)}
body .lir-cs-fondatore.e-con + .lir-cs-fondatore.e-con{padding-left:22px}
body .lir-cs-fondatore.e-con:last-child{border-right:0}
.lir-cs-fondatore__anno{font-size:2.4rem;font-weight:300;letter-spacing:-.03em;color:var(--petrolio);line-height:1}
.lir-cs-fondatore__nome{font-weight:600;font-size:1.06rem;line-height:1.3;padding-top:10px}
.lir-cs-fondatore__testo{color:var(--inchiostro-tenue);font-size:.92rem;line-height:1.55;padding-top:6px}

/* -- Citazione: il testo sta su tinta piena, la foto accanto */
body .lir-cs-citazione.e-con{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;padding:0;background:var(--grafite);min-height:400px}
body .lir-cs-citazione__testo.e-con{display:flex;flex-direction:column;justify-content:center;padding:56px clamp(20px,5vw,72px);gap:0}
.lir-cs-citazione__frase{font-size:clamp(1.6rem,1.15rem + 1.5vw,2.45rem);font-weight:300;line-height:1.22;letter-spacing:-.015em;color:#fff;max-width:18ch}
.lir-cs-citazione__et{font-family:var(--etichetta);font-weight:600;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--petrolio-chiaro);padding-top:22px}
body .lir-cs-citazione > .lir-riquadro.elementor-widget{border-radius:0;width:100%;flex:none;min-height:400px}

/* -- 02: foto verticale e testo, poi il confronto in tabella */
body .lir-cs-c2.e-con{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(30px,5vw,64px);padding:0;align-items:stretch}
/* Come nel capitolo 01: l'altezza la decide il testo e la foto la riempie
   (14/10/2026). Il taglio tiene al centro la mano con la penna, che nello
   scatto sta fra il 26% e il 58% dell'altezza. */
body .lir-cs-c2 > .lir-cs-foto.elementor-widget{min-height:300px;width:100%;flex:none}
body .lir-cs-c2 > .lir-cs-foto.elementor-widget img{position:absolute;inset:0;object-position:50% 42%}
body .lir-cs-confronto.e-con{display:block;padding:0;margin-top:clamp(36px,4vw,46px);background:#fff;border-radius:var(--raggio-scatola);overflow:hidden;box-shadow:var(--ombra-alta)}
body .lir-cs-confronto__riga.e-con{display:grid;grid-template-columns:24% minmax(0,1fr) minmax(0,1fr);gap:0;padding:0;border-bottom:1px solid var(--linea-tenue)}
body .lir-cs-confronto__riga.e-con:last-child{border-bottom:0}
.lir-cs-confronto__riga > .elementor-widget{padding:15px 18px}
.lir-cs-confronto__voce{font-weight:600;font-size:.92rem;line-height:1.45}
.lir-cs-confronto__prima{color:var(--inchiostro-tenue);font-size:.92rem;line-height:1.45}
.lir-cs-confronto__dopo{color:var(--inchiostro);font-size:.92rem;line-height:1.45;background:#F8FBFC}
body .lir-cs-confronto__testa.e-con{background:var(--grafite);border-bottom:0}
.lir-cs-confronto__testa > .elementor-widget{font-family:var(--etichetta);font-weight:600;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#C3D2D8;background:none}
.lir-cs-confronto__testa > .lir-cs-confronto__dopo{background:var(--petrolio);color:#fff}

/* -- 03: foto larga sopra, titolo e testo affiancati, i soci */
/* La foto larga apre il capitolo 03: saltandoci dall'indice, su uno schermo
   basso occupava tutta la vista e il titolo restava sotto la piega. L'altezza
   ha un tetto legato all'altezza dello schermo, cosi' sotto la foto si vede
   sempre l'inizio del capitolo; il soggetto sta al centro e regge il taglio. */
body .lir-gabbia > .lir-cs-foto--larga.elementor-widget{aspect-ratio:21/8;max-height:max(220px,34vh);width:100%;flex:none;margin-bottom:clamp(34px,4vw,46px)}
body .lir-cs-c3.e-con{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,5vw,64px);padding:0}
body .elementor-widget-loop-grid.lir-cs-persone{margin-top:clamp(36px,4vw,46px)}
body .e-loop-item > a.lir-socio-breve.e-con{display:block;padding:0;text-decoration:none;color:var(--inchiostro)}
.lir-socio-breve .lir-scheda-socio__ritratto{border-radius:var(--raggio-scatola);margin-bottom:12px;transition:transform var(--transizione)}
body a.lir-socio-breve:hover .lir-scheda-socio__ritratto{transform:translateY(-2px)}
body a.lir-socio-breve:hover .lir-socio-breve__nome{color:var(--petrolio)}
.lir-socio-breve .lir-monogramma span{font-size:clamp(1.4rem,2.2vw,1.9rem)}
.lir-socio-breve__nome{font-weight:600;font-size:.98rem;line-height:1.3}
.lir-socio-breve__ruolo{font-family:var(--etichetta);font-weight:600;font-size:.69rem;letter-spacing:.1em;text-transform:uppercase;color:var(--inchiostro-tenue);padding-top:4px;line-height:1.4}
.lir-socio-breve__lingue{font-size:.84rem;color:var(--petrolio);padding-top:5px;line-height:1.4}

/* -- 04: la visura e la foto della sede */
body .lir-cs-c4.e-con{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(30px,5vw,64px);padding:0;align-items:stretch}
body .lir-cs-c4 > .lir-cs-foto.elementor-widget{min-height:380px;width:100%;flex:none}
.lir-visura{margin:0;background:#fff;border:1px solid var(--linea);border-radius:var(--raggio-scatola);padding:6px 22px}
.lir-visura div{display:flex;align-items:baseline;gap:10px;padding:12px 0;border-bottom:1px dashed var(--linea);font-size:.94rem}
.lir-visura div:last-child{border-bottom:0}
.lir-visura dt{color:var(--inchiostro-tenue);white-space:nowrap}
.lir-visura__guida{flex:1;min-width:16px;border-bottom:1px dotted var(--linea);transform:translateY(-4px)}
.lir-visura dd{margin:0;font-weight:600;text-align:right}
.lir-visura dd.lir-visura__pec{font-weight:500;font-size:.88rem;overflow-wrap:anywhere}

/* -- Schermi stretti: tutto in colonna */
@media (max-width:900px){
  body .lir-cs-intro.e-con,body .lir-cs-c1.e-con,body .lir-cs-c2.e-con,body .lir-cs-c3.e-con,
  body .lir-cs-c4.e-con,body .lir-cs-citazione.e-con{grid-template-columns:minmax(0,1fr)}
  body .lir-cs-c1 > .lir-cs-foto.elementor-widget,body .lir-cs-c4 > .lir-cs-foto.elementor-widget{min-height:0;aspect-ratio:4/3}
  body .lir-cs-c2 > .lir-cs-foto.elementor-widget{min-height:0;aspect-ratio:4/3}
  body .lir-cs-citazione > .lir-riquadro.elementor-widget{min-height:0;aspect-ratio:16/9}
  body .lir-gabbia > .lir-cs-foto--larga.elementor-widget{aspect-ratio:16/9}
  body .lir-cs-fondatori.e-con{grid-template-columns:minmax(0,1fr)}
  body .lir-cs-fondatore.e-con,body .lir-cs-fondatore.e-con + .lir-cs-fondatore.e-con{padding:16px 0;border-right:0;border-bottom:1px solid var(--linea)}
  body .lir-cs-confronto__riga.e-con{grid-template-columns:minmax(0,1fr)}
  body .lir-cs-confronto__testa.e-con{display:none}
  .lir-cs-confronto__riga > .elementor-widget{padding:10px 16px}
  .lir-cs-confronto__voce{padding-top:16px!important}
  .lir-cs-confronto__prima::before{content:attr(data-et);display:block;font-family:var(--etichetta);font-weight:600;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--inchiostro-tenue)}
  .lir-cs-confronto__dopo::before{content:attr(data-et);display:block;font-family:var(--etichetta);font-weight:600;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--petrolio)}
  .lir-visura div{flex-wrap:wrap}
  .lir-visura__guida{display:none}
  .lir-visura dd{text-align:left;width:100%}
}
/* Soci in inglese e rumeno: card statiche, senza collegamento (le schede
   esistono solo in italiano), con la stessa griglia del Loop Grid italiano. */
body .lir-cs-persone-statiche.e-con{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px 16px;padding:0;margin-top:clamp(36px,4vw,46px);
}
@media (max-width:1024px){body .lir-cs-persone-statiche.e-con{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:767px){body .lir-cs-persone-statiche.e-con{grid-template-columns:repeat(2,minmax(0,1fr))}}
body .lir-cs-persone-statiche > .lir-socio-breve.e-con{display:block;padding:0}

/* =====================================================================
   Mission e vision (stack/seed/51-mission-vision.php)
   Riusa le classi di Chi siamo (lir-cs-testo, lir-cs-foto, lir-cs-colonna).
   ===================================================================== */
body .lir-mv-mission.e-con{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(30px,5vw,64px);padding:0;align-items:stretch}
body .lir-mv-mission > .lir-mv-mission__foto.elementor-widget{min-height:480px;width:100%;flex:none}
.lir-mv-frase{font-size:clamp(1.5rem,1.12rem + 1.4vw,2.25rem);font-weight:300;line-height:1.28;letter-spacing:-.012em;color:var(--inchiostro);max-width:24ch;padding-bottom:32px}
.lir-mv-frase p{margin:0}
.lir-mv-frase strong{font-weight:600}
body .lir-mv-punto.e-con{display:block;padding:18px 0 0;margin-top:30px;border-top:2px solid var(--inchiostro);max-width:40ch}
.lir-mv-punto__et{font-family:var(--etichetta);font-weight:600;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--petrolio);padding-bottom:6px}
.lir-mv-punto__frase{font-size:1.1rem;font-weight:600;line-height:1.4;color:var(--inchiostro)}

body .lir-mv-vision.e-con{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;padding:0;background:var(--grafite);min-height:520px}
body .lir-mv-vision__testo.e-con{display:flex;flex-direction:column;justify-content:center;gap:0;padding:64px clamp(20px,5vw,72px)}
body .lir-mv-vision__testo .lir-occhiello{padding-bottom:14px;margin:0}
.lir-mv-vision__frase{font-size:clamp(1.6rem,1.2rem + 1.5vw,2.45rem);font-weight:300;line-height:1.2;letter-spacing:-.015em;color:#fff;max-width:18ch;padding-bottom:24px}
.lir-mv-vision__par{color:#B3C7CF;max-width:46ch;line-height:1.66}
.lir-mv-vision__par p{margin:0}
body .lir-mv-vision > .lir-riquadro.elementor-widget{border-radius:0;width:100%;flex:none;min-height:520px}

body .lir-mv-impegni.e-con{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:0}
body .lir-mv-impegno.e-con{
  display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto 1fr;gap:6px 22px;
  background:#fff;border-top:3px solid var(--petrolio);border-radius:var(--raggio-scatola);
  box-shadow:var(--ombra-alta);padding:28px 28px 30px;
}
.lir-mv-impegno > .lir-mv-impegno__num{grid-row:1/3}
.lir-mv-impegno__num{font-size:3.4rem;font-weight:200;line-height:.9;color:var(--petrolio);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.lir-mv-impegno__titolo{font-family:var(--titolo);font-weight:600;font-size:1.14rem;line-height:1.3;color:var(--inchiostro);align-self:end}
.lir-mv-impegno__testo{color:var(--inchiostro-tenue);font-size:.98rem;line-height:1.55}

@media (max-width:900px){
  body .lir-mv-mission.e-con,body .lir-mv-vision.e-con{grid-template-columns:minmax(0,1fr)}
  body .lir-mv-mission > .lir-mv-mission__foto.elementor-widget{min-height:0;aspect-ratio:4/3}
  body .lir-mv-vision > .lir-riquadro.elementor-widget{min-height:0;aspect-ratio:16/9}
  body .lir-mv-impegni.e-con{grid-template-columns:minmax(0,1fr)}
}

/* =====================================================================
   Pagine servizio (stack/seed/53-servizi.php): apertura con scheda,
   situazioni, fascia del dato
   ===================================================================== */

/* -- Apertura: frase principale a sinistra, scheda del servizio a destra */
body .lir-sv-apre.e-con{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(30px,5vw,72px);padding:0;align-items:start}
body .lir-sv-intro.e-con{display:block;padding:0}
.lir-sv-lead{font-size:clamp(1.35rem,1.05rem + 1.1vw,1.85rem);font-weight:300;line-height:1.34;letter-spacing:-.012em;color:var(--inchiostro);padding-bottom:24px}
.lir-sv-lead p{margin:0}
.lir-sv-lead strong{font-weight:600}
body .lir-sv-scheda.e-con{
  display:block;padding:6px clamp(20px,2.4vw,28px);background:#fff;
  border-top:3px solid var(--petrolio);border-radius:var(--raggio-scatola);box-shadow:var(--ombra-alta);
}
body .lir-sv-riga.e-con{display:block;padding:16px 0;border-bottom:1px solid var(--linea-tenue)}
body .lir-sv-riga.e-con:last-child{border-bottom:0}
.lir-sv-et{display:block;font-family:var(--etichetta);font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--inchiostro-tenue);padding-bottom:6px}
.lir-sv-val{font-size:.98rem;line-height:1.5;color:var(--inchiostro)}
.lir-sv-val p{margin:0}
body .lir-sv-val a{color:var(--petrolio-scuro);font-weight:600}

/* Chi segue la materia */
.lir-prof{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:12px}
.lir-prof__voce{display:flex;gap:14px;align-items:center}
.lir-prof__ritratto{position:relative;flex:none;width:48px;height:48px;border-radius:50%;overflow:hidden;background:var(--grafite)}
.lir-prof__ritratto img{width:100%;height:100%;object-fit:cover;display:block}
.lir-prof__ritratto .lir-monogramma{width:100%;height:100%;aspect-ratio:auto}
body .lir-prof__ritratto .lir-monogramma span{font-size:.92rem;letter-spacing:.04em}
.lir-prof__dati{display:flex;flex-direction:column;line-height:1.3}
body .lir-prof__nome{font-weight:600;color:var(--inchiostro);text-decoration:none}
body a.lir-prof__nome:hover{color:var(--petrolio);text-decoration:underline}
.lir-prof__ruolo{font-size:.86rem;color:var(--inchiostro-tenue)}

/* -- Situazioni. Una voce e' pulsante + pannello. Da 900px le voci si
   sciolgono (display:contents) in una griglia a due colonne: pulsanti a
   sinistra, uno per riga, e tutti i pannelli nella stessa cella a destra,
   alta quanto l'elenco; se ne vede uno, gli altri sono [hidden]. */
.lir-sit{border:1px solid var(--linea);border-radius:var(--raggio-scatola);background:#fff;box-shadow:var(--ombra-alta);overflow:hidden}
.lir-sit__voce + .lir-sit__voce{border-top:1px solid var(--linea-tenue)}
body .lir-sit__tab{
  all:unset;box-sizing:border-box;width:100%;cursor:pointer;
  display:flex;gap:14px;align-items:baseline;padding:18px clamp(18px,2.2vw,26px);
  font-family:var(--testo);font-size:1.02rem;font-weight:600;line-height:1.35;color:var(--inchiostro-tenue);
  transition:background-color var(--transizione),color var(--transizione);
}
body .lir-sit__tab:hover{color:var(--inchiostro);background:var(--tenue)}
body .lir-sit__tab:focus-visible{outline:2px solid var(--petrolio);outline-offset:-2px}
.lir-sit__num{flex:none;font-size:.74rem;letter-spacing:.1em;color:var(--linea);font-variant-numeric:tabular-nums}
.lir-sit__voce.is-aperta > .lir-sit__tab{color:var(--inchiostro);background:var(--carta);box-shadow:inset 3px 0 0 var(--petrolio)}
.lir-sit__voce.is-aperta .lir-sit__num{color:var(--petrolio)}
/* Su telefono: chevron, che vuol dire "si apre" */
.lir-sit__titolo{flex:1}
.lir-sit__tab::after{content:"";flex:none;width:8px;height:8px;margin-left:auto;border-right:1.5px solid var(--petrolio);border-bottom:1.5px solid var(--petrolio);transform:translateY(-3px) rotate(45deg);transition:transform var(--transizione)}
.lir-sit__voce.is-aperta > .lir-sit__tab::after{transform:translateY(1px) rotate(-135deg)}
.lir-sit__foto{position:relative;overflow:hidden;background:var(--petrolio-scuro);aspect-ratio:16/8}
.lir-sit__foto img{display:block;width:100%;height:100%;object-fit:cover;filter:var(--foto-colore)}
.lir-sit__corpo{padding:22px clamp(18px,2.6vw,32px) 28px}
.lir-sit__tema{display:block;font-family:var(--etichetta);font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--petrolio);padding-bottom:10px}
.lir-sit__testo{color:var(--inchiostro-tenue);line-height:1.66}
.lir-sit__testo p{margin:0 0 12px}
.lir-sit__testo > :last-child{margin-bottom:0}
.lir-sit__testo ul{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--linea-tenue)}
.lir-sit__testo li{position:relative;padding:9px 0 9px 20px;border-bottom:1px solid var(--linea-tenue);color:var(--inchiostro);font-size:.96rem;line-height:1.45}
.lir-sit__testo li::before{content:"";position:absolute;left:0;top:1.05em;width:6px;height:6px;background:var(--petrolio)}
@media (min-width:900px){
  .lir-sit{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:repeat(var(--n),auto) 1fr}
  .lir-sit__voce{display:contents}
  .lir-sit__voce + .lir-sit__voce{border-top:0}
  body .lir-sit__tab{grid-column:1;border-right:1px solid var(--linea);border-bottom:1px solid var(--linea-tenue);align-self:stretch}
  .lir-sit::after{content:"";grid-column:1;grid-row:calc(var(--n) + 1);border-right:1px solid var(--linea)}
  .lir-sit__tab::after{display:none}
  .lir-sit__pannello{grid-column:2;grid-row:1 / -1}
  .lir-sit__foto{aspect-ratio:16/7}
}

/* -- Il dato della pagina: fascia scura, numero grande e la foto accanto.
   Il testo parte dal bordo della gabbia, come il resto della pagina. */
body .lir-sv-dato.e-con{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;padding:0;background:var(--petrolio-scuro)}
body .lir-sv-dato__testo.e-con{
  display:flex;flex-direction:column;justify-content:center;gap:0;
  padding:clamp(48px,6vw,80px) clamp(28px,4vw,64px) clamp(48px,6vw,80px) max(var(--bordo-x),calc((100vw - 1220px) / 2 + var(--bordo-x)));
}
.lir-sv-dato__cifra{font-size:clamp(3rem,2rem + 4vw,5.4rem);font-weight:200;line-height:1;letter-spacing:-.035em;color:#fff;font-variant-numeric:tabular-nums;padding-bottom:18px}
.lir-sv-dato__frase{color:#C3D2D8;font-size:1.06rem;line-height:1.6;max-width:44ch}
.lir-sv-dato__fonte{font-family:var(--etichetta);font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#8FB3C1;padding-top:18px}
body .lir-sv-dato > .lir-riquadro.elementor-widget{border-radius:0;width:100%;flex:none;min-height:360px}

@media (max-width:959px){
  body .lir-sv-apre.e-con{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:900px){
  body .lir-sv-dato.e-con{grid-template-columns:minmax(0,1fr)}
  body .lir-sv-dato__testo.e-con{padding:48px var(--bordo-x)}
  body .lir-sv-dato > .lir-riquadro.elementor-widget{min-height:0;aspect-ratio:16/9}
}

/* =====================================================================
   Le quattro cifre della home (stack/seed/54-cifre-home.php), "riga aperta"
   dal 14/10/2026: niente scatola ne' ombra. La frase fa da titolo, a sinistra,
   con l'occhiello a destra sulla stessa riga e un filetto sotto; le cifre sono
   grandi, nel serif dei titoli, separate da filetti verticali. Il "+" e' un
   <small> nel titolo del widget: piu' piccolo e in petrolio chiaro.
   ===================================================================== */
/* Fascia colorata: respiro uguale sopra e sotto, piu' corto del ritmo pieno
   (e' un raccordo fra l'apertura e i servizi, non un capitolo). Il selettore
   ripete quello della regola "dopo l'apertura" per batterla. */
body .lir-sezione.lir-cifre-fascia,
body .lir-hero + .lir-sezione.lir-cifre-fascia:not(:has(> * > .lir-testa:first-child)){padding-block:clamp(44px,5vw,68px)}
body .lir-cifre.e-con{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(26px,3vw,38px);padding:0}

/* Testata: su mobile occhiello sopra e frase sotto; da tablet in su la frase
   va a sinistra e l'occhiello a destra, allineati sulla linea di base. */
body .lir-cifre__testa.e-con{
  display:flex;flex-direction:column;gap:8px;
  padding:0 0 18px;border-bottom:1px solid var(--linea);
}
body .lir-cifre__testa > .elementor-widget{width:auto;max-width:100%;margin:0}
body .lir-cifre__testa .lir-occhiello{display:block;margin:0}
body .lir-cifre__frase,
body .lir-cifre__frase .elementor-heading-title{
  font-family:var(--titolo);font-weight:600;font-size:clamp(1.35rem,1.1rem + .9vw,1.8rem);
  line-height:1.2;letter-spacing:-.01em;color:var(--inchiostro);max-width:none;margin:0;
}
@media (min-width:768px){
  body .lir-cifre__testa.e-con{flex-direction:row;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 32px}
  body .lir-cifre__testa.e-con > :first-child{order:2}
}

/* Le cifre: due colonne su mobile, quattro da 960px, divise da filetti. */
body .lir-cifre .lir-numeri{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 0;
  background:none;border-radius:0;box-shadow:none;overflow:visible;
}
body .lir-cifre .lir-numeri__voce{
  display:block;background:none;border-radius:0;text-align:left;
  padding:0 20px 0 0;border:0;
}
body .lir-cifre .lir-numeri__voce:nth-child(even){padding-left:20px;border-left:1px solid var(--linea)}
body .lir-cifre .lir-numeri__cifra{
  font-weight:600;letter-spacing:-.03em;font-size:clamp(2.6rem,1.8rem + 2.6vw,4rem);
  line-height:.95;color:var(--petrolio);font-variant-numeric:lining-nums;
}
body .lir-cifre .lir-numeri__cifra small{font-size:.55em;font-weight:inherit;letter-spacing:0;color:var(--petrolio-chiaro);margin-left:2px}
body .lir-cifre .lir-numeri__et{margin-top:10px;font-size:.93rem;line-height:1.45;color:var(--inchiostro-tenue);max-width:22ch}
@media (min-width:960px){
  body .lir-cifre .lir-numeri{grid-template-columns:repeat(4,minmax(0,1fr))}
  body .lir-cifre .lir-numeri__voce,
  body .lir-cifre .lir-numeri__voce:nth-child(even){padding:0 28px;border-left:1px solid var(--linea)}
  body .lir-cifre .lir-numeri__voce:first-child{padding-left:0;border-left:0}
}
/* =====================================================================
   "Due pubblici" in Elementor (stack/seed/57-due-pubblici.php): modello
   salvato con due card, l'elenco e' un Loop Grid con "Card - Servizio".
   Misure ricalcate su quelle del vecchio widget (.lir-mondo).
   ===================================================================== */
body .lir-dp.e-con{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(18px,2.5vw,26px);padding:0}
@media (min-width:860px){body .lir-dp.e-con{grid-template-columns:repeat(2,minmax(0,1fr))}}
body .lir-dp__card.e-con{
  display:flex;flex-direction:column;gap:0;padding:0;overflow:hidden;
  background:#fff;border:1px solid var(--linea-tenue);border-radius:var(--raggio-scatola);box-shadow:var(--ombra);
}
/* Foto a filo della card, filetto sotto (petrolio chiaro per i privati) */
body .lir-dp__card > .lir-dp__foto.elementor-widget{
  width:100%;flex:none;aspect-ratio:16/7;overflow:hidden;margin:0;
  background:var(--petrolio-scuro);border-bottom:3px solid var(--petrolio);
}
body .lir-dp__card--privati > .lir-dp__foto.elementor-widget{border-bottom-color:var(--petrolio-chiaro)}
body .lir-dp__foto img{display:block;width:100%;height:100%;object-fit:cover;filter:var(--foto-colore)}
body .lir-dp__corpo.e-con{display:flex;flex-direction:column;flex:1;gap:0;padding:clamp(26px,3vw,36px)}
body .lir-dp__corpo .lir-dp__occhiello{margin-bottom:6px}
.lir-dp__titolo{font-family:var(--titolo);font-weight:600;font-size:clamp(1.3rem,1.15rem + .5vw,1.6rem);line-height:1.2;color:var(--inchiostro);padding-bottom:.35em}
.lir-dp__testo{color:var(--inchiostro-tenue);line-height:1.66}
/* E' un widget Titolo, e i titoli bilanciano le righe: su un paragrafo di tre
   righe lo andava a capo a meta' colonna */
body .lir-dp__testo .elementor-heading-title{text-wrap:pretty}
/* L'elenco: righe separate da un filetto, numerate da un contatore */
body .lir-dp__elenco.elementor-widget{width:100%;padding:12px 0}
body .lir-dp__elenco .elementor-loop-container{counter-reset:lir-dp;gap:0}
body .lir-dp__elenco .e-loop-item{counter-increment:lir-dp}
body .lir-dp__elenco .e-loop-item + .e-loop-item{border-top:1px solid var(--linea-tenue)}
body .lir-dp-voce.e-con{
  display:flex;flex-direction:column;gap:2px;position:relative;
  padding:8px 4px 8px 36px;transition:background var(--transizione);
}
body .lir-dp-voce.e-con:hover{background:var(--petrolio-velo)}
.lir-dp-voce > .elementor-widget{position:static}
.lir-dp-voce__titolo{font-weight:600;font-size:1rem;line-height:1.4;color:var(--inchiostro)}
/* Il numero e' lo pseudo-elemento del titolo (quelli dei contenitori li usa
   Elementor per lo sfondo), posizionato sulla riga intera */
.lir-dp-voce__titolo::before{
  content:counter(lir-dp,decimal-leading-zero);position:absolute;left:4px;top:calc(8px + .3em);
  font-family:var(--etichetta);font-size:.72rem;font-weight:400;letter-spacing:.06em;color:var(--petrolio-chiaro);
}
/* Tutta la riga e' cliccabile: il collegamento del titolo si allarga alla riga */
/* Il colore va sul widget: Elementor forza color:inherit sul collegamento del titolo */
body .lir-dp-voce__titolo a{text-decoration:none}
body .lir-dp-voce__titolo a::after{content:"";position:absolute;inset:0}
body .lir-dp-voce:hover .lir-dp-voce__titolo{color:var(--petrolio)}
.lir-dp-voce__testo{font-size:.9rem;line-height:1.5;color:var(--inchiostro-tenue)}
/* Il pulsante in fondo, allineato fra le due card */
body .lir-dp__corpo .lir-dp__piede{margin-top:auto;font-size:1rem;color:var(--petrolio)}
body .lir-dp__corpo .lir-dp__piede:hover{color:var(--petrolio-scuro)}
body .lir-dp__piede a{
  display:inline-flex;align-items:center;gap:.45em;font-weight:600;text-decoration:none;
  border-bottom:1px solid currentColor;padding-bottom:1px;
}
body .lir-dp__piede a::after{
  content:"";width:.9em;height:.9em;flex:none;background:currentColor;transition:transform var(--transizione);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
}
body .lir-dp__piede a:hover::after{transform:translateX(3px)}

/* =====================================================================
   Parti del Theme Builder rifatte con widget di Elementor (01/10/2026):
   fascia del titolo, dati del socio, articoli firmati, icone social,
   articolo precedente e successivo. Le misure sono quelle delle versioni
   disegnate dal tema, che restano per le riserve PHP.
   ===================================================================== */

/* -- Fascia del titolo (modello salvato "Blocco - Fascia del titolo") */
body .lir-intestazione.e-con{display:block;gap:0;padding-inline:0;padding-block:var(--ritmo-stretto)}
/* Il widget della foto non deve fare da riferimento: la foto copre la fascia intera */
body .lir-intestazione > .elementor-widget-lir_fascia_foto{position:static;width:auto;max-width:none;margin:0}
body .lir-intestazione .lir-gabbia.e-con{display:block;gap:0}
.lir-intestazione__titolo{
  font-family:var(--titolo);font-weight:600;line-height:1.14;letter-spacing:-.022em;
  font-size:clamp(2.1rem,1.35rem + 2.5vw,3.5rem);color:#fff;max-width:20ch;
}
body .lir-intestazione__titolo .elementor-heading-title{text-wrap:balance}
.lir-intestazione__sommario{padding-top:16px;max-width:60ch;color:#AFC4CC;font-size:1.06rem;line-height:1.6}
/* Il modello "Pagina": il contenuto della pagina a tutta larghezza, senza i
   margini e i gap che Elementor da' ai contenitori */
body .lir-tb-contenuto.e-con{display:block;padding:0;gap:0}
body .lir-tb-contenuto > .elementor-widget-theme-post-content{width:100%;max-width:none}

/* -- Dati del socio (righe con etichetta e valore, vuote = nascoste) */
body .lir-ana.e-con{
  display:grid;gap:1px;padding:0;background:var(--linea-tenue);
  border:1px solid var(--linea-tenue);border-radius:var(--raggio-scatola);overflow:hidden;
}
body .lir-ana__riga.e-con{display:block;background:#fff;padding:12px 16px}
body .lir-ana__riga.e-con:not(:has(.lir-ana__dd .elementor-heading-title)),
body .lir-ana__riga--link.e-con:not(:has(.lir-ana__dd a)){display:none}
.lir-ana__dt{
  font-family:var(--etichetta);font-weight:600;font-size:.73rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--inchiostro-tenue);padding-bottom:3px;
}
.lir-ana__dd{font-size:.97rem;font-weight:600;line-height:1.45;color:var(--inchiostro)}
.lir-ana__dd.lir-dato{font-size:.9rem}
/* Colore sul widget: Elementor forza color:inherit sul collegamento */
body .lir-ana__riga:has(a) .lir-ana__dd{color:var(--petrolio)}
body .lir-ana__dd a{text-decoration:none;border-bottom:1px solid currentColor}

/* -- Articoli firmati: senza articoli sparisce anche il titolo */
body .lir-firmati.e-con{display:block;padding:0;gap:0}
body .lir-firmati.e-con:not(:has(.e-loop-item)){display:none}
.lir-firmati__titolo{font-family:var(--titolo);font-weight:600;font-size:1.4rem;line-height:1.2;color:var(--inchiostro);padding:1.6em 0 .6em}

/* -- Icone social del piede (widget Icone social) */
body .lir-social-el{margin-top:28px}
body .lir-social-el{text-align:left;width:auto}
body .lir-social-el .elementor-social-icons-wrapper{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start}
body .lir-social-el .elementor-grid-item{margin:0}
body .lir-piede .lir-social-el .elementor-social-icon{
  display:flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;
  font-size:17px;background:transparent;color:#A9BDC5;
  border:1px solid rgba(255,255,255,.18);border-radius:var(--raggio-comando);
  transition:background var(--transizione),color var(--transizione),border-color var(--transizione);
}
body .lir-piede .lir-social-el .elementor-social-icon svg{width:17px;height:17px;fill:currentColor}
body .lir-piede .lir-social-el .elementor-social-icon:hover{background:#fff;color:var(--grafite);border-color:#fff}

/* -- Articolo precedente e successivo (widget Navigazione articoli) */
body .lir-vicini-el.elementor-widget{
  max-width:var(--gabbia-stretta);margin-top:clamp(34px,4vw,48px);
  padding-top:clamp(20px,2.2vw,26px);border-top:1px solid var(--linea);
}
body .lir-vicini-el .elementor-post-navigation{display:grid;grid-template-columns:1fr;gap:22px}
@media (min-width:640px){
  body .lir-vicini-el .elementor-post-navigation{grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px)}
}
body .lir-vicini-el .elementor-post-navigation__separator-wrapper{display:none}
body .lir-vicini-el .elementor-post-navigation__link{width:auto;max-width:none}
body .lir-vicini-el .elementor-post-navigation__next{text-align:right}
body .lir-vicini-el .elementor-post-navigation a{display:flex;text-decoration:none;color:inherit}
body .lir-vicini-el .elementor-post-navigation__next a{justify-content:flex-end}
body .lir-vicini-el .elementor-post-navigation__link__prev,
body .lir-vicini-el .elementor-post-navigation__link__next{display:flex;flex-direction:column;gap:5px}
body .lir-vicini-el .post-navigation__prev--label,
body .lir-vicini-el .post-navigation__next--label{
  display:inline-flex;align-items:center;gap:.4em;
  font-family:var(--etichetta);font-weight:600;font-size:.7rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--petrolio);
}
body .lir-vicini-el .post-navigation__next--label{align-self:flex-end}
body .lir-vicini-el .post-navigation__prev--title,
body .lir-vicini-el .post-navigation__next--title{
  font-size:.99rem;font-weight:600;line-height:1.4;text-transform:none;letter-spacing:0;
  color:var(--inchiostro);transition:color var(--transizione);
}
body .lir-vicini-el a:hover .post-navigation__prev--title,
body .lir-vicini-el a:hover .post-navigation__next--title{color:var(--petrolio)}
body .lir-vicini-el .post-navigation__prev--label::before,
body .lir-vicini-el .post-navigation__next--label::after{
  content:"";width:.85em;height:.85em;flex:none;background:currentColor;transition:transform var(--transizione);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
}
body .lir-vicini-el .post-navigation__prev--label::before{transform:rotate(180deg)}
body .lir-vicini-el a:hover .post-navigation__next--label::after{transform:translateX(3px)}
body .lir-vicini-el a:hover .post-navigation__prev--label::before{transform:rotate(180deg) translateX(3px)}

/* =====================================================================
   Situazioni con le Schede annidate di Elementor (widget nested-tabs,
   classe lir-sit-el). Stesso aspetto del vecchio widget lir-sit: elenco a
   sinistra e pannello a destra da 1025px, fisarmonica sotto (e' Elementor a
   riordinare titoli e pannelli, con il breakpoint "tablet" del widget).
   ===================================================================== */
/* I colori e gli spazi del widget passano dalle sue variabili: cosi' valgono
   anche negli stati (attivo, al passaggio) senza gareggiare in specificita'
   con il foglio generato da Elementor */
body .lir-sit-el{
  --n-tabs-title-background-color:transparent;
  --n-tabs-title-background-color-hover:var(--tenue);
  --n-tabs-title-background-color-active:var(--carta);
  --n-tabs-title-color:var(--inchiostro-tenue);
  --n-tabs-title-color-hover:var(--inchiostro);
  --n-tabs-title-color-active:var(--inchiostro);
  --n-tabs-title-gap:0;--n-tabs-gap:0;--n-tabs-title-border-radius:0;
  --n-tabs-border-width:0;--n-tabs-heading-justify-content:flex-start;
  --n-tabs-title-justify-content:flex-start;--n-tabs-title-text-align:left;
}
body .lir-sit-el .e-n-tabs{
  counter-reset:lir-sit;gap:0;background:#fff;border:1px solid var(--linea);
  border-radius:var(--raggio-scatola);box-shadow:var(--ombra-alta);overflow:hidden;
}
body .lir-sit-el .e-n-tab-title{
  counter-increment:lir-sit;display:flex;align-items:baseline;justify-content:flex-start;gap:14px;
  width:100%;margin:0;padding:18px clamp(18px,2.2vw,26px);text-align:left;cursor:pointer;
  border:0;border-bottom:1px solid var(--linea-tenue);border-radius:0;
  font-family:var(--testo);font-size:1.02rem;font-weight:600;line-height:1.35;
  transition:background-color var(--transizione),color var(--transizione);
}
body .lir-sit-el .e-n-tab-title-text{font:inherit;color:inherit;text-align:left}
body .lir-sit-el .e-n-tab-title::before{
  content:counter(lir-sit,decimal-leading-zero);flex:none;
  font-size:.74rem;letter-spacing:.1em;color:var(--linea);font-variant-numeric:tabular-nums;
}
/* Selettore lungo apposta: il reset di Hello toglie l'ombra ai pulsanti con il
   focus da mouse ([tabindex]:not([tabindex="-1"]):focus:not(:focus-visible),
   quattro classi), quindi dopo un clic il filetto spariva finche' non si
   cliccava altrove. */
body .lir-sit-el .e-n-tabs .e-n-tabs-heading .e-n-tab-title[aria-selected="true"]{box-shadow:inset 3px 0 0 var(--petrolio)}
body .lir-sit-el .e-n-tab-title[aria-selected="true"]::before{color:var(--petrolio)}
body .lir-sit-el .e-n-tab-title:focus-visible{outline:2px solid var(--petrolio);outline-offset:-2px}
body .lir-sit-el .e-n-tabs-content{padding:0;border:0}
body .lir-sit-el .lir-sit-el__pannello.e-con{flex-direction:column;gap:0;padding:0;border:0}
body .lir-sit-el__pannello > .lir-sit-el__foto.elementor-widget{width:100%;flex:none;aspect-ratio:16/8;overflow:hidden;margin:0;background:var(--petrolio-scuro)}
body .lir-sit-el__foto img{display:block;width:100%;height:100%;object-fit:cover;filter:var(--foto-colore)}
body .lir-sit-el__corpo.e-con{display:block;padding:22px clamp(18px,2.6vw,32px) 28px;gap:0}
body .lir-sit-el .lir-sit__testo ul{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--linea-tenue)}
body .lir-sit-el .lir-sit__testo li{position:relative;padding:9px 0 9px 20px;border-bottom:1px solid var(--linea-tenue);color:var(--inchiostro);font-size:.96rem;line-height:1.45}
body .lir-sit-el .lir-sit__testo li::before{content:"";position:absolute;left:0;top:1.05em;width:6px;height:6px;background:var(--petrolio)}
@media (min-width:1025px){
  body .lir-sit-el .e-n-tabs{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
  body .lir-sit-el .e-n-tabs-heading{display:flex;flex-direction:column;justify-content:flex-start;gap:0;border-right:1px solid var(--linea)}
  body .lir-sit-el__pannello > .lir-sit-el__foto.elementor-widget{aspect-ratio:16/7}
}
/* Fisarmonica: chevron che si gira sulla voce aperta */
@media (max-width:1024px){
  body .lir-sit-el .e-n-tab-title::after{
    content:"";flex:none;width:8px;height:8px;margin-left:auto;
    border-right:1.5px solid var(--petrolio);border-bottom:1.5px solid var(--petrolio);
    transform:translateY(-3px) rotate(45deg);transition:transform var(--transizione);
  }
  body .lir-sit-el .e-n-tab-title[aria-selected="true"]::after{transform:translateY(1px) rotate(-135deg)}
  body .lir-sit-el .e-n-tabs .e-n-tabs-heading .e-n-tab-title[aria-selected="true"]{box-shadow:none}
}

/* -- Apertura di Servizi, Per le aziende, Per i privati (60-intro-titoli.php):
   da 960px occhiello e titolo a sinistra, il paragrafo a destra, allineato
   al titolo. Nelle pagine inglesi e rumene a destra c'e' il testo lungo. */
@media (min-width:960px){
  /* Due colonne uguali con lo stesso stacco delle card sotto: il paragrafo
     parte dal bordo della seconda card e arriva al bordo destro della gabbia */
  body .lir-testa.lir-testa--affiancata.e-con{
    max-width:none;width:100%;
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    column-gap:clamp(18px,2.4vw,26px);align-items:start;
  }
  body .lir-testa--affiancata > *{grid-column:1}
  body .lir-testa--affiancata > .elementor-widget:last-child{grid-column:2;grid-row:2}
  body .lir-testa--affiancata > .elementor-widget:last-child p{font-size:1.08rem;line-height:1.66;max-width:none}
  body .lir-gabbia.lir-gabbia--affiancata.e-con{
    display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
    column-gap:clamp(40px,5vw,80px);align-items:start;
  }
  body .lir-gabbia--affiancata > .lir-testa{margin-bottom:0}
  /* Il testo parte all'altezza del titolo, non dell'occhiello */
  body .lir-gabbia--affiancata > .lir-testo-lungo{padding-top:30px}
}

/* Elenco puntato subito dopo una testata: lo stacco lo da' gia' la testata,
   il margine sopra dell'elenco lo raddoppiava */
body .lir-gabbia > .lir-testa ~ .elementor-widget-lir_elenco .lir-elenco{margin-top:0}

/* -- Menu per telefono (02/10/2026). La regola generale dei collegamenti del
   cassetto (.lir-drawer a, padding 14px 0) toglieva il padding orizzontale
   anche ai due pulsanti: il testo toccava il bordo. E la sigla della lingua
   attiva era bianca su bianco (stile pensato per la striscia scura in alto),
   quindi EN e RO sembravano rientrati. */
body .lir-drawer__azioni a.lir-portale-btn{display:block;padding:14px 18px;border-radius:var(--raggio-comando)}
body .lir-drawer__azioni a.lir-btn{display:flex;align-items:center;justify-content:flex-start;gap:.6em;padding:14px 18px}
/* Le lingue come un selettore a tre caselle: tutte della stessa misura (la
   sigla attiva prendeva il corpo piccolo della striscia in alto, le altre
   quello dei recapiti), quella attiva piena in petrolio, le altre con il solo
   bordo. Il bordo della prima casella sta sul bordo della colonna, come per
   ogni testo dentro una scatola. Niente sottolineatura puntinata di <abbr>,
   che sembrava un collegamento anche sulla lingua attiva. */
body .lir-drawer .lir-lingue--drawer{gap:8px;margin:20px 0 0}
body .lir-drawer .lir-lingue--drawer a,
body .lir-drawer .lir-lingue--drawer .lir-lingue__attiva{
  min-width:40px;min-height:34px;padding:6px 10px;margin:0;
  font-size:.82rem;font-weight:600;letter-spacing:.1em;line-height:1;
  border:1px solid var(--linea);border-radius:var(--raggio-comando);
  color:var(--inchiostro-tenue);background:#fff;text-decoration:none;
}
body .lir-drawer .lir-lingue--drawer .lir-lingue__attiva{background:var(--petrolio);border-color:var(--petrolio);color:#fff}
body .lir-drawer .lir-lingue--drawer a:hover{border-color:var(--petrolio-chiaro);color:var(--petrolio)}
body .lir-drawer .lir-lingue--drawer abbr{text-decoration:none;font:inherit;letter-spacing:inherit}
body .lir-drawer__recapiti{padding-bottom:32px}

/* -- Piede su telefono (02/10/2026) */
@media (max-width:699px){
  /* Due colonne bilanciate: a sinistra Lo studio, Accesso e Iscrizioni uno
     sotto l'altro, a destra i Servizi, che sono la colonna piu' lunga. Prima la
     seconda riga lasciava vuota meta' larghezza sotto i servizi. */
  body .lir-piede__menu.e-con{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px 20px}
  body .lir-piede__menu > :nth-child(1){grid-column:1;grid-row:1}
  body .lir-piede__menu > :nth-child(2){grid-column:2;grid-row:1 / span 2}
  body .lir-piede__menu > :nth-child(3){grid-column:1;grid-row:2}
  /* Fascia legale: voci centrate su piu' righe, senza i punti separatori.
     A capo il punto restava in testa alla riga, e con il suo margine e lo
     spazio fra le voci apriva vuoti larghi e irregolari. */
  body .lir-piede__bassa.e-con{gap:6px 18px;justify-content:center;text-align:center}
  body .lir-piede__bassa.e-con > .elementor-widget{flex:0 0 auto;width:auto}
  body .lir-piede__bassa > .elementor-widget + .elementor-widget::before{content:none}
}

/* -- Testata sotto i 1080px (02/10/2026): pulsante del menu alto quanto
   "Area clienti" (38px), e pulsante di chiusura del cassetto della stessa
   misura, con la X disegnata a linee come quella del menu. Prima la chiusura
   prendeva il padding dei pulsanti di Elementor (14px 24px) e una x di testo
   da 16px: rettangolare e con l'icona minuscola. */
@media (max-width:1079px){
  body .elementor-location-header .lir-portale-btn{min-height:38px}
  body button.lir-hamburger{width:38px;height:38px}
  body button.lir-drawer__chiudi{
    position:relative;flex:none;width:38px;height:38px;min-width:0;padding:0;
    font-size:0;line-height:0;display:inline-flex;align-items:center;justify-content:center;
  }
  body button.lir-drawer__chiudi::before,
  body button.lir-drawer__chiudi::after{
    content:"";position:absolute;left:50%;top:50%;width:19px;height:1.5px;margin:-.75px 0 0 -9.5px;
    background:var(--inchiostro);
  }
  body button.lir-drawer__chiudi::before{transform:rotate(45deg)}
  body button.lir-drawer__chiudi::after{transform:rotate(-45deg)}
}

/* Marchio intero fra 1100 e 1379px (02/10/2026): alla misura piena la parte
   sinistra finiva sotto la fine del sommario e la seconda card. Qui e' piu'
   piccolo e resta ancorato in alto a destra; da 1380px torna quello di sempre. */
@media (min-width:1100px) and (max-width:1379px){
  .lir-hero::after{width:40vw;top:-6%;right:-5%}
}

/* -- Tendine del menu (02/10/2026): partono a filo del bordo inferiore della
   testata, non subito sotto la voce, e hanno gli angoli arrotondati anche in
   alto, con il filetto petrolio da 3px come le card (la scheda delle pagine
   servizio). La voce sta centrata nella barra: lo scarto fra il fondo della
   voce e il fondo della barra e' 17px a ogni larghezza da 1080px. */
@media (min-width:1080px){
  body .lir-sub, body .lir-mega{
    top:calc(100% + 17px);border-top-width:3px;border-radius:var(--raggio-scatola);
    /* Solo il filetto in alto, come le card: con i bordi grigi ai lati, nell'angolo
       il blu si interrompeva in diagonale e l'arrotondamento sembrava diverso. */
    border-left:0;border-right:0;border-bottom:0;
  }
  /* Il ponte invisibile: senza, passando dalla voce alla tendina il mouse
     attraversa i 17px vuoti, la voce perde l'hover e la tendina si chiude. */
  body .lir-sub::before, body .lir-mega::before{
    content:"";position:absolute;left:0;right:0;bottom:100%;height:24px;
  }
  body .lir-sub, body .lir-mega{overflow:visible}
  body .lir-mega__piede{border-radius:0 0 var(--raggio-scatola) var(--raggio-scatola)}
}

/* -- Voci del menu (02/10/2026): niente sottolineatura, solo il colore. Petrolio
   sulla voce della pagina corrente, al passaggio del mouse, da tastiera e
   mentre la sua tendina e' aperta. */
.lir-nav__lista > li > a::after{display:none}
body .lir-nav__lista > li:hover > a,
body .lir-nav__lista > li:focus-within > a,
body .lir-nav__lista > li.lir-aperta > a,
body .lir-nav__lista > li.lir-corrente > a{color:var(--petrolio)}
body .lir-nav__lista > li > a{transition:color var(--transizione)}

/* -- Pulsante "vedi tutti" in riga con la testata (02/10/2026): la stessa
   soluzione del "Conosci i soci", per qualsiasi sezione. Il widget con la
   classe lir-azione-testa resta l'ultimo nei dati (ordine giusto da tastiera,
   e in fondo su telefono); da 860px la griglia lo porta in alto a destra. */
body .lir-azione-testa{margin-top:28px}
body .lir-azione-testa p{margin:0}
@media (min-width:860px){
  body .lir-gabbia:has(> .lir-azione-testa){
    display:grid;grid-template-columns:minmax(0,1fr) auto;
    column-gap:clamp(24px,4vw,64px);align-items:center;
  }
  body .lir-gabbia:has(> .lir-azione-testa) > *{grid-column:1/-1}
  body .lir-gabbia:has(> .lir-azione-testa) > .lir-testa{grid-column:1;grid-row:1}
  body .lir-gabbia > .lir-azione-testa{grid-column:2;grid-row:1;justify-self:end;margin:0}
}

/* =====================================================================
   Apertura a slider (02/10/2026, stack/seed/63-apertura-slider.php).
   Sfondo "Presentazione" di Elementor: la diapositiva 0 e' un PNG
   trasparente (si vede la trama: grafite e marchio), le altre sono foto
   piene. Strati: grafite, presentazione, marchio, testi.
   ===================================================================== */
body .lir-hero{background-color:var(--grafite)}
body .lir-hero > .elementor-background-slideshow{z-index:0}
.lir-hero::after{z-index:1;transition:opacity 1.4s ease}
body .lir-hero .lir-gabbia{z-index:2}
/* Il marchio esce quando la diapositiva attiva e' una foto */
body .lir-hero:has(.elementor-background-slideshow__slide.swiper-slide-active:not([data-swiper-slide-index="0"]))::after{opacity:0}
/* Le foto in duotono, come nella fascia del titolo, con il velo grafite pieno
   a sinistra (dove sta il testo) che si apre verso destra */
body .lir-hero .elementor-background-slideshow__slide__image{filter:grayscale(1) contrast(1.05)}
body .lir-hero .elementor-background-slideshow__slide:not([data-swiper-slide-index="0"])::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,rgba(12,20,24,.95) 0%,rgba(12,20,24,.86) 42%,rgba(17,72,92,.62) 100%);
}
@media (max-width:1099px){
  body .lir-hero .elementor-background-slideshow__slide:not([data-swiper-slide-index="0"])::after{
    background:linear-gradient(180deg,rgba(12,20,24,.9) 0%,rgba(12,20,24,.86) 60%,rgba(17,72,92,.75) 100%);
  }
}
/* Chi chiede meno movimento vede solo la trama */
@media (prefers-reduced-motion:reduce){
  body .lir-hero > .elementor-background-slideshow{display:none}
  body .lir-hero::after{opacity:1!important}
}

/* =====================================================================
   Varianti della home - TEMPORANEO (02/10/2026, stack/seed/64-home-varianti.php).
   Tre copie della home con un passaggio diverso, da far scegliere al
   cliente. A scelta fatta si tiene solo la parte della variante scelta.
   ===================================================================== */

/* --- Slider: il marchio e' disegnato dentro la prima diapositiva e
   scorre via con lei, invece di sparire in dissolvenza --- */
body .lir-hero--slider::after{content:none}
body .lir-hero--slider .elementor-background-slideshow__slide{overflow:hidden}
body .lir-hero--slider .elementor-background-slideshow__slide[data-swiper-slide-index="0"]::after{
  content:"";position:absolute;top:-8%;right:-6%;width:min(680px,54vw);aspect-ratio:1;
  pointer-events:none;opacity:.85;
  background-image:linear-gradient(rgba(92,147,166,1),rgba(92,147,166,1)), var(--apertura-foto);
  background-size:cover,cover;background-position:center,30% 62%;
  background-blend-mode:color;
  -webkit-mask:url(../img/marchio-mascherina.svg) center/contain no-repeat;
          mask:url(../img/marchio-mascherina.svg) center/contain no-repeat;
}
@media (min-width:1100px) and (max-width:1379px){
  body .lir-hero--slider .elementor-background-slideshow__slide[data-swiper-slide-index="0"]::after{width:40vw;top:-6%;right:-5%}
}
@media (max-width:1099px){
  body .lir-hero--slider .elementor-background-slideshow__slide[data-swiper-slide-index="0"]::after{
    background-image:none;background-color:rgba(255,255,255,.09);
    opacity:1;top:88px;right:-12%;width:min(320px,64vw);
  }
}

/* --- Apertura: il marchio si allarga fino a riempire la fascia e al ritorno
   si richiude. Dentro al marchio c'e' gia' la foto della seconda fase, con lo
   stesso taglio (cover sull'intera fascia) e lo stesso trattamento: cambia
   solo la forma, non la fotografia. Per questo il marchio fermo non e' il
   ::after della fascia (che ha un taglio suo, sul riquadro del segno) ma lo
   strato "apre" a misura 1.
   La foto e' l'ultima immagine della Presentazione di Elementor (nascosta):
   site.js la legge, ne fa --ap-foto e misura centro e larghezza del marchio
   (--ap-x, --ap-y, --ap-w) dal ::after, che resta come riferimento di misura
   e posizione. Giro di 14 secondi. --- */
@property --ap-k{syntax:"<number>";inherits:false;initial-value:1}
/* Quanto e' fitto il velo a destra, dove sta il marchio: .35 a marchio chiuso
   (il segno si legge meglio), 1 sulla foto piena (il velo delle altre due
   varianti). Si anima insieme all'apertura e alla chiusura. */
@property --ap-v{syntax:"<number>";inherits:false;initial-value:1}
body .lir-hero--apertura > .elementor-background-slideshow{display:none}
.lir-hero--apertura .lir-ap{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0}
/* Piena, apre e chiude hanno lo stesso fondo, velo compreso: il marchio
   fermo e' gia' un pezzo della foto piena cosi' come la si vede, e sovrapposti
   gli strati non si distinguono. Il velo e' quello della foto piena delle altre
   due varianti, pieno a sinistra dove sta il testo. */
.lir-hero--apertura .lir-ap--piena,
.lir-hero--apertura .lir-ap--apre,
.lir-hero--apertura .lir-ap--chiude{
  /* Dal basso: foto, tinta petrolio, velo e, in cima, un "pavimento" in
     modalita' screen: nessun punto del marchio scende sotto un petrolio scuro,
     cosi' anche dove la foto e' quasi nera il segno si stacca dalla grafite.
     Il pavimento vale solo a marchio chiuso: cresce con 1 - --ap-v e sulla
     foto piena (--ap-v 1) e' nero, cioe' non fa niente. */
  background-image:
    linear-gradient(rgb(calc(52 * (1 - var(--ap-v))) calc(108 * (1 - var(--ap-v))) calc(128 * (1 - var(--ap-v)))), rgb(calc(52 * (1 - var(--ap-v))) calc(108 * (1 - var(--ap-v))) calc(128 * (1 - var(--ap-v))))),
    linear-gradient(100deg,rgba(12,20,24,.95) 0%,rgba(12,20,24,.86) 42%,rgba(17,72,92,calc(.62 * var(--ap-v))) 100%),
    linear-gradient(rgba(92,147,166,1),rgba(92,147,166,1)),
    var(--ap-foto);
  background-size:cover;background-position:center;background-blend-mode:screen,normal,color,normal;
}
.lir-hero--apertura .lir-ap--apre,
.lir-hero--apertura .lir-ap--chiude{
  -webkit-mask-image:url(../img/marchio-mascherina.svg);
          mask-image:url(../img/marchio-mascherina.svg);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-size:calc(var(--ap-w) * var(--ap-k)) calc(var(--ap-w) * var(--ap-k));
          mask-size:calc(var(--ap-w) * var(--ap-k)) calc(var(--ap-w) * var(--ap-k));
  -webkit-mask-position:calc(var(--ap-x) - var(--ap-w) * var(--ap-k) / 2) calc(var(--ap-y) - var(--ap-w) * var(--ap-k) / 2);
          mask-position:calc(var(--ap-x) - var(--ap-w) * var(--ap-k) / 2) calc(var(--ap-y) - var(--ap-w) * var(--ap-k) / 2);
}
/* Il ::after resta solo come metro (site.js ne legge misura e posizione) */
.lir-hero--apertura.lir-ap-pronta::after{opacity:0!important;transition:none}
/* Prima che site.js sia pronto il ::after e' il marchio della home normale,
   con un trattamento suo (tinta senza velo ne' pavimento, taglio 30% 62%,
   opacita' .85): visibile, all'apertura della pagina si vedeva per un attimo
   un marchio di colore diverso, poi sostituito dagli strati. Resta invisibile
   finche' gli strati non sono pronti; !important e il body davanti battono la
   regola di prefers-reduced-motion delle altre varianti. */
body .lir-hero--apertura:not(.lir-ap-pronta)::after{opacity:0!important;transition:none}
/* Gli strati entrano insieme, in dissolvenza, quando la foto e' gia' decodificata */
.lir-hero--apertura .lir-ap-strati{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .6s ease}
.lir-hero--apertura.lir-ap-pronta .lir-ap-strati{opacity:1}
.lir-hero--apertura.lir-ap-pronta .lir-ap--apre{animation:lir-ap-apre 14s infinite}
.lir-hero--apertura.lir-ap-pronta .lir-ap--piena{animation:lir-ap-piena 14s infinite}
.lir-hero--apertura.lir-ap-pronta .lir-ap--chiude{animation:lir-ap-chiude 14s infinite}
@keyframes lir-ap-apre{0%,36%{--ap-k:1;--ap-v:.35;opacity:1}52%{--ap-k:16;--ap-v:1;opacity:1}58%,100%{--ap-k:16;--ap-v:1;opacity:0}}
@keyframes lir-ap-piena{0%,46%{opacity:0}54%,86%{opacity:1}93%,100%{opacity:0}}
@keyframes lir-ap-chiude{0%,84%{--ap-k:16;--ap-v:1;opacity:0}86%{--ap-k:16;--ap-v:1;opacity:1}95%,100%{--ap-k:1;--ap-v:.35;opacity:1}}
/* Sotto i 1100px il marchio e' una filigrana: il passaggio diventa una
   dissolvenza semplice della foto con il suo velo, e la filigrana resta */
@media (max-width:1099px){
  .lir-hero--apertura .lir-ap--apre,
  .lir-hero--apertura .lir-ap--chiude{display:none}
  .lir-hero--apertura.lir-ap-pronta::after{opacity:1!important}
  .lir-hero--apertura .lir-ap--piena{background-image:linear-gradient(180deg,rgba(12,20,24,.9) 0%,rgba(12,20,24,.86) 60%,rgba(17,72,92,.75) 100%), linear-gradient(rgba(92,147,166,1),rgba(92,147,166,1)), var(--ap-foto)}
}
@media (prefers-reduced-motion:reduce){
  .lir-hero--apertura .lir-ap{animation:none!important}
  .lir-hero--apertura .lir-ap--apre{opacity:1;--ap-v:.35}
}