/* ============================================================
   ALPAMARINE — BASE (reset + fondamenta comuni)
   Ogni valore referenzia un token di tokens.css (contratto M33b).
   ============================================================ */

/* ---- Reset essenziale ---- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
img, picture, video { display: block; max-width: 100%; height: auto; }
input, button, textarea, select { font: inherit; }

html, body { overflow-x: clip; } /* mai scroll laterale di pagina: il largo scorre nei suoi contenitori */
body {
  font-family: var(--font-testo);
  font-weight: var(--peso-corpo);
  font-size: var(--testo-base);
  line-height: var(--interlinea-corpo);
  color: var(--inchiostro);
  background: var(--bianco);
  /* spazio per la barra CTA sticky su mobile */
  padding-bottom: var(--altezza-ctabar);
}
@media (min-width: 64rem) {
  body { padding-bottom: 0; }
}

h1, h2, h3, h4 {
  line-height: var(--interlinea-titolo);
  font-weight: var(--peso-titolo);
  color: var(--inchiostro);
  text-wrap: balance;
}
h1 { font-size: var(--titolo-1); font-weight: var(--peso-forte); }
h2 { font-size: var(--titolo-2); }
h3 { font-size: var(--titolo-3); }
h4 { font-size: var(--titolo-4); }

a { color: var(--blu); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 3px solid var(--turchese);
  outline-offset: 2px;
}

/* ---- Container ---- */
.contenitore {
  width: 100%;
  max-width: var(--larghezza-max);
  margin-inline: auto;
  padding-inline: var(--spazio-md);
}
.sezione { padding-block: var(--spazio-sezione); }
.sezione--velo  { background: var(--blu-velo); }
.sezione--blu   { background: var(--blu); color: var(--bianco); }
.sezione--blu h2, .sezione--blu h3 { color: var(--bianco); }

/* Kicker di sezione (etichetta sopra il titolo) */
.kicker {
  display: block;
  font-size: var(--testo-xs);
  font-weight: var(--peso-titolo);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--blu);
  margin-bottom: var(--spazio-xs);
}
.sezione--blu .kicker { color: var(--turchese-chiaro); }

/* ---- Bottoni ---- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--spazio-xs);
  min-height: var(--tap-min);
  padding: var(--spazio-sm) var(--spazio-lg);
  border: 0;
  border-radius: var(--raggio-pieno);
  font-weight: var(--peso-titolo);
  font-size: var(--testo-base);
  text-decoration: none;
  cursor: pointer;
  transition: background var(--transizione), transform var(--transizione);
}
.btn:active { transform: scale(0.98); }
.btn--primario { background: var(--blu); color: var(--bianco); box-shadow: var(--ombra-cta); }
.btn--primario:hover { background: var(--blu-scuro); }
.btn--whatsapp { background: var(--whatsapp); color: var(--bianco); }
.btn--whatsapp:hover { background: var(--whatsapp-scuro); }
.btn--fantasma { background: transparent; color: var(--blu); box-shadow: inset 0 0 0 2px var(--blu); }
.btn--fantasma:hover { background: var(--blu-velo); }
.sezione--blu .btn--fantasma { color: var(--bianco); box-shadow: inset 0 0 0 2px var(--bianco); }
.btn--blocco { width: 100%; }

/* ---- Card ---- */
.card {
  background: var(--bianco);
  border: 1px solid var(--linea);
  border-radius: var(--raggio-md);
  box-shadow: var(--ombra-card);
  padding: var(--spazio-lg);
}

/* (niente header: landing di conversione — logo nel hero, CTA nella barra fissa) */

/* ---- Barra CTA sticky (solo mobile — 99% del traffico) ---- */
.barra-cta {
  position: fixed;
  inset-inline: 0;
  bottom: 0;
  z-index: 60;
  /* nascosta all'apertura: compare al primo scroll (JS aggiunge .visibile) */
  transform: translateY(110%);
  transition: transform 240ms ease;
  height: var(--altezza-ctabar);
  display: flex;
  gap: var(--spazio-xs);
  align-items: center;
  padding: var(--spazio-xs) var(--spazio-md);
  padding-bottom: calc(var(--spazio-xs) + env(safe-area-inset-bottom));
  background: var(--bianco);
  border-top: 1px solid var(--linea);
  box-shadow: var(--ombra-alta);
}
.barra-cta.visibile { transform: none; }
.barra-cta .btn { flex: 1; padding-inline: var(--spazio-sm); }
@media (min-width: 64rem) {
  .barra-cta { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .barra-cta { transition: none; }
}

/* ---- Footer ---- */
.pie {
  background: var(--blu-notte);
  color: var(--bianco);
  padding-block: var(--spazio-2xl);
  font-size: var(--testo-sm);
}
.pie a { color: var(--turchese); }

/* ============================================================
   SEZIONI (home + template) — mobile-first
   ============================================================ */

/* ---- Bottone turchese (CTA su fondo blu) ---- */
.btn--turchese { background: var(--turchese); color: var(--blu-notte); box-shadow: var(--ombra-cta); }
.btn--turchese:hover { filter: brightness(1.06); }


/* ---- Hero ---- */
.eroe { position: relative; display: grid; color: var(--bianco); background: var(--blu-notte); }
/* la griglia hero ha due sole aree: il logo assoluto non ne occupa una */
.eroe__foto, .eroe__testo { grid-area: 1 / 1; }
.eroe__foto img { width: 100%; height: 100%; object-fit: cover; min-height: 34rem; }
.eroe__foto::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, var(--velo-foto-alto) 0%, var(--velo-foto-medio) 78%, var(--velo-foto-basso) 100%);
}
.eroe__foto { position: relative; }
.eroe__testo {
  position: relative; z-index: 1; align-self: end;
  /* il padding-top riserva la fascia del logo: il testo non può mai salirci sopra */
  padding-block: calc(7rem + 2 * var(--spazio-lg)) var(--spazio-xl);
}
.eroe__testo h1 { color: var(--bianco); max-width: 22ch; }
.eroe__logo {
  position: absolute;
  top: var(--spazio-lg); left: 50%;
  transform: translateX(-50%);
  width: 7rem; height: 7rem;
  z-index: 2;
  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.35)); /* stacco dalla foto chiara */
}
.eroe__badge {
  display: inline-block;
  background: var(--vetro-chiaro); border: 1px solid var(--vetro-bordo);
  border-radius: var(--raggio-pieno);
  padding: var(--spazio-2xs) var(--spazio-md);
  font-size: var(--testo-sm); margin-bottom: var(--spazio-md);
}
.kicker--eroe { color: var(--turchese-chiaro); }
.eroe__sotto { max-width: var(--larghezza-testo); margin-top: var(--spazio-md); font-size: var(--testo-lg); }
.eroe__cta { display: flex; gap: var(--spazio-sm); flex-wrap: wrap; margin-top: var(--spazio-lg); }
@media (min-width: 64rem) {
  .eroe__foto img { min-height: 38rem; }
}

/* ---- Griglie ---- */
.griglia-3 { display: grid; gap: var(--spazio-lg); grid-template-columns: 1fr; margin-top: var(--spazio-xl); }
@media (min-width: 48rem) { .griglia-3 { grid-template-columns: repeat(3, 1fr); } }
.sezione__sotto { margin-top: var(--spazio-xs); max-width: var(--larghezza-testo); }
.sezione__cta { margin-top: var(--spazio-xl); text-align: center; }
.contenitore--stretto { max-width: 46rem; }

/* ---- Striscia persone: scroll orizzontale con barra visibile ---- */
.striscia-persone {
  display: flex; gap: var(--spazio-md);
  overflow-x: auto;
  scroll-snap-type: x proximity;
  margin-top: var(--spazio-xl);
  padding-bottom: var(--spazio-md);
  -webkit-overflow-scrolling: touch;
  /* barra sempre percepibile (Firefox) */
  scrollbar-width: thin;
  scrollbar-color: var(--blu) var(--linea);
}
.striscia-persone::-webkit-scrollbar { height: 8px; }
.striscia-persone::-webkit-scrollbar-track { background: var(--linea); border-radius: var(--raggio-pieno); }
.striscia-persone::-webkit-scrollbar-thumb { background: var(--blu); border-radius: var(--raggio-pieno); }
.striscia-persone .card--persona {
  flex: 0 0 min(78vw, 20rem);
  scroll-snap-align: start;
}
@media (min-width: 64rem) {
  .striscia-persone .card--persona { flex-basis: 22rem; }
}

/* ---- Ancore gommoni: atterraggio con respiro ---- */
.card--barca[id] { scroll-margin-top: var(--spazio-md); }

/* ---- Card persona ---- */
.card--persona { padding: 0; overflow: hidden; text-decoration: none; color: inherit; display: flex; flex-direction: column; transition: transform var(--transizione), box-shadow var(--transizione); }
.card--persona:hover { transform: translateY(-3px); box-shadow: var(--ombra-alta); }
.card--persona img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.card--persona__corpo { padding: var(--spazio-lg); display: flex; flex-direction: column; gap: var(--spazio-xs); flex: 1; }
.prezzo-da { color: var(--blu); font-size: var(--titolo-4); }
.prezzo-da strong { font-weight: var(--peso-forte); }
.card--persona__link { color: var(--blu); font-weight: var(--peso-titolo); margin-top: auto; }

/* ---- Flotta ---- */
.stagioni-legenda {
  margin-top: var(--spazio-md);
  font-size: var(--testo-sm); color: var(--grigio);
  background: var(--bianco); border: 1px solid var(--linea);
  border-radius: var(--raggio-sm); padding: var(--spazio-sm) var(--spazio-md);
  display: inline-block;
}
.flotta { display: grid; gap: var(--spazio-lg); grid-template-columns: 1fr; margin-top: var(--spazio-lg); }
@media (min-width: 48rem) { .flotta { grid-template-columns: repeat(2, 1fr); } }
.card--barca { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.card--barca__foto { position: relative; }
.card--barca__foto img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
/* Bollini sulla foto: piccoli, una riga sola, in alto (i CV vivono nel titolo) */
.chips--foto {
  position: absolute;
  left: var(--spazio-sm); right: var(--spazio-sm); top: var(--spazio-sm);
  margin: 0;
  flex-wrap: nowrap;
  gap: var(--spazio-2xs);
}
.chips--foto li {
  background: var(--velo-pillola);
  color: var(--bianco);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  font-size: var(--testo-xs);
  padding: 2px var(--spazio-xs);
  white-space: nowrap;
}
.chips--foto .chips__ok { background: var(--turchese); color: var(--blu-notte); }
.card--barca__corpo { padding: var(--spazio-lg); display: flex; flex-direction: column; gap: var(--spazio-sm); flex: 1; }
.card--barca__corpo > .btn { margin-top: auto; }
/* Su telefono la card è compatta: l'obiettivo è una card ≈ una schermata */
@media (max-width: 47.9375rem) {
  .card--barca__foto img { aspect-ratio: auto; height: 10rem; }
  .card--barca__corpo { padding: var(--spazio-md); gap: var(--spazio-xs); }
  .card--barca__corpo p { font-size: var(--testo-sm); }
  .listino td { padding-block: var(--spazio-2xs); }
  .listino__date { display: inline; margin-left: var(--spazio-2xs); }
}

/* Comparsa delle card flotta allo scroll (JS aggiunge .visibile; spenta con reduced-motion) */
.rivela {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 420ms ease, transform 420ms ease;
}
.rivela.visibile { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .rivela { opacity: 1; transform: none; transition: none; }
}

/* ---- Chips ---- */
.chips { display: flex; flex-wrap: wrap; gap: var(--spazio-xs); list-style: none; padding: 0; }
.chips li {
  font-size: var(--testo-sm); font-weight: var(--peso-medio);
  background: var(--blu-velo); color: var(--blu);
  border-radius: var(--raggio-pieno); padding: var(--spazio-2xs) var(--spazio-sm);
}
.chips__ok { background: var(--turchese); color: var(--blu-notte); font-weight: var(--peso-titolo); }
.chips--grandi { margin-top: var(--spazio-lg); }
.chips--grandi li { font-size: var(--testo-base); padding: var(--spazio-xs) var(--spazio-md); }

/* ---- Listino con toggle mezza/piena (CSS-only via radio) ---- */
.listino { border: 1px solid var(--linea); border-radius: var(--raggio-sm); padding: var(--spazio-sm); }
.listino input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.listino label {
  display: inline-block; cursor: pointer;
  font-size: var(--testo-sm); font-weight: var(--peso-medio);
  padding: var(--spazio-xs) var(--spazio-sm);
  border-radius: var(--raggio-pieno); color: var(--grigio);
  min-height: auto;
}
.listino input:checked + label { background: var(--blu); color: var(--bianco); }
.listino input:focus-visible + label { outline: 3px solid var(--turchese); outline-offset: 2px; }
.listino table { width: 100%; border-collapse: collapse; margin-top: var(--spazio-sm); }
.listino td { padding: var(--spazio-xs) var(--spazio-2xs); border-top: 1px solid var(--linea); }
.listino td:last-child { text-align: right; font-weight: var(--peso-forte); color: var(--blu); white-space: nowrap; }
.listino__piena { display: none; }
.listino:has(#l-6m-piena:checked)  .listino__piena, .listino:has(#l-7m-piena:checked)  .listino__piena,
.listino:has(#l-8m-piena:checked)  .listino__piena, .listino:has(#l-10m-piena:checked) .listino__piena { display: table; }
.listino:has(#l-6m-piena:checked)  .listino__mezza, .listino:has(#l-7m-piena:checked)  .listino__mezza,
.listino:has(#l-8m-piena:checked)  .listino__mezza, .listino:has(#l-10m-piena:checked) .listino__mezza { display: none; }
.listino__orari { font-size: var(--testo-xs); color: var(--grigio); margin-top: var(--spazio-xs); }
.listino__date { display: block; font-size: var(--testo-xs); color: var(--grigio); font-weight: var(--peso-corpo); }
/* stagione in corso: evidenziata dal JS in base alla data di oggi */
.listino tr.adesso td { background: var(--blu-velo); }
.listino tr.adesso td:first-child::after {
  content: "adesso";
  display: inline-block;
  margin-left: var(--spazio-xs);
  padding: 1px var(--spazio-xs);
  background: var(--turchese); color: var(--blu-notte);
  font-size: var(--testo-xs); font-weight: var(--peso-titolo);
  border-radius: var(--raggio-pieno);
  vertical-align: middle;
}
.listino__richiesta { color: var(--grigio); padding: var(--spazio-xs); }

/* ---- Trasparenza ---- */
.trasparenza {
  margin-top: var(--spazio-lg);
  background: var(--blu-velo); border-left: 4px solid var(--turchese);
  border-radius: var(--raggio-sm); padding: var(--spazio-md) var(--spazio-lg);
}

/* ---- Emozione (sezione blu) ---- */
.griglia-3--foto figure { margin: 0; }
.motivo img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--raggio-md); }
.motivo figcaption { margin-top: var(--spazio-sm); font-size: var(--testo-base); }

/* ---- Video striscia (scroll-snap orizzontale) ---- */
.video-striscia {
  display: flex; gap: var(--spazio-md);
  overflow-x: auto; scroll-snap-type: x mandatory;
  margin-top: var(--spazio-xl);
  padding-bottom: var(--spazio-sm);
  -webkit-overflow-scrolling: touch;
}
.video-striscia video {
  flex: 0 0 min(70vw, 17rem);
  aspect-ratio: 9 / 16; height: auto;
  border-radius: var(--raggio-md);
  scroll-snap-align: start;
  background: var(--blu-notte);
}

/* ---- Recensioni ---- */
.recensioni__testata { display: flex; align-items: center; gap: var(--spazio-lg); flex-wrap: wrap; }
.recensioni__testata img { width: 4.5rem; height: 4.5rem; }
.recensione { margin: 0; display: flex; flex-direction: column; gap: var(--spazio-sm); }
.recensione__stelle { color: var(--stelle); letter-spacing: 0.12em; }
.recensione footer { font-weight: var(--peso-titolo); }

/* ---- Passi (come prenotare) ---- */
.passi { list-style: none; padding: 0; margin-top: var(--spazio-xl); display: grid; gap: var(--spazio-lg); counter-reset: passo; }
@media (min-width: 48rem) { .passi { grid-template-columns: repeat(3, 1fr); } }
.passi li { counter-increment: passo; position: relative; padding-left: 3.5rem; }
.passi li::before {
  content: counter(passo);
  position: absolute; left: 0; top: 0;
  width: 2.5rem; height: 2.5rem;
  display: grid; place-items: center;
  background: var(--blu); color: var(--bianco);
  font-weight: var(--peso-forte); font-size: var(--titolo-4);
  border-radius: var(--raggio-pieno);
}
.passi h3 { font-size: var(--titolo-4); }
.passi p { margin-top: var(--spazio-xs); }

/* ---- Form ---- */
.modulo { margin-top: var(--spazio-xl); display: flex; flex-direction: column; gap: var(--spazio-md); }
.modulo__riga { display: grid; gap: var(--spazio-md); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 48rem) { .modulo__riga { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.modulo__campo { display: flex; flex-direction: column; gap: var(--spazio-2xs); min-width: 0; }
.modulo__campo label { font-weight: var(--peso-medio); font-size: var(--testo-sm); }
.modulo__facolt { font-weight: var(--peso-corpo); opacity: 0.75; }
.modulo input, .modulo select, .modulo textarea {
  font-size: var(--testo-base); /* ≥16px: niente auto-zoom iOS */
  min-height: var(--tap-min);
  padding: var(--spazio-sm) var(--spazio-md);
  border: 1px solid var(--linea); border-radius: var(--raggio-sm);
  background: var(--bianco); color: var(--inchiostro);
  width: 100%;
  max-width: 100%;
  min-width: 0; /* dentro le griglie: mai più largo della cella (date/select su iOS) */
}
.modulo input[type="date"] { -webkit-appearance: none; appearance: none; }
.modulo textarea { min-height: 6rem; resize: vertical; }
.modulo__telefono { display: flex; gap: var(--spazio-xs); }
.modulo__telefono select { flex: 0 0 6.5rem; padding-inline: var(--spazio-xs); }
.modulo__telefono input { flex: 1; }
.modulo__hp { position: absolute; left: -5000px; opacity: 0; height: 0; overflow: hidden; }
.modulo__privacy { font-size: var(--testo-xs); }
.modulo__privacy a, .modulo__oppure a { color: var(--turchese-chiaro); }
.modulo__oppure { text-align: center; margin-top: var(--spazio-xs); }

/* ---- Form compatto: la sezione sta in una schermata ---- */
.modulo-schermo {
  min-height: 100svh;
  display: flex; align-items: center;
  padding-block: var(--spazio-lg);
}
.modulo--compatto { margin-top: var(--spazio-md); gap: var(--spazio-sm); }
.modulo--compatto .modulo__riga { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--spazio-sm); }
.modulo--compatto .modulo__campo { gap: 2px; }

/* ---- Barra CTA: WhatsApp a icona quadrata + CTA su una riga ---- */
.barra-cta__wa { flex: 0 0 var(--altezza-ctabar); padding-inline: 0; min-width: 0; }
.barra-cta__principale { white-space: nowrap; font-size: var(--testo-base); }

/* ---- Hero breve (pagine di servizio, fondo blu) ---- */
.eroe-breve { text-align: center; }
.eroe-breve__logo { width: 6rem; height: 6rem; margin-inline: auto; }
.eroe-breve .kicker { color: var(--turchese-chiaro); margin-top: var(--spazio-md); }
.eroe-breve h1 { color: var(--bianco); font-size: var(--titolo-1); }
.eroe-breve .eroe__sotto { margin-inline: auto; }

/* ---- Mappa (dove-siamo) ---- */
.mappa { text-align: center; }
.mappa__img { margin-inline: auto; border-radius: var(--raggio-md); border: 1px solid var(--linea); }
.mappa__cta { margin-top: var(--spazio-lg); }

/* ---- Pagine legali ---- */
.legale h1 { font-size: var(--titolo-2); }
.legale h2 { font-size: var(--titolo-4); margin-top: var(--spazio-lg); }
.legale p { margin-top: var(--spazio-sm); }
.legale a { color: var(--blu); }

/* ---- Pagina grazie ---- */
.grazie { text-align: center; display: flex; flex-direction: column; gap: var(--spazio-md); align-items: center; }
.grazie__logo { width: 6rem; height: 6rem; }
.grazie h1 { color: var(--bianco); font-size: var(--titolo-2); }
.grazie__testo { max-width: 34rem; }
.grazie__nota { font-size: var(--testo-sm); opacity: 0.85; }
.grazie__nota a { color: var(--turchese-chiaro); }
.grazie .btn--blocco { max-width: 22rem; }

/* ---- FAQ ---- */
.faq { margin-top: var(--spazio-xl); border-top: 1px solid var(--linea); }
.faq details { border-bottom: 1px solid var(--linea); }
.faq summary {
  cursor: pointer; list-style: none;
  padding: var(--spazio-md) var(--spazio-xs);
  font-weight: var(--peso-titolo);
  display: flex; justify-content: space-between; align-items: center; gap: var(--spazio-md);
  min-height: var(--tap-min);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--blu); font-size: var(--titolo-3); font-weight: var(--peso-corpo); flex: none; }
.faq details[open] summary::after { content: "\2212"; }
.faq details p { padding: 0 var(--spazio-xs) var(--spazio-md); color: var(--grigio); max-width: var(--larghezza-testo); }

/* ---- CTA finale ---- */
.finale__riga { display: flex; flex-direction: column; gap: var(--spazio-lg); }
@media (min-width: 64rem) { .finale__riga { flex-direction: row; align-items: center; justify-content: space-between; } }

/* ---- Footer ---- */
.pie__griglia { display: grid; gap: var(--spazio-xl); grid-template-columns: 1fr; }
@media (min-width: 48rem) { .pie__griglia { grid-template-columns: repeat(2, 1fr); } }
.pie__griglia img { width: 5rem; height: 5rem; margin-bottom: var(--spazio-sm); }
.pie a { color: var(--bianco); }
.pie__legali { margin-top: var(--spazio-sm); font-size: var(--testo-xs); }
.pie__legali a { color: var(--turchese-chiaro); }
.pie__firma { margin-top: var(--spazio-xl); font-size: var(--testo-xs); color: var(--linea); }
.pie__firma a { color: var(--turchese-chiaro); }

/* ---- Fascia cookie (colori brand; il tasto facile è "Va bene tutto") ---- */
.cookie {
  position: fixed; inset-inline: 0; bottom: 0; z-index: 80;
  padding: var(--spazio-md);
  transform: translateY(105%);
  transition: transform 480ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
.cookie--su { transform: none; }
.cookie-fascia {
  max-width: 34rem; margin-inline: auto;
  background: var(--bianco);
  border: 1px solid var(--linea);
  border-radius: var(--raggio-lg);
  box-shadow: var(--ombra-alta);
  padding: var(--spazio-md) var(--spazio-lg) var(--spazio-lg);
}
.cookie-testata { display: flex; justify-content: space-between; align-items: center; gap: var(--spazio-md); }
.cookie-eti {
  font-size: var(--testo-xs); font-weight: var(--peso-titolo);
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--grigio);
}
.cookie-esci {
  background: none; border: 0; cursor: pointer;
  color: var(--grigio); font-size: var(--testo-xs);
  min-height: var(--tap-min); padding: 0 var(--spazio-2xs);
  touch-action: manipulation;
}
.cookie-esci:hover { color: var(--inchiostro); text-decoration: underline; }
.cookie-titolo { font-size: var(--titolo-4); font-weight: var(--peso-forte); color: var(--blu-notte); margin-top: var(--spazio-xs); }
.cookie-testo { font-size: var(--testo-sm); color: var(--grigio); margin-top: var(--spazio-2xs); }
.cookie-link { color: var(--blu); }
.cookie-scelte { display: flex; gap: var(--spazio-sm); margin-top: var(--spazio-md); }
.cookie-scelte .btn { flex: 1; }
.cookie-si { font-size: var(--testo-base); }
.cookie-scelta { margin-top: var(--spazio-md); border-top: 1px solid var(--linea); padding-top: var(--spazio-md); }
.cookie-riga {
  display: flex; gap: var(--spazio-sm); align-items: flex-start;
  font-size: var(--testo-sm); color: var(--grigio);
  padding-block: var(--spazio-xs);
  min-height: var(--tap-min);
}
.cookie-riga input { width: 1.25rem; height: 1.25rem; flex: none; margin-top: 2px; accent-color: var(--blu); }
.cookie-riga b { color: var(--inchiostro); }
@media (prefers-reduced-motion: reduce) { .cookie { transition: none; } }

/* ---- Riduzione movimento ---- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .card--persona:hover { transform: none; }
}

/* ---- Utility ---- */
.testo-secondario { color: var(--grigio); }
.solo-screenreader {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}