/* Borgia di Firenze · foglio di stile condiviso.
   Le pagine portano gli stili inline del design; qui stanno solo le regole globali,
   i punti di rottura (container query, come nel design) e i componenti generati dal build. */

:root {
  --bordeaux: #7B1A37;
  --gold: #95762B;
  --gold-dark: #5B481B;
  --gold-line: #826626;
  --gold-light: #D9B96B;
  --ink: #1A252B;
  --bg: #FCF5E7;
  --surface: #FFFFFF;
  --panel: #E9ECF2;
  --text: #212121;
  --text-sec: #3E4B52;
  --text-muted: #64717A;
  --text-inv: #FEFFFF;
  --border: #E4D9C6;
  --border-strong: #C9BFAE;
  --font-brand: 'Cormorant Garamond', Georgia, serif;
  --font-ui: 'Jost', system-ui, sans-serif;
}

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: #FCF5E7; color: #1A252B; font-family: var(--font-ui); }
* { border-radius: 0; }
a { color: #886B27; text-decoration: none; }
a:hover { color: #6E5620; }
img, video { max-width: 100%; }
details summary::-webkit-details-marker { display: none; }
[hidden] { display: none !important; }
[data-footer-email]::placeholder { color: rgba(252,245,231,.75); }
:focus-visible { outline: 2px solid #95762B; outline-offset: 3px; }

.skip { position: absolute; left: -9999px; top: 0; z-index: 200; background: #1A252B; color: #FCF5E7; padding: 12px 18px; font-size: 13px; }
.skip:focus { left: 0; color: #FCF5E7; }

/* Bottoni del design system (solo le varianti usate) */
.bdf { font-family: var(--font-ui); color: var(--text); }
.bdf-btn {
  display: inline-flex; align-items: center; gap: 8px;
  font: 700 11px/1.3 var(--font-ui);
  letter-spacing: .22em; text-transform: uppercase;
  padding: 12px 22px; cursor: pointer;
  border: 1px solid transparent; transition: background .2s, color .2s, border-color .2s;
}
.bdf-btn--primary { background: var(--gold); border-color: var(--gold); color: var(--text-inv); }
.bdf-btn--primary:hover { background: var(--gold-dark); border-color: var(--gold-dark); }
.bdf-btn--ghost { background: transparent; border-color: transparent; color: #886B27; padding-left: 4px; padding-right: 4px; }
.bdf-btn--ghost:hover { border-color: transparent; color: var(--ink); }
.bdf-btn:disabled { opacity: .5; cursor: not-allowed; }

/* Comparsa allo scorrimento: solo con JavaScript attivo e senza "riduci movimento" */
@media (prefers-reduced-motion: no-preference) {
  .js [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity 1s ease, transform 1s ease; }
  .js [data-reveal].in { opacity: 1; transform: none; }
  .js [data-reveal].now { transition: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* Punti di rottura del design (container query: ogni blocco reagisce alla propria larghezza) */
/* Header: nel design il menu collassava a 1100 px, ma otto voci piu' quattro lingue stanno su una riga solo
   da 1395 px in su. Quindi: voci mai a capo, spaziatura ridotta fra 1300 e 1400, hamburger sotto i 1300. */
header nav a { white-space: nowrap; }
@container (max-width: 1400px) {
  header nav[data-dt] { gap: 18px !important; }
}
/* in francese le voci sono piu' lunghe: spaziatura ridotta fino a 1500 px */
@container (max-width: 1500px) {
  html[lang="fr"] header nav[data-dt] { gap: 18px !important; }
}
@container (max-width: 1300px) {
  [data-dt] { display: none !important; }
  [data-mb] { display: flex !important; }
}
@container (max-width: 760px) {
  [data-cols], [data-two], [data-exp], [data-room] { grid-template-columns: 1fr !important; }
  [data-facts], [data-four], [data-feat] { grid-template-columns: 1fr 1fr !important; }
  [data-menu] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  [data-side]:not([data-acq]) { position: static !important; }
  [data-rev] { flex-direction: column !important; }
  [data-bubble] { top: 60px !important; bottom: auto !important; right: 12px !important; width: 92px !important; height: 119px !important; }
  [data-bubble] span { font-size: 11px !important; padding: 0 18% !important; }
  [data-acq] { display: none !important; }
  [data-acq-inline] { display: flex !important; }
  [data-room] { gap: 28px !important; }
  [data-room] [data-txt] { padding: 0 !important; order: 2; }
  [data-room] [data-pic] { order: 1; }
  [data-exp] [data-txt] { order: 2; }
  [data-exp] [data-pic] { order: 1; }
}

body.menu-open { overflow: hidden; }

/* Tabella dei cookie nella privacy: scorre in orizzontale sui telefoni invece di allargare la pagina */
.privacy-table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.privacy-table table { width: 100%; border-collapse: collapse; font-size: 13px; }
.privacy-table th, .privacy-table td { text-align: left; vertical-align: top; padding: 8px 10px 8px 0; border-bottom: 1px solid #E4D9C6; }

/* Aree di tocco da 48 px su telefono (audit del 20/09/2026). L'aspetto non cambia: si allarga solo la zona sensibile,
   con uno pseudo-elemento trasparente centrato sul controllo. */
[data-menu-open], [data-menu-close], [data-cookie-accept], [data-cookie-reject], [data-cookie-open],
[data-letter-reset], [data-newsletter-send], [data-langs] a, #site-menu a[href*="secure-reservation"] { position: relative; }
[data-menu-open]::after, [data-menu-close]::after, [data-cookie-accept]::after, [data-cookie-reject]::after, [data-cookie-open]::after,
[data-letter-reset]::after, [data-newsletter-send]::after, [data-langs] a::after, #site-menu a[href*="secure-reservation"]::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 100%; height: 100%;
  min-width: 48px; min-height: 48px; transform: translate(-50%, -50%);
}
/* nel selettore lingua le voci sono vicine: 48 px in altezza, in larghezza solo lo spazio che c'e' */
[data-langs] a::after { min-width: 100%; padding: 0 5px; }

/* Barra "Prenota" su telefono (decisione del 20/09/2026): compare dopo il primo scorrimento, sta sotto il banner dei cookie e sotto il menu */
[data-book-bar] { display: none; }
@media (max-width: 760px) {
  [data-book-bar] {
    display: flex; align-items: center; justify-content: center; position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
    min-height: 52px; padding-bottom: env(safe-area-inset-bottom); background: #95762B; color: #FEFFFF;
    font: 700 12px/1.3 var(--font-ui); letter-spacing: .24em; text-transform: uppercase;
    transform: translateY(100%); transition: transform .3s ease;
  }
  [data-book-bar]:hover { color: #FEFFFF; background: #5B481B; }
  .scrolled [data-book-bar] { transform: none; }
  body:has([data-book-bar])::after { content: ""; display: block; height: 52px; background: #1A252B; }
  [data-why-grid] { grid-template-columns: 1fr !important; }
}
@media (prefers-reduced-motion: reduce) { [data-book-bar] { transition: none; } }