/* Point — stile unico del prototipo. Mobile-first. */

:root {
  --sfondo: #ffffff;
  /* Colori del marchio Point */
  --marchio-navy: #174774;
  --marchio-blu: #1f74b5;
  --marchio-giallo: #ffb646;
  --marchio-corallo: #f56954;
  --marchio-verde: #63a561;
  --marchio-verde-scuro: #40986f;

  --sfondo-tenue: #f5f7fa;
  --sfondo-verde: #e8f1f9; /* azzurro tenue del marchio */
  --testo: #1b2a3a;
  --testo-tenue: #4a5a6a;
  --primario: #1561a0;
  --primario-scuro: var(--marchio-navy);
  --accento: var(--marchio-giallo);
  --accento-tenue: #fff3dc;
  --bordo: #d6dde5;
  --errore: #a4262c;
  --focus: #c2410c;
  --raggio: 14px;
  --raggio-piccolo: 8px;
  --ombra: 0 1px 2px rgba(23, 71, 116, 0.06), 0 4px 16px rgba(23, 71, 116, 0.07);
  --larghezza: 1120px;
  --font: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

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

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

body {
  margin: 0;
  font-family: var(--font);
  font-size: 1.125rem;
  line-height: 1.6;
  color: var(--testo);
  background: var(--sfondo);
}

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

h1, h2, h3 { line-height: 1.2; margin: 0 0 0.5em; letter-spacing: -0.01em; color: var(--marchio-navy); }
h1 { font-size: clamp(2rem, 6vw, 3rem); }
h2 { font-size: clamp(1.5rem, 4.5vw, 2.1rem); }
h3 { font-size: 1.25rem; }
p { margin: 0 0 1em; }

a { color: var(--primario); text-underline-offset: 0.15em; }
a:hover { color: var(--primario-scuro); }

:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
  border-radius: 4px;
}

.contenitore { width: 100%; max-width: var(--larghezza); margin: 0 auto; padding: 0 1rem; }
@media (min-width: 700px) { .contenitore { padding: 0 1.5rem; } }

.salta {
  position: absolute; left: 0.5rem; top: -4rem; z-index: 100;
  background: var(--primario); color: #fff; padding: 0.75rem 1rem; border-radius: var(--raggio-piccolo);
}
.salta:focus { top: 0.5rem; color: #fff; }

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

.icona { width: 1.25em; height: 1.25em; flex: none; }

/* ---------- Invito al questionario e intestazione ---------- */
.banner-invito {
  background: var(--marchio-navy);
  color: #fff;
  text-align: center;
  font-size: 0.98rem;
  padding: 0.6rem 1rem;
}
.banner-invito a { color: var(--marchio-giallo); font-weight: 700; margin-left: 0.35rem; white-space: nowrap; }
.banner-invito a:hover { color: #ffd38a; }
.banner-invito :focus-visible { outline-color: var(--marchio-giallo); }

.testata { background: var(--sfondo); border-bottom: 1px solid var(--bordo); position: sticky; top: 0; z-index: 50; }
.testata-riga { display: flex; align-items: center; justify-content: space-between; min-height: 4rem; gap: 1rem; flex-wrap: wrap; }

.logo { display: inline-flex; align-items: center; gap: 0.45rem; text-decoration: none; padding: 0.25rem 0; }
.logo-simbolo { height: 2.6rem; width: auto; }
.logo-scritta { height: 1.75rem; width: auto; }

.menu-pulsante {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font: inherit; font-weight: 600; color: var(--testo);
  background: none; border: 1px solid var(--bordo); border-radius: var(--raggio-piccolo);
  min-height: 2.9rem; padding: 0 0.9rem; cursor: pointer;
}
.menu-pulsante .icona-chiudi { display: none; }
.menu-pulsante[aria-expanded="true"] .icona-apri { display: none; }
.menu-pulsante[aria-expanded="true"] .icona-chiudi { display: inline; }

.menu { display: none; width: 100%; padding-bottom: 0.75rem; }
.menu.aperto { display: block; }
.menu ul { list-style: none; margin: 0; padding: 0; }
.menu a {
  display: block; padding: 0.8rem 0.5rem; text-decoration: none; color: var(--testo);
  font-weight: 600; border-radius: var(--raggio-piccolo);
}
.menu a:hover { background: var(--sfondo-tenue); }
.menu a[aria-current="page"] { color: var(--primario); box-shadow: inset 4px 0 0 var(--primario); }

.menu-accedi a { display: flex; align-items: center; gap: 0.4rem; }
.menu-accedi .icona { width: 1.1em; height: 1.1em; }
@media (min-width: 860px) {
  .menu-accedi { margin-left: 0.5rem; }
  .menu-accedi a { border: 2px solid var(--primario); border-radius: 999px !important; padding: 0.45rem 1rem !important; color: var(--primario) !important; box-shadow: none !important; }
  .menu-accedi a:hover { background: var(--sfondo-verde); }
  .menu-accedi a[aria-current="page"] { background: var(--primario); color: #fff !important; }
}
@media (min-width: 860px) {
  .menu-pulsante { display: none; }
  .menu { display: block; width: auto; padding: 0; }
  .menu ul { display: flex; gap: 0.25rem; }
  .menu a { padding: 0.6rem 0.8rem; }
  .menu a[aria-current="page"] { box-shadow: inset 0 -3px 0 var(--primario); border-radius: 0; }
}

/* ---------- Pulsanti ---------- */
.pulsante {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  min-height: 3.25rem; padding: 0.75rem 1.5rem;
  font: inherit; font-weight: 700; letter-spacing: 0.02em; text-decoration: none; text-align: center;
  border-radius: 999px; border: 2px solid var(--primario); cursor: pointer;
  background: var(--primario); color: #fff;
}
.pulsante:hover { background: var(--primario-scuro); border-color: var(--primario-scuro); color: #fff; }
.pulsante-secondario { background: #fff; color: var(--primario); }
.pulsante-secondario:hover { background: var(--sfondo-verde); color: var(--primario-scuro); }
.pulsante-leggero { background: transparent; border-color: transparent; color: var(--primario); padding-inline: 0.75rem; }
.pulsante-leggero:hover { background: var(--sfondo-verde); border-color: transparent; color: var(--primario-scuro); }
.pulsante[disabled] { opacity: 0.5; cursor: not-allowed; }
.pulsante-largo { width: 100%; }
@media (min-width: 560px) { .pulsante-largo { width: auto; } }

.azioni { display: flex; flex-wrap: wrap; gap: 0.75rem; }

/* ---------- Sezioni ---------- */
.sezione { padding: 3rem 0; }
.sezione-tenue { background: var(--sfondo-tenue); }
.sezione-verde { background: var(--sfondo-verde); }
@media (min-width: 860px) { .sezione { padding: 4.5rem 0; } }

.occhiello { font-size: 0.9rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--primario); margin-bottom: 0.5rem; }
.occhiello::before { content: ''; display: inline-block; width: 0.55em; height: 0.55em; border-radius: 50%; background: var(--marchio-giallo); margin-right: 0.45em; vertical-align: 0.05em; }
.intro { font-size: 1.2rem; color: var(--testo-tenue); max-width: 40rem; }
.testo-stretto { max-width: 42rem; }

/* ---------- Home ---------- */
.hero { padding: 2.5rem 0 3rem; background: linear-gradient(180deg, var(--sfondo-verde), var(--sfondo)); }
.hero-griglia { display: grid; gap: 2rem; align-items: center; }
.hero h1 { max-width: 16ch; }
.hero .intro { margin-bottom: 1.75rem; }
.hero-img { border-radius: var(--raggio); box-shadow: var(--ombra); }
@media (min-width: 860px) {
  .hero { padding: 4.5rem 0; }
  .hero-griglia { grid-template-columns: 1.1fr 1fr; gap: 3rem; }
}

.passi { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; gap: 1rem; counter-reset: passo; }
.passo {
  background: #fff; border: 1px solid var(--bordo); border-radius: var(--raggio);
  padding: 1.5rem; position: relative;
}
.passo-numero {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.5rem; height: 2.5rem; border-radius: 50%; margin-bottom: 0.75rem;
  background: var(--marchio-giallo); color: var(--marchio-navy); font-weight: 800;
}
.passo:nth-child(2) .passo-numero { background: var(--marchio-corallo); color: var(--testo); }
.passo:nth-child(3) .passo-numero { background: var(--marchio-verde); color: var(--testo); }
.passo h3 { font-size: 1.3rem; letter-spacing: 0.04em; }
.passo p { margin: 0; color: var(--testo-tenue); }
@media (min-width: 700px) { .passi { grid-template-columns: repeat(3, 1fr); } }

.citazione {
  margin: 0; padding: 1.5rem; border-left: 5px solid var(--accento);
  background: #fff; border-radius: 0 var(--raggio) var(--raggio) 0;
  font-size: 1.25rem; font-weight: 600; line-height: 1.5;
}

.due-colonne { display: grid; gap: 2rem; }
@media (min-width: 860px) { .due-colonne { grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; } }

.lista-spunte { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: 0.75rem; }
.lista-spunte li { display: flex; gap: 0.75rem; align-items: flex-start; }
.lista-spunte .icona { color: var(--primario); margin-top: 0.2em; }

.invito-sondaggio {
  background: var(--marchio-navy); color: #fff; border-radius: var(--raggio);
  padding: 2rem 1.5rem; text-align: center;
}
.invito-sondaggio h2 { color: #fff; }
.invito-sondaggio p { color: #e8f1f9; max-width: 36rem; margin-inline: auto; }
.invito-sondaggio .pulsante { background: var(--accento); border-color: var(--accento); color: var(--testo); }
.invito-sondaggio .pulsante:hover { background: #ffc86e; border-color: #ffc86e; }

.categorie-rapide { display: flex; flex-wrap: wrap; gap: 0.6rem; list-style: none; padding: 0; margin: 1.5rem 0 0; }
.categorie-rapide a {
  display: inline-flex; min-height: 2.75rem; align-items: center; padding: 0.4rem 1rem;
  border: 1px solid var(--bordo); border-radius: 999px; background: #fff;
  color: var(--testo); font-weight: 600; text-decoration: none;
}
.categorie-rapide a:hover { border-color: var(--primario); color: var(--primario); }

/* ---------- Card ---------- */
.griglia-card { display: grid; gap: 1.25rem; list-style: none; margin: 0; padding: 0; }
@media (min-width: 640px) { .griglia-card { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .griglia-card { grid-template-columns: repeat(3, 1fr); } }

.card {
  position: relative; display: flex; flex-direction: column; height: 100%;
  background: #fff; border: 1px solid var(--bordo); border-radius: var(--raggio);
  overflow: hidden; box-shadow: var(--ombra); transition: transform 0.15s, box-shadow 0.15s;
}
.card:hover { transform: translateY(-2px); box-shadow: 0 2px 4px rgba(28,38,38,.08), 0 10px 28px rgba(28,38,38,.1); }
.card:focus-within { outline: 3px solid var(--focus); outline-offset: 2px; }
.card-img { aspect-ratio: 8 / 5; object-fit: cover; width: 100%; background: var(--sfondo-tenue); }
.card-corpo { display: flex; flex-direction: column; flex: 1; padding: 1.1rem 1.25rem 1.25rem; }
.card-categoria { font-size: 0.85rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--primario); margin: 0 0 0.35rem; }
.card-titolo { font-size: 1.25rem; margin-bottom: 0.35rem; }
.card-titolo a { color: var(--testo); text-decoration: none; }
.card-titolo a::after { content: ''; position: absolute; inset: 0; }
.card-titolo a:focus-visible { outline: none; }
.card-luogo, .card-disponibile { display: flex; align-items: center; gap: 0.35rem; color: var(--testo-tenue); font-size: 0.98rem; margin: 0 0 0.6rem; }
.card-testo { color: var(--testo-tenue); font-size: 1rem; }
.card-piede { margin-top: auto; padding-top: 0.75rem; border-top: 1px solid var(--bordo); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem 1rem; align-items: center; }
.card-prezzo { font-weight: 800; font-size: 1.1rem; margin: 0; }
.card-disponibile { margin: 0; font-size: 0.92rem; }

.etichette { list-style: none; padding: 0; margin: 0 0 1rem; display: flex; flex-wrap: wrap; gap: 0.4rem; }
.etichetta {
  display: inline-flex; align-items: center; gap: 0.35rem;
  background: var(--sfondo-verde); color: var(--primario-scuro);
  font-size: 0.88rem; font-weight: 600; padding: 0.3rem 0.65rem; border-radius: 999px;
}
.etichetta .icona { width: 1.05em; height: 1.05em; }

/* ---------- Ricerca ---------- */
.cerca-testata { padding: 2rem 0 1rem; }
.importante {
  background: var(--sfondo-verde); border-radius: var(--raggio); padding: 1.25rem; margin-bottom: 1.25rem;
}
.importante legend { float: left; width: 100%; font-size: 1.3rem; font-weight: 700; padding: 0; margin-bottom: 0.25rem; }
.importante legend + * { clear: both; }
.importante p { color: var(--testo-tenue); font-size: 1rem; margin-bottom: 0.9rem; }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }

.scelte { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.scelta {
  display: inline-flex; align-items: center; gap: 0.4rem; min-height: 2.9rem;
  padding: 0.4rem 1rem; font: inherit; font-size: 1rem; font-weight: 600;
  background: #fff; color: var(--testo); border: 2px solid var(--bordo); border-radius: 999px; cursor: pointer;
}
.scelta:hover { border-color: var(--primario); }
.scelta[aria-pressed="true"] { background: var(--primario); border-color: var(--primario); color: #fff; }
.scelta[aria-pressed="true"]::before { content: '✓'; font-weight: 800; }

.filtri-rapidi { display: grid; gap: 0.9rem; margin-bottom: 1rem; }
@media (min-width: 700px) { .filtri-rapidi { grid-template-columns: 1fr 1fr auto; align-items: end; } }

.campo { display: flex; flex-direction: column; gap: 0.35rem; }
.campo > label, .campo > .etichetta-campo { font-weight: 700; font-size: 1rem; }
.campo-aiuto { font-size: 0.92rem; color: var(--testo-tenue); margin: 0; }
select, input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], textarea {
  font: inherit; font-size: 1.05rem; color: var(--testo);
  min-height: 3rem; padding: 0.6rem 0.8rem; width: 100%;
  background: #fff; border: 2px solid var(--bordo); border-radius: var(--raggio-piccolo);
}
select:hover, input:hover, textarea:hover { border-color: #b8b2a6; }
textarea { min-height: 7rem; resize: vertical; }
input[type="range"] { width: 100%; accent-color: var(--primario); min-height: 2.5rem; }

.spunta { display: flex; gap: 0.7rem; align-items: flex-start; cursor: pointer; font-size: 1.02rem; min-height: 2.75rem; padding: 0.35rem 0; }
.spunta input { width: 1.4rem; height: 1.4rem; margin: 0.15rem 0 0; accent-color: var(--primario); flex: none; }

.altri-filtri { border: 1px solid var(--bordo); border-radius: var(--raggio); margin-bottom: 1.5rem; background: #fff; }
.altri-filtri > summary {
  cursor: pointer; list-style: none; font-weight: 700; padding: 1rem 1.25rem; min-height: 3.25rem;
  display: flex; align-items: center; gap: 0.5rem;
}
.altri-filtri > summary::-webkit-details-marker { display: none; }
.altri-filtri > summary::after { content: '+'; margin-left: auto; font-size: 1.5rem; line-height: 1; color: var(--primario); }
.altri-filtri[open] > summary::after { content: '−'; }
.altri-filtri-corpo { padding: 0 1.25rem 1.25rem; display: grid; gap: 1.1rem; }
@media (min-width: 700px) { .altri-filtri-corpo { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .altri-filtri-corpo { grid-template-columns: repeat(3, 1fr); } }
.gruppo-radio { display: flex; flex-wrap: wrap; gap: 0 1.25rem; }

.risultati-testa { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.5rem; margin-bottom: 1rem; }
.risultati-testa p { margin: 0; font-weight: 700; }
.vuoto { text-align: center; padding: 2.5rem 1rem; background: var(--sfondo-tenue); border-radius: var(--raggio); }

/* ---------- Scheda Hub ---------- */
.scheda-testata { padding: 1.5rem 0 1rem; }
.torna { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 600; margin-bottom: 1rem; min-height: 2.75rem; }
.scheda-meta { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; color: var(--testo-tenue); margin-bottom: 0.5rem; }
.scheda-meta span { display: inline-flex; align-items: center; gap: 0.35rem; }

.galleria { display: grid; gap: 0.6rem; }
.galleria-principale { margin: 0; }
.galleria-principale img { border-radius: var(--raggio); width: 100%; aspect-ratio: 8 / 5; object-fit: cover; background: var(--sfondo-tenue); }
.galleria-principale figcaption { font-size: 0.92rem; color: var(--testo-tenue); margin-top: 0.4rem; }
.galleria-miniature { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem; list-style: none; padding: 0; margin: 0; }
.miniatura {
  padding: 0; border: 3px solid transparent; border-radius: var(--raggio-piccolo); background: none; cursor: pointer; width: 100%;
  overflow: hidden; display: block;
}
.miniatura img { aspect-ratio: 8 / 5; object-fit: cover; width: 100%; }
.miniatura[aria-current="true"] { border-color: var(--primario); }
.video-segnaposto {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.25rem;
  aspect-ratio: 8 / 5; border-radius: var(--raggio-piccolo); background: var(--testo); color: #fff;
  font-size: 0.8rem; text-align: center; padding: 0.25rem; line-height: 1.2;
}
.video-segnaposto .icona { width: 1.8rem; height: 1.8rem; }

.scheda-griglia { display: grid; gap: 2rem; }
@media (min-width: 1000px) { .scheda-griglia { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 3rem; align-items: start; } }
.scheda-lato { display: grid; gap: 1rem; }
@media (min-width: 1000px) { .scheda-lato { position: sticky; top: 5.5rem; } }

.dati-chiave { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin: 0; }
.dato { background: var(--sfondo-tenue); border-radius: var(--raggio-piccolo); padding: 0.8rem 1rem; }
.dato dt { font-size: 0.88rem; color: var(--testo-tenue); display: flex; align-items: center; gap: 0.35rem; }
.dato dd { margin: 0; font-weight: 700; font-size: 1.1rem; }

.riquadro { border: 1px solid var(--bordo); border-radius: var(--raggio); padding: 1.25rem; background: #fff; }
.riquadro-prezzo { font-size: 1.6rem; font-weight: 800; margin: 0; }
.riquadro-nota { color: var(--testo-tenue); font-size: 0.98rem; }

.sai-gia { background: var(--sfondo-verde); border-radius: var(--raggio); padding: 1.5rem 1.25rem; margin: 2rem 0; }
@media (min-width: 700px) { .sai-gia { padding: 2rem; } }
.sai-gia > p { color: var(--testo-tenue); }
.sai-gia-griglia { display: grid; gap: 0.9rem; margin-top: 1.25rem; }
@media (min-width: 700px) { .sai-gia-griglia { grid-template-columns: 1fr 1fr; } }
.voce-sai { background: #fff; border-radius: var(--raggio-piccolo); padding: 1rem 1.1rem; }
.voce-sai h3 { display: flex; align-items: center; gap: 0.5rem; font-size: 1.05rem; margin-bottom: 0.35rem; color: var(--primario-scuro); }
.voce-sai .livello { font-weight: 700; margin-bottom: 0.25rem; }
.voce-sai p { margin: 0; font-size: 1rem; color: var(--testo-tenue); }
.voce-sai p + p { margin-top: 0.35rem; }
.da-sapere { background: var(--accento-tenue); }
.da-sapere h3 { color: var(--testo); }
.da-sapere ul { margin: 0; padding-left: 1.2rem; font-size: 1rem; }

.blocco { margin-bottom: 2rem; }
.lista-colonne { columns: 1; padding-left: 1.2rem; margin: 0; }
@media (min-width: 560px) { .lista-colonne { columns: 2; column-gap: 2rem; } }
.lista-colonne li { break-inside: avoid; margin-bottom: 0.35rem; }

.cta-mobile {
  position: sticky; bottom: 0; z-index: 40; padding: 0.75rem 1rem;
  background: rgba(255,255,255,.97); border-top: 1px solid var(--bordo);
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.cta-mobile p { margin: 0; font-weight: 800; white-space: nowrap; }
.cta-mobile .pulsante { min-height: 3rem; padding-inline: 1.1rem; }
@media (min-width: 1000px) { .cta-mobile { display: none; } }

/* ---------- Prenotazione ---------- */
.prenota { scroll-margin-top: 5rem; }
.passi-indicatore { display: flex; gap: 0.35rem; list-style: none; padding: 0; margin: 0 0 1rem; }
.passi-indicatore li { flex: 1; height: 6px; border-radius: 3px; background: var(--bordo); }
.passi-indicatore li.fatto { background: var(--primario); }
.passo-titolo { font-size: 1.3rem; }
.passo-titolo:focus { outline: none; }
.passo-titolo:focus-visible { outline: 3px solid var(--focus); }

.giorni { display: grid; grid-template-columns: repeat(auto-fill, minmax(5.6rem, 1fr)); gap: 0.5rem; list-style: none; padding: 0; margin: 0 0 1rem; }
.giorno, .fascia {
  width: 100%; min-height: 3.5rem; font: inherit; font-size: 0.98rem; line-height: 1.25;
  border: 2px solid var(--bordo); border-radius: var(--raggio-piccolo); background: #fff; color: var(--testo); cursor: pointer; padding: 0.4rem;
}
.giorno strong { display: block; }
.giorno:hover:not([disabled]), .fascia:hover:not([disabled]) { border-color: var(--primario); }
.giorno[aria-pressed="true"], .fascia[aria-pressed="true"] { background: var(--primario); border-color: var(--primario); color: #fff; }
.giorno[disabled], .fascia[disabled] { background: var(--sfondo-tenue); color: #6d7676; cursor: not-allowed; text-decoration: line-through; border-style: dashed; }
.fasce { display: grid; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); gap: 0.5rem; list-style: none; padding: 0; margin: 0 0 1rem; }
.legenda { font-size: 0.92rem; color: var(--testo-tenue); }

.riepilogo { margin: 0 0 1.25rem; display: grid; gap: 0.5rem; }
.riepilogo div { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px dashed var(--bordo); padding-bottom: 0.4rem; }
.riepilogo dt { color: var(--testo-tenue); }
.riepilogo dd { margin: 0; font-weight: 700; text-align: right; }

.navigazione-passi { display: flex; justify-content: space-between; gap: 0.75rem; margin-top: 1.25rem; flex-wrap: wrap; }

.avviso {
  background: var(--accento-tenue); border-left: 5px solid var(--accento);
  padding: 0.8rem 1rem; border-radius: 0 var(--raggio-piccolo) var(--raggio-piccolo) 0; font-size: 1rem;
}
.errore-testo { color: var(--errore); font-weight: 600; font-size: 1rem; }
.conferma { text-align: center; padding: 1rem 0; }
.conferma-segno {
  width: 4rem; height: 4rem; margin: 0 auto 1rem; border-radius: 50%;
  background: var(--sfondo-verde); color: var(--primario); display: flex; align-items: center; justify-content: center;
}
.conferma-segno .icona { width: 2rem; height: 2rem; }
.timbro {
  display: inline-block; font-size: 0.85rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase;
  border: 2px solid var(--accento); color: #7a4a00; padding: 0.2rem 0.6rem; border-radius: 6px; margin-bottom: 0.75rem;
}

/* ---------- Moduli ---------- */
.modulo { display: grid; gap: 1.25rem; }
.modulo-griglia { display: grid; gap: 1.25rem; }
@media (min-width: 700px) { .modulo-griglia { grid-template-columns: 1fr 1fr; } .campo-intero { grid-column: 1 / -1; } }
.modulo fieldset > legend { font-weight: 700; font-size: 1.05rem; margin-bottom: 0.35rem; padding: 0; }
.obbligatorio { color: var(--errore); }
.campo-disattivato { opacity: 0.75; }
.domanda { background: #fff; border: 1px solid var(--bordo); border-radius: var(--raggio); padding: 1.25rem; }
.domanda > legend { float: left; width: 100%; font-size: 1.15rem !important; margin-bottom: 0.75rem !important; }
.domanda > legend + * { clear: both; }

/* ---------- Diventa partner / Progetto ---------- */
.requisiti { display: grid; gap: 0.75rem; }
.requisiti details { border: 1px solid var(--bordo); border-radius: var(--raggio-piccolo); background: #fff; }
.requisiti summary { cursor: pointer; font-weight: 700; padding: 0.9rem 1rem; min-height: 3rem; }
.requisiti details > ul { margin: 0; padding: 0 1rem 1rem 2.2rem; }

.pagina-testo { padding: 2.5rem 0 3.5rem; }
.pagina-testo h2 { margin-top: 2rem; }

/* ---------- Area riservata ---------- */
.admin { max-width: 36rem; margin: 0 auto; padding: 2.5rem 1rem 4rem; }
.tabella-versioni { width: 100%; border-collapse: collapse; font-size: 1rem; }
.tabella-versioni th, .tabella-versioni td { text-align: left; padding: 0.6rem 0.4rem; border-bottom: 1px solid var(--bordo); vertical-align: top; }
.versione-card { border: 1px solid var(--bordo); border-radius: var(--raggio-piccolo); padding: 1rem; margin-bottom: 0.75rem; }
.versione-card h3 { margin-bottom: 0.25rem; }
.input-pin { letter-spacing: 0.5em; font-size: 1.5rem !important; text-align: center; max-width: 14rem; }

/* ---------- Piè di pagina ---------- */
.piede { background: var(--sfondo-tenue); color: var(--testo); padding: 2.5rem 0 1.5rem; margin-top: 0; border-top: 4px solid var(--marchio-navy); }
.piede a { color: var(--primario-scuro); }
.piede-logo { width: 9rem; height: auto; margin-bottom: 1rem; }
.piede-griglia { display: grid; gap: 1.5rem; }
@media (min-width: 700px) { .piede-griglia { grid-template-columns: 2fr 1fr; } }
.piede-link { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.25rem; }
.piede-link a { display: inline-block; padding: 0.3rem 0; }
.piede-nota { border-top: 1px solid var(--bordo); margin-top: 1.5rem; padding-top: 1rem; font-size: 0.92rem; color: var(--testo-tenue); }

/* ---------- Sondaggio pubblico ---------- */
.pagina-sondaggio { background: var(--sfondo-tenue); }
.sondaggio { max-width: 46rem; padding-top: 2rem; padding-bottom: 2rem; }
.sondaggio-barra { background: #fff; border-bottom: 1px solid var(--bordo); }
.sondaggio-barra-riga { max-width: 46rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3.5rem; }
.logo-piccolo .logo-simbolo { height: 1.9rem; }
.logo-piccolo .logo-scritta { height: 1.25rem; }
.torna-home { font-weight: 600; display: inline-flex; align-items: center; min-height: 2.75rem; }
.sondaggio-testa { margin-bottom: 1.5rem; }
.sondaggio-testa h1 { font-size: clamp(1.7rem, 5vw, 2.4rem); }
.intro-sondaggio p { color: var(--testo-tenue); }
.sondaggio-modulo { gap: 1rem; }
.sondaggio-sezione { background: var(--sfondo-verde); border-radius: var(--raggio); padding: 1.5rem 1.25rem; margin: 1rem 0; }
.sondaggio-sezione h2 { font-size: 1.5rem; }
.sondaggio-logo { width: 6.5rem; height: auto; margin-bottom: 1rem; }
.domanda-titolo { font-size: 1.15rem !important; font-weight: 700; }
.domanda .campo-aiuto { margin-bottom: 0.5rem; }
.domanda[hidden] { display: none; }
.campo-altro { margin: 0.25rem 0 0 2.1rem; }
.scala { display: grid; grid-template-columns: repeat(auto-fit, minmax(3rem, 1fr)); gap: 0.5rem; margin-top: 0.25rem; }
.scala-voce { position: relative; }
.scala-voce input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.scala-voce span {
  display: flex; align-items: center; justify-content: center; min-height: 3.25rem;
  border: 2px solid var(--bordo); border-radius: var(--raggio-piccolo); font-weight: 800; font-size: 1.2rem; background: #fff;
}
.scala-voce input:hover + span { border-color: var(--primario); }
.scala-voce input:checked + span { background: var(--primario); border-color: var(--primario); color: #fff; }
.scala-voce input:focus-visible + span { outline: 3px solid var(--focus); outline-offset: 2px; }
.scala-etichette { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.92rem; color: var(--testo-tenue); margin-top: 0.4rem; }
.sondaggio-piede { max-width: 46rem; padding-bottom: 2.5rem; font-size: 0.95rem; color: var(--testo-tenue); }

/* ---------- Area riservata: schede e sondaggi ---------- */
.admin.admin-largo { max-width: 68rem; }
.schede { display: flex; flex-wrap: wrap; gap: 0.25rem; border-bottom: 2px solid var(--bordo); margin: 1rem 0 1.5rem; }
.scheda {
  font: inherit; font-weight: 700; background: none; border: 0; cursor: pointer; color: var(--testo-tenue);
  padding: 0.75rem 1rem; min-height: 3rem; border-bottom: 3px solid transparent; margin-bottom: -2px;
}
.scheda[aria-selected="true"] { color: var(--primario-scuro); border-bottom-color: var(--primario); }
.scheda:hover { color: var(--primario); }
.barra-azioni { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.75rem; margin-bottom: 1rem; }
.barra-azioni p { margin: 0; }
.sondaggio-card { border: 1px solid var(--bordo); border-radius: var(--raggio); padding: 1.1rem 1.25rem; margin-bottom: 1rem; background: #fff; }
.sondaggio-card-testa { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.sondaggio-card h3 { margin: 0 0 0.25rem; }
.stato { font-size: 0.8rem; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; padding: 0.2rem 0.6rem; border-radius: 999px; white-space: nowrap; }
.stato-attivo { background: #e3f1e2; color: #2b6a2a; }
.stato-bozza { background: var(--accento-tenue); color: #7a4a00; }
.stato-chiuso { background: #eceff3; color: var(--testo-tenue); }
.link-pubblico { font-size: 0.95rem; display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.5rem; }
.link-pubblico code { background: var(--sfondo-tenue); padding: 0.15rem 0.4rem; border-radius: 4px; word-break: break-all; }
.pericolo { color: var(--errore) !important; }
.pericolo:hover { background: #fbeaea !important; }

.blocco-editor { border: 1px solid var(--bordo); border-radius: var(--raggio); padding: 1rem 1.1rem; margin-bottom: 0.9rem; background: #fff; display: grid; gap: 0.75rem; }
.blocco-editor > legend { font-weight: 800; color: var(--primario-scuro); padding: 0 0.4rem; }
.blocco-testo { background: var(--sfondo-verde); }
.blocco-comandi { display: flex; gap: 0.25rem; justify-content: flex-end; margin-top: -0.5rem; }
.blocco-comandi .pulsante { min-height: 2.5rem; padding: 0.3rem 0.8rem; }
.aggiungi { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; padding: 1rem; border: 2px dashed var(--bordo); border-radius: var(--raggio); }
.aggiungi .pulsante { min-height: 2.6rem; padding: 0.4rem 1rem; font-size: 0.95rem; }
.condizione summary { cursor: pointer; font-weight: 600; color: var(--primario); min-height: 2.5rem; display: flex; align-items: center; }
.condizione[open] { background: var(--sfondo-tenue); border-radius: var(--raggio-piccolo); padding: 0 0.9rem 0.75rem; }

.numeri-admin { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 0.75rem; margin: 1rem 0; }
.numeri-admin div { border: 1px solid var(--bordo); border-radius: var(--raggio-piccolo); padding: 0.75rem 1rem; font-size: 0.95rem; color: var(--testo-tenue); background: #fff; }
.numeri-admin b { display: block; font-size: 1.5rem; color: var(--primario-scuro); }
.risultato { border: 1px solid var(--bordo); border-radius: var(--raggio); padding: 1.1rem 1.25rem; margin-top: 1rem; background: #fff; }
.risultato h4 { margin: 0 0 0.25rem; font-size: 1.1rem; color: var(--primario-scuro); }
.grafico { display: grid; gap: 0.45rem; margin: 0.75rem 0; }
.barra-riga { display: grid; grid-template-columns: minmax(8rem, 16rem) 1fr 5.5rem; gap: 0.75rem; align-items: center; font-size: 0.95rem; }
.barra-etichetta { color: var(--testo); }
.barra-traccia { height: 1.25rem; background: var(--sfondo-tenue); border-radius: 4px; overflow: hidden; }
.barra { display: block; height: 100%; background: var(--marchio-blu); border-radius: 0 4px 4px 0; min-width: 2px; }
.barra-riga:hover .barra { background: var(--marchio-navy); }
.barra-valore { font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.barra-valore small { color: var(--testo-tenue); font-weight: 400; }
@media (max-width: 600px) {
  .barra-riga { grid-template-columns: 1fr auto; }
  .barra-etichetta { grid-column: 1 / -1; }
}
.media { display: flex; align-items: baseline; gap: 0.5rem; margin: 0.5rem 0; }
.media strong { font-size: 2.2rem; color: var(--primario-scuro); }
.media span { color: var(--testo-tenue); }
.lista-testi { list-style: none; padding: 0; margin: 0.5rem 0; display: grid; gap: 0.5rem; }
.lista-testi li { background: var(--sfondo-tenue); border-radius: var(--raggio-piccolo); padding: 0.6rem 0.8rem; }
.lista-testi small { display: block; color: var(--testo-tenue); margin-top: 0.2rem; }
.tabella-scorrevole { overflow-x: auto; padding: 0 1rem 1rem; }
.tabella-risposte { border-collapse: collapse; font-size: 0.88rem; min-width: 100%; }
.tabella-risposte th, .tabella-risposte td { border-bottom: 1px solid var(--bordo); padding: 0.4rem 0.5rem; text-align: left; vertical-align: top; min-width: 7rem; }
.tabella-risposte th { background: var(--sfondo-verde); color: var(--primario-scuro); position: sticky; top: 0; }
.tabella-risposte td.doppia { background: var(--accento-tenue); font-weight: 700; }
.anteprima-sondaggio { background: var(--sfondo-tenue); border-radius: var(--raggio); padding: 1.25rem; }

/* ---------- Invito a dare il proprio parere ---------- */
.invito-hero {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem;
  background: var(--accento-tenue); border: 2px solid var(--marchio-giallo); border-radius: var(--raggio);
  padding: 1rem 1.25rem; margin-bottom: 1.75rem;
}
.invito-hero p { margin: 0; flex: 1 1 18rem; font-size: 1.05rem; }
.pulsante-invito { background: var(--marchio-giallo); border-color: var(--marchio-giallo); color: var(--marchio-navy); }
.pulsante-invito:hover { background: #ffc86e; border-color: #ffc86e; color: var(--marchio-navy); }
.menu-parere a { color: var(--marchio-navy); }
@media (min-width: 860px) {
  .menu-parere a { background: var(--accento-tenue); border-radius: 999px !important; box-shadow: none !important; }
  .menu-parere a:hover { background: #ffe7bd; }
  .menu-parere a[aria-current="page"] { background: var(--marchio-giallo); }
}
.tag-esempio {
  display: inline-block; margin-left: 0.4rem; padding: 0.05rem 0.5rem; border-radius: 999px;
  background: var(--sfondo-tenue); border: 1px solid var(--bordo); color: var(--testo-tenue);
  font-size: 0.75rem; letter-spacing: 0.04em; vertical-align: 0.1em;
}
.nota-esempi { font-size: 0.98rem; color: var(--testo-tenue); background: var(--sfondo-tenue); border-radius: var(--raggio-piccolo); padding: 0.6rem 0.9rem; max-width: 42rem; }
.promemoria {
  position: fixed; z-index: 60; right: 1rem; bottom: 1rem; left: 1rem; max-width: 24rem; margin-left: auto;
  background: #fff; border: 2px solid var(--marchio-giallo); border-radius: var(--raggio);
  box-shadow: 0 8px 30px rgba(23, 71, 116, 0.18); padding: 1.1rem 1.25rem 1.25rem;
  animation: promemoria-entra 0.4s ease-out;
}
.promemoria p { margin: 0 0 0.75rem; font-size: 1rem; }
.promemoria-titolo { font-weight: 800; color: var(--marchio-navy); font-size: 1.15rem !important; padding-right: 2rem; }
.promemoria .pulsante { width: 100%; }
.promemoria-chiudi {
  position: absolute; top: 0.4rem; right: 0.4rem; width: 2.75rem; height: 2.75rem;
  font-size: 1.6rem; line-height: 1; background: none; border: 0; border-radius: 50%; cursor: pointer; color: var(--testo-tenue);
}
.promemoria-chiudi:hover { background: var(--sfondo-tenue); color: var(--testo); }
@keyframes promemoria-entra { from { opacity: 0; transform: translateY(1rem); } to { opacity: 1; transform: none; } }
@media (min-width: 1000px) { .promemoria { bottom: 1.5rem; right: 1.5rem; } }