/* ==========================================================================
   CER Irpinia Sannio — pagine frontali pubbliche
   Un solo carattere, tre inchiostri dal logo, due superfici (foglio e campo).
   ========================================================================== */

/* --- Carattere: Schibsted Grotesk, self-hosted (SIL Open Font License) --- */
@font-face {
  font-family: "Schibsted Grotesk";
  src: url("../fonts/schibsted-grotesk-latin-ext.65233324c912.woff2") format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Schibsted Grotesk";
  src: url("../fonts/schibsted-grotesk-latin.ba4038fc5cb5.woff2") format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --- Token --- */
:root {
  --font: "Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* inchiostri */
  --inchiostro: #14181a;
  --inchiostro-tenue: #4d565b;
  --carta: #fbfaf7;
  --carta-scura: #f2efe8;
  --filetto: #ded9cd;
  --filetto-forte: #c6c0b1;

  /* inchiostri del logo */
  --verde: #1d5c33;
  --verde-scuro: #17492a;
  --verde-tinta: #e9f1e6;
  --ambra: #f7b120;
  --ambra-scura: #dd950c;
  --ambra-tinta: #fdf3da;
  --blu: #126fb3;
  --blu-scuro: #0d5589;
  --blu-tinta: #e7f1f8;

  /* superfici derivate */
  --campo-testo: #fbfaf7;
  --campo-tenue: #cfe0cd;
  --campo-filetto: rgba(251, 250, 247, 0.24);

  /* tipografia */
  --display: clamp(2.3rem, 1.15rem + 4.4vw, 4.5rem);
  --h2: clamp(1.7rem, 1.1rem + 2.4vw, 2.9rem);
  --h3: clamp(1.2rem, 1.08rem + 0.7vw, 1.55rem);
  --lead: clamp(1.09rem, 1rem + 0.42vw, 1.32rem);
  --testo: 1.0625rem;
  --piccolo: 0.9375rem;
  --etichetta: 0.8125rem;

  /* spazi */
  --sp-1: 0.5rem;
  --sp-2: 0.75rem;
  --sp-3: 1rem;
  --sp-4: 1.5rem;
  --sp-5: 2rem;
  --sp-6: 3rem;
  --sp-7: 4.5rem;
  --sp-8: 6rem;
  --sezione: clamp(3.25rem, 7vw, 6.5rem);
  --contenitore: 1240px;
  --raggio: 14px;
  --raggio-piccolo: 10px;
  --pillola: 999px;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* --- Base --- */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 6rem;
  scrollbar-color: var(--filetto-forte) transparent;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--carta);
  color: var(--inchiostro);
  font-family: var(--font);
  font-size: var(--testo);
  line-height: 1.6;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  caret-color: var(--verde);
}

::selection { background: var(--ambra); color: var(--inchiostro); }

img, svg, iframe { display: block; max-width: 100%; }
img { height: auto; }

h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }

a {
  color: var(--blu);
  text-decoration: underline;
  text-decoration-thickness: 0.055em;
  text-underline-offset: 0.18em;
  transition: color 0.16s var(--ease), text-decoration-color 0.16s var(--ease);
}
a:hover { color: var(--blu-scuro); text-decoration-thickness: 0.1em; }

strong { font-weight: 700; }

.cifre, .iban, time, td, .fatto__numero { font-variant-numeric: tabular-nums; }
.iban { letter-spacing: 0.01em; word-break: break-word; }

:focus-visible {
  outline: 3px solid var(--verde);
  outline-offset: 2px;
  border-radius: 4px;
}
.piede :focus-visible { outline-color: var(--ambra); }

input::placeholder { color: var(--inchiostro-tenue); opacity: 1; }

.salta {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 50;
  background: var(--inchiostro);
  color: var(--carta);
  padding: 0.85rem 1.25rem;
  border-radius: 0 0 var(--raggio-piccolo) 0;
  text-decoration: none;
}
.salta:focus { left: 0; }

.solo-lettori {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* --- Struttura --- */
.contenitore {
  width: 100%;
  max-width: var(--contenitore);
  margin-inline: auto;
  padding-inline: clamp(1.15rem, 4vw, 2.5rem);
}
.contenitore--stretto { max-width: 880px; }

.sezione { padding-block: var(--sezione); }
.sezione--bordo { border-top: 1px solid var(--filetto); }
.sezione--fatti { padding-block: clamp(2rem, 4vw, 3.25rem); border-bottom: 1px solid var(--filetto); }

.sezione--campo {
  background: var(--verde-scuro);
  color: var(--campo-testo);
}
.sezione--campo h2, .sezione--campo h3 { color: var(--campo-testo); }
.sezione--campo .intestazione__testo { color: var(--campo-tenue); }
.sezione--campo a { color: var(--campo-testo); }
.sezione--campo :focus-visible { outline-color: var(--ambra); }

/* --- Tipografia --- */
.intestazione { max-width: 68ch; margin-bottom: clamp(2rem, 4vw, 3.25rem); }
.intestazione--larga { max-width: 80ch; }
.intestazione--riga {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3) var(--sp-4);
  align-items: baseline;
  justify-content: space-between;
  max-width: none;
}
.intestazione__titolo {
  font-size: var(--h2);
  line-height: 1.06;
  letter-spacing: -0.022em;
  font-weight: 800;
  text-wrap: balance;
}
.intestazione__testo {
  margin-top: var(--sp-3);
  font-size: var(--lead);
  line-height: 1.45;
  color: var(--inchiostro-tenue);
  max-width: 62ch;
}

.titolo-blocco {
  font-size: var(--h3);
  line-height: 1.2;
  letter-spacing: -0.012em;
  font-weight: 700;
  margin-bottom: var(--sp-3);
}

.fonte {
  margin-top: var(--sp-4);
  font-size: var(--piccolo);
  color: var(--inchiostro-tenue);
}
.nota, .nota-campo { font-size: var(--piccolo); color: var(--inchiostro-tenue); }
.nota-campo { margin-top: var(--sp-6); color: var(--campo-tenue); max-width: 70ch; }

.prosa { max-width: 68ch; }
.prosa--centrata { margin-inline: auto; }
.conclusione {
  margin-top: clamp(2.5rem, 5vw, 4rem);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--filetto);
  max-width: none;
}
.conclusione p { max-width: 68ch; font-size: var(--lead); line-height: 1.5; color: var(--inchiostro-tenue); }
.prosa h2 {
  font-size: var(--h3);
  line-height: 1.2;
  letter-spacing: -0.012em;
  font-weight: 700;
  margin-top: var(--sp-6);
  margin-bottom: var(--sp-3);
}
.prosa h2:first-child { margin-top: 0; }
.prosa p + p { margin-top: var(--sp-3); }
.prosa p { margin-top: var(--sp-3); }
.prosa .elenco-punti, .prosa .elenco-numerato { margin-top: var(--sp-3); }
.prosa > p:first-of-type { margin-top: 0; }

.elenco-punti { display: grid; gap: var(--sp-2); }
.elenco-punti > li {
  position: relative;
  padding-left: 1.35rem;
}
.elenco-punti > li::before {
  content: "";
  position: absolute;
  left: 0.15rem;
  top: 0.66em;
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 50%;
  background: var(--verde);
}
.sezione--campo .elenco-punti > li::before { background: var(--ambra); }

.elenco-numerato { list-style: decimal; padding-left: 1.6rem; }
.elenco-numerato > li + li { margin-top: var(--sp-2); }
.elenco-numerato > li::marker {
  color: var(--verde);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.sezione--campo .elenco-numerato > li::marker { color: var(--ambra); }

/* --- Icone --- */
.icona {
  width: 1.15em;
  height: 1.15em;
  flex: none;
  vertical-align: -0.16em;
}

/* --- Bottoni --- */
.bottone {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.82rem 1.4rem;
  border: 1px solid transparent;
  border-radius: var(--raggio-piccolo);
  font: inherit;
  font-weight: 600;
  font-size: 0.98rem;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.18s var(--ease), border-color 0.18s var(--ease), color 0.18s var(--ease);
}
.bottone--primario {
  background: var(--ambra);
  border-color: var(--ambra);
  color: var(--inchiostro);
}
.bottone--primario:hover { background: var(--ambra-scura); border-color: var(--ambra-scura); color: var(--inchiostro); }
.bottone--secondario {
  background: transparent;
  border-color: var(--filetto-forte);
  color: var(--inchiostro);
}
.bottone--secondario:hover { border-color: var(--inchiostro); color: var(--inchiostro); }
.bottone--testo {
  padding: 0.15rem 0;
  background: none;
  border: none;
  color: var(--verde);
  text-decoration: none;
  font-weight: 700;
}
.bottone--testo:hover { color: var(--verde-scuro); text-decoration: underline; text-underline-offset: 0.2em; }
.bottone--compatto { padding: 0.62rem 1.1rem; font-size: 0.93rem; }
.bottone--campo {
  background: transparent;
  border-color: rgba(251, 250, 247, 0.62);
  color: var(--campo-testo);
}
.bottone--campo:hover { background: var(--campo-testo); border-color: var(--campo-testo); color: var(--verde-scuro); }
.icona--freccia { transition: transform 0.22s var(--ease); }
.bottone:hover .icona--freccia, .documento__apri:hover .icona--freccia { transform: translateX(3px); }
.sezione--campo .bottone--secondario { border-color: var(--campo-filetto); color: var(--campo-testo); }
.sezione--campo .bottone--secondario:hover { border-color: var(--campo-testo); }
.sezione--campo .bottone--testo { color: var(--ambra); }
.sezione--campo .bottone--testo:hover { color: var(--campo-testo); }

/* --- Testata --- */
.testata {
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--carta);
  border-bottom: 1px solid var(--filetto);
  transition: background-color 0.3s var(--ease);
}
/* Scorrendo la pagina la testata si abbassa e lascia intravedere il contenuto. */
.testata[data-scorsa] {
  background: rgba(251, 250, 247, 0.82);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  backdrop-filter: blur(14px) saturate(1.4);
}
.testata:has(.nav[data-aperta]) { background: var(--carta); }
.testata[data-scorsa] .testata__interno { min-height: 62px; }
.testata[data-scorsa] .marchio img { height: 44px; }
/* Avanzamento di lettura: il filetto verde segue lo scorrimento della pagina. */
@supports (animation-timeline: scroll()) {
  .testata::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -1px;
    height: 2px;
    background: var(--verde);
    transform: scaleX(0);
    transform-origin: left;
    animation: avanzamento linear both;
    animation-timeline: scroll(root block);
  }
}
@keyframes avanzamento { to { transform: scaleX(1); } }

.testata__interno {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  min-height: 84px;
  transition: min-height 0.3s var(--ease);
}
.marchio { flex: none; display: block; }
.marchio img { height: clamp(50px, 5.4vw, 64px); width: auto; transition: height 0.3s var(--ease); }

.nav {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.4vw, 2.25rem);
  margin-left: auto;
}
.nav__lista {
  display: flex;
  align-items: center;
  gap: clamp(0.9rem, 1.9vw, 1.85rem);
}
.nav__link {
  position: relative;
  display: inline-block;
  padding-block: 0.35rem;
  color: var(--inchiostro);
  font-size: 0.97rem;
  font-weight: 500;
  text-decoration: none;
}
.nav__link::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -0.1rem;
  height: 2px;
  background: var(--verde);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.22s var(--ease);
}
.nav__link:hover::after, .nav__link[aria-current="page"]::after { transform: scaleX(1); }
.nav__azioni { display: flex; align-items: center; gap: var(--sp-2); }
.nav__azioni .bottone--testo { color: var(--inchiostro); }

.testata__apri {
  display: none;
  margin-left: auto;
  min-width: 46px;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 0.6rem 0.7rem;
  background: none;
  border: 1px solid var(--inchiostro-tenue);
  border-radius: var(--raggio-piccolo);
  color: var(--inchiostro);
  cursor: pointer;
}

/* --- Apertura --- */
.apertura { padding-block: clamp(2.5rem, 5vw, 4.5rem) clamp(3rem, 6vw, 5.5rem); }
.apertura__interno {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
}
.apertura__titolo {
  font-size: var(--display);
  line-height: 1.02;
  letter-spacing: -0.03em;
  font-weight: 800;
  text-wrap: balance;
}
.apertura__sommario {
  margin-top: var(--sp-4);
  font-size: var(--lead);
  line-height: 1.5;
  color: var(--inchiostro-tenue);
  max-width: 46ch;
}
.apertura__azioni {
  margin-top: var(--sp-5);
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3);
}
.apertura__nota {
  margin-top: var(--sp-4);
  font-size: var(--piccolo);
  color: var(--inchiostro-tenue);
  max-width: 52ch;
}

.foto { margin: 0; }
.foto img {
  width: 100%;
  border-radius: var(--raggio);
  object-fit: cover;
}
.foto figcaption {
  margin-top: var(--sp-2);
  font-size: var(--etichetta);
  color: var(--inchiostro-tenue);
  line-height: 1.45;
}
.foto--apertura img { aspect-ratio: 4 / 3; }
.foto--larga img { aspect-ratio: 21 / 9; }
.foto--banda { margin-bottom: clamp(2rem, 4vw, 3.25rem); }
.foto--documento img {
  border: 1px solid var(--filetto);
  background: #fff;
  aspect-ratio: auto;
  max-height: 780px;
  width: auto;
  margin-inline: auto;
  object-fit: contain;
}
.foto__apri { display: block; margin-top: 0.25rem; font-weight: 600; color: var(--blu); }

/* --- Fatti --- */
.fatti {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-4) 0;
}
.fatto { padding-inline: clamp(0.9rem, 2.4vw, 2rem); }
.fatto:first-child { padding-left: 0; }
.fatto + .fatto { border-left: 1px solid var(--filetto); }
.fatto__numero {
  font-size: clamp(1.9rem, 1.2rem + 2.2vw, 3rem);
  line-height: 1;
  letter-spacing: -0.03em;
  font-weight: 800;
  color: var(--verde);
}
.fatto__etichetta {
  margin-top: var(--sp-2);
  font-size: var(--piccolo);
  line-height: 1.4;
  color: var(--inchiostro-tenue);
  max-width: 30ch;
}

/* --- Passi (meccanismo) --- */
.passi {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-5);
  counter-reset: nessuno;
}
.passo { padding-top: var(--sp-4); border-top: 1px solid var(--campo-filetto); }
.passo__numero {
  font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2rem);
  line-height: 1;
  font-weight: 800;
  color: var(--ambra);
  letter-spacing: -0.02em;
}
.passo__titolo {
  margin-top: var(--sp-3);
  font-size: 1.16rem;
  line-height: 1.25;
  letter-spacing: -0.01em;
  font-weight: 700;
}
.passo p:last-child { margin-top: var(--sp-2); color: var(--campo-tenue); font-size: var(--piccolo); line-height: 1.5; }

.incentivi {
  margin-top: clamp(2.5rem, 5vw, 4rem);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-5);
}
.incentivo { padding-top: var(--sp-4); border-top: 1px solid var(--campo-filetto); }
.incentivo__titolo {
  font-size: var(--h3);
  line-height: 1.15;
  letter-spacing: -0.015em;
  font-weight: 700;
}
.incentivo p { margin-top: var(--sp-2); color: var(--campo-tenue); max-width: 46ch; }

/* --- Strade (consumatori / produttori) --- */
.strade {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(2rem, 5vw, 4rem);
}
.strada__titolo {
  margin-top: var(--sp-4);
  font-size: var(--h3);
  line-height: 1.15;
  letter-spacing: -0.015em;
  font-weight: 700;
  text-wrap: balance;
}
.strada p { margin-top: var(--sp-3); color: var(--inchiostro-tenue); max-width: 52ch; }
.strada .bottone { margin-top: var(--sp-4); }
.strada .foto img { aspect-ratio: 16 / 10; }

/* --- Territorio: chi aderisce e come si entra in configurazione --- */
.perimetro {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(1.75rem, 4vw, 3.5rem);
  align-items: start;
}
.aderente { padding-block: var(--sp-4); border-top: 1px solid var(--filetto); }
.aderente:last-child { padding-bottom: 0; }
.aderente__titolo { font-size: 1.06rem; font-weight: 700; letter-spacing: -0.01em; }
.aderente p { margin-top: var(--sp-2); color: var(--inchiostro-tenue); max-width: 52ch; }

.tappe-riquadro {
  border: 1px solid var(--filetto);
  border-radius: var(--raggio);
  background: var(--carta-scura);
  padding: clamp(1.25rem, 3vw, 2rem);
}
.tappa {
  display: grid;
  grid-template-columns: 1.6rem minmax(0, 1fr);
  gap: 0 var(--sp-3);
  padding-block: var(--sp-3);
  border-top: 1px solid var(--filetto);
}
.tappa:last-child { padding-bottom: 0; }
.tappa__numero { font-weight: 800; color: var(--verde); font-variant-numeric: tabular-nums; }
.tappa__titolo { font-weight: 700; letter-spacing: -0.01em; }
.tappa p { grid-column: 2; margin-top: 0.2rem; font-size: var(--piccolo); line-height: 1.5; color: var(--inchiostro-tenue); }
.tappe-riquadro .nota { margin-top: var(--sp-3); }

/* Mappa delle cabine primarie: al passaggio del mouse si ingrandisce
   attorno al puntatore (sito.js), per leggere i nomi dei comuni. */
.mappa-cabine { margin: clamp(2rem, 4vw, 3.25rem) 0 0; }
.mappa-cabine__quadro {
  display: block;
  overflow: hidden;
  border: 1px solid var(--filetto);
  border-radius: var(--raggio);
  background: #fff;
}
.mappa-cabine__quadro img {
  display: block;
  width: 100%;
  height: auto;
  transform-origin: var(--zoom-x, 50%) var(--zoom-y, 50%);
  transition: transform 0.25s var(--ease);
}
.mappa-cabine[data-zoom] .mappa-cabine__quadro { cursor: zoom-in; }
.mappa-cabine[data-zoom="attivo"] .mappa-cabine__quadro img { transform: scale(2.5); }
.mappa-cabine figcaption {
  margin-top: var(--sp-2);
  font-size: var(--etichetta);
  color: var(--inchiostro-tenue);
  line-height: 1.45;
}
.mappa-cabine__aiuto { display: none; }
.mappa-cabine[data-zoom] .mappa-cabine__aiuto { display: inline; }
@media (prefers-reduced-motion: reduce) {
  .mappa-cabine__quadro img { transition: none; }
}

/* --- Documenti --- */
.documenti {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-4);
}
.documento {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  padding: clamp(1.1rem, 2.4vw, 1.6rem);
  border: 1px solid var(--filetto);
  border-radius: var(--raggio);
  background: var(--carta);
  transition: border-color 0.18s var(--ease);
}
.documento:hover { border-color: var(--filetto-forte); }
.documento__tipo {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: var(--etichetta);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--blu);
}
.documento__dimensione { color: var(--inchiostro-tenue); font-weight: 500; letter-spacing: 0; text-transform: none; }
.documento__titolo { font-size: 1.12rem; line-height: 1.25; font-weight: 700; letter-spacing: -0.01em; }
.documento__titolo a { color: var(--inchiostro); text-decoration: none; }
.documento__titolo a:hover { text-decoration: underline; text-underline-offset: 0.18em; }
.documento__descrizione { font-size: var(--piccolo); color: var(--inchiostro-tenue); flex: 1; }
.documento__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1rem;
  align-items: center;
  justify-content: space-between;
  padding-top: var(--sp-2);
  border-top: 1px solid var(--filetto);
  font-size: var(--etichetta);
  color: var(--inchiostro-tenue);
}
.documento__apri { display: inline-flex; align-items: center; gap: 0.35rem; font-weight: 700; color: var(--verde); text-decoration: none; }
.documento__apri:hover { text-decoration: underline; text-underline-offset: 0.2em; }

/* --- Bacheca --- */
.elenco-articoli { display: grid; gap: var(--sp-6); }
.voce-articolo__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.85rem;
  font-size: var(--etichetta);
  color: var(--inchiostro-tenue);
}
.targhetta {
  display: inline-block;
  padding: 0.12rem 0.6rem;
  border-radius: var(--pillola);
  background: var(--verde-tinta);
  color: var(--verde);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.targhetta--documenti { background: var(--blu-tinta); color: var(--blu-scuro); }
.targhetta--avviso { background: var(--ambra-tinta); color: #8a5a06; }
.voce-articolo__categoria { color: var(--inchiostro-tenue); }
.voce-articolo__titolo {
  margin-top: var(--sp-2);
  font-size: clamp(1.35rem, 1.1rem + 1vw, 1.85rem);
  line-height: 1.15;
  letter-spacing: -0.018em;
  font-weight: 700;
  text-wrap: balance;
}
.voce-articolo__titolo a { color: var(--inchiostro); text-decoration: none; }
.voce-articolo__titolo a:hover { text-decoration: underline; text-underline-offset: 0.18em; }
.voce-articolo__sommario { margin-top: var(--sp-2); color: var(--inchiostro-tenue); max-width: 74ch; }
.elenco-articoli--esteso .voce-articolo {
  display: grid;
  grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
  gap: clamp(1.25rem, 3vw, 2.25rem);
  align-items: start;
}
.elenco-articoli--esteso .voce-articolo__corpo:only-child { grid-column: 1 / -1; }
.voce-articolo__foto img { aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--raggio); }

/* --- Articolo --- */
.articolo-pagina__testata { max-width: 74ch; }
.articolo-pagina__titolo {
  margin-top: var(--sp-3);
  font-size: clamp(2rem, 1.3rem + 3vw, 3.4rem);
  line-height: 1.05;
  letter-spacing: -0.028em;
  font-weight: 800;
  text-wrap: balance;
}
.articolo-pagina__sommario {
  margin-top: var(--sp-3);
  font-size: var(--lead);
  line-height: 1.45;
  color: var(--inchiostro-tenue);
}
.articolo-pagina__corpo { margin-top: clamp(2rem, 4vw, 3.25rem); max-width: 72ch; }
.articolo-pagina__corpo h2 {
  font-size: var(--h3);
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -0.012em;
  margin-top: var(--sp-6);
  margin-bottom: var(--sp-3);
}
.articolo-pagina__corpo h3 { font-size: 1.15rem; font-weight: 700; margin-top: var(--sp-4); }
.articolo-pagina__corpo p { margin-top: var(--sp-3); }
.articolo-pagina__corpo p:first-child { margin-top: 0; }
.articolo-pagina__corpo ul, .articolo-pagina__corpo ol { margin-top: var(--sp-3); }
.lead-articolo { font-size: var(--lead); line-height: 1.5; }
.articolo-pagina__allegati, .articolo-pagina__avviso { margin-top: clamp(2.5rem, 5vw, 4rem); }
.articolo-pagina__allegati .documenti { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.articolo-pagina__ritorno { margin-top: clamp(2rem, 4vw, 3rem); }
.firma-articolo { margin-top: var(--sp-5); font-size: var(--piccolo); color: var(--inchiostro-tenue); }

/* --- Dettagli (dl) --- */
.dettagli { display: grid; gap: 0; border-top: 1px solid var(--filetto); }
.dettaglio {
  display: grid;
  grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
  gap: var(--sp-2) var(--sp-4);
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--filetto);
}
.dettaglio dt { font-size: var(--piccolo); color: var(--inchiostro-tenue); }
.dettaglio dd { font-weight: 600; }
.dettagli--date .dettaglio { grid-template-columns: minmax(0, 260px) minmax(0, 1fr); }
.dettagli--date dd { font-size: 1.1rem; }

/* --- Tabelle --- */
.tabella {
  width: 100%;
  border-collapse: collapse;
  margin-top: var(--sp-5);
  font-variant-numeric: tabular-nums;
}
.tabella caption {
  text-align: left;
  font-size: var(--piccolo);
  color: var(--inchiostro-tenue);
  padding-bottom: var(--sp-2);
}
.tabella th, .tabella td {
  text-align: left;
  padding: 0.9rem 1rem 0.9rem 0;
  border-bottom: 1px solid var(--filetto);
  vertical-align: baseline;
}
.tabella thead th {
  font-size: var(--etichetta);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--inchiostro-tenue);
  border-bottom-color: var(--filetto-forte);
}
.tabella tbody th { font-weight: 600; }
.tabella tbody tr:last-child th, .tabella tbody tr:last-child td { border-bottom: none; }

/* --- Requisiti e benefici --- */
.requisiti {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-5);
}
.requisito { padding-top: var(--sp-4); border-top: 1px solid var(--campo-filetto); }
.requisito__titolo {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 1.16rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.requisito__titolo .icona { color: var(--ambra); }
.requisito__testo { margin-top: var(--sp-2); color: var(--campo-tenue); font-size: var(--piccolo); }
.requisito .elenco-punti { margin-top: var(--sp-3); font-size: var(--piccolo); }
.requisito .elenco-punti > li { color: var(--campo-tenue); }
.requisito .elenco-punti > li::before { background: var(--ambra); }

.avvisi { margin-top: var(--sp-5); display: grid; gap: var(--sp-2); }
.avviso {
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  font-size: var(--piccolo);
  line-height: 1.5;
  color: var(--campo-tenue);
}
.avviso .icona { color: var(--ambra); margin-top: 0.15rem; }
.sezione:not(.sezione--campo) .avviso { color: var(--inchiostro-tenue); }
.sezione:not(.sezione--campo) .avviso .icona { color: var(--verde); }

.benefici { margin-top: clamp(2rem, 4vw, 3rem); display: grid; gap: var(--sp-6); }
.beneficio {
  display: grid;
  grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
  gap: var(--sp-3) clamp(1.5rem, 4vw, 3.5rem);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--filetto);
}
.beneficio__titolo {
  font-size: var(--h3);
  line-height: 1.15;
  letter-spacing: -0.015em;
  font-weight: 700;
}
.beneficio .elenco-punti { max-width: 74ch; }
.beneficio .elenco-punti > li { color: var(--inchiostro-tenue); }
.beneficio .elenco-punti strong { color: var(--inchiostro); }

/* --- Contatti --- */
.consiglio {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-4);
}
.consiglio--grande { margin-bottom: clamp(2rem, 4vw, 3rem); }
.persona { padding-top: var(--sp-3); border-top: 1px solid var(--filetto); }
.persona__nome { font-weight: 700; letter-spacing: -0.01em; }
.persona__ruolo { font-size: var(--etichetta); text-transform: uppercase; letter-spacing: 0.06em; color: var(--inchiostro-tenue); margin-top: 0.15rem; }
.persona__telefono { margin-top: var(--sp-2); }
.persona__telefono a { display: inline-flex; align-items: center; gap: 0.45rem; text-decoration: none; font-weight: 600; color: var(--inchiostro); }
.persona__telefono a:hover { color: var(--verde); }
.persona__telefono .icona { color: var(--verde); }

.recapiti { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-5); margin-bottom: clamp(2rem, 4vw, 3rem); }
.recapito p { display: flex; align-items: flex-start; gap: 0.5rem; }
.recapito .icona { color: var(--verde); margin-top: 0.2rem; }
.recapito .nota { margin-top: var(--sp-2); }

.contatti { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.75rem, 4vw, 3.5rem); align-items: start; }
.contatti__dati .consiglio { grid-template-columns: minmax(0, 1fr); gap: var(--sp-3); }
.contatti__email, .contatti__sede { margin-top: var(--sp-4); display: flex; align-items: flex-start; gap: 0.5rem; }
.contatti__email a { display: inline-flex; align-items: center; gap: 0.5rem; }
.contatti__email .icona, .contatti__sede .icona { color: var(--verde); }
.contatti__dati .bottone { margin-top: var(--sp-4); }

.aiuto { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(1.75rem, 4vw, 3.5rem); }
.aiuto .consiglio { grid-template-columns: minmax(0, 1fr); gap: var(--sp-3); }

/* --- Mappa --- */
.mappa {
  position: relative;
  border: 1px solid var(--filetto);
  border-radius: var(--raggio);
  overflow: hidden;
  background: var(--carta-scura);
  min-height: 340px;
  display: flex;
}
.mappa--larga { margin-top: var(--sp-5); min-height: 380px; }
.mappa__segnaposto {
  margin: auto;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  text-align: center;
  display: grid;
  gap: var(--sp-3);
  justify-items: center;
  max-width: 46ch;
}
.mappa__testo { font-size: var(--piccolo); color: var(--inchiostro-tenue); }
.mappa iframe { width: 100%; height: 100%; min-height: 420px; border: 0; }
.video { max-width: 960px; min-height: 240px; aspect-ratio: 16 / 9; }
.video iframe { min-height: 0; }

/* --- Chiusura --- */
.chiusura {
  background: var(--carta-scura);
  border-top: 1px solid var(--filetto);
  padding-block: clamp(2.5rem, 5vw, 4rem);
}
.chiusura__interno {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4) var(--sp-5);
}
.chiusura__titolo {
  font-size: var(--h2);
  line-height: 1.08;
  letter-spacing: -0.022em;
  font-weight: 800;
  max-width: 26ch;
  text-wrap: balance;
}
.chiusura__testo { margin-top: var(--sp-2); color: var(--inchiostro-tenue); max-width: 52ch; }
.chiusura__azioni { display: flex; flex-wrap: wrap; gap: var(--sp-3); }

/* --- Piede --- */
.piede {
  background: var(--verde-scuro);
  color: var(--campo-testo);
  padding-top: clamp(2.5rem, 5vw, 4rem);
}
.piede a { color: var(--campo-testo); text-decoration: none; }
.piede a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.piede__interno {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 0.8fr)) minmax(0, 1fr);
  gap: clamp(1.75rem, 4vw, 3rem);
  padding-bottom: clamp(2rem, 4vw, 3rem);
}
.piede__logo { border-radius: 8px; }
.piede__nome { margin-top: var(--sp-2); font-weight: 700; font-size: 1.05rem; }
.piede__nota { margin-top: var(--sp-2); font-size: var(--piccolo); color: var(--campo-tenue); max-width: 40ch; }
.piede__social { display: flex; gap: var(--sp-2); margin-top: var(--sp-4); }
.piede__social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 1px solid var(--campo-filetto);
  border-radius: var(--pillola);
}
.piede__social a:hover { border-color: var(--campo-testo); }
.piede__titolo {
  font-size: var(--etichetta);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--campo-tenue);
}
.piede__lista { margin-top: var(--sp-3); display: grid; gap: var(--sp-2); font-size: var(--piccolo); }
.piede__contatti { font-style: normal; margin-top: var(--sp-3); display: grid; gap: var(--sp-2); font-size: var(--piccolo); }
.piede__basso {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-4);
  justify-content: space-between;
  padding-block: var(--sp-4);
  border-top: 1px solid var(--campo-filetto);
  font-size: var(--etichetta);
  color: var(--campo-tenue);
}

/* --- Testata di pagina --- */
.testata-pagina { padding-block: clamp(2.5rem, 5vw, 4.5rem) clamp(1.5rem, 3vw, 2.25rem); }
.testata-pagina__titolo {
  margin-top: var(--sp-3);
  font-size: clamp(2.1rem, 1.3rem + 3.4vw, 3.6rem);
  line-height: 1.04;
  letter-spacing: -0.03em;
  font-weight: 800;
  text-wrap: balance;
  max-width: 30ch;
}
.testata-pagina__testo {
  margin-top: var(--sp-3);
  font-size: var(--lead);
  line-height: 1.5;
  color: var(--inchiostro-tenue);
  max-width: 64ch;
}

.briciole { font-size: var(--etichetta); }
.briciole ol { display: flex; flex-wrap: wrap; gap: 0.45rem; }
.briciole li + li::before { content: "/"; margin-right: 0.45rem; color: var(--filetto-forte); }
.briciole a { color: var(--inchiostro-tenue); text-decoration: none; }
.briciole a:hover { color: var(--inchiostro); text-decoration: underline; text-underline-offset: 0.2em; }
.briciole [aria-current="page"] { color: var(--inchiostro); font-weight: 600; }

/* --- Scheda societaria --- */
.scheda-societaria {
  border: 1px solid var(--filetto);
  border-radius: var(--raggio);
  padding: clamp(1.5rem, 4vw, 2.75rem);
  background: var(--carta);
}
.scheda-societaria__denominazione { font-size: clamp(1.3rem, 1rem + 1.4vw, 1.85rem); font-weight: 800; letter-spacing: -0.02em; line-height: 1.15; }
.scheda-societaria__forma { margin-top: 0.35rem; font-size: var(--piccolo); color: var(--inchiostro-tenue); }
.scheda-societaria .dettagli { margin-top: var(--sp-5); }
.scheda-inline { margin-top: var(--sp-3); padding: var(--sp-4); border: 1px solid var(--filetto); border-radius: var(--raggio); background: var(--carta-scura); display: grid; gap: 0.3rem; }

/* --- Crediti --- */
.crediti { display: grid; gap: var(--sp-4); }
.credito {
  display: grid;
  grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
  gap: var(--sp-4);
  align-items: start;
  padding-bottom: var(--sp-4);
  border-bottom: 1px solid var(--filetto);
}
.credito__foto { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--raggio-piccolo); }
.credito__titolo { font-weight: 700; }
.credito__autore { font-size: var(--piccolo); color: var(--inchiostro-tenue); }
.credito__licenza { font-size: var(--piccolo); }
.credito__uso { margin-top: var(--sp-2); font-size: var(--etichetta); color: var(--inchiostro-tenue); }

/* --- Nota tecnica --- */
.nota-tecnica {
  margin-top: var(--sp-6);
  border: 1px solid var(--filetto-forte);
  border-radius: var(--raggio);
  background: var(--carta-scura);
  padding: clamp(1.25rem, 3vw, 1.85rem);
}
.nota-tecnica h2 { margin-top: 0; font-size: 1.1rem; }

/* --- Indice delle informative --- */
.informativa {
  display: grid;
  grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: start;
}
.indice { position: sticky; top: 7rem; font-size: var(--piccolo); }
.indice__titolo {
  font-size: var(--etichetta);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  color: var(--inchiostro-tenue);
}
.indice ol { margin-top: var(--sp-3); display: grid; border-top: 1px solid var(--filetto); }
.indice a {
  display: block;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--filetto);
  color: var(--inchiostro);
  text-decoration: none;
  line-height: 1.35;
}
.indice a:hover { color: var(--verde); }
.prosa h2[id] { scroll-margin-top: 7rem; }
.prosa .tabella { margin-top: var(--sp-4); font-size: var(--piccolo); }
/* Nelle celle di testo le cifre tabellari allargano anche la punteggiatura. */
.tabella--schede, .tabella--schede td { font-variant-numeric: normal; }
.prosa .tabella td, .prosa .tabella th { vertical-align: top; }
.prosa .tabella code, .nome-cookie { font: inherit; font-weight: 700; word-break: break-word; }
.aggiornamento { margin-top: var(--sp-6); padding-top: var(--sp-4); border-top: 1px solid var(--filetto); font-size: var(--piccolo); color: var(--inchiostro-tenue); }
.scelta-cookie {
  margin-top: var(--sp-4);
  padding: clamp(1.25rem, 3vw, 1.85rem);
  border: 1px solid var(--filetto);
  border-radius: var(--raggio);
  background: var(--carta-scura);
  display: grid;
  gap: var(--sp-3);
  justify-items: start;
}
.scelta-cookie p { margin: 0; }

/* --- Consenso ai cookie --- */
.solo-js { display: none; }
html.js .solo-js { display: revert; }
.piede__bottone {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: var(--campo-testo);
  cursor: pointer;
  text-align: left;
}
.piede__bottone:hover { text-decoration: underline; text-underline-offset: 0.2em; }

.consenso {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 40;
  background: var(--verde-scuro);
  color: var(--campo-testo);
  border-top: 1px solid var(--campo-filetto);
  padding-block: clamp(1.1rem, 2.4vw, 1.6rem);
  animation: consenso-sale 0.5s var(--ease) both;
}
.consenso[hidden] { display: none; }
@keyframes consenso-sale { from { transform: translateY(100%); } }
.consenso__interno {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: var(--sp-3) clamp(1.25rem, 3vw, 2.5rem);
  align-items: center;
}
.consenso__titolo { font-size: 1.16rem; font-weight: 700; letter-spacing: -0.01em; line-height: 1.2; }
.consenso__testo p { margin-top: 0.35rem; font-size: var(--piccolo); line-height: 1.5; color: var(--campo-tenue); max-width: 74ch; }
.consenso a { color: var(--campo-testo); white-space: nowrap; }
.consenso__azioni { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-3); }
.consenso .bottone--testo { color: var(--campo-testo); text-decoration: underline; text-underline-offset: 0.2em; font-weight: 600; }
.consenso .bottone--testo:hover { color: var(--ambra); }
.consenso__chiudi, .preferenze__chiudi {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: var(--raggio-piccolo);
  background: none;
  color: inherit;
  cursor: pointer;
  transition: border-color 0.18s var(--ease);
}
.consenso__chiudi:hover { border-color: var(--campo-filetto); }
.preferenze__chiudi:hover { border-color: var(--filetto-forte); }
.consenso :focus-visible { outline-color: var(--ambra); }

.preferenze {
  width: min(600px, calc(100vw - 2rem));
  max-height: calc(100dvh - 2rem);
  padding: 0;
  border: 1px solid var(--filetto-forte);
  border-radius: var(--raggio);
  background: var(--carta);
  color: var(--inchiostro);
  overflow: auto;
  overscroll-behavior: contain;
}
.preferenze::backdrop { background: rgba(20, 24, 26, 0.58); }
.preferenze[open] { animation: preferenze-entra 0.32s var(--ease) both; }
@keyframes preferenze-entra { from { opacity: 0; transform: translateY(12px); } }
.preferenze__modulo { padding: clamp(1.25rem, 4vw, 2rem); }
.preferenze__testa { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.preferenze__titolo { font-size: var(--h3); line-height: 1.2; letter-spacing: -0.012em; font-weight: 700; }
.preferenze__intro { margin-top: var(--sp-2); font-size: var(--piccolo); color: var(--inchiostro-tenue); }
.preferenze__elenco { margin-top: var(--sp-4); border-top: 1px solid var(--filetto); }
.preferenza {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--sp-3) var(--sp-4);
  align-items: center;
  padding-block: var(--sp-3);
  border-bottom: 1px solid var(--filetto);
}
.preferenza__nome { font-weight: 700; letter-spacing: -0.01em; }
.preferenza__testo { margin-top: 0.15rem; font-size: var(--piccolo); line-height: 1.45; color: var(--inchiostro-tenue); }
.preferenza__fisso { font-size: var(--etichetta); font-weight: 700; color: var(--verde); white-space: nowrap; }
.preferenze__azioni { margin-top: var(--sp-4); display: flex; flex-wrap: wrap; gap: var(--sp-2); }

.interruttore {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  flex: none;
  width: 54px;
  height: 32px;
  margin: 0;
  border: 1px solid var(--inchiostro-tenue);
  border-radius: var(--pillola);
  background: var(--carta);
  cursor: pointer;
  transition: background-color 0.2s var(--ease), border-color 0.2s var(--ease);
}
.interruttore::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--inchiostro-tenue);
  transition: transform 0.2s var(--ease), background-color 0.2s var(--ease);
}
.interruttore:checked { background: var(--verde); border-color: var(--verde); }
.interruttore:checked::before { transform: translateX(22px); background: var(--carta); }

/* --- Linee di campo: lo sfondo animato (disegnato da sito.js) --- */
.con-linee { position: relative; isolation: isolate; }
.linee {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
}

/* --- Passaggio tra le pagine --- */
@view-transition { navigation: auto; }
.testata { view-transition-name: testata; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 0.22s; }

/* --- Movimento d'ingresso --- */
@media (prefers-reduced-motion: no-preference) {
  /* L'apertura della home arriva in tre tempi; la fotografia si scopre da destra. */
  .apertura__titolo, .apertura__sommario, .apertura__azioni, .apertura__nota,
  .testata-pagina__titolo, .testata-pagina__testo {
    animation: sale 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .apertura__sommario, .testata-pagina__testo { animation-delay: 0.08s; }
  .apertura__azioni { animation-delay: 0.16s; }
  .apertura__nota { animation-delay: 0.24s; }
  .foto--apertura img { animation: scopre 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both; }

  /* I tre passi: il filetto d'ambra corre da un passo al successivo. */
  html.js [data-sequenza] .passo { position: relative; }
  html.js [data-sequenza] .passo::before {
    content: "";
    position: absolute;
    top: -1px; left: 0; right: 0;
    height: 2px;
    background: var(--ambra);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.7s var(--ease);
  }
  html.js [data-sequenza] .passo > * { opacity: 0.35; transition: opacity 0.5s var(--ease); }
  html.js [data-sequenza].dentro .passo::before { transform: scaleX(1); }
  html.js [data-sequenza].dentro .passo > * { opacity: 1; }
  html.js [data-sequenza] .passo:nth-child(2)::before, html.js [data-sequenza] .passo:nth-child(2) > * { transition-delay: 0.45s; }
  html.js [data-sequenza] .passo:nth-child(3)::before, html.js [data-sequenza] .passo:nth-child(3) > * { transition-delay: 0.9s; }
}
@keyframes sale { from { opacity: 0; transform: translateY(18px); } }
@keyframes scopre {
  from { clip-path: inset(0 0 0 100% round 14px); }
  to { clip-path: inset(0 0 0 0 round 14px); }
}

/* --- Rivelazione discreta dei blocchi (con JS attivo) --- */
html.js [data-rivela] {
  opacity: 0;
  transform: translateY(14px);
}
html.js [data-rivela].dentro {
  opacity: 1;
  transform: none;
  transition: opacity 0.6s var(--ease), transform 0.6s var(--ease);
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  html.js [data-rivela] { opacity: 1; transform: none; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* --- Responsive --- */
@media (max-width: 1080px) {
  .documenti { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .piede__interno { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .testata__apri { display: inline-flex; align-items: center; }
  .nav {
    position: absolute;
    inset: 100% 0 auto 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: var(--sp-3);
    margin: 0;
    padding: var(--sp-4) clamp(1.15rem, 4vw, 2.5rem) var(--sp-5);
    background: var(--carta);
    border-bottom: 1px solid var(--filetto);
    max-height: calc(100dvh - 84px);
    overflow: auto;
  }
  .nav[data-aperta] { display: flex; }
  .nav__lista { flex-direction: column; align-items: stretch; gap: 0; }
  .nav__link { padding-block: 0.7rem; border-bottom: 1px solid var(--filetto); }
  .nav__link::after { display: none; }
  .nav__azioni { flex-direction: column; align-items: stretch; gap: var(--sp-2); }
  .nav__azioni .bottone { justify-content: center; }

  .apertura__interno { grid-template-columns: minmax(0, 1fr); }
  .foto--apertura { order: -1; }
  .fatti { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4) 0; }
  .fatto:nth-child(odd) { padding-left: 0; border-left: none; }
  .passi { grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); }
  .incentivi { grid-template-columns: minmax(0, 1fr); }
  .strade { grid-template-columns: minmax(0, 1fr); }
  .perimetro { grid-template-columns: minmax(0, 1fr); }
  .requisiti { grid-template-columns: minmax(0, 1fr); }
  .beneficio { grid-template-columns: minmax(0, 1fr); }
  .consiglio { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contatti { grid-template-columns: minmax(0, 1fr); }
  .aiuto { grid-template-columns: minmax(0, 1fr); }
  .recapiti { grid-template-columns: minmax(0, 1fr); }
  .informativa { grid-template-columns: minmax(0, 1fr); }
  .indice { position: static; }
  .consenso__interno { grid-template-columns: minmax(0, 1fr) auto; }
  .consenso__testo { grid-column: 1; grid-row: 1; }
  .consenso__chiudi { grid-column: 2; grid-row: 1; align-self: start; }
  .consenso__azioni { grid-column: 1 / -1; }
  .elenco-articoli--esteso .voce-articolo { grid-template-columns: minmax(0, 1fr); }
  .voce-articolo__foto { max-width: 340px; }
  .articolo-pagina__allegati .documenti { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 620px) {
  :root { --testo: 1.03125rem; }
  .documenti { grid-template-columns: minmax(0, 1fr); }
  .fatti { grid-template-columns: minmax(0, 1fr); }
  .fatto { padding-inline: 0; }
  .fatto + .fatto { border-left: none; border-top: 1px solid var(--filetto); padding-top: var(--sp-4); }
  .consiglio { grid-template-columns: minmax(0, 1fr); }
  .piede__interno { grid-template-columns: minmax(0, 1fr); }
  .dettaglio { grid-template-columns: minmax(0, 1fr); gap: 0.15rem; }
  .credito { grid-template-columns: minmax(0, 1fr); }
  .chiusura__azioni { width: 100%; }
  .consenso__azioni .bottone--campo { flex: 1 1 0; justify-content: center; }
  .consenso__azioni .bottone--testo { flex-basis: 100%; justify-content: center; padding-block: 0.4rem; }
  .preferenze__azioni .bottone { flex: 1 1 100%; justify-content: center; }
  /* Tabelle delle informative: ogni riga diventa una scheda con le etichette. */
  .tabella--schede thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .tabella--schede tr { display: block; padding-block: var(--sp-3); border-bottom: 1px solid var(--filetto); }
  .tabella--schede tbody tr:last-child { border-bottom: none; }
  .tabella--schede th, .tabella--schede td { display: block; padding: 0.15rem 0; border: 0; }
  .tabella--schede td[data-etichetta]::before {
    content: attr(data-etichetta) ": ";
    font-weight: 600;
    color: var(--inchiostro-tenue);
  }
  .chiusura__azioni .bottone { flex: 1 1 auto; justify-content: center; }
}

/* --- Stampa --- */
@media print {
  .testata, .piede, .chiusura, .salta, .mappa, .consenso, .preferenze, .linee, .indice { display: none !important; }
  .sezione--campo { background: none; color: #000; }
  .sezione--campo .intestazione__testo, .nota-campo { color: #333; }
  a { color: #000; }
}
