/* ---------- caratteri, ospitati sul sito: nessun collegamento a Google ---------- */
@font-face { font-family: 'Karla'; font-style: normal; font-weight: 400; font-display: swap; src: url('../font/karla-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Karla'; font-style: normal; font-weight: 500; font-display: swap; src: url('../font/karla-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Karla'; font-style: normal; font-weight: 600; font-display: swap; src: url('../font/karla-latin-600-normal.woff2') format('woff2'); }

/* NatureFitFlorence — foglio di stile unico
   Palette: bosco e oro (22 settembre 2026, al posto di «salvia e lino»).
   Tutti i colori del sito stanno in questo blocco: per cambiarli basta qui. */

:root {
  --lino: #F7F5EE;
  --bianco: #FFFFFF;
  --salvia-chiara: #DDE5D6;
  --salvia: #6F8A68;
  --bosco: #1F3A2B;
  --bosco-chiaro: #2A4838;
  --bosco-bordo: #3A5A48;
  --testo: #1F3A2B;
  --testo-tenue: #4B5E50;
  --testo-chiaro: #C9D6C6;
  --terracotta: #8C6A1E;
  --terracotta-scura: #6B5016;
  --link-testo: #5E480F;
  --terracotta-tenue: #F4ECD6;
  --bordo: #E2E3D6;
  --bordo-forte: #C4C8B6;
  --crema: #F2EFE2;
  --serif: Georgia, "Times New Roman", serif;
  --sans: "Karla", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
  --gutter: 20px;
  --max: 1200px;
}

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

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.65;
  color: var(--testo);
  background: var(--lino);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.1; margin: 0; }
h1 { font-size: clamp(2.4rem, 6vw, 4.4rem); }
h2 { font-size: clamp(1.9rem, 4vw, 2.9rem); }
h3 { font-size: clamp(1.3rem, 2.4vw, 1.7rem); }
p { margin: 0 0 1rem; text-wrap: pretty; }
img { max-width: 100%; height: auto; display: block; }

a { color: var(--terracotta); text-decoration: none; }
a:hover { color: var(--terracotta-scura); text-decoration: underline; }
/* Link dentro i testi delle pagine (es. VegExpert in «Chi sono», link nelle
   domande frequenti): l'oro chiaro sottile su fondo lino si leggeva poco.
   Stesso oro, nella tonalità scura della palette, in semigrassetto; al
   passaggio una sottolineatura sottile e distanziata. Pulsanti e schede
   dentro i testi mantengono il loro stile. */
.prosa a:not(.bottone):not(.scheda), .domanda a, .richiamo a {
  color: var(--link-testo); font-weight: 600; font-size: 1.02em;
}
.prosa a:not(.bottone):not(.scheda):hover, .domanda a:hover, .richiamo a:hover {
  color: var(--link-testo);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
}

.contenitore { max-width: var(--max); margin: 0 auto; padding-inline: var(--gutter); }

/* salto al contenuto, per chi naviga da tastiera */
.salta {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  background: var(--bosco); color: #fff; padding: 12px 20px; border-radius: 0 0 10px 0;
}
.salta:focus { left: 0; }

:focus-visible { outline: 3px solid var(--terracotta); outline-offset: 2px; }

/* ---------- intestazione ---------- */
.testata {
  position: sticky; top: 0; z-index: 50;
  background: rgba(247, 245, 238, .94);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--bordo);
}
.testata__interno {
  max-width: 1320px; margin: 0 auto; padding: 14px var(--gutter);
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.marchio { display: flex; align-items: center; gap: 11px; color: var(--testo); }
.marchio:hover { text-decoration: none; }
.marchio__simbolo { width: 54px; height: 54px; flex: none; }
.marchio__testo { display: flex; flex-direction: column; gap: 1px; }
.marchio__nome {
  font-family: var(--serif); font-size: 1.72rem; line-height: 1; color: var(--bosco);
  /* Instrument Serif esiste solo in tondo: il grassetto vero non c'e.
     Un filo di contorno ispessisce l'asta senza la poltiglia del finto grassetto. */
  -webkit-text-stroke: .42px currentColor;
}
.marchio__sotto { font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; color: var(--testo-tenue); }

.menu { display: flex; align-items: center; gap: 22px; }
.menu a { color: var(--testo); font-size: 1.04rem; white-space: nowrap; }
.menu .bottone--pieno { color: #fff; }
.menu .bottone--pieno:hover { color: #fff; }
.testata .bottone { white-space: nowrap; }
.menu a:hover { color: var(--terracotta); }
.menu__lingua { display: flex; gap: 7px; align-items: center; font-size: .9rem; color: var(--testo-tenue); }
.menu__lingua strong { color: var(--testo); font-weight: 600; }
.lingua { display: inline-flex; align-items: center; gap: 5px; }
.lingua img { width: 20px; height: 20px; flex: none; }
a.lingua { opacity: .72; }
a.lingua:hover { opacity: 1; text-decoration: none; }
.social { display: flex; align-items: center; gap: 4px; margin-left: -6px; }
.social__link { display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%; color: var(--bosco); }
.social__link:hover { background: var(--salvia-chiara); color: var(--terracotta); text-decoration: none; }

.bottone {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  min-height: 48px; padding: 0 26px; border-radius: 999px;
  font-family: var(--sans); font-size: 1rem; font-weight: 600;
  border: 1px solid transparent; cursor: pointer; text-align: center;
}
.bottone:hover { text-decoration: none; }
.bottone--pieno { background: var(--bosco); color: #fff; }
.bottone--pieno:hover { background: #142A1E; color: #fff; }
.bottone--vuoto { border-color: var(--salvia); color: var(--testo); background: transparent; }
.bottone--vuoto:hover { background: var(--salvia-chiara); color: var(--testo); }
.bottone--chiaro { background: var(--crema); color: var(--bosco); }
.bottone--chiaro:hover { background: #fff; color: var(--bosco); }
.bottone--largo { width: 100%; }

/* il bottone dentro al menu compare solo quando il menu diventa a tendina */
@media (min-width: 1241px) { .menu > .bottone { display: none; } }

.apri-menu { display: none; width: 48px; height: 48px; align-items: center; justify-content: center;
  border: 1px solid var(--bordo-forte); border-radius: 12px; background: transparent; cursor: pointer; }

/* ---------- etichetta ---------- */
.etichetta {
  display: inline-flex; align-items: center; align-self: flex-start;
  padding: 6px 15px; border-radius: 999px;
  border: 1px solid var(--terracotta); background: var(--terracotta-tenue);
  color: var(--terracotta-scura); font-size: .82rem; font-weight: 600;
}

/* ---------- apertura ---------- */
.apertura { padding: 60px 0 56px; }
.apertura__griglia { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.apertura__testo { display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.apertura__testo p { font-size: 1.15rem; color: var(--testo-tenue); margin: 0; max-width: 34em; }
.apertura__azioni { display: flex; gap: 12px; flex-wrap: wrap; }
.apertura__dati { display: flex; gap: 10px 22px; flex-wrap: wrap; font-size: .9rem; color: var(--testo-tenue); }
.apertura__dati span:not(:last-child)::after { content: "·"; margin-left: 22px; color: var(--bordo-forte); }
/* icona Google Maps accanto all'indirizzo: piccola, monocromatica; il padding
   allarga l'area da toccare su mobile, i margini negativi lo compensano */
.apertura__mappa { display: inline-flex; vertical-align: -3px; padding: 4px; margin: -4px -4px -4px 2px; color: #000; border-radius: 6px; }
.apertura__mappa:hover { color: var(--bosco); }
/* desktop a due colonne: i tre dati rapidi devono stare su una riga anche in
   inglese («Registered ASD, affiliated to MSP Italia» è lungo); sotto i 1000 px
   restano come sopra */
@media (min-width: 1001px) {
  .apertura__dati { gap: 10px 12px; font-size: .85rem; }
  .apertura__dati span:not(:last-child)::after { margin-left: 12px; }
}
.apertura__foto { border-radius: 20px; overflow: hidden; background: var(--salvia-chiara); aspect-ratio: 16 / 10; }
.apertura__foto img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- blocco risposta ---------- */
.risposta { background: var(--salvia-chiara); padding: 48px 0; }
.risposta__griglia { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 48px; align-items: start; }
.risposta p { font-size: 1.15rem; margin: 0; color: var(--testo); }
.risposta p.risposta__ente { margin-top: 18px; padding-top: 18px; border-top: 1px solid rgba(31, 58, 43, .18);
  font-size: 1.02rem; color: var(--testo); }
.risposta__ente a { color: var(--bosco); text-decoration: underline; text-underline-offset: 3px; }
.risposta__ente a:hover { color: var(--terracotta); }
.risposta h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); }

/* ---------- sezioni ---------- */
.sezione { padding: 70px 0; }
.sezione--stretta { padding: 46px 0; }
.sezione__intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 34px; flex-wrap: wrap; }
.sezione__intro p { margin: 0; color: var(--testo-tenue); max-width: 30em; font-size: .98rem; text-wrap: pretty; }
/* titolo corto (per esempio «Quanto costa»): la frase sta sotto al titolo,
   invece che spinta a destra dove si spezzerebbe male */
.sezione__intro--colonna { flex-direction: column; align-items: flex-start; gap: 10px; }
.sezione__intro--colonna p { max-width: 46em; }
.sezione__intro--prezzi { gap: 12px; }
.sezione__intro--prezzi p {
  display: flex; flex-direction: column; align-items: flex-start; gap: 5px;
  color: var(--testo); font-size: 1.05rem; line-height: 1.5;
  max-width: 46em;
}
.sezione__intro--prezzi p strong {
  color: var(--terracotta-scura); font-size: .9rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
}
.sezione__intro--prezzi p em {
  color: var(--testo); font-size: 1.08rem; font-style: italic;
}
@media (max-width: 720px) {
  .sezione__intro--prezzi { gap: 10px; }
  .sezione__intro--prezzi p { font-size: 1rem; }
  .sezione__intro--prezzi p strong { font-size: .82rem; letter-spacing: .1em; }
  .sezione__intro--prezzi p em { font-size: 1.03rem; }
}

.griglia-schede { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.scheda {
  background: var(--bianco); border: 1px solid var(--bordo); border-radius: 16px;
  padding: 28px; display: flex; flex-direction: column; gap: 12px;
}
.scheda h3 { margin: 0; }
.scheda p { margin: 0; color: var(--testo-tenue); font-size: .98rem; }
.scheda a { font-weight: 600; font-size: .95rem; margin-top: auto; }
/* ombra discreta solo sulle schede delle attività in home (sezione #discipline);
   le schede delle uscite (escursioni, notizie) usano la stessa classe e restano senza */
#discipline .griglia-schede > .scheda { box-shadow: 0 3px 10px rgba(0, 0, 0, 0.14); }

.nota-riga {
  margin-top: 20px; padding: 20px 26px; border-radius: 16px;
  border: 1px solid var(--bordo); background: var(--crema);
  display: flex; gap: 14px; align-items: baseline; flex-wrap: wrap;
}
.nota-riga strong { font-weight: 600; }
.nota-riga span { color: var(--testo-tenue); }

/* ---------- calendario ---------- */
.calendario { background: var(--bosco); color: var(--crema); padding: 64px 0; }
.calendario h2 { color: var(--crema); }
.calendario__intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 26px; flex-wrap: wrap; }
.calendario__intro p { margin: 6px 0 0; color: var(--testo-chiaro); font-size: .98rem; }
.provvisorio {
  display: inline-flex; align-items: center; padding: 7px 15px; border-radius: 999px;
  border: 1px dashed var(--salvia); font-size: .8rem; color: var(--testo-chiaro);
}
.filtri { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; }
.filtro {
  min-height: 44px; padding: 0 20px; border-radius: 999px; cursor: pointer;
  font-family: var(--sans); font-size: .95rem; font-weight: 600;
  background: transparent; color: var(--testo-chiaro); border: 1px solid var(--bordo-forte);
  border-color: var(--bosco-bordo);
}
.filtro[aria-pressed="true"] { background: var(--crema); color: var(--bosco); border-color: var(--crema); }
.settimana { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }
.giorno { display: flex; flex-direction: column; gap: 10px; }
.giorno__nome { padding-bottom: 9px; border-bottom: 1px solid var(--bosco-bordo);
  font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; color: var(--testo-chiaro); }
.lezione {
  background: var(--bosco-chiaro); border: 1px solid var(--bosco-bordo); border-radius: 12px;
  padding: 14px; color: var(--crema); display: block;
}
.lezione:hover { background: #365A45; color: var(--crema); text-decoration: none; }
.lezione--appuntamento .lezione__ora, .lezione--link .lezione__ora {
  font-family: var(--sans); font-size: .78rem; font-weight: 600; letter-spacing: .03em;
  text-transform: uppercase; color: var(--testo-chiaro); padding: 4px 0 2px; }
.lezione--appuntamento, .lezione--link { background: transparent; border-style: dashed; border-color: var(--salvia); }
.lezione--appuntamento:hover, .lezione--link:hover { background: var(--bosco-chiaro); }
.lezione--link .lezione__posti { color: var(--crema); font-weight: 600; }
.lezione__ora, .lezione__nome, .lezione__posti { display: block; }
.lezione__ora { font-family: var(--serif); font-size: 1.2rem; color: #fff; }
.lezione__nome { font-size: .95rem; font-weight: 600; margin-top: 2px; line-height: 1.35; }
.lezione__posti { font-size: .8rem; color: var(--testo-chiaro); margin-top: 6px; }
.giorno.nascosto, .lezione.nascosta { display: none; }
.calendario__coda { margin-top: 26px; display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.calendario__coda span { font-size: .93rem; color: var(--testo-chiaro); }

/* ---------- istruttrice ---------- */
.istruttrice__griglia { display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: 56px; align-items: center; }
.istruttrice__foto { border-radius: 20px; overflow: hidden; background: var(--salvia-chiara); aspect-ratio: 3 / 4; }
.istruttrice__foto img { object-position: center 25%; }
.istruttrice__foto img { width: 100%; height: 100%; object-fit: cover; }
.istruttrice__testo { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.istruttrice__testo h2, .istruttrice__testo p, .istruttrice__testo ul { margin: 0; }
.soprattitolo { font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; color: var(--terracotta); }
.citazione { font-family: var(--serif); font-style: italic; font-size: clamp(1.25rem, 2.4vw, 1.6rem); line-height: 1.5; margin: 0; }
.qualifiche { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px 24px; }
.qualifiche li { font-size: .95rem; padding-left: 15px; border-left: 2px solid var(--salvia); }

/* ---------- prezzi ---------- */
.griglia-prezzi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.prezzo {
  background: var(--bianco); border: 1px solid var(--bordo); border-radius: 16px; padding: 28px;
  display: flex; flex-direction: column; gap: 10px;
}
.prezzo--risalto { border: 2px solid var(--salvia); }
/* il titolo occupa sempre due righe: così le cifre restano allineate fra le
   schede anche quando un nome è più lungo degli altri */
.prezzo h3 { min-height: 2.5em; display: flex; align-items: flex-start; }
.prezzo__cifra { font-family: var(--serif); font-size: 2.6rem; line-height: 1; }
.prezzo__cifra small { font-family: var(--sans); font-size: .9rem; color: var(--testo-tenue); font-weight: 400; }
.prezzo ul { margin: 0; padding-left: 1.1rem; color: var(--testo-tenue); font-size: .95rem; }
.prezzo li { margin-bottom: 5px; }
.avviso-prezzi {
  margin-top: 18px; padding: 16px 22px; border-radius: 12px;
  border: 1px dashed var(--terracotta); background: var(--terracotta-tenue);
  color: var(--terracotta-scura); font-size: .93rem;
}

/* ---------- attività fuori dal listino dei corsi in studio ---------- */
.listino-extra {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px; margin-top: 20px;
  background: var(--bordo); border: 1px solid var(--bordo);
  border-radius: 14px; overflow: hidden;
}
.voce-extra {
  background: var(--crema); padding: 20px 24px;
  display: flex; flex-direction: column; gap: 2px;
}
.voce-extra__nome { font-size: .95rem; font-weight: 600; color: var(--testo); }
.voce-extra__cifra {
  font-family: var(--serif); font-size: 1.75rem; line-height: 1.15; color: var(--bosco);
  font-variant-numeric: tabular-nums;
}
.voce-extra__nota { font-size: .86rem; color: var(--testo-tenue); }

/* ---------- tesseramento ---------- */
.tesseramento {
  margin-top: 14px; padding: 18px 24px; border-radius: 14px;
  background: var(--salvia-chiara);
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 28px;
}
.tesseramento__titolo {
  font-size: .72rem; letter-spacing: .14em; text-transform: uppercase;
  font-weight: 600; color: var(--bosco);
}
.tesseramento__voci { display: flex; flex-wrap: wrap; gap: 8px 28px; }
.tesseramento__voci span { font-size: .96rem; color: var(--testo); }
.tesseramento__voci strong {
  font-family: var(--serif); font-weight: 400; font-size: 1.25rem;
  color: var(--bosco); margin-right: 3px; font-variant-numeric: tabular-nums;
}
@media (max-width: 860px) { .listino-extra { grid-template-columns: 1fr; } }

/* ---------- domande ---------- */
.domande { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 44px; }
.domanda { padding-top: 20px; border-top: 1px solid var(--bordo); }
.domanda h3 { font-family: var(--sans); font-size: 1.08rem; font-weight: 600; margin: 0 0 8px; line-height: 1.4; }
.domanda p { margin: 0; color: var(--testo-tenue); font-size: .98rem; }

/* ---------- contatti ---------- */
.contatti { background: var(--salvia-chiara); padding: 70px 0; }
.contatti__griglia { display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: 56px; align-items: start; }
.contatti__testo p { color: var(--bosco-chiaro); }
.contatti__recapiti { font-size: .95rem; color: var(--bosco-chiaro); }
.contatti__recapiti a { color: var(--terracotta-scura); }

.modulo { background: var(--lino); border-radius: 20px; padding: 32px; display: flex; flex-direction: column; gap: 18px; }
.campi-doppi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.campo { display: flex; flex-direction: column; gap: 7px; }
.campo label { font-size: .88rem; font-weight: 600; }
.campo input, .campo select, .campo textarea {
  min-height: 48px; padding: 12px 14px; border: 1px solid var(--bordo-forte); border-radius: 10px;
  background: var(--bianco); font-family: var(--sans); font-size: 1rem; color: var(--testo); width: 100%;
}
.campo textarea { resize: vertical; min-height: 96px; }
.campo input:focus, .campo select:focus, .campo textarea:focus { border-color: var(--salvia); }
.consenso { display: flex; gap: 10px; align-items: flex-start; }
.consenso input { width: 19px; height: 19px; margin-top: 3px; flex-shrink: 0; }
.consenso label { font-size: .88rem; color: var(--testo-tenue); line-height: 1.5; font-weight: 400; }

/* ---------- newsletter ---------- */
.newsletter { padding: 44px 0; border-bottom: 1px solid var(--bordo); }
.newsletter__griglia { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.newsletter p { margin: 6px 0 0; color: var(--testo-tenue); font-size: .95rem; }
.newsletter__campi { display: flex; gap: 10px; align-items: flex-end; }
.newsletter__campi .campo { min-width: 260px; }
.bottone--accento { background: var(--terracotta); color: #fff; }
.bottone--accento:hover { background: var(--terracotta-scura); color: #fff; }

/* ---------- piede ---------- */
.piede { padding: 48px 0 40px; }
.piede__griglia { display: grid; grid-template-columns: 300px repeat(2, auto) minmax(0, 1fr); gap: 44px; align-items: start; }
.piede__titolo { font-family: var(--serif); font-size: 1.4rem; display: block; margin-bottom: 10px; }
.piede address { font-style: normal; font-size: .93rem; line-height: 1.75; color: var(--testo-tenue); }
.piede address a { color: var(--testo-tenue); }
.piede__colonna { display: flex; flex-direction: column; gap: 10px; }
.piede__etichetta { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--testo-tenue); }
.piede__colonna a { color: var(--testo); font-size: .93rem; }
.piede__legale { text-align: right; font-size: .8rem; line-height: 1.7; color: var(--testo-tenue); }
.piede .piede__legale a { display: inline; white-space: nowrap; padding: 0; font-size: inherit; color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.piede .piede__legale a:hover { color: var(--terracotta); }

/* ---------- barra mobile ---------- */
.barra-mobile { display: none; }

/* ---------- pagine interne ---------- */
.testatina { padding: 48px 0 36px; }
.testatina__briciole { font-size: .85rem; color: var(--testo-tenue); margin-bottom: 14px; }
.testatina h1 { max-width: 16em; }
.testatina p { font-size: 1.12rem; color: var(--testo-tenue); max-width: 40em; margin-top: 18px; }
.figura-larga { border-radius: 20px; overflow: hidden; aspect-ratio: 21 / 9; background: var(--salvia-chiara); }
.figura-larga img { width: 100%; height: 100%; object-fit: cover; }
.prosa { max-width: 44em; }
.prosa h2 { margin-top: 2.2rem; margin-bottom: .9rem; }
.prosa h3 { margin-top: 1.8rem; margin-bottom: .6rem; font-family: var(--sans); font-size: 1.15rem; font-weight: 600; }
.prosa ul { padding-left: 1.2rem; color: var(--testo-tenue); }
.prosa li { margin-bottom: .5rem; }
.richiamo {
  border: 1px solid var(--bordo); background: var(--crema); border-radius: 16px;
  padding: 26px 30px; margin: 2rem 0;
}
.richiamo p:last-child { margin-bottom: 0; }

.galleria { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.galleria img { border-radius: 14px; aspect-ratio: 16 / 10; object-fit: cover; width: 100%;
  /* il taglio parte dall'alto: nei ritratti il viso resta dentro l'inquadratura */
  object-position: 50% 20%; }
.galleria--locandine img { object-fit: contain; background: var(--crema); border: 1px solid var(--bordo); }

/* ---------- adattamento schermi ---------- */
@media (max-width: 1100px) { .settimana { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 26px; } }
@media (max-width: 1000px) {
  .apertura__griglia { grid-template-columns: 1fr; gap: 32px; }
  .griglia-schede { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .griglia-prezzi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .settimana { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .istruttrice__griglia { grid-template-columns: 1fr; gap: 28px; }
  .istruttrice__foto { max-width: 340px; }
  .contatti__griglia { grid-template-columns: 1fr; gap: 32px; }
  .risposta__griglia { grid-template-columns: 1fr; gap: 16px; }
  .piede__griglia { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
  .piede__legale { text-align: left; grid-column: 1 / -1; }
  .galleria { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Il menu passa alla versione a tendina molto prima del resto del layout:
   sei voci, il selettore di lingua e il bottone, accanto al logo grande,
   in italiano, con FAQ e le icone di Instagram e Facebook, hanno bisogno di
   circa 1200px (misurato). La testata e' piu' larga del contenuto (1320px) e
   il menu passa a tendina sotto i 1240px, con un po' di margine. */
@media (max-width: 1240px) {
  .menu { display: none; }
  .menu--aperto {
    display: flex; position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--lino); border-bottom: 1px solid var(--bordo); padding: 8px var(--gutter) 18px;
  }
  .menu--aperto a { padding: 14px 0; border-bottom: 1px solid var(--bordo); font-size: 1.05rem; }
  .menu--aperto .bottone { margin-top: 14px; border-bottom: none; }
  .menu--aperto .menu__lingua { padding-top: 14px; }
  .apri-menu { display: flex; }
  .testata__interno > .bottone { display: none; }
  .social { margin-left: auto; margin-right: -4px; }
}

/* Smartphone in verticale: niente icone social nella testata (restano nel
   piede di pagina), solo marchio e hamburger. Sta DOPO le regole base: a
   parità di specificità vince la regola scritta dopo, e prima il corpo del
   nome dei telefoni veniva annullato da quello di .marchio__nome.
   Il nome resta a 1.72rem finché ci sta; sotto circa 390px scala con lo
   schermo: ~8.14px di testo per px di corpo (Georgia), e margini + simbolo +
   hamburger + respiro fanno ~164px, da cui calc(12.29vw - 20.1px). */
@media (max-width: 480px) {
  .testata .social { display: none; }
  .testata__interno { gap: 12px; }
  .marchio { gap: 8px; min-width: 0; }
  .marchio__testo { min-width: 0; }
  .marchio__simbolo { width: 44px; height: 44px; }
  .marchio__nome { font-size: clamp(1rem, calc(12.29vw - 20.1px), 1.72rem); white-space: nowrap; }
  .apri-menu { flex: none; margin-left: auto; }
}

@media (max-width: 720px) {
  body { font-size: 16px; }
  .settimana { gap: 18px; }
  .giorno { gap: 8px; }
  .lezione { display: grid; grid-template-columns: 4.2rem 1fr; column-gap: 8px; padding: 11px 14px; }
  .lezione__ora { grid-row: span 2; align-self: center; }
  .lezione__nome { margin-top: 0; }
  .lezione__posti { margin-top: 2px; }
  .lezione--appuntamento .lezione__ora, .lezione--link .lezione__ora { grid-column: 1 / -1; grid-row: auto; padding: 0 0 2px; }
  .lezione--appuntamento .lezione__nome, .lezione--appuntamento .lezione__posti,
  .lezione--link .lezione__nome, .lezione--link .lezione__posti { grid-column: 1 / -1; }
  .griglia-schede, .griglia-prezzi, .domande, .settimana, .galleria,
  .campi-doppi, .qualifiche { grid-template-columns: 1fr; }
  .sezione { padding: 48px 0; }
  .apertura { padding: 34px 0 40px; }
  .calendario, .contatti { padding: 48px 0; }
  .newsletter__campi { flex-direction: column; align-items: stretch; width: 100%; }
  .newsletter__campi .campo { min-width: 0; }
  .modulo { padding: 24px 20px; }
  body { padding-bottom: 86px; }
  .barra-mobile {
    display: flex; gap: 10px; position: fixed; bottom: 0; left: 0; right: 0; z-index: 60;
    padding: 12px var(--gutter) calc(12px + env(safe-area-inset-bottom));
    background: rgba(247, 245, 238, .96); backdrop-filter: blur(8px);
    border-top: 1px solid var(--bordo);
  }
  .barra-mobile .bottone { flex-grow: 1; }
  .barra-mobile .bottone--tondo { flex-grow: 0; width: 52px; padding: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; transition: none !important; }
}

@media print {
  .testata, .barra-mobile, .calendario__coda, .modulo, .newsletter { display: none; }
  body { background: #fff; padding-bottom: 0; }
}


/* ---------- scheda dati di un'uscita ---------- */
.scheda-dati {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px; margin: 0 0 2rem; padding: 0;
  background: var(--bordo); border: 1px solid var(--bordo); border-radius: 14px; overflow: hidden;
}
.scheda-dati > div { background: var(--crema); padding: 16px 20px; }
.scheda-dati dt { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--testo-tenue); margin-bottom: 4px; }
.scheda-dati dd { margin: 0; font-size: 1rem; font-weight: 500; color: var(--testo); }

/* ---------- scheda di un'uscita nell'indice ---------- */
.scheda--uscita { padding: 0; overflow: hidden; color: var(--testo); gap: 0; }
.scheda--uscita:hover { text-decoration: none; border-color: var(--salvia); }
.scheda--uscita img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.scheda--uscita h3 { margin: 0; padding: 20px 24px 8px; }
.scheda--uscita span { display: block; padding: 0 24px 24px; color: var(--testo-tenue); font-size: .95rem; line-height: 1.55; }

@media (max-width: 720px) { .scheda-dati { grid-template-columns: 1fr; } }


/* ---------- salto alle ancore del menu ----------
   La testata resta fissa in alto: senza questo margine il titolo della
   sezione finisce sotto di essa. Il valore tiene conto dell'altezza della
   testata piu un respiro, cosi il titolo arriva staccato e leggibile. */
section[id], .calendario[id], .contatti[id] { scroll-margin-top: 112px; }
@media (max-width: 720px) { section[id], .calendario[id], .contatti[id] { scroll-margin-top: 96px; } }

/* ---------- inviti all'azione dentro le pagine ---------- */
/* Riga compatta, subito sotto «In breve». */
.azione-riga {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 18px 26px; margin-top: 34px;
  padding: 20px 26px; border-radius: 18px;
  border: 1px solid var(--bordo); background: var(--crema);
}
.azione-riga p { margin: 0; font-size: 1.02rem; color: var(--testo-tenue); }
.azione-riga__bottoni { display: flex; flex-wrap: wrap; gap: 12px; }

/* Blocco pieno, a fine lettura. */
.azione {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 24px 40px; padding: 38px 40px; border-radius: 22px;
  background: var(--salvia-chiara);
}
.azione__testo { max-width: 52ch; }
.azione__testo h2 { margin: 0 0 .5rem; font-size: 1.7rem; }
.azione__testo p { margin: 0; color: var(--testo-tenue); }
.azione__bottoni { display: flex; flex-wrap: wrap; gap: 12px; }
.azione .bottone--vuoto { border-color: var(--bosco); }

@media (max-width: 720px) {
  .azione-riga, .azione { flex-direction: column; align-items: stretch; text-align: left; }
  .azione { padding: 30px 24px; }
  .azione-riga__bottoni .bottone, .azione__bottoni .bottone { flex: 1 1 auto; }
}

/* ---------- modulo di iscrizione ---------- */
.modulo .gruppo { border: 0; margin: 0; padding: 0 0 6px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.modulo .gruppo + .gruppo { border-top: 1px solid var(--bordo); padding-top: 22px; }
.modulo legend { font-family: var(--serif); font-size: 1.35rem; color: var(--bosco); padding: 0; margin-bottom: 4px; }
.gruppo__nota, .modulo .campo small { font-size: .85rem; color: var(--testo-tenue); margin: -6px 0 0; }
.campi-tripli { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
.campo--corto { max-width: 280px; }
.facoltativo { font-weight: 400; color: var(--testo-tenue); }
.scelta { display: flex; flex-wrap: wrap; gap: 10px; }
.scelta label {
  display: flex; align-items: center; gap: 10px; cursor: pointer;
  padding: 12px 16px; border: 1px solid var(--bordo-forte); border-radius: 10px; background: var(--bianco);
  font-size: .95rem;
}
.scelta label:has(input:checked) { border-color: var(--bosco); box-shadow: inset 0 0 0 1px var(--bosco); }
.scelta input { width: 18px; height: 18px; margin: 0; accent-color: var(--bosco); }
.consenso a { color: var(--terracotta-scura); text-decoration: underline; }
.consenso em { font-style: normal; color: var(--testo-tenue); display: block; margin-top: 2px; }
.modulo__sotto { margin: -4px 0 0; font-size: .88rem; color: var(--testo-tenue); text-align: center; }
/* la trappola per i programmi automatici: fuori dallo schermo, non «display:none»,
   che alcuni riconoscono e saltano */
.trappola { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.modulo { position: relative; }
/* adulto o minore: con JavaScript si vede solo quello che serve */
.se-minore { display: none; }
.modulo[data-chi="minore"] .se-minore { display: inline; }
.modulo[data-chi="minore"] .se-adulto { display: none; }
.modulo.js-attivo[data-chi="adulto"] .gruppo--genitore { display: none; }
.modulo.js-attivo .gruppo--genitore .gruppo__nota { display: none; }
/* il modulo è lungo: il testo a sinistra, con il bottone WhatsApp, resta in vista */
@media (min-width: 721px) { .contatti__testo { position: sticky; top: 110px; } }
@media (max-width: 720px) {
  .campi-tripli { grid-template-columns: 1fr 1fr; }
  .campi-tripli .campo:first-child { grid-column: 1 / -1; }
  .scelta { flex-direction: column; }
  .modulo { padding: 24px 18px; }
}
/* il testo della richiesta di ammissione: leggibile ma senza allungare troppo il modulo */
.ammissione {
  max-height: 300px; overflow-y: auto; padding: 18px 20px; border: 1px solid var(--bordo-forte);
  border-radius: 10px; background: var(--bianco); font-size: .9rem; line-height: 1.6; color: var(--testo);
}
.ammissione:focus { outline: 2px solid var(--salvia); outline-offset: 2px; }
.ammissione p { margin: 0 0 .7em; }
.ammissione ol { margin: 0; padding-left: 1.3em; display: flex; flex-direction: column; gap: .55em; }
.ammissione a { color: var(--terracotta-scura); text-decoration: underline; }
.modulo[data-chi="minore"] .ammissione .se-minore { display: inline; }

/* ---------- pagine di servizio ---------- */
.tabella { overflow-x: auto; margin: 1.4rem 0; }
.tabella table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.tabella th, .tabella td { text-align: left; vertical-align: top; padding: 12px 14px; border-bottom: 1px solid var(--bordo); }
.tabella th { font-weight: 600; background: var(--crema); }
.esito { border-radius: 16px; padding: 22px 26px; margin: 0 0 1.6rem; font-size: 1.05rem; }
.esito p { margin: 0; }
.esito--ok { background: var(--salvia-chiara); color: var(--bosco); font-weight: 600; }
.esito--ko { background: var(--terracotta-tenue); border: 1px solid var(--terracotta); color: var(--terracotta-scura); font-weight: 600; }
.esito__bottoni { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 1rem; }
.aggiornata { margin-top: 2.4rem; font-size: .85rem; color: var(--testo-tenue); }

/* ---------- pagamenti e QR ---------- */
.pagamenti { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 1.6rem 0 2rem; }
.pagamento {
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px;
  padding: 24px 20px; border: 1px solid var(--bordo); border-radius: 18px; background: var(--bianco);
}
.pagamento h3 { margin: 0; }
.pagamento p { margin: 0; font-size: .92rem; color: var(--testo-tenue); flex: 1; }
.pagamento__qr { width: 200px; height: auto; max-width: 100%; border-radius: 10px; image-rendering: pixelated; }
.nota-riga__link { display: inline-block; margin-top: 6px; color: var(--terracotta-scura); font-weight: 600; }
.contatti__qr { display: flex; align-items: center; gap: 14px; margin: 22px 0 6px; }
.contatti__qr img { width: 116px; height: 116px; border-radius: 10px; background: #fff; padding: 6px; image-rendering: pixelated; }
.contatti__qr figcaption { font-size: .85rem; color: var(--bosco-chiaro); line-height: 1.5; max-width: 22ch; }
/* dal telefono un QR non si inquadra: lì valgono i pulsanti */
@media (max-width: 900px) {
  .contatti__qr { display: none; }
  .pagamenti { grid-template-columns: 1fr; }
  .pagamento__qr { display: none; }
}
.sezione--dopo-testata { padding-top: 12px; }
.pagamento .bottone { width: 100%; padding: 0 12px; white-space: nowrap; }
/* nel menu a tendina le voci hanno un filetto sotto: il cambio lingua no */
.menu--aperto .menu__lingua a { padding: 0; border-bottom: none; }
.menu--aperto .menu__lingua { gap: 18px; }

/* ---------- immagini dentro il testo ---------- */
.figura-testo { margin: .4rem 0 1.4rem; }
.figura-testo img { display: block; max-width: 100%; height: auto; }
/* un'immagine piccola come il logo sta a destra del testo, su schermi larghi */
@media (min-width: 721px) {
  .figura-testo { float: right; width: 230px; margin: .3rem 0 1.2rem 2.2rem; }
}
@media (max-width: 720px) {
  .figura-testo { width: 190px; margin-inline: auto; }
}
/* il titolo successivo riparte sotto l'immagine, non accanto */
.prosa h2 { clear: both; }
.istruttrice__firma { display: flex; align-items: center; flex-wrap: wrap; gap: 20px 28px; margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--bordo); }
.istruttrice__firma img { width: 150px; height: auto; }
@media (max-width: 720px) { .istruttrice__firma { justify-content: center; text-align: center; } }
.istruttrice__firma { width: 100%; max-width: none; }

/* ---------- apertura con foto verticale ---------- */
.apertura-verticale {
  display: grid; grid-template-columns: minmax(0, 440px) minmax(0, 1fr); gap: 48px; align-items: center;
  background: var(--salvia-chiara); border-radius: 22px; padding: 28px;
}
.apertura-verticale__foto { border-radius: 16px; overflow: hidden; aspect-ratio: 4 / 5; }
.apertura-verticale__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.apertura-verticale__testo h2 { margin-top: 0; }
.apertura-verticale__testo p { font-size: 1.08rem; line-height: 1.75; margin: 0; }
@media (max-width: 860px) {
  .apertura-verticale { grid-template-columns: 1fr; gap: 26px; padding: 18px; }
  .apertura-verticale__foto { max-width: 420px; width: 100%; margin-inline: auto; }
}
.domande__tutte { margin-top: 2rem; text-align: center; }
/* i titoli con un'ancora (indice delle FAQ, #gravidanza, #posturale) non
   devono finire sotto la testata fissa quando ci si salta */
.prosa h2[id], .prosa h3[id] { scroll-margin-top: 112px; }
@media (max-width: 720px) { .prosa h2[id], .prosa h3[id] { scroll-margin-top: 96px; } }

/* ---------- CAPTCHA (ALTCHA) nel modulo ---------- */
.captcha { margin: 6px 0 18px; }
.captcha altcha-widget {
  --altcha-border-width: 1px;
  --altcha-border-radius: 12px;
  --altcha-color-base: var(--bianco);
  --altcha-color-border: var(--bordo-forte);
  --altcha-color-text: var(--testo);
  --altcha-color-border-focus: var(--salvia);
  --altcha-color-error-text: var(--terracotta);
  --altcha-color-footer-bg: var(--crema);
  --altcha-max-width: 320px;
  font-family: var(--sans);
  accent-color: var(--bosco);
}