/* Palladio20 Loft & Terrace — stile del sito */
@font-face { font-family: "Fraunces"; src: url("fonts/fraunces.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Bricolage Grotesque"; src: url("fonts/bricolage.woff2") format("woff2"); font-weight: 200 800; font-display: swap; }
@font-face { font-family: "Space Grotesk"; src: url("fonts/space-grotesk.woff2") format("woff2"); font-weight: 300 700; font-display: swap; }
@font-face { font-family: "Jost"; src: url("fonts/jost.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/inter.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

/* Tema "blu notte" scelto il 7/11/2026 */
:root {
  color-scheme: dark;
  --sfondo: #141A22;
  --carta: #1E2631;
  --inchiostro: #EEF1F4;
  --grigio: #AEB8C4;
  --spento: #8A95A2;
  --bordo: #3A4656;
  --linea: #2B3441;
  --cotto: #9A4321;          /* pulsanti */
  --cotto-scuro: #B5532B;    /* pulsanti al passaggio del mouse */
  --link: #E8956A;
  --link-hover: #F3B08C;
  --cotto-chiaro: #4E3324;   /* notti scelte nel calendario */
  --verde: #1F3A33;
  --verde-testo: #CFDCD6;
  --serif: "Fraunces", Georgia, serif;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --larg: 1200px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--sfondo); color: var(--inchiostro); font-family: var(--sans); font-size: 17px; line-height: 1.6; }
img { max-width: 100%; display: block; }
a { color: var(--link); }
a:hover { color: var(--link-hover); }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.12; margin: 0; }
h2 { font-size: clamp(32px, 4.4vw, 44px); }
.wrap { max-width: var(--larg); margin: 0 auto; padding: 0 24px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
:focus-visible { outline: 3px solid var(--link); outline-offset: 2px; }

/* Pulsanti */
.btn { display: inline-block; text-decoration: none; font-weight: 600; font-size: 16px; padding: 14px 24px; border-radius: 999px; border: 0; cursor: pointer; font-family: inherit; text-align: center; }
.btn-pieno { background: var(--cotto); color: #fff; }
.btn-pieno:hover { background: var(--cotto-scuro); color: #fff; }
.btn-bianco { background: #fff; color: #9A4321; }
.btn-bianco:hover { color: #6E2F17; }
.btn-bordo { border: 1.5px solid currentColor; color: #fff; background: transparent; font-weight: 500; padding: 13px 22px; }
.btn-bordo:hover { background: rgba(255,255,255,.12); color: #fff; }
.btn-spento { background: var(--linea); color: var(--grigio); pointer-events: none; }

/* Testata */
.testata { position: sticky; top: 0; z-index: 20; background: rgba(20,26,34,.92); backdrop-filter: blur(8px); border-bottom: 1px solid transparent; transition: border-color .2s; }
.testata.ombra { border-bottom-color: var(--linea); }
.testata .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; min-height: 72px; flex-wrap: wrap; padding-top: 10px; padding-bottom: 10px; }
.logo { font-family: "Bricolage Grotesque", var(--sans); font-weight: 800; font-size: 30px; letter-spacing: -.03em; color: var(--inchiostro); text-decoration: none; line-height: 1.1; white-space: nowrap; }
.logo b { color: var(--link); font-weight: 700; }
.logo b { font-weight: 800; }
.logo span { font-family: "Space Grotesk", var(--sans); font-weight: 400; font-size: .5em; letter-spacing: .06em; color: var(--grigio); margin-left: 10px; }
.logo:hover { color: var(--inchiostro); }
.menu { display: flex; gap: 22px; font-family: "Jost", var(--sans); font-size: 13px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; margin-left: auto; }
.menu a { color: var(--inchiostro); text-decoration: none; }
.menu a:hover { color: var(--link); }
.testata-dx { display: flex; align-items: center; gap: 14px; }
.lingua { font-size: 14px; color: var(--grigio); text-decoration: none; padding: 8px 4px; }
.lingua strong { color: var(--inchiostro); }
.testata .btn { padding: 11px 20px; font-size: 15px; }
.apri-menu { display: none; width: 44px; height: 44px; border: 0; background: var(--carta); color: var(--inchiostro); border-radius: 10px; cursor: pointer; align-items: center; justify-content: center; }

@media (max-width: 1240px) {
  .menu { display: none; order: 4; width: 100%; flex-direction: column; gap: 0; padding: 8px 0 12px; }
  .menu.aperto { display: flex; }
  .menu a { padding: 12px 0; border-top: 1px solid var(--linea); }
  .apri-menu { display: inline-flex; }
  .testata .btn { display: none; }
  .logo { font-size: 22px; }
  .testata .wrap { gap: 10px 12px; min-height: 64px; }
}

/* Apertura */
.apertura { padding-top: 8px; }
.apertura-foto { border-radius: 20px; overflow: hidden; aspect-ratio: 3 / 2; max-height: 620px; width: 100%; background: var(--carta); }
.apertura-foto img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.apertura-testo { display: flex; flex-wrap: wrap; gap: 24px 48px; align-items: flex-end; justify-content: space-between; margin: 36px 0 28px; }
.apertura-testo > div { flex: 1 1 100%; }
.apertura-testo h1 { font-size: clamp(32px, 4.6vw, 56px); max-width: none; }
.apertura-testo p { max-width: 720px; }
.apertura-testo p { margin: 0; color: var(--grigio); }
.occhiello { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--grigio); margin: 0 0 12px; }

/* Barra prenotazione */
.barra { background: var(--carta); border: 1px solid var(--linea); border-radius: 16px; box-shadow: 0 12px 40px rgba(0,0,0,.3); padding: 20px; display: flex; flex-wrap: wrap; align-items: flex-end; gap: 16px; }
.barra label { flex: 1 1 170px; display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; color: var(--grigio); }
.barra input, .barra select { font: inherit; font-size: 16px; font-weight: 400; color: var(--inchiostro); padding: 12px; border: 1px solid var(--bordo); border-radius: 10px; background: var(--sfondo); min-height: 48px; width: 100%; }
.barra .btn { flex: 1 1 220px; border-radius: 10px; padding: 15px 20px; }
.barra .nota { flex: 1 1 100%; margin: 0; font-size: 14px; color: var(--grigio); }

/* Numeri */
.numeri { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; padding: 56px 0 16px; }
.numero { background: var(--carta); border-radius: 12px; padding: 18px; }
.numero b { display: block; font-family: var(--serif); font-weight: 400; font-size: 30px; line-height: 1.2; }
.numero span { font-size: 14px; color: var(--grigio); }

/* Sezioni */
.sezione { padding-top: 56px; padding-bottom: 56px; }
.sezione-testa { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 24px; }
.sezione-testa p { margin: 6px 0 0; color: var(--grigio); }
.spazi { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 18px; }
.spazio { text-decoration: none; color: var(--inchiostro); }
.spazio img { width: 100%; height: auto; aspect-ratio: 4 / 3.4; object-fit: cover; border-radius: 14px; transition: transform .3s; }
.spazio:hover img { transform: scale(1.02); }
.spazio h3 { font-weight: 600; font-size: 21px; margin: 14px 0 4px; }
.spazio p { margin: 0; font-size: 15px; color: var(--grigio); }
.spazio:hover { color: var(--inchiostro); }

/* Calendario */
.cal-box { background: var(--carta); border: 1px solid var(--linea); border-radius: 20px; padding: 32px; }
.legenda { display: flex; flex-wrap: wrap; gap: 16px; font-size: 14px; color: var(--grigio); }
.legenda span { display: flex; align-items: center; gap: 6px; }
.legenda i { width: 14px; height: 14px; border-radius: 4px; display: inline-block; }
.cal-nav { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.cal-nav button { width: 44px; height: 44px; border-radius: 10px; border: 1px solid var(--bordo); background: var(--sfondo); font-size: 20px; cursor: pointer; color: var(--inchiostro); }
.cal-nav button:disabled { opacity: .35; cursor: default; }
.mesi { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 32px; }
.mese h3 { font-family: var(--sans); font-size: 17px; font-weight: 600; margin: 0 0 12px; text-transform: capitalize; }
.griglia { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; text-align: center; }
.griglia .gs { font-size: 13px; color: var(--grigio); padding-bottom: 4px; }
.giorno { height: 44px; width: 100%; border-radius: 8px; font: inherit; font-size: 15px; border: 1px solid var(--bordo); background: var(--sfondo); color: var(--inchiostro); cursor: pointer; padding: 0; }
.giorno:hover { border-color: var(--link); }
.giorno.occ { border: 0; background: var(--linea); color: var(--spento); text-decoration: line-through; cursor: not-allowed; }
.giorno.passato { border: 0; background: transparent; color: #56616E; cursor: default; }
.giorno.sel { border: 0; background: var(--cotto); color: #fff; font-weight: 600; }
.giorno.int { border: 0; background: var(--cotto-chiaro); }
.cal-piede { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--linea); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.cal-piede .riep { margin: 0; font-size: 18px; font-weight: 600; }
.cal-piede .info { margin: 4px 0 0; font-size: 13px; color: var(--grigio); }
.cal-azioni { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.link-btn { font: inherit; font-size: 15px; background: none; border: 0; color: var(--grigio); text-decoration: underline; cursor: pointer; padding: 12px 4px; }

/* Perché diretto */
.diretto { background: var(--verde); color: #F6F1EA; }
.diretto .wrap { display: flex; flex-wrap: wrap; gap: 48px; align-items: center; padding-top: 64px; padding-bottom: 64px; }
.diretto .testo { flex: 1 1 340px; }
.diretto .testo p { color: var(--verde-testo); font-size: 17px; }
.diretto ul { flex: 1 1 460px; list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.diretto li { background: rgba(255,255,255,.08); border-radius: 12px; padding: 18px 20px; }
.diretto li strong { display: block; font-size: 17px; }
.diretto li span { font-size: 15px; color: var(--verde-testo); }

/* Recensioni */
.recensioni { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.rec { background: var(--carta); border: 1px solid transparent; border-radius: 14px; padding: 28px; display: flex; flex-direction: column; gap: 14px; text-decoration: none; color: var(--inchiostro); }
.rec:hover { color: var(--inchiostro); border-color: var(--bordo); }
.rec b { font-family: var(--serif); font-weight: 600; font-size: 24px; }
.rec span { color: var(--grigio); font-size: 15px; }
.rec em { font-style: normal; color: var(--link); font-weight: 600; font-size: 15px; }

/* Zona */
.zona { display: flex; flex-wrap: wrap; gap: 32px; }
.zona > div { flex: 1 1 360px; }
.zona dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 10px 20px; font-size: 16px; }
.zona dt { font-weight: 600; }
.zona dd { margin: 0; color: var(--grigio); }
.zona figure { flex: 1 1 520px; margin: 0; }
.zona figure img { width: 100%; height: 380px; max-height: none; object-fit: cover; border-radius: 14px; }
.zona figcaption { margin-top: 8px; font-size: 13px; color: var(--grigio); }
.idee { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; margin-top: 40px; }
.idea { background: var(--carta); border-radius: 14px; padding: 22px; }
.idea h3 { font-weight: 600; font-size: 21px; margin-bottom: 6px; }
.idea p { margin: 0 0 10px; font-size: 15px; color: var(--grigio); }

/* Chiusura */
.chiusura { background: var(--cotto); color: #fff; }
.chiusura .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; padding-top: 64px; padding-bottom: 64px; }
.chiusura h2 { font-size: clamp(32px, 4.6vw, 48px); margin-bottom: 8px; }
.chiusura p { margin: 0; color: #F7E2D6; }
.chiusura .azioni { display: flex; flex-wrap: wrap; gap: 12px; }

/* Piede */
.piede { padding: 32px 0 48px; font-size: 14px; color: var(--grigio); }
.piede .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; }
.piede .riga { flex: 1 1 100%; }

/* Galleria */
.filtri { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.filtri button { font: inherit; font-size: 15px; padding: 10px 16px; border-radius: 999px; border: 1px solid var(--bordo); background: var(--carta); color: var(--inchiostro); cursor: pointer; min-height: 44px; }
.filtri button[aria-pressed="true"] { background: var(--inchiostro); color: var(--sfondo); border-color: var(--inchiostro); }
.foto-griglia { columns: 3 280px; column-gap: 14px; }
.foto-griglia button { display: block; width: 100%; margin: 0 0 14px; padding: 0; border: 0; background: none; cursor: zoom-in; break-inside: avoid; border-radius: 12px; overflow: hidden; }
.foto-griglia img { width: 100%; height: auto; }
.lightbox { position: fixed; inset: 0; z-index: 50; background: rgba(20,15,12,.94); display: none; align-items: center; justify-content: center; flex-direction: column; padding: 56px 16px 24px; }
.lightbox.aperta { display: flex; }
.lightbox img { max-width: 100%; max-height: calc(100vh - 140px); object-fit: contain; border-radius: 6px; }
.lightbox p { color: #EDE5DC; margin: 12px 0 0; text-align: center; font-size: 15px; }
.lightbox button { position: absolute; width: 48px; height: 48px; border-radius: 50%; border: 0; background: rgba(255,255,255,.14); color: #fff; font-size: 24px; cursor: pointer; }
.lb-chiudi { top: 12px; right: 12px; }
.lb-prec { left: 12px; top: 50%; }
.lb-succ { right: 12px; top: 50%; }

/* Pagine di testo */
.testo-pagina { max-width: 760px; padding: 48px 24px 80px; margin: 0 auto; }
.testo-pagina h1 { font-size: clamp(34px, 5vw, 48px); margin-bottom: 24px; }
.testo-pagina h2 { font-size: 26px; margin: 32px 0 8px; }

/* Barra fissa su telefono */
.barra-mobile { display: none; }
@media (max-width: 700px) {
  body { font-size: 16px; }
  .barra-mobile { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: var(--carta); border-top: 1px solid var(--linea); box-shadow: 0 -6px 24px rgba(0,0,0,.35); padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); align-items: center; justify-content: space-between; gap: 12px; }
  .barra-mobile span { font-size: 13px; color: var(--grigio); line-height: 1.3; }
  .barra-mobile span b { color: var(--inchiostro); font-size: 15px; }
  .piede { padding-bottom: 110px; }
  .apertura-foto { aspect-ratio: 4 / 3.3; border-radius: 16px; }
  .cal-box { padding: 20px 16px; }
  .wrap { padding: 0 16px; }
  .zona figure img { height: 260px; }
}

/* Una casa con carattere */
.carattere { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 18px; }
.tratto { margin: 0; background: var(--carta); border-radius: 16px; overflow: hidden; border: 1px solid var(--linea); }
.tratto img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.tratto-testo { display: block; padding: 16px 18px 20px; }
.tratto b { display: block; font-family: var(--serif); font-weight: 600; font-size: 21px; margin-bottom: 4px; }
.tratto-testo > span { display: block; font-size: 15px; color: var(--grigio); }

/* Verona a piedi */
.percorso { list-style: none; margin: 0; padding: 0; position: relative; max-width: 820px; }
.percorso::before { content: ""; position: absolute; left: 21px; top: 22px; bottom: 22px; width: 2px; background: var(--bordo); }
.tappa { display: flex; gap: 20px; position: relative; padding-bottom: 28px; }
.tappa .num { flex: 0 0 44px; height: 44px; border-radius: 50%; background: var(--carta); border: 2px solid var(--link); color: var(--inchiostro); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 15px; position: relative; z-index: 1; }
.tappa.casa .num { background: var(--cotto); border-color: var(--cotto); color: #fff; font-size: 20px; }
.tappa h3 { font-weight: 600; font-size: 24px; margin: 2px 0 6px; }
.tappa p { margin: 0 0 6px; color: var(--grigio); }
.tappa .passi { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--spento); margin-bottom: 2px; }
.tappa-link { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 15px; }
.legs { flex: 1 1 420px; display: flex; flex-direction: column; gap: 12px; }
.legs .btn { text-align: left; }

.idea-foto { width: calc(100% + 44px); max-width: none; height: 170px; object-fit: cover; object-position: center 60%; margin: -22px -22px 16px; border-radius: 14px 14px 0 0; }
.idea { overflow: hidden; }
.idea .credito { font-size: 11px; margin: -12px 0 10px; color: var(--spento); }
.idea .credito a { color: var(--spento); }

/* Pianta della casa e zoom */
.pianta-box { display: flex; flex-wrap: wrap; gap: 28px 40px; align-items: center; background: var(--carta); border: 1px solid var(--linea); border-radius: 20px; padding: 28px; }
.pianta-testo { flex: 1 1 260px; }
.pianta-testo p { color: var(--grigio); margin: 10px 0 18px; }
.pianta-img { flex: 2 1 480px; padding: 0; border: 0; background: #fff; border-radius: 12px; overflow: hidden; cursor: zoom-in; }
.pianta-img img { width: 100%; height: auto; }
.zoom { position: fixed; inset: 0; z-index: 60; background: rgba(10,13,18,.96); display: none; }
.zoom.aperto { display: block; }
.zoom-area { position: absolute; inset: 0; overflow: auto; -webkit-overflow-scrolling: touch; display: flex; align-items: center; justify-content: center; padding: 56px 12px 12px; }
.zoom-area img { max-width: 100%; max-height: 100%; background: #fff; border-radius: 6px; cursor: zoom-in; }
.zoom.grande .zoom-area { display: block; }
.zoom.grande .zoom-area img { max-width: none; max-height: none; width: 220%; cursor: zoom-out; }
.zoom-chiudi { position: absolute; top: 10px; right: 12px; z-index: 2; width: 48px; height: 48px; border-radius: 50%; border: 0; background: rgba(255,255,255,.16); color: #fff; font-size: 26px; cursor: pointer; }
@media (min-width: 1100px) { .zoom.grande .zoom-area img { width: 160%; } }

/* Info utili (versione pubblica del Welcome Book) */
.ic { width: 22px; height: 22px; flex: none; }
.btn-linea { border: 1.5px solid var(--bordo); color: var(--inchiostro); background: transparent; font-weight: 500; padding: 12px 20px; }
.btn-linea:hover { border-color: var(--link); color: var(--inchiostro); }
.info-layout { display: flex; flex-wrap: wrap; gap: 32px; align-items: flex-start; padding-bottom: 64px; }
.info-indice { flex: 1 1 230px; position: sticky; top: 92px; display: flex; flex-direction: column; gap: 2px; max-height: calc(100vh - 110px); overflow: auto; }
.info-indice a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; color: var(--grigio); text-decoration: none; font-size: 15px; }
.info-indice a:hover { background: var(--carta); color: var(--inchiostro); }
.info-indice .ic { width: 18px; height: 18px; color: var(--link); }
.info-corpo { flex: 999 1 560px; min-width: 0; display: grid; gap: 20px; }
.info-sez { background: var(--carta); border: 1px solid var(--linea); border-radius: 18px; padding: 26px 28px; scroll-margin-top: 92px; }
.info-sez h2 { display: flex; align-items: center; gap: 12px; font-size: 30px; margin-bottom: 14px; }
.info-sez h2 .ic { width: 26px; height: 26px; color: var(--link); }
.info-sez h3.area { display: flex; align-items: center; gap: 10px; font-family: var(--sans); font-weight: 600; font-size: 20px; margin: 28px 0 8px; padding-top: 18px; border-top: 1px solid var(--linea); }
.info-sez h3.area .ic { color: var(--link); }
.info-sez h4 { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; margin: 22px 0 8px; color: var(--inchiostro); }
.info-sez p { margin: 0 0 12px; color: var(--grigio); }
.info-sez p strong, .info-sez li strong, .info-sez dd strong { color: var(--inchiostro); }
.info-sez .nota { background: var(--sfondo); border-radius: 12px; padding: 12px 16px; color: var(--inchiostro); }
.punti, .passi-lista { margin: 0 0 14px; padding-left: 22px; color: var(--grigio); }
.punti li, .passi-lista li { margin-bottom: 6px; }
.kv { display: grid; gap: 8px; margin: 0 0 14px; }
.kv div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; background: var(--sfondo); border-radius: 12px; padding: 12px 16px; }
.kv dt { color: var(--grigio); font-size: 14px; letter-spacing: .06em; text-transform: uppercase; }
.kv dd { margin: 0; font-weight: 600; }
.info-img { display: block; border-radius: 12px; margin: 6px 0 14px; max-height: 460px; max-width: 100%; width: auto; height: auto; object-fit: contain; }
.azioni-info { display: flex; flex-wrap: wrap; gap: 10px; }
.luoghi { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; margin-bottom: 14px; }
.luogo { background: var(--sfondo); border-radius: 12px; padding: 14px 16px; }
.luogo .tag { display: block; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--spento); }
.luogo b { display: block; font-size: 17px; margin: 2px 0 4px; }
.luogo p { margin: 0 0 6px; font-size: 15px; }
.luogo .meta, .tappe-info .meta { color: var(--link); font-size: 14px; }
.luogo .link { display: flex; flex-wrap: wrap; gap: 14px; font-size: 14px; margin: 6px 0 0; }
.acc { display: grid; gap: 8px; margin-bottom: 14px; }
.acc details { background: var(--sfondo); border-radius: 12px; padding: 12px 16px; }
.acc summary { cursor: pointer; font-weight: 600; }
.acc ol { margin: 10px 0 0; padding-left: 20px; color: var(--grigio); }
.tappe-info { margin: 0 0 14px; padding-left: 22px; }
.tappe-info li { margin-bottom: 14px; }
.tappe-info p { margin: 4px 0 0; }
@media (max-width: 860px) {
  .info-indice { position: static; flex-direction: row; overflow-x: auto; max-height: none; gap: 6px; padding-bottom: 6px; }
  .info-indice .occhiello { display: none; }
  .info-indice a { flex: none; background: var(--carta); white-space: nowrap; }
  .info-sez { padding: 20px 18px; }
}

/* Pagina Verona e dintorni */
.ver-banner { display: flex; flex-direction: column; gap: 6px; background: var(--cotto); color: #fff; text-decoration: none; border-radius: 18px; padding: 26px 28px; margin-bottom: 20px; }
.ver-banner:hover { background: var(--cotto-scuro); color: #fff; }
.ver-banner .occhiello { color: #F7E2D6; margin: 0; }
.ver-banner b { font-family: var(--serif); font-weight: 400; font-size: clamp(24px, 3vw, 34px); line-height: 1.15; }
.ver-banner span:last-child { font-weight: 600; }
.idee-grandi { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); margin-top: 0; }
.idee-grandi .idea-foto { height: 230px; }
.indietro { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin: 4px 0 12px; font-family: "Jost", var(--sans); font-size: 13px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--link); text-decoration: none; }
.indietro:hover { color: var(--link-hover); }
.gmaps { font-family: var(--sans); font-size: 17px; font-weight: 500; vertical-align: middle; }
.marchio { font-family: "Bricolage Grotesque", var(--sans); font-weight: 800; letter-spacing: -.03em; }
.marchio b { color: var(--link); font-weight: 800; }
.ver-banner .marchio b { color: #141A22; font-family: "Bricolage Grotesque", var(--sans); font-weight: 800; font-size: 1em; line-height: inherit; }
.marchio-esteso { color: var(--inchiostro); font-size: 1.15em; white-space: nowrap; }
.marchio-esteso > span { font-family: "Space Grotesk", var(--sans); font-weight: 400; font-size: .55em; letter-spacing: .06em; color: var(--grigio); margin-left: 6px; }
.link-testa { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.cal-azioni { justify-content: flex-end; max-width: 440px; row-gap: 8px; }
.nota-inr { flex: 1 1 100%; margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--spento); text-align: right; }
@media (max-width: 700px) { .nota-inr { text-align: left; margin-left: 0; } }

/* Video in apertura */
.apertura-video { position: relative; aspect-ratio: 16 / 9; }
.video-apertura { width: 100%; height: 100%; object-fit: cover; display: block; background: var(--carta); }
.video-pausa { position: absolute; right: 14px; bottom: 14px; width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(20,26,34,.65); color: #fff; display: grid; place-items: center; cursor: pointer; }
.video-pausa .ic-play { display: none; }
.video-pausa[aria-pressed="true"] .ic-play { display: inline; }
.video-pausa[aria-pressed="true"] .ic-pausa { display: none; }
@media (max-width: 700px) { .apertura-video { aspect-ratio: 4 / 3.3; } }
.copertina { margin-top: 20px; }

.tratto { display: block; text-decoration: none; color: var(--inchiostro); transition: border-color .2s; }
.tratto:hover { border-color: var(--link); color: var(--inchiostro); }
.tratto img { transition: transform .3s; }
.tratto:hover img { transform: scale(1.03); }

.video-audio { position: absolute; right: 66px; bottom: 14px; width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(20,26,34,.65); color: #fff; display: grid; place-items: center; cursor: pointer; }
.video-audio .ic-on { display: none; }
.video-audio[aria-pressed="true"] .ic-on { display: inline; }
.video-audio[aria-pressed="true"] .ic-off { display: none; }
.video-audio:hover, .video-pausa:hover { background: rgba(20,26,34,.85); }

/* Box prenotazione in evidenza: colore sabbia chiaro, stacca dal fondo blu notte */
.barra { background: #F3E8DA; border-color: #E2CDB4; box-shadow: 0 16px 48px rgba(0,0,0,.45); color: #1A2029; }
.barra label { color: #5A4A3C; }
.barra input, .barra select { background: #fff; color: #1A2029; border-color: #D8C3A8; color-scheme: light; }
.barra input:focus, .barra select:focus { outline: 2px solid var(--cotto); outline-offset: 1px; border-color: var(--cotto); }
.barra .nota { color: #5A4A3C; }
.barra .nota a { color: #8A3A1C; font-weight: 600; }
.barra .nota a:hover { color: #6E2C14; }

/* Barra prenotazione fissa sotto il menu (solo computer e tablet) */
.barra-fissa { position: fixed; left: 0; right: 0; top: 72px; z-index: 19; background: #F3E8DA; border-bottom: 1px solid #E2CDB4; box-shadow: 0 10px 28px rgba(0,0,0,.4); transform: translateY(-120%); opacity: 0; transition: transform .25s ease, opacity .25s ease; pointer-events: none; }
.barra-fissa.visibile { transform: none; opacity: 1; pointer-events: auto; }
.barra-fissa .wrap { display: flex; align-items: center; gap: 14px; padding-top: 10px; padding-bottom: 10px; }
.barra-fissa-titolo { font-family: var(--serif); font-size: 19px; color: #1A2029; margin-right: auto; white-space: nowrap; }
.barra-fissa label { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: #5A4A3C; }
.barra-fissa input, .barra-fissa select { font: inherit; font-size: 15px; font-weight: 400; color: #1A2029; background: #fff; border: 1px solid #D8C3A8; border-radius: 9px; padding: 8px 10px; min-height: 40px; color-scheme: light; }
.barra-fissa input:focus, .barra-fissa select:focus { outline: 2px solid var(--cotto); outline-offset: 1px; }
.barra-fissa .btn { padding: 10px 20px; font-size: 15px; border-radius: 9px; white-space: nowrap; }
@media (max-width: 1100px) { .barra-fissa-titolo { display: none; } .barra-fissa .wrap { justify-content: center; } }
@media (max-width: 700px) { .barra-fissa { display: none; } }
@media (prefers-reduced-motion: reduce) { .barra-fissa { transition: none; } }