/* ==========================================================================
   Con Te ODV — foglio di stile
   Pensato per lettori anziani: testo grande, contrasto alto, pulsanti ampi.
   Colori del marchio dal logo (oliva #A1A429, ambra #E2A103); vedi 01-archivio-brand/palette.md
   ========================================================================== */

:root {
  --oliva: #A1A429;
  --ambra: #E2A103;
  --notte: #1F2A4D;
  --grigio: #4A5470;
  --oliva-s: #5E6012;
  --ambra-s: #8A5A00;
  --crema: #FBF8EC;
  --sabbia: #F1EACB;

  --sfondo: var(--crema);
  --carta: #FFFFFF;
  --sezione: var(--sabbia);
  --testo: var(--notte);
  --testo-2: var(--grigio);
  --titoli: var(--notte);
  --bordo: #D9D2AE;
  --sottolinea: var(--ambra);
  --focus: var(--ambra-s);
  --errore: #9B1C1C;
  --ok-sfondo: #EEF0C8;

  /* Caratteri di sistema, moderni e già presenti su ogni dispositivo: nessun file da scaricare */
  --f-testo: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Roboto, Arial, sans-serif;
  --f-titoli: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Roboto, Arial, sans-serif;
  --raggio: 16px;
  --ombra: 0 2px 0 rgba(31, 42, 77, .06), 0 14px 30px -18px rgba(31, 42, 77, .35);
  --larghezza: 1120px;
}

/* Dimensione del testo scelta dal lettore (pulsanti A− / A+) */
html { font-size: 112.5%; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
html[data-size="1"] { font-size: 125%; }
html[data-size="2"] { font-size: 137.5%; }
html[data-size="3"] { font-size: 150%; }
html[data-size="-1"] { font-size: 100%; }

/* Alto contrasto: giallo su nero */
html[data-contrast="alto"] {
  --sfondo: #000; --carta: #000; --sezione: #111;
  --testo: #fff; --testo-2: #f0f0f0; --titoli: #FFD400;
  --bordo: #fff; --sottolinea: #FFD400; --focus: #FFD400;
  --errore: #ff9d9d; --ok-sfondo: #001a00;
  --ambra: #FFD400; --ambra-s: #FFD400; --oliva-s: #FFD400; --notte: #fff;
}

*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0; background: var(--sfondo); color: var(--testo);
  font: 1rem/1.7 var(--f-testo); text-rendering: optimizeLegibility;
}
img, svg { max-width: 100%; }
h1, h2, h3 { font-family: var(--f-titoli); font-weight: 800; color: var(--titoli); line-height: 1.15; margin: 0 0 .6em; letter-spacing: -.015em; }
h1 { font-size: clamp(2.1rem, 1.2rem + 3.6vw, 3.4rem); letter-spacing: -.025em; }
h2 { font-size: clamp(1.65rem, 1.2rem + 1.6vw, 2.35rem); }
h3 { font-size: 1.3rem; }
p { margin: 0 0 1em; }
ul, ol { padding-left: 1.3em; margin: 0 0 1em; }
li { margin-bottom: .4em; }
a { color: var(--testo); font-weight: 700; text-decoration: underline; text-decoration-color: var(--sottolinea);
    text-decoration-thickness: 3px; text-underline-offset: 4px; }
a:hover { color: var(--oliva-s); text-decoration-thickness: 4px; }
html[data-contrast="alto"] a:hover { color: #fff; }
:focus-visible { outline: 4px solid var(--focus); outline-offset: 3px; border-radius: 4px; }
[hidden] { display: none !important; }

.salta { position: absolute; left: .5rem; top: -4rem; background: var(--notte); color: #fff; padding: .8rem 1.2rem; z-index: 100; border-radius: 8px; }
.salta:focus { top: .5rem; }
.contenitore { width: min(var(--larghezza), calc(100% - 2rem)); margin-inline: auto; }
.ico { width: 1.35em; height: 1.35em; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; vertical-align: -.25em; }

/* ---------- Strumenti di lettura ---------- */
.strumenti { background: var(--sezione); border-bottom: 1px solid var(--bordo); font-size: .85rem; }
.strumenti-riga { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; padding-block: .5rem; }
.strumenti-titolo { font-weight: 700; }
.gruppo { display: inline-flex; gap: .3rem; }
.strumenti button {
  font: inherit; font-weight: 700; color: var(--testo); background: var(--carta);
  border: 2px solid var(--testo); border-radius: 10px; min-height: 2.75rem; min-width: 2.75rem;
  padding: .3rem .8rem; cursor: pointer; display: inline-flex; align-items: center; gap: .4rem;
}
.strumenti button:hover { background: var(--ambra); color: #000; }
.strumenti button[aria-pressed="true"] { background: var(--notte); color: #fff; }
html[data-contrast="alto"] .strumenti button[aria-pressed="true"] { background: #FFD400; color: #000; }
.emergenza { margin-left: auto; display: inline-flex; align-items: center; gap: .4rem; }

/* ---------- Testata ---------- */
.testata { background: var(--carta); border-bottom: 5px solid var(--oliva); position: relative; }
.testata::after { content: ""; position: absolute; right: 0; bottom: -5px; width: 50%; height: 5px; background: var(--ambra); }
.testata-riga { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.2rem; padding-block: .8rem; }
.marchio { display: flex; align-items: center; gap: .8rem; text-decoration: none; color: var(--testo); }
.marchio img { display: block; width: 64px; height: 64px; }
.marchio-testo { display: flex; flex-direction: column; line-height: 1.15; }
.marchio-testo strong { font: 700 1.7rem var(--f-titoli); color: var(--titoli); }
.marchio-testo small { font-weight: 400; font-size: .8rem; color: var(--testo-2); }
.menu { display: none; width: 100%; flex-direction: column; gap: .2rem; order: 5; }
.menu.aperto { display: flex; }
.menu a { text-decoration: none; padding: .85rem 1rem; border-radius: 12px; border: 2px solid transparent; font-size: 1.05rem; }
.menu a:hover { background: var(--sezione); }
.menu a[aria-current="page"] { background: var(--notte); color: #fff; }
html[data-contrast="alto"] .menu a[aria-current="page"] { background: #FFD400; color: #000; }
.menu-bottone {
  margin-left: auto; font: inherit; font-weight: 700; color: var(--testo); background: var(--carta);
  border: 3px solid var(--testo); border-radius: 12px; min-height: 3.25rem; padding: .4rem 1rem;
  display: inline-flex; align-items: center; gap: .5rem; cursor: pointer;
}
.testata .testata-chiama { display: none; }
.marchio { flex: 1 1 auto; min-width: 0; }
.marchio img { width: 56px; height: 56px; }
.marchio-testo small { font-size: .72rem; }
.menu-bottone { flex: none; min-height: 3rem; padding: .3rem .9rem; border-width: 2px; }
@media (max-width: 61.99rem) {
  .strumenti-titolo, .emergenza { display: none; }
  .strumenti-riga { gap: .4rem .5rem; padding-block: .4rem; }
  .strumenti button { padding: .3rem .6rem; font-size: .8rem; }
}

/* ---------- Pulsanti ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem; text-align: center;
  min-height: 3.5rem; padding: .7rem 1.5rem; border-radius: 14px; border: 3px solid transparent;
  font: 700 1.05rem/1.25 var(--f-testo); text-decoration: none; cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.btn:hover { transform: translateY(-1px); text-decoration: none; }
.btn:active { transform: translateY(2px); }
.btn-primario { background: var(--ambra); color: #1F2A4D; box-shadow: 0 4px 0 var(--ambra-s); }
.btn-primario:hover { color: #1F2A4D; box-shadow: 0 6px 0 var(--ambra-s); }
.btn-secondario { background: var(--carta); color: var(--testo); border-color: var(--testo); }
.btn-secondario:hover { background: var(--sezione); color: var(--testo); }
.btn-oliva { background: var(--oliva-s); color: #fff; box-shadow: 0 4px 0 #3C3E0A; }
.btn-oliva:hover { color: #fff; }
.btn-piccolo { min-height: 2.9rem; padding: .4rem 1.1rem; font-size: .95rem; }
html[data-contrast="alto"] .btn-primario { background: #FFD400; color: #000; border-color: #fff; box-shadow: none; }
html[data-contrast="alto"] .btn-primario:hover { color: #000; }
html[data-contrast="alto"] .btn-secondario { background: #000; color: #FFD400; border-color: #FFD400; }
html[data-contrast="alto"] .btn-oliva { background: #000; color: #fff; border-color: #fff; box-shadow: none; }

/* ---------- Sezioni ---------- */
.sezione { padding-block: clamp(2.4rem, 6vw, 4.2rem); }
.sezione-alt { background: var(--sezione); }
.con-marchio::before { content: ""; display: block; width: 3.4rem; height: .9rem; margin-bottom: .9rem;
  background: linear-gradient(90deg, var(--oliva) 50%, var(--ambra) 50%); }
.lead { font-size: 1.2rem; line-height: 1.65; max-width: 46rem; }
.sopratitolo { font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: .85rem; color: var(--ambra-s); margin-bottom: .6rem; }
html[data-contrast="alto"] .sopratitolo { color: #FFD400; }
.intro { max-width: 46rem; }
.griglia { display: grid; gap: 1.2rem; }
.griglia > * { min-width: 0; }
a[href^="mailto:"], a[href^="tel:"] { overflow-wrap: anywhere; }
.griglia-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); }
.griglia-3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
.carta { background: var(--carta); border: 2px solid var(--bordo); border-radius: var(--raggio); padding: 1.4rem; box-shadow: var(--ombra); }
html[data-contrast="alto"] .carta { border-color: #fff; box-shadow: none; }
.carta h3 { margin-top: 0; }
.carta > .tessera-ico { margin-bottom: .9rem; }
.nota { font-size: .95rem; color: var(--testo-2); }
.avviso { display: flex; gap: .8rem; align-items: flex-start; background: var(--ok-sfondo); border: 2px solid var(--oliva-s); border-radius: 12px; padding: 1rem 1.2rem; margin-block: 1.2rem; }
.avviso .ico { margin-top: .2rem; color: var(--oliva-s); }
.avviso p { margin: 0; }
html[data-contrast="alto"] .avviso { border-color: #FFD400; }
.azioni { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 1.4rem; }

/* ---------- Eroe (Home) ---------- */
.eroe { padding-block: clamp(2rem, 6vw, 4.5rem); background:
  radial-gradient(circle at 92% 8%, rgba(226,161,3,.18) 0 14rem, transparent 14.1rem), var(--sfondo); }
html[data-contrast="alto"] .eroe { background: #000; }
.eroe-griglia { display: grid; gap: 2rem; align-items: center; }
.eroe-logo { justify-self: center; width: min(320px, 78%); background: #fff; padding: 1rem; border-radius: 20px; box-shadow: var(--ombra); border: 2px solid var(--bordo); }
.eroe-logo img { display: block; width: 100%; height: auto; }
.eroe-logo figcaption { text-align: center; font-size: .85rem; color: #4A5470; padding-top: .6rem; }

/* ---------- Tessere dei bisogni ---------- */
.tessere { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.tessere li { margin: 0; }
.tessera {
  display: flex; flex-direction: column; gap: .7rem; height: 100%; text-decoration: none; color: var(--testo);
  background: var(--carta); border: 2px solid var(--bordo); border-radius: var(--raggio); padding: 1.3rem; box-shadow: var(--ombra);
  transition: transform .12s ease, border-color .12s ease;
}
.tessera:hover { transform: translateY(-3px); border-color: var(--oliva-s); color: var(--testo); }
html[data-contrast="alto"] .tessera { border-color: #fff; }
.tessera-ico { width: 3.6rem; height: 3.6rem; display: grid; place-items: center; background: var(--ambra); color: #1F2A4D; border-radius: 10px; }
.tessera-ico .ico { width: 2rem; height: 2rem; }
html[data-contrast="alto"] .tessera-ico { color: #000; }
.tessera strong { font: 700 1.25rem/1.25 var(--f-titoli); color: var(--titoli); }
.tessera span.sotto { color: var(--testo-2); font-weight: 400; font-size: .95rem; }
.tessera .vai { margin-top: auto; display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; }

/* ---------- Passi ---------- */
.passi { list-style: none; padding: 0; counter-reset: p; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.passi li { counter-increment: p; background: var(--carta); border: 2px solid var(--bordo); border-radius: var(--raggio); padding: 1.3rem 1.3rem 1.3rem 1.3rem; position: relative; margin: 0; }
html[data-contrast="alto"] .passi li { border-color: #fff; }
.passi li::before { content: counter(p); display: grid; place-items: center; width: 3rem; height: 3rem; background: var(--oliva-s); color: #fff;
  font: 700 1.6rem var(--f-titoli); margin-bottom: .7rem; }
html[data-contrast="alto"] .passi li::before { background: #FFD400; color: #000; }
.passi strong { display: block; font: 700 1.2rem var(--f-titoli); margin-bottom: .3rem; color: var(--titoli); }

/* ---------- Pannello «In breve» (Home) ---------- */
.rapido { background: var(--carta); border: 2px solid var(--bordo); border-radius: var(--raggio); padding: 1.4rem; box-shadow: var(--ombra); }
.rapido h2 { display: flex; align-items: center; gap: .6rem; font-size: 1.3rem; margin-bottom: .9rem; }
.rapido h2 img { width: 44px; height: 44px; border-radius: 10px; }
.rapido-lista { list-style: none; padding: 0; margin: 0; display: grid; gap: .9rem; }
.rapido-lista li { display: flex; gap: .8rem; align-items: flex-start; margin: 0; line-height: 1.5; }
.rapido-lista .ico { width: 1.7rem; height: 1.7rem; color: var(--oliva-s); margin-top: .15rem; }
.rapido-lista strong { display: block; }
.rapido-lista a { display: inline-block; font-size: 1.15rem; margin: .1rem .3rem .1rem 0; overflow-wrap: anywhere; }
html[data-contrast="alto"] .rapido { border-color: #fff; box-shadow: none; }
html[data-contrast="alto"] .rapido-lista .ico { color: #FFD400; }

/* ---------- Etichetta a pillola ---------- */
.chip { display: inline-flex; align-items: center; gap: .4rem; background: var(--sezione); border: 2px solid var(--bordo); border-radius: 999px; padding: .3rem .9rem; font-weight: 700; font-size: .95rem; margin-bottom: .8rem; }
html[data-contrast="alto"] .chip { border-color: #fff; }

/* ---------- Banda «suggerimenti» ---------- */
.banda { display: grid; gap: 1.2rem; align-items: center; }
.banda .azioni { margin-top: 0; }
.banda .lead { margin-bottom: 0; }
@media (min-width: 62rem) { .banda { grid-template-columns: 1fr auto; } }

/* ---------- Dati in evidenza e persone ---------- */
.dato { text-align: center; }
.dato b { display: block; font: 800 clamp(2.2rem, 1.6rem + 2.4vw, 3rem)/1.1 var(--f-titoli); color: var(--oliva-s); }
html[data-contrast="alto"] .dato b { color: #FFD400; }
.persone { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
.persone li { margin: 0; }
.persona-ruolo { display: block; font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ambra-s); font-weight: 700; margin-bottom: .25rem; }
html[data-contrast="alto"] .persona-ruolo { color: #FFD400; }
.persona strong { font: 700 1.2rem/1.25 var(--f-titoli); color: var(--titoli); }
.piede-sotto { font-size: .9rem; opacity: .9; }

/* ---------- Servizi a fisarmonica ---------- */
.servizio { background: var(--carta); border: 2px solid var(--bordo); border-radius: var(--raggio); margin-bottom: 1rem; box-shadow: var(--ombra); scroll-margin-top: 1rem; }
html[data-contrast="alto"] .servizio { border-color: #fff; box-shadow: none; }
.servizio summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.3rem; min-height: 4.5rem; }
.servizio summary::-webkit-details-marker { display: none; }
.servizio summary .tessera-ico { width: 3.2rem; height: 3.2rem; flex: none; }
.servizio summary .servizio-titolo { font: 700 1.3rem/1.25 var(--f-titoli); color: var(--titoli); flex: 1; margin: 0; padding: 0; }
.servizio summary .freccia { transition: transform .2s ease; width: 1.8rem; height: 1.8rem; }
.servizio[open] summary .freccia { transform: rotate(180deg); }
.servizio[open] summary { border-bottom: 2px solid var(--bordo); }
.servizio-corpo { padding: 1.3rem; }
.servizio-corpo h3 { font: 700 1rem var(--f-testo); letter-spacing: .06em; text-transform: uppercase; color: var(--ambra-s); margin: 1.2rem 0 .3rem; }
html[data-contrast="alto"] .servizio-corpo h3 { color: #FFD400; }
.servizio-corpo h3:first-child { margin-top: 0; }

/* ---------- Eventi / novità ---------- */
.eventi { display: grid; gap: 1rem; }
.evento { background: var(--carta); border: 2px solid var(--bordo); border-left: 10px solid var(--oliva); border-radius: 12px; padding: 1.1rem 1.3rem; }
.evento[data-tipo="appuntamento"] { border-left-color: var(--ambra); }
html[data-contrast="alto"] .evento { border-color: #fff; border-left-color: #FFD400; }
.evento-quando { display: inline-block; font-weight: 700; font-size: .9rem; background: var(--sezione); border-radius: 8px; padding: .15rem .7rem; margin-bottom: .5rem; }
.evento h3, .evento h2 { margin: 0 0 .4rem; font-size: 1.25rem; }
.evento p { margin-bottom: .6rem; }
.evento-luogo { color: var(--testo-2); font-size: .95rem; }
.filtri { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1.5rem; }
.filtri button { font: 700 1rem var(--f-testo); min-height: 3rem; padding: .4rem 1.2rem; border-radius: 999px; border: 2px solid var(--testo); background: var(--carta); color: var(--testo); cursor: pointer; }
.filtri button[aria-pressed="true"] { background: var(--notte); color: #fff; }
html[data-contrast="alto"] .filtri button[aria-pressed="true"] { background: #FFD400; color: #000; }

/* ---------- Moduli ---------- */
.modulo { display: grid; gap: 1.2rem; }
.campo label, .campo legend { display: block; font-weight: 700; margin-bottom: .35rem; font-size: 1.05rem; }
.campo .aiuto { font-weight: 400; font-size: .9rem; color: var(--testo-2); display: block; margin-top: .25rem; }
.campo input[type="text"], .campo input[type="tel"], .campo select, .campo textarea {
  width: 100%; font: inherit; color: #1F2A4D; background: #fff; border: 3px solid #4A5470; border-radius: 12px; min-height: 3.5rem; padding: .7rem 1rem;
}
.campo textarea { min-height: 7rem; resize: vertical; }
.campo input:focus, .campo select:focus, .campo textarea:focus { border-color: var(--notte); outline: 4px solid var(--ambra); outline-offset: 2px; }
.campo fieldset { border: 0; padding: 0; margin: 0; }
.opzioni { display: flex; flex-wrap: wrap; gap: .8rem; }
.opzione { display: flex; align-items: center; gap: .6rem; background: var(--carta); border: 3px solid #4A5470; border-radius: 12px; padding: .7rem 1.1rem; min-height: 3.5rem; cursor: pointer; font-weight: 700; color: var(--testo); }
.opzione input { width: 1.5rem; height: 1.5rem; accent-color: var(--oliva-s); margin: 0; }
.consenso { display: flex; gap: .8rem; align-items: flex-start; }
.consenso input { width: 1.7rem; height: 1.7rem; flex: none; margin-top: .15rem; accent-color: var(--oliva-s); }
.errore { color: var(--errore); font-weight: 700; margin-top: .3rem; }
.campo-errato input, .campo-errato select { border-color: var(--errore) !important; }
.esito { border-radius: 12px; padding: 1.2rem 1.4rem; margin-top: 1rem; border: 3px solid var(--oliva-s); background: var(--ok-sfondo); }
.esito h3 { margin-top: 0; }
.trappola { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Tabelle e documenti ---------- */
.elenco-doc { list-style: none; padding: 0; display: grid; gap: .8rem; }
.elenco-doc a { display: flex; gap: .8rem; align-items: center; background: var(--carta); border: 2px solid var(--bordo); border-radius: 12px; padding: 1rem 1.2rem; text-decoration: none; min-height: 3.5rem; }
.elenco-doc a:hover { border-color: var(--oliva-s); }
html[data-contrast="alto"] .elenco-doc a { border-color: #fff; }
.tabella { width: 100%; border-collapse: collapse; background: var(--carta); font-size: .95rem; }
.tabella th, .tabella td { border: 2px solid var(--bordo); padding: .7rem .9rem; text-align: left; vertical-align: top; }
.tabella th { background: var(--sezione); }
.tabella-scorri { overflow-x: auto; }
.cf { font: 700 1.6rem/1 var(--f-titoli); letter-spacing: .05em; background: var(--sezione); border: 2px dashed var(--testo); border-radius: 10px; padding: .8rem 1.1rem; display: inline-block; }
.cronologia { list-style: none; padding: 0; border-left: 5px solid var(--oliva); margin-left: .6rem; }
.cronologia li { padding: 0 0 1.2rem 1.4rem; position: relative; margin: 0; }
.cronologia li::before { content: ""; position: absolute; left: -.95rem; top: .55rem; width: 1rem; height: 1rem; background: var(--ambra); }
.cronologia b { font-family: var(--f-titoli); font-size: 1.2rem; color: var(--titoli); }

/* ---------- Galleria fotografica ---------- */
.galleria { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 36rem) { .galleria { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 72rem) { .galleria { grid-template-columns: repeat(4, 1fr); } .galleria.galleria-3 { grid-template-columns: repeat(3, 1fr); } }
.galleria figure { margin: 0; border-radius: var(--raggio); overflow: hidden; background: var(--carta); border: 2px solid var(--bordo); box-shadow: var(--ombra); }
.galleria img { display: block; width: 100%; height: 13rem; object-fit: cover; }
.galleria figcaption { padding: .7rem 1rem; font-weight: 700; font-size: .95rem; }
html[data-contrast="alto"] .galleria figure { border-color: #fff; }

/* ---------- Barra mobile e piè di pagina ---------- */
.barra-chiama { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem;
  padding: .6rem .8rem calc(.6rem + env(safe-area-inset-bottom)); background: var(--carta); border-top: 4px solid var(--oliva); box-shadow: 0 -8px 20px -12px rgba(0,0,0,.4); }
.barra-chiama .btn { min-height: 3.25rem; padding-inline: .6rem; }
body { padding-bottom: 5rem; }
.piede { background: var(--notte); color: #fff; margin-top: 2rem; }
html[data-contrast="alto"] .piede { background: #000; border-top: 4px solid #FFD400; }
.piede a { color: #fff; text-decoration-color: var(--ambra); }
.piede a:hover { color: #FFE9A6; }
.piede :focus-visible { outline-color: #FFD35A; }
.piede h2 { color: #fff; font-size: 1.25rem; }
.piede-griglia { display: grid; gap: 2rem; padding-block: 2.5rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.piede-griglia p { margin-bottom: .6rem; }
.piede-griglia img { background: #fff; padding: 4px; margin-bottom: .6rem; }
.piede-link { list-style: none; padding: 0; }
.piede-fondo { border-top: 1px solid rgba(255,255,255,.25); padding-block: 1.4rem 2rem; font-size: .9rem; }
.piede-sostenitori { border-top: 1px solid rgba(255,255,255,.25); padding-block: 1.6rem .4rem; }
.piede-sostenitori h2 { margin-bottom: .6rem; }
.piede-etichetta { margin: .8rem 0 .5rem; font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; opacity: .9; }
.sostenitori { list-style: none; padding: 0; margin: 0 0 .6rem; display: flex; flex-wrap: wrap; gap: .7rem; }
.sostenitori li { margin: 0; display: flex; align-items: center; gap: .7rem; background: #fff; color: #1F2A4D; border-radius: 14px; padding: .55rem 1rem; min-height: 3.6rem; font-weight: 700; font-size: .92rem; line-height: 1.25; max-width: 100%; }
.sostenitori img { height: 3rem; width: auto; display: block; }
.sostenitori .sost-nome { display: block; }
html[data-contrast="alto"] .sostenitori li { border: 2px solid #fff; background: #000; color: #fff; }

/* ---------- Schermi larghi ---------- */
@media (min-width: 62rem) {
  .eroe-griglia { grid-template-columns: 1.35fr 1fr; }
  .menu-bottone { display: none; }
  .testata-riga { justify-content: space-between; }
  .testata .testata-chiama { display: inline-flex; order: 2; }
  .menu { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; order: 5; gap: .3rem; padding-top: .6rem; border-top: 2px solid var(--bordo); }
  .menu a { padding: .6rem .85rem; font-size: 1rem; }
  .barra-chiama { display: none; }
  body { padding-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }

/* ---------- Schermi molto piccoli (telefoni) ---------- */
.servizio .servizio-titolo { min-width: 0; overflow-wrap: anywhere; hyphens: auto; }
@media (max-width: 30rem) {
  .servizio summary { padding: .9rem; gap: .7rem; min-height: 4rem; }
  .servizio summary .tessera-ico { width: 2.6rem; height: 2.6rem; }
  .servizio summary .tessera-ico .ico { width: 1.5rem; height: 1.5rem; }
  .servizio summary .servizio-titolo { font-size: 1.1rem; }
  .servizio summary .freccia { width: 1.4rem; height: 1.4rem; }
  .servizio-corpo { padding: 1rem; }
  .btn { padding-inline: 1rem; }
}

@media print {
  .strumenti, .testata, .barra-chiama, .menu-bottone, .azioni { display: none !important; }
  body { background: #fff; color: #000; font-size: 12pt; padding: 0; }
  a { color: #000; text-decoration: underline; }
  .piede { background: #fff; color: #000; }
  .piede a, .piede h2 { color: #000; }
  .servizio { break-inside: avoid; }
}

/* ---- ultime novità: avvisi rapidi (dati/novita.txt) ---- */
.ultime-sezione { padding-block: clamp(1.6rem, 4vw, 2.6rem); background: #FFF4CF; border-top: 2px solid var(--bordo); border-bottom: 2px solid var(--bordo); }
.ultime-sezione h2 { margin-bottom: 1rem; }
.ultime-sezione h2 a { color: inherit; text-decoration-thickness: 3px; }
.ultime-interna { border: 2px solid var(--bordo); border-radius: var(--raggio); padding: 1.2rem 1.4rem; margin-bottom: 2rem; }
.ultime { display: grid; gap: 1rem; }
@media (min-width: 62rem) { .ultime { grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); } }
.ultime .evento { border-left-color: var(--ambra-s); }
.ultime .evento h3 { font-size: 1.3rem; }
.ultime .evento p:last-child { margin-bottom: 0; }
.ultime a.evento { display: block; color: inherit; font-weight: 400; text-decoration: none; transition: transform .15s, box-shadow .15s; }
.ultime a.evento:hover { color: inherit; transform: translateY(-2px); box-shadow: 0 6px 16px rgba(31, 42, 77, .14); }
.ultime a.evento h3 { text-decoration: underline; text-decoration-color: var(--sottolinea); text-decoration-thickness: 3px; text-underline-offset: .15em; }
.ultime-vai { display: inline-block; margin-top: .7rem; font-weight: 700; color: var(--ambra-s); }
.ultime-vai::after { content: " \2192"; }
html[data-contrast="alto"] .ultime-sezione { background: #000; border-color: #fff; }
html[data-contrast="alto"] .ultime-vai { color: #FFD400; }
