/* DIMORA — Salotto & Cucina · "Una casa, sei stanze"
   Palette dal logo definitivo: verde #3A4A30 · bordeaux #633234 · oro #CDAE6A */

:root {
  --carta: #F3EBDD;
  --carta-2: #EAE0CE;
  --carta-3: #E0D3BC;
  --beige: #D9C7AC;
  --verde: #3A4A30;
  --verde-2: #2E3B26;
  --notte: #1F271A;
  --bordeaux: #633234;
  --bordeaux-2: #4E2729;
  --oro: #CDAE6A;
  --oro-chiaro: #E2CC98;
  --inchiostro: #2B3324;
  --grigio: #6E6656;
  --linea: rgba(58, 74, 48, .22);

  --f-display: "Fraunces", Georgia, "Times New Roman", serif;
  --f-label: "Jost", "Futura", "Century Gothic", sans-serif;

  --gutter: clamp(16px, 4vw, 56px);
  --max: 1320px;
  --testata-h: 76px;
  --ease: cubic-bezier(.2, .7, .1, 1);
  --ease-porta: cubic-bezier(.7, 0, .2, 1);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--testata-h) + 16px); }
body {
  margin: 0;
  background: var(--carta);
  color: var(--inchiostro);
  font-family: var(--f-display);
  font-variation-settings: "opsz" 14, "SOFT" 50;
  font-size: clamp(17px, 1.05vw + 12px, 19px);
  line-height: 1.6;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
button { font: inherit; color: inherit; }
::selection { background: var(--oro); color: var(--notte); }
:focus-visible { outline: 2px solid var(--oro); outline-offset: 3px; }

.salta { position: absolute; left: -999px; top: 8px; z-index: 200; background: var(--verde); color: var(--carta); padding: 10px 16px; }
.salta:focus { left: 8px; }

/* ---------- tipografia ---------- */
.occhiello {
  font-family: var(--f-label); font-weight: 500; font-size: 12px; letter-spacing: .28em; text-transform: uppercase;
  margin: 0 0 14px; color: var(--bordeaux);
}
.titolo {
  font-weight: 350; font-variation-settings: "opsz" 144, "SOFT" 50;
  font-size: clamp(44px, 7.4vw, 118px); line-height: .96; letter-spacing: -.02em; margin: 0; color: var(--verde);
  text-wrap: balance;
}
.titolo em, .t2 em, .frase em { font-style: italic; color: var(--bordeaux); font-weight: 330; }
.t2 {
  font-weight: 360; font-variation-settings: "opsz" 120, "SOFT" 50;
  font-size: clamp(34px, 4.4vw, 68px); line-height: 1.02; letter-spacing: -.015em; margin: 0 0 .4em; color: var(--verde); text-wrap: balance;
}
.t3 { font-weight: 420; font-variation-settings: "opsz" 48; font-size: clamp(22px, 1.6vw + 12px, 30px); line-height: 1.15; margin: 0 0 .35em; color: var(--verde); }
.lead { font-size: clamp(20px, 1.2vw + 14px, 26px); line-height: 1.45; font-weight: 340; font-variation-settings: "opsz" 36; max-width: 34ch; }
.frase { font-weight: 330; font-variation-settings: "opsz" 144; font-size: clamp(30px, 4vw, 60px); line-height: 1.1; letter-spacing: -.01em; margin: 0; text-wrap: balance; }
p { margin: 0 0 1em; }
.testo-colonna { max-width: 58ch; }

/* ---------- bottoni ---------- */
.btn {
  --c: var(--verde); --t: var(--carta);
  display: inline-flex; align-items: center; gap: 14px; min-height: 52px; padding: 0 28px;
  background: var(--c); color: var(--t); border: 1px solid var(--c); border-radius: 0;
  font-family: var(--f-label); font-weight: 500; font-size: 13px; letter-spacing: .22em; text-transform: uppercase; text-decoration: none;
  cursor: pointer; transition: background .35s var(--ease), color .35s var(--ease), border-color .35s;
}
.btn:hover { background: transparent; color: var(--c); }
.btn--oro { --c: var(--oro); --t: var(--notte); }
.btn--bordeaux { --c: var(--bordeaux); --t: var(--carta); }
.btn--linea { background: transparent; color: var(--c); }
.btn--linea:hover { background: var(--c); color: var(--t); }
.btn .pomello { width: 20px; height: 20px; transition: transform .7s var(--ease); }
.btn:hover .pomello { transform: rotate(120deg); }
.link-freccia { font-family: var(--f-label); font-size: 13px; letter-spacing: .2em; text-transform: uppercase; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 4px; }
.link-freccia::after { content: " →"; transition: margin .3s; }
.link-freccia:hover::after { margin-left: 6px; }

/* ---------- testata ---------- */
.testata {
  position: fixed; inset: 0 0 auto; z-index: 50; height: var(--testata-h);
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; padding: 0 var(--gutter);
  transition: background-color .35s, box-shadow .35s, transform .45s var(--ease);
  will-change: transform;
}
.testata.is-pieno { background: rgba(243, 235, 221, .94); backdrop-filter: blur(10px); box-shadow: 0 1px 0 var(--linea); }
.testata.is-nascosta { transform: translateY(-100%); }
.testata__logo { justify-self: start; display: block; width: clamp(112px, 12vw, 150px); }
.testata__logo img { width: 100%; height: auto; }
.logo-chiaro { display: none !important; }
.testata--chiara:not(.is-pieno) .logo-scuro { display: none !important; }
.testata--chiara:not(.is-pieno) .logo-chiaro { display: block !important; }
.testata__stanza { margin: 0; font-family: var(--f-label); font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: var(--grigio); white-space: nowrap; }
.testata__stanza span { color: var(--oro); margin-right: 6px; }
.testata--chiara:not(.is-pieno) .testata__stanza { color: var(--beige); }
.testata__azioni { justify-self: end; display: flex; align-items: center; gap: 10px; }
.btn-prenota {
  font-family: var(--f-label); font-size: 12px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; text-decoration: none;
  padding: 12px 18px; border: 1px solid currentColor; color: var(--bordeaux); transition: background .3s, color .3s;
}
.btn-prenota:hover { background: var(--bordeaux); color: var(--carta); border-color: var(--bordeaux); }
.btn-stanze {
  display: inline-flex; align-items: center; gap: 12px; background: none; border: 0; cursor: pointer; padding: 6px 0 6px 8px;
  font-family: var(--f-label); font-size: 12px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--verde);
}
.btn-stanze__pomello { width: 38px; height: 38px; color: var(--oro); transition: transform .9s var(--ease); }
.btn-stanze:hover .btn-stanze__pomello, .btn-stanze[aria-expanded="true"] .btn-stanze__pomello { transform: rotate(180deg); }
.testata--chiara:not(.is-pieno) .btn-stanze, .testata--chiara:not(.is-pieno) .btn-prenota { color: var(--carta); }
.testata--chiara:not(.is-pieno) .btn-prenota:hover { background: var(--carta); color: var(--verde); border-color: var(--carta); }

@media (max-width: 860px) {
  .testata { grid-template-columns: 1fr auto; }
  .testata__stanza { display: none; }
  .btn-prenota { display: none; }
  .btn-stanze__testo { display: none; }
}

.link-conto { font-family: var(--f-label); font-size: 12px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; text-decoration: none; color: var(--verde); padding: 12px 6px; }
.link-conto::before { content: "✦ "; color: var(--oro); }
.link-conto:hover { color: var(--bordeaux); }
.testata--chiara:not(.is-pieno) .link-conto { color: var(--carta); }
@media (max-width: 860px) { .link-conto { font-size: 11px; letter-spacing: .12em; } }
.btn-prenota, .link-conto, .btn-stanze { white-space: nowrap; }
.conto-menu { position: relative; }
.conto-menu__tendina {
  position: absolute; top: 100%; left: 50%; min-width: 170px; padding: 6px 0; margin-top: 4px;
  background: var(--carta); border: 1px solid var(--oro); box-shadow: 0 18px 34px -18px rgba(31, 39, 26, .5);
  opacity: 0; visibility: hidden; transform: translate(-50%, -6px); transition: opacity .25s, transform .3s var(--ease), visibility .25s;
}
.conto-menu__tendina::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; } /* ponte: il menu non si chiude passando col mouse */
.conto-menu:hover .conto-menu__tendina, .conto-menu:focus-within .conto-menu__tendina { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.conto-menu__tendina a { display: block; padding: 10px 18px; font-family: var(--f-label); font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; text-decoration: none; color: var(--verde); text-align: center; white-space: nowrap; }
.conto-menu__tendina a + a { border-top: 1px solid var(--linea); }
.conto-menu__tendina a:hover { color: var(--bordeaux); background: rgba(205, 174, 106, .14); }
@media (max-width: 1180px) { .testata { grid-template-columns: 1fr auto; } .testata__stanza { display: none; } }

/* ---------- account ---------- */
.conto { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: clamp(24px, 4vw, 64px); align-items: start; padding-bottom: clamp(70px, 10vw, 140px); }
.conto--stretto { grid-template-columns: minmax(0, 640px); justify-content: center; }
.conto__lato { background: var(--verde); color: var(--carta); padding: 34px 30px; position: relative; }
.conto__lato::before { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(205, 174, 106, .5); pointer-events: none; }
.conto__lato .occhiello { color: var(--oro); }
.conto__lato h2 { color: var(--carta); }
.conto__lato p, .conto__lato li { color: var(--beige); font-size: 16px; }
.conto__lato a:not(.btn) { color: var(--oro); }
.consenso { border: 1px solid var(--carta-3); padding: 16px 18px; background: rgba(205, 174, 106, .08); }
.consenso + .consenso { margin-top: 12px; }
.consenso .spunta { color: var(--inchiostro); }
.consenso__dettaglio { font-family: var(--f-label); font-size: 12.5px; line-height: 1.6; color: var(--grigio); margin: 8px 0 0 32px; }
.consenso__tag { display: inline-block; font-family: var(--f-label); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; padding: 2px 8px; margin-left: 6px; vertical-align: 2px; }
.tag-obb { background: var(--verde); color: var(--carta); }
.tag-fac { border: 1px solid var(--oro); color: var(--bordeaux); }
.esito { text-align: center; padding: clamp(36px, 6vw, 70px) clamp(18px, 4vw, 50px); }
.esito .pomello { width: 76px; height: 76px; color: var(--oro); margin: 0 auto 22px; animation: gira 2.4s var(--ease) both; }
.mie-pren { list-style: none; margin: 0; padding: 0; }
.mie-pren li { display: grid; grid-template-columns: 1fr auto; gap: 6px 18px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--linea); }
.mie-pren .quando { font-size: 21px; color: var(--verde); }
.mie-pren .dett { font-family: var(--f-label); font-size: 13px; color: var(--grigio); letter-spacing: .04em; }
.badge { font-family: var(--f-label); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; padding: 3px 9px; background: var(--carta-2); color: var(--grigio); }
.badge--confermata { background: var(--verde); color: var(--carta); }
.badge--attesa { background: #F1E1BC; color: #6E4B10; }
.badge--annullata, .badge--rifiutata { text-decoration: line-through; }
.riga-azioni { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 16px; }
.btn--piccolo { min-height: 40px; padding: 0 16px; font-size: 11px; }
.messaggio { padding: 14px 18px; margin: 0 0 24px; border-left: 3px solid var(--verde); background: rgba(58, 74, 48, .08); font-size: 16px; }
.messaggio--errore { border-color: #A32A2A; background: rgba(163, 42, 42, .07); }
.blocco-conto { background: var(--carta); border: 1px solid var(--carta-3); padding: clamp(22px, 3.4vw, 40px); margin-bottom: 24px; }
.blocco-conto h2 { margin-bottom: 18px; }
@media (max-width: 900px) { .conto { grid-template-columns: 1fr; } }

/* ---------- pianta (menu) ---------- */
.pianta {
  position: fixed; inset: 0; z-index: 90; background: rgba(31, 39, 26, .7);
  display: grid; place-items: center; padding: 16px; opacity: 0; transition: opacity .45s var(--ease);
}
.pianta[hidden] { display: none; }
.pianta.is-aperta { opacity: 1; }
.pianta__carta {
  width: min(1100px, 100%); max-height: calc(100dvh - 32px); overflow: auto;
  background: var(--notte); color: var(--carta); padding: clamp(20px, 3.4vw, 44px);
  border: 1px solid rgba(205, 174, 106, .35); outline: 1px solid rgba(205, 174, 106, .25); outline-offset: -10px;
  transform: translateY(18px) scale(.985); transition: transform .6s var(--ease);
}
.pianta.is-aperta .pianta__carta { transform: none; }
.pianta__testa { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 18px; }
.pianta__testa .occhiello { color: var(--oro); margin: 0; }
.pianta__chiudi { background: none; border: 0; cursor: pointer; font-family: var(--f-label); font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--beige); }
.pianta__chiudi span { font-size: 22px; vertical-align: -2px; margin-left: 6px; }
.pianta__corpo { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(20px, 4vw, 56px); align-items: center; }
.pianta__disegno { width: 100%; height: auto; color: var(--oro); }
.pianta__disegno .muri rect, .pianta__disegno .muri line { fill: none; stroke: var(--oro); stroke-width: 2.5; }
.pianta__disegno .muri .cortile { stroke-dasharray: 6 6; stroke-width: 1.5; fill: url(#tratteggio); }
.pianta__disegno .porta path, .pianta__disegno .porta line { fill: none; stroke: var(--oro); stroke-width: 1; opacity: .7; }
.pianta__disegno .stanze-plan rect { fill: transparent; stroke: none; transition: fill .35s; }
.pianta__disegno .stanze-plan circle { fill: none; stroke: var(--oro); stroke-width: 1; opacity: .7; }
.pianta__disegno text { fill: var(--carta); font-family: var(--f-display); font-size: 17px; text-anchor: middle; font-style: italic; pointer-events: none; }
.pianta__disegno text.pic { font-family: var(--f-label); font-style: normal; font-size: 9px; letter-spacing: .2em; text-transform: uppercase; fill: var(--oro); }
.pianta__disegno .cortile-t { fill: var(--beige); opacity: .8; }
.pianta__disegno a:hover rect, .pianta__disegno a.is-hover rect, .pianta__disegno a:focus rect { fill: rgba(205, 174, 106, .16); }
.pianta__elenco { list-style: none; margin: 0; padding: 0; counter-reset: s; }
.pianta__elenco a {
  display: grid; grid-template-columns: 44px 1fr; grid-template-rows: auto auto; column-gap: 12px; text-decoration: none;
  padding: 12px 0; border-bottom: 1px solid rgba(205, 174, 106, .2);
}
.pianta__elenco .num { grid-row: span 2; font-family: var(--f-label); font-size: 12px; letter-spacing: .1em; color: var(--oro); padding-top: 10px; }
.pianta__elenco .nome { font-size: clamp(24px, 2.4vw, 34px); line-height: 1.1; font-weight: 340; font-variation-settings: "opsz" 96; transition: color .3s, transform .4s var(--ease); }
.pianta__elenco .voce { font-family: var(--f-label); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--beige); opacity: .75; }
.pianta__elenco a:hover .nome, .pianta__elenco a.is-hover .nome { color: var(--oro); transform: translateX(6px); }
.pianta__elenco a[aria-current] .nome { font-style: italic; color: var(--oro-chiaro); }
.pianta__piede { margin: 22px 0 0; font-family: var(--f-label); font-size: 12px; letter-spacing: .12em; color: var(--beige); }
.pianta__piede a { color: var(--oro); }
@media (max-width: 760px) {
  .pianta__corpo { grid-template-columns: 1fr; }
  .pianta__disegno { order: 2; max-width: 460px; }
}

/* ---------- struttura ---------- */
.contenitore { width: min(var(--max), 100% - 2 * var(--gutter)); margin-inline: auto; }
.sezione { padding: clamp(80px, 11vw, 170px) 0; position: relative; }
.sezione--scura { background: var(--verde); color: var(--carta); }
.sezione--scura .t2, .sezione--scura .titolo, .sezione--scura .t3 { color: var(--carta); }
.sezione--scura .occhiello { color: var(--oro); }
.sezione--scura .t2 em, .sezione--scura .titolo em, .sezione--scura .frase em { color: var(--oro-chiaro); }
.sezione--notte { background: var(--notte); color: var(--carta); }
.sezione--notte .t2, .sezione--notte .t3 { color: var(--carta); }
.sezione--notte .occhiello { color: var(--oro); }
.sezione--notte .t2 em { color: var(--oro); }
.sezione--carta2 { background: var(--carta-2); }

.carta-da-parati {
  background-color: var(--carta-2);
  background-image: url("../img/carta-pomello.jpg");
  background-size: 300px auto;
}
.carta-da-parati--scura { position: relative; }
.carta-da-parati--scura::before { content: ""; position: absolute; inset: 0; background: rgba(31, 39, 26, .82); mix-blend-mode: multiply; }
.carta-da-parati--scura > * { position: relative; }

/* targa d'ottone: titolo di stanza */
.targa {
  display: inline-flex; align-items: center; gap: 0; margin: 0 0 28px;
  font-family: var(--f-label); text-transform: uppercase; letter-spacing: .26em; font-size: 11px;
  border: 1px solid var(--oro); color: var(--verde); background: linear-gradient(180deg, rgba(226, 204, 152, .35), rgba(205, 174, 106, .12));
}
.targa span { padding: 9px 14px; }
.targa__n { background: var(--oro); color: var(--notte); font-weight: 600; }
.targa__nome { font-weight: 500; }
.sezione--scura .targa, .sezione--notte .targa, .su-scuro .targa { color: var(--carta); }

/* cornici dorate per le foto */
.cornice { position: relative; background: var(--carta); padding: clamp(8px, 1vw, 14px); box-shadow: 0 1px 0 rgba(0,0,0,.05), 0 24px 50px -28px rgba(31, 39, 26, .55); }
.cornice::after { content: ""; position: absolute; inset: clamp(4px, .5vw, 7px); border: 1px solid var(--oro); pointer-events: none; }
.cornice img { width: 100%; height: 100%; object-fit: cover; }
.didascalia { font-family: var(--f-label); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--grigio); margin-top: 12px; }

/* comparsa allo scroll */
.rivela { opacity: 0; transform: translateY(26px); transition: opacity 1s var(--ease), transform 1.1s var(--ease); }
.rivela.is-visibile { opacity: 1; transform: none; }
.rivela[data-ritardo="1"] { transition-delay: .12s; }
.rivela[data-ritardo="2"] { transition-delay: .24s; }
.rivela[data-ritardo="3"] { transition-delay: .36s; }

/* ================= HOME: l'ingresso (hero fisso, senza animazione di apertura) ================= */
.ingresso { position: relative; background: var(--notte); }
.ingresso__scena { position: relative; height: 100vh; height: 100svh; min-height: 560px; overflow: hidden; }
.ingresso__dentro { position: absolute; inset: 0; background: url("../img/salotto-camino.jpg") center / cover no-repeat; animation: respira 18s var(--ease) both; }
@keyframes respira { from { transform: scale(1.08); } to { transform: scale(1); } }
.ingresso__dentro::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(31, 39, 26, .45) 0%, rgba(31, 39, 26, .15) 40%, rgba(31, 39, 26, .8) 100%); }
.ingresso__testo {
  position: absolute; left: var(--gutter); right: var(--gutter); bottom: clamp(40px, 9vh, 96px); z-index: 2; color: var(--carta);
  display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: 24px 48px; align-items: end;
  animation: entra-stanza 1.4s var(--ease) .2s both;
}
.ingresso__testo .titolo { color: var(--carta); font-size: clamp(56px, 10vw, 164px); }
.ingresso__testo .titolo em { color: var(--oro-chiaro); }
.ingresso__testo .lead { color: var(--beige); margin: 0 0 22px; }
.ingresso__testo .occhiello { color: var(--oro); }
.ingresso__testo .azioni { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 760px) { .ingresso__testo { grid-template-columns: 1fr; } }

/* soglia: testo editoriale */
.soglia { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; align-items: start; }
.soglia__num { grid-column: 1 / 3; font-family: var(--f-label); font-size: 12px; letter-spacing: .3em; color: var(--oro); text-transform: uppercase; padding-top: 18px; }
.soglia__frase { grid-column: 3 / 12; }
.soglia__frase .frase { color: var(--verde); }
.soglia__corpo { grid-column: 7 / 12; margin-top: 40px; color: var(--grigio); }
.soglia__firma { font-style: italic; color: var(--bordeaux); margin-top: 18px; }
@media (max-width: 860px) { .soglia__num, .soglia__frase, .soglia__corpo { grid-column: 1 / -1; } .soglia__corpo { margin-top: 10px; } }

/* le stanze in home: quadreria */
.quadreria { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(16px, 2vw, 28px); align-items: start; }
.quadro { text-decoration: none; display: block; position: relative; }
.quadro .cornice { overflow: hidden; }
.quadro .cornice img { transition: transform 1.4s var(--ease); }
.quadro:hover .cornice img { transform: scale(1.05); }
.quadro__testo { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: 16px; }
.quadro__nome { font-size: clamp(24px, 2vw, 32px); font-weight: 360; font-variation-settings: "opsz" 72; color: var(--verde); line-height: 1.1; }
.quadro__nome em { color: var(--bordeaux); }
.quadro__n { font-family: var(--f-label); font-size: 11px; letter-spacing: .24em; color: var(--oro); text-transform: uppercase; white-space: nowrap; }
.quadro__descr { color: var(--grigio); font-size: 16px; margin: 6px 0 0; max-width: 38ch; }
.quadro--a { grid-column: 1 / 6; }
.quadro--a .cornice { aspect-ratio: 4 / 5; }
.quadro--b { grid-column: 7 / 13; margin-top: 120px; }
.quadro--b .cornice { aspect-ratio: 3 / 2; }
.quadro--c { grid-column: 2 / 7; margin-top: -40px; }
.quadro--c .cornice { aspect-ratio: 1 / 1; }
.quadro--d { grid-column: 8 / 12; margin-top: 60px; }
.quadro--d .cornice { aspect-ratio: 3 / 4; }
.quadreria__testa { grid-column: 7 / 13; align-self: end; }
@media (max-width: 860px) {
  .quadro--a, .quadro--b, .quadro--c, .quadro--d, .quadreria__testa { grid-column: 1 / -1; margin-top: 0; }
  .quadro--b, .quadro--d { margin-left: 12%; }
  .quadro--a, .quadro--c { margin-right: 12%; }
}

/* sul fuoco: tre piatti */
.fuoco { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.fuoco__foto { position: relative; aspect-ratio: 4 / 5; }
.fuoco__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .8s var(--ease), transform 1.2s var(--ease); transform: scale(1.04); }
.fuoco__foto img.is-attiva { opacity: 1; transform: none; }
.fuoco__foto::after { content: ""; position: absolute; inset: 12px; border: 1px solid rgba(205, 174, 106, .7); pointer-events: none; }
.fuoco__lista { list-style: none; margin: 30px 0 34px; padding: 0; border-top: 1px solid rgba(205, 174, 106, .3); }
.fuoco__lista li { border-bottom: 1px solid rgba(205, 174, 106, .3); }
.fuoco__lista button {
  width: 100%; display: grid; grid-template-columns: 1fr auto; gap: 4px 20px; text-align: left; background: none; border: 0; cursor: pointer;
  padding: 22px 0; color: var(--carta);
}
.fuoco__piatto { font-size: clamp(24px, 2.2vw, 34px); font-weight: 340; font-variation-settings: "opsz" 96; line-height: 1.1; transition: color .3s; }
.fuoco__prezzo { font-family: var(--f-label); color: var(--oro); font-size: 14px; letter-spacing: .1em; }
.fuoco__descr { grid-column: 1 / -1; color: var(--beige); font-size: 16px; max-height: 0; overflow: hidden; opacity: 0; transition: max-height .6s var(--ease), opacity .5s; }
.fuoco__lista button[aria-pressed="true"] .fuoco__piatto, .fuoco__lista button:hover .fuoco__piatto { color: var(--oro-chiaro); font-style: italic; }
.fuoco__lista button[aria-pressed="true"] .fuoco__descr { max-height: 120px; opacity: .9; }
@media (max-width: 860px) { .fuoco { grid-template-columns: 1fr; } .fuoco__foto { aspect-ratio: 4 / 3; } }

/* citazione / oste */
.oste { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 100px); align-items: center; }
.oste blockquote { margin: 0; }
.oste .frase { color: var(--verde); }
.oste cite { display: block; margin-top: 26px; font-style: normal; font-family: var(--f-label); font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: var(--bordeaux); }
.oste .cornice { aspect-ratio: 4 / 5; transform: rotate(-1.5deg); }
@media (max-width: 860px) { .oste { grid-template-columns: 1fr; } .oste .cornice { max-width: 420px; } }

/* fascia invito con carta da parati */
.fascia-invito { padding: clamp(70px, 10vw, 140px) 0; text-align: center; }
.fascia-invito__cartiglio {
  display: inline-block; background: var(--carta); padding: clamp(36px, 5vw, 64px) clamp(24px, 6vw, 90px); max-width: min(760px, 100%);
  border: 1px solid var(--oro); outline: 1px solid var(--oro); outline-offset: -10px; box-shadow: 0 30px 60px -30px rgba(31, 39, 26, .6);
}
.fascia-invito .frase { color: var(--verde); margin-bottom: 26px; }
.fascia-invito p.piccolo { font-family: var(--f-label); font-size: 13px; letter-spacing: .08em; color: var(--grigio); margin-top: 20px; }

/* ================= testata di stanza (pagine interne) ================= */
.stanza-testa { padding: calc(var(--testata-h) + clamp(50px, 8vw, 120px)) 0 clamp(50px, 7vw, 100px); position: relative; }
.stanza-testa__griglia { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(24px, 5vw, 80px); align-items: end; }
.stanza-testa .lead { color: var(--grigio); margin: 0; }
@media (max-width: 860px) { .stanza-testa__griglia { grid-template-columns: 1fr; } }

/* ================= LA CASA ================= */
.casa-foto { position: relative; height: clamp(320px, 62vw, 780px); overflow: hidden; }
.casa-foto img { width: 100%; height: 118%; object-fit: cover; transform: translateY(calc(var(--py, 0) * -1px)); }
.storia { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; }
.storia__a { grid-column: 1 / 6; }
.storia__b { grid-column: 7 / 13; columns: 2; column-gap: 40px; color: var(--grigio); }
.storia__b p:first-child::first-letter { float: left; font-size: 4.4em; line-height: .82; padding: 6px 10px 0 0; color: var(--bordeaux); font-variation-settings: "opsz" 144; }
@media (max-width: 860px) { .storia__a, .storia__b { grid-column: 1 / -1; } .storia__b { columns: 1; } }

.stanza-riga { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; align-items: center; padding: clamp(40px, 6vw, 90px) 0; border-top: 1px solid var(--linea); }
.stanza-riga__foto { grid-column: 1 / 8; }
.stanza-riga__foto .cornice { aspect-ratio: 16 / 10; }
.stanza-riga__testo { grid-column: 9 / 13; }
.stanza-riga--inversa .stanza-riga__foto { grid-column: 6 / 13; order: 2; }
.stanza-riga--inversa .stanza-riga__testo { grid-column: 1 / 5; order: 1; }
.stanza-riga__dati { display: flex; gap: 28px; margin-top: 20px; font-family: var(--f-label); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--bordeaux); }
.stanza-riga__dati b { display: block; font-family: var(--f-display); font-size: 34px; letter-spacing: 0; font-weight: 340; color: var(--verde); text-transform: none; }
@media (max-width: 860px) {
  .stanza-riga__foto, .stanza-riga__testo, .stanza-riga--inversa .stanza-riga__foto, .stanza-riga--inversa .stanza-riga__testo { grid-column: 1 / -1; order: initial; }
}

.persone { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 48px); }
.persona .cornice { aspect-ratio: 3 / 4; margin-bottom: 20px; }
.persona:nth-child(2) { margin-top: 70px; }
.persona__ruolo { font-family: var(--f-label); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--oro); }
.persona p { color: var(--beige); font-size: 16px; }
@media (max-width: 860px) { .persone { grid-template-columns: 1fr; } .persona:nth-child(2) { margin-top: 0; } .persona .cornice { max-width: 380px; } }

.valori { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--linea); }
.valore { padding: 34px 26px 10px 0; border-right: 1px solid var(--linea); }
.valore + .valore { padding-left: 26px; }
.valore:last-child { border-right: 0; }
.valore__n { font-family: var(--f-label); font-size: 11px; letter-spacing: .24em; color: var(--oro); }
.valore p { color: var(--grigio); font-size: 16px; }
@media (max-width: 860px) { .valori { grid-template-columns: 1fr 1fr; } .valore { border-right: 0; padding-left: 0 !important; border-bottom: 1px solid var(--linea); } }
@media (max-width: 520px) { .valori { grid-template-columns: 1fr; } }

/* ================= MENÙ ================= */
.p-menu { background: var(--verde); }
.p-menu .stanza-testa { color: var(--carta); }
.p-menu .stanza-testa .titolo { color: var(--carta); }
.p-menu .stanza-testa .titolo em { color: var(--oro-chiaro); }
.p-menu .stanza-testa .lead { color: var(--beige); }
.tovaglia { padding-bottom: clamp(70px, 10vw, 150px); position: relative; }
.carta-menu {
  position: relative; width: min(980px, 100%); margin: 0 auto; background: var(--carta); color: var(--inchiostro);
  padding: clamp(28px, 6vw, 84px) clamp(18px, 6vw, 90px) clamp(36px, 5vw, 70px);
  box-shadow: 0 50px 90px -40px rgba(0, 0, 0, .6);
}
.carta-menu::before { content: ""; position: absolute; inset: 12px; border: 1px solid var(--oro); pointer-events: none; }
.carta-menu::after { content: ""; position: absolute; inset: 18px; border: 1px solid rgba(205, 174, 106, .45); pointer-events: none; }
.carta-menu__testa { text-align: center; margin-bottom: 30px; }
.carta-menu__testa .pomello { width: 46px; height: 46px; color: var(--oro); margin: 0 auto 14px; }
.carta-menu__testa .occhiello { margin-bottom: 6px; }
.schede { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 6px; margin: 0 0 40px; padding: 0; list-style: none; }
.schede button {
  background: none; border: 0; cursor: pointer; padding: 10px 14px; position: relative;
  font-family: var(--f-label); font-size: 12px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--grigio);
}
.schede button::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 1px; background: var(--bordeaux); transform: scaleX(0); transition: transform .4s var(--ease); }
.schede button[aria-selected="true"] { color: var(--bordeaux); }
.schede button[aria-selected="true"]::after, .schede button:hover::after { transform: scaleX(1); }
.portata[hidden] { display: none; }
.portata__titolo { text-align: center; font-style: italic; font-weight: 330; font-size: clamp(30px, 3vw, 44px); color: var(--verde); margin: 0 0 8px; }
.portata__sotto { text-align: center; color: var(--grigio); font-size: 15px; margin: 0 auto 34px; max-width: 46ch; }
.piatti { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 56px; }
.piatto { padding: 16px 0; position: relative; }
.piatto__riga { display: flex; align-items: baseline; gap: 10px; }
.piatto__nome { font-size: 21px; font-weight: 450; font-variation-settings: "opsz" 36; color: var(--verde); }
.piatto__riga::after { content: ""; order: 2; flex: 1; border-bottom: 1px dotted rgba(58, 74, 48, .45); transform: translateY(-5px); }
.piatto__prezzo { order: 3; font-family: var(--f-label); font-size: 15px; color: var(--bordeaux); }
.piatto__descr { font-size: 15px; color: var(--grigio); margin: 4px 0 0; line-height: 1.5; }
.piatto__tag { font-family: var(--f-label); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--oro); margin-left: 4px; }
.piatto[data-foto] .piatto__nome { cursor: zoom-in; text-decoration: underline; text-decoration-color: rgba(205, 174, 106, .6); text-underline-offset: 5px; text-decoration-thickness: 1px; }
@media (max-width: 720px) { .piatti { grid-template-columns: 1fr; } }
.carta-menu__nota { text-align: center; font-family: var(--f-label); font-size: 12px; letter-spacing: .06em; color: var(--grigio); margin-top: 40px; line-height: 1.8; }
.foto-volante {
  position: fixed; z-index: 40; width: 260px; aspect-ratio: 4 / 3; pointer-events: none; opacity: 0; transform: translate(-50%, -110%) rotate(-3deg) scale(.9);
  transition: opacity .3s, transform .4s var(--ease); background: var(--carta); padding: 8px; box-shadow: 0 20px 40px -14px rgba(0, 0, 0, .5);
}
.foto-volante img { width: 100%; height: 100%; object-fit: cover; }
.foto-volante.is-visibile { opacity: 1; transform: translate(-50%, -112%) rotate(-3deg) scale(1); }
@media (hover: none) { .foto-volante { display: none; } }

.percorso { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(30px, 6vw, 90px); align-items: center; }
.percorso__prezzo { font-size: clamp(60px, 8vw, 120px); font-weight: 300; font-variation-settings: "opsz" 144; color: var(--oro); line-height: 1; margin: 10px 0; }
.percorso__prezzo small { font-family: var(--f-label); font-size: 13px; letter-spacing: .2em; text-transform: uppercase; color: var(--beige); margin-left: 10px; }
.percorso .cornice { aspect-ratio: 5 / 4; background: var(--notte); }
@media (max-width: 860px) { .percorso { grid-template-columns: 1fr; } }
.galleria-piatti { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 70px; }
.galleria-piatti img { aspect-ratio: 1; object-fit: cover; width: 100%; }
.galleria-piatti img:nth-child(odd) { transform: translateY(24px); }
@media (max-width: 700px) { .galleria-piatti { grid-template-columns: 1fr 1fr; } }

/* ================= ESPERIENZE ================= */
.almanacco { border-top: 2px solid var(--verde); }
.giorno-riga { display: grid; grid-template-columns: 170px minmax(0, 1fr) minmax(0, 1.1fr) 160px; gap: 24px; align-items: center; padding: 28px 0; border-bottom: 1px solid var(--linea); transition: background .4s; }
.giorno-riga:hover { background: rgba(205, 174, 106, .1); }
.giorno-riga__g { font-family: var(--f-label); font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: var(--bordeaux); }
.giorno-riga__g b { display: block; font-family: var(--f-display); font-size: 40px; letter-spacing: 0; font-weight: 320; font-style: italic; color: var(--verde); text-transform: none; line-height: 1; margin-top: 4px; }
.giorno-riga .t3 { margin: 0; }
.giorno-riga p { margin: 0; color: var(--grigio); font-size: 16px; }
.giorno-riga__foto { aspect-ratio: 4 / 3; overflow: hidden; }
.giorno-riga__foto img { width: 100%; height: 100%; object-fit: cover; filter: sepia(.15); transition: transform 1s var(--ease); }
.giorno-riga:hover .giorno-riga__foto img { transform: scale(1.06); }
.giorno-riga__prezzo { font-family: var(--f-label); font-size: 13px; letter-spacing: .12em; color: var(--verde); text-align: right; }
@media (max-width: 900px) {
  .giorno-riga { grid-template-columns: 1fr 1fr; }
  .giorno-riga__foto { grid-row: 1; grid-column: 2; }
  .giorno-riga > div:nth-child(2), .giorno-riga > p { grid-column: 1 / -1; }
  .giorno-riga__prezzo { text-align: left; grid-column: 1 / -1; }
}
.privati { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(30px, 6vw, 90px); align-items: center; }
.privati__foto { position: relative; }
.privati__foto .cornice:first-child { aspect-ratio: 4 / 3; }
.privati__foto .cornice:last-child { position: absolute; width: 46%; aspect-ratio: 3 / 4; right: -4%; bottom: -16%; }
.elenco-segni { list-style: none; padding: 0; margin: 24px 0 32px; }
.elenco-segni li { padding: 12px 0 12px 34px; border-bottom: 1px solid rgba(205, 174, 106, .25); position: relative; }
.elenco-segni li::before { content: "✦"; position: absolute; left: 4px; color: var(--oro); }
@media (max-width: 860px) { .privati { grid-template-columns: 1fr; } .privati__foto { margin-bottom: 70px; } }

/* ================= PRENOTA ================= */
.p-prenota { background: var(--carta-2); }
.prenota { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); gap: clamp(24px, 4vw, 64px); align-items: start; padding-bottom: clamp(70px, 10vw, 140px); }
.modulo { background: var(--carta); padding: clamp(22px, 4vw, 52px); border: 1px solid var(--carta-3); }
.passo { border: 0; padding: 0; margin: 0 0 40px; min-width: 0; }
.passo legend { padding: 0; margin-bottom: 18px; display: flex; align-items: baseline; gap: 14px; width: 100%; }
.passo__n { font-family: var(--f-label); font-size: 11px; letter-spacing: .2em; color: var(--carta); background: var(--verde); padding: 5px 9px; }
.passo__t { font-size: clamp(24px, 2vw, 30px); font-weight: 380; color: var(--verde); font-variation-settings: "opsz" 72; }
.persone-scelta { display: flex; flex-wrap: wrap; gap: 8px; }
.persone-scelta button, .orari button {
  min-width: 52px; min-height: 48px; padding: 0 14px; background: transparent; border: 1px solid var(--linea); cursor: pointer;
  font-family: var(--f-label); font-size: 15px; color: var(--verde); transition: background .25s, color .25s, border-color .25s;
}
.persone-scelta button:hover, .orari button:hover { border-color: var(--verde); }
.persone-scelta button[aria-pressed="true"], .orari button[aria-pressed="true"] { background: var(--verde); color: var(--carta); border-color: var(--verde); }
.nota-piccola { font-family: var(--f-label); font-size: 13px; color: var(--grigio); margin: 12px 0 0; letter-spacing: .02em; }
.nota-piccola a { color: var(--bordeaux); }

.cal { max-width: 520px; }
.cal__testa { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.cal__mese { font-size: 24px; font-style: italic; color: var(--verde); font-weight: 360; text-transform: capitalize; }
.cal__nav { display: flex; gap: 6px; }
.cal__nav button { width: 44px; height: 44px; border: 1px solid var(--linea); background: none; cursor: pointer; color: var(--verde); font-size: 18px; }
.cal__nav button:disabled { opacity: .3; cursor: default; }
.cal__griglia { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.cal__gs { font-family: var(--f-label); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--grigio); text-align: center; padding: 6px 0; }
.cal__g {
  aspect-ratio: 1; display: grid; place-items: center; border: 1px solid transparent; background: none; cursor: pointer; position: relative;
  font-family: var(--f-display); font-size: 18px; color: var(--verde); transition: background .2s, border-color .2s;
}
.cal__g:hover:not(:disabled) { border-color: var(--verde); }
.cal__g:disabled { color: rgba(58, 74, 48, .3); cursor: default; }
.cal__g.is-pieno { color: rgba(99, 50, 52, .55); text-decoration: line-through; }
.cal__g.is-oggi::after { content: ""; position: absolute; bottom: 7px; width: 4px; height: 4px; border-radius: 50%; background: var(--oro); }
.cal__g[aria-pressed="true"] { background: var(--bordeaux); color: var(--carta); border-color: var(--bordeaux); }
.cal__legenda { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 12px; font-family: var(--f-label); font-size: 12px; color: var(--grigio); }
.cal__legenda span::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 6px; vertical-align: -1px; }
.cal__legenda .l-scelto::before { background: var(--bordeaux); }
.cal__legenda .l-pieno::before { background: none; border-top: 1px solid var(--bordeaux); height: 0; vertical-align: 3px; width: 14px; }
.cal__legenda .l-chiuso::before { background: var(--carta-3); }
.turni { display: grid; gap: 22px; }
.turno__t { font-family: var(--f-label); font-size: 12px; letter-spacing: .24em; text-transform: uppercase; color: var(--bordeaux); margin: 0 0 10px; display: flex; justify-content: space-between; gap: 10px; }
.turno__t span { color: var(--grigio); letter-spacing: .08em; text-transform: none; }
.orari { display: flex; flex-wrap: wrap; gap: 8px; }
.orari button:disabled { opacity: .35; cursor: not-allowed; text-decoration: line-through; }
.vuoto { color: var(--grigio); font-style: italic; }

.campi { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 22px; }
.campo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.campo--pieno { grid-column: 1 / -1; }
.campo label, .campo .etichetta { font-family: var(--f-label); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--grigio); }
.campo input, .campo select, .campo textarea {
  width: 100%; font: inherit; font-size: 18px; color: var(--inchiostro); background: transparent; border: 0; border-bottom: 1px solid rgba(58, 74, 48, .4);
  padding: 10px 0; border-radius: 0; transition: border-color .25s;
}
.campo textarea { min-height: 90px; resize: vertical; border: 1px solid rgba(58, 74, 48, .3); padding: 12px; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--bordeaux); }
.campo.ha-errore input, .campo.ha-errore select { border-color: #A32A2A; }
.campo__errore { font-family: var(--f-label); font-size: 12px; color: #A32A2A; min-height: 0; }
.spunta { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; color: var(--grigio); cursor: pointer; }
.spunta input { width: 20px; height: 20px; accent-color: var(--verde); margin-top: 3px; flex: none; }
.spunta a { color: var(--bordeaux); }
.miele { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.modulo__invia { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 30px; }
.modulo__msg { font-family: var(--f-label); font-size: 14px; color: #A32A2A; margin: 0; }
@media (max-width: 620px) { .campi { grid-template-columns: 1fr; } }

/* segnaposto riepilogo */
.segnaposto { position: sticky; top: calc(var(--testata-h) + 20px); }
.segnaposto__carta {
  background: var(--verde); color: var(--carta); padding: 34px 30px 30px; text-align: center; position: relative;
  box-shadow: 0 30px 50px -30px rgba(31, 39, 26, .7);
}
.segnaposto__carta::before { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(205, 174, 106, .55); pointer-events: none; }
.segnaposto__carta .pomello { width: 52px; height: 52px; color: var(--oro); margin: 0 auto 16px; transition: transform 1s var(--ease); }
.segnaposto__carta.is-pronto .pomello { transform: rotate(180deg); }
.segnaposto__nome { font-size: clamp(26px, 2.4vw, 34px); font-style: italic; font-weight: 330; line-height: 1.1; margin: 0 0 18px; color: var(--oro-chiaro); min-height: 1.1em; overflow-wrap: anywhere; }
.segnaposto dl { margin: 0; display: grid; gap: 0; text-align: left; }
.segnaposto dl div { display: flex; justify-content: space-between; gap: 12px; padding: 11px 0; border-top: 1px solid rgba(205, 174, 106, .22); }
.segnaposto dt { font-family: var(--f-label); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--beige); }
.segnaposto dd { margin: 0; text-align: right; font-size: 17px; }
.segnaposto__aiuto { font-family: var(--f-label); font-size: 13px; color: var(--grigio); margin-top: 18px; line-height: 1.7; }
.segnaposto__aiuto a { color: var(--bordeaux); }
@media (max-width: 960px) { .prenota { grid-template-columns: 1fr; } .segnaposto { position: static; order: -1; } }

.grazie { text-align: center; padding: clamp(40px, 6vw, 80px) clamp(20px, 4vw, 50px); }
.grazie .pomello { width: 80px; height: 80px; color: var(--oro); margin: 0 auto 24px; animation: gira 2.4s var(--ease) both; }
@keyframes gira { from { transform: rotate(-200deg); } to { transform: rotate(0); } }
.grazie__codice { display: inline-block; font-family: var(--f-label); letter-spacing: .3em; font-size: 15px; border: 1px solid var(--oro); padding: 10px 18px; margin: 10px 0 20px; color: var(--bordeaux); }
.avviso { background: rgba(205, 174, 106, .22); border-left: 3px solid var(--oro); padding: 14px 18px; margin: 0 0 30px; font-size: 16px; }

/* ================= CONTATTI ================= */
.portone { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(30px, 5vw, 80px); align-items: start; }
.indirizzo-grande { font-size: clamp(34px, 4.4vw, 64px); line-height: 1.05; font-weight: 340; font-variation-settings: "opsz" 144; color: var(--verde); margin: 0 0 18px; }
.indirizzo-grande em { color: var(--bordeaux); }
.mappa { position: relative; aspect-ratio: 4 / 3; }
.mappa iframe { width: 100%; height: 100%; border: 0; filter: grayscale(.7) sepia(.35) contrast(.95); }
.targa-orari { background: var(--verde); color: var(--carta); padding: clamp(26px, 3vw, 40px); position: relative; margin-top: 40px; }
.targa-orari::before { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(205, 174, 106, .5); pointer-events: none; }
.targa-orari h2 { color: var(--oro); }
.targa-orari table { width: 100%; border-collapse: collapse; }
.targa-orari td, .targa-orari th { padding: 12px 0; border-bottom: 1px solid rgba(205, 174, 106, .22); text-align: left; vertical-align: top; font-weight: 400; }
.targa-orari th { font-family: var(--f-label); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--beige); padding-right: 16px; }
.contatti-righe { display: grid; gap: 0; margin: 30px 0; border-top: 1px solid var(--linea); }
.contatti-righe a, .contatti-righe p { display: flex; justify-content: space-between; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--linea); text-decoration: none; margin: 0; flex-wrap: wrap; }
.contatti-righe span:first-child { font-family: var(--f-label); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--grigio); }
.contatti-righe span:last-child { font-size: 20px; color: var(--verde); }
.contatti-righe a:hover span:last-child { color: var(--bordeaux); font-style: italic; }
.domande details { border-bottom: 1px solid var(--linea); padding: 6px 0; }
.domande summary { cursor: pointer; list-style: none; padding: 18px 40px 18px 0; position: relative; font-size: 21px; color: var(--verde); }
.domande summary::-webkit-details-marker { display: none; }
.domande summary::after { content: "+"; position: absolute; right: 4px; top: 14px; font-size: 26px; color: var(--oro); transition: transform .3s; }
.domande details[open] summary::after { transform: rotate(45deg); }
.domande details p { color: var(--grigio); max-width: 64ch; }
@media (max-width: 860px) { .portone { grid-template-columns: 1fr; } }

/* ================= testi legali ================= */
.legale { max-width: 72ch; }
.legale h2 { font-size: 26px; font-weight: 400; color: var(--verde); margin: 40px 0 10px; }
.legale p, .legale li { color: var(--grigio); font-size: 17px; }

/* ================= piede ================= */
.piede { position: relative; background: var(--notte); color: var(--beige); overflow: hidden; }
.piede__carta { position: absolute; inset: 0; background: url("../img/carta-pomello.jpg") 0 0 / 280px auto; opacity: .07; }
.piede__dentro { position: relative; width: min(var(--max), 100% - 2 * var(--gutter)); margin: 0 auto; padding: clamp(60px, 8vw, 110px) 0 30px; }
.piede__invito { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 24px; padding-bottom: 50px; border-bottom: 1px solid rgba(205, 174, 106, .25); }
.piede__invito .occhiello { color: var(--oro); width: 100%; margin: 0; }
.piede__frase { font-size: clamp(38px, 5vw, 76px); line-height: 1; margin: 0; font-weight: 320; font-variation-settings: "opsz" 144; color: var(--carta); }
.piede__frase em { color: var(--oro); }
.piede__logo { width: min(520px, 80%); margin: 60px auto 56px; opacity: .95; }
.piede__colonne { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px; font-size: 16px; line-height: 1.7; }
.piede__colonne .occhiello { color: var(--oro); font-size: 11px; }
.piede__colonne a { text-decoration: none; border-bottom: 1px solid rgba(205, 174, 106, .3); }
.piede__colonne a:hover { color: var(--oro); }
.piede__colonne ul { list-style: none; margin: 0; padding: 0; }
.piede__colonne li { margin-bottom: 4px; }
.piede__g { font-family: var(--f-label); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--carta); }
.piede__legale { margin: 60px 0 0; padding-top: 24px; border-top: 1px solid rgba(205, 174, 106, .18); font-family: var(--f-label); font-size: 12px; letter-spacing: .06em; opacity: .7; }
@media (max-width: 860px) { .piede__colonne { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .piede__colonne { grid-template-columns: 1fr; } }

/* ---------- transizione tra stanze (Chrome/Edge: view transitions tra pagine) ---------- */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: esci-stanza .45s var(--ease-porta) both; }
::view-transition-new(root) { animation: entra-stanza .7s var(--ease) both; }
@keyframes esci-stanza { to { opacity: 0; transform: scale(.985); filter: blur(2px); } }
@keyframes entra-stanza { from { opacity: 0; transform: translateY(14px); } }

@media (prefers-reduced-motion: reduce) {
  html:not(.motion) *, html:not(.motion) *::before, html:not(.motion) *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  html:not(.motion) .rivela { opacity: 1; transform: none; }
}

/* ================= COMING SOON ================= */
.visuale-nascosta { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.barra-anteprima { position: fixed; top: 0; left: 0; right: 0; height: 33px; display: flex; align-items: center; justify-content: center; z-index: 95; background: var(--bordeaux); color: var(--carta); text-align: center; padding: 8px 16px; font-family: var(--f-label); font-size: 12px; letter-spacing: .08em; }
.barra-anteprima a { color: var(--oro-chiaro); margin-left: 12px; }
body:has(.barra-anteprima) { padding-top: 33px; }
body:has(.barra-anteprima) .testata { top: 33px; }
body:has(.barra-anteprima) .testata.is-nascosta { transform: translateY(calc(-100% - 33px)); }
.attesa { min-height: 100vh; min-height: 100svh; display: grid; place-items: center; padding: 40px 16px 70px; position: relative; background: var(--notte); overflow: hidden; }
.attesa__carta { position: absolute; inset: -40px; background: var(--carta-2) url("../img/carta-pomello.jpg") 0 0 / 280px auto; animation: carta-scorre 90s linear infinite; }
.attesa__carta::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at center, rgba(31, 39, 26, .05) 30%, rgba(31, 39, 26, .55) 100%); }
@keyframes carta-scorre { to { background-position: 280px 334px; } }
.attesa__cartiglio {
  position: relative; width: min(680px, 100%); background: var(--carta); text-align: center;
  padding: clamp(40px, 7vw, 76px) clamp(22px, 6vw, 70px) clamp(30px, 5vw, 50px);
  border: 1px solid var(--oro); outline: 1px solid var(--oro); outline-offset: -12px; box-shadow: 0 40px 80px -30px rgba(31, 39, 26, .75);
  animation: entra-stanza 1.2s var(--ease) both;
}
.attesa__pomello { width: 56px; height: 56px; color: var(--oro); margin: 0 auto 22px; animation: gira 3s var(--ease) both; }
.attesa__logo { margin: 0 auto 26px; width: min(440px, 92%); }
.attesa__logo img { width: 100%; height: auto; }
.attesa .frase { color: var(--verde); font-size: clamp(28px, 4vw, 44px); margin-bottom: 18px; }
.attesa__testo { color: var(--grigio); max-width: 46ch; margin: 0 auto 24px; font-size: 17px; }
.attesa__dove { font-family: var(--f-label); font-size: 13px; letter-spacing: .06em; color: var(--verde); line-height: 1.9; margin-bottom: 28px; }
.attesa__dove a { color: var(--bordeaux); }
.attesa__chiave { border-top: 1px solid var(--linea); padding-top: 18px; }
.attesa__chiave summary { cursor: pointer; list-style: none; font-family: var(--f-label); font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--grigio); }
.attesa__chiave summary::-webkit-details-marker { display: none; }
.attesa__chiave summary span { color: var(--bordeaux); border-bottom: 1px solid currentColor; margin-left: 6px; }
.attesa__chiave form { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 18px; }
.attesa__chiave input { font: inherit; font-size: 17px; padding: 0 14px; min-height: 52px; border: 1px solid rgba(58, 74, 48, .35); background: #fff; min-width: 0; flex: 1 1 220px; max-width: 300px; border-radius: 0; }
.attesa__chiave input:focus { outline: 2px solid var(--oro); border-color: var(--verde); }
.attesa__errore { font-family: var(--f-label); font-size: 13px; color: #A32A2A; margin: 12px 0 0; }
.attesa__legale { position: absolute; bottom: 16px; left: 16px; right: 16px; margin: 0; text-align: center; font-family: var(--f-label); font-size: 11px; letter-spacing: .04em; color: var(--carta); text-shadow: 0 1px 2px rgba(0,0,0,.5); }
@media (prefers-reduced-motion: reduce) { .attesa__carta, .attesa__cartiglio, .attesa__pomello { animation: none; } }

.h1-occhiello { display: block; font-size: 12px; line-height: 1.5; letter-spacing: .28em; margin-bottom: 18px; color: var(--oro); font-family: var(--f-label); font-weight: 500; }

/* ================= POPUP richiesta evento ================= */
.popup { border: 0; padding: 0; background: transparent; width: min(760px, calc(100% - 24px)); max-height: calc(100dvh - 24px); overflow: visible; color: var(--inchiostro); }
.popup::backdrop { background: rgba(31, 39, 26, .72); backdrop-filter: blur(3px); }
.popup[open] { animation: entra-stanza .5s var(--ease) both; }
.popup__carta { position: relative; background: var(--carta); padding: clamp(26px, 4.5vw, 52px); max-height: calc(100dvh - 24px); overflow: auto; border: 1px solid var(--oro); outline: 1px solid var(--oro); outline-offset: -10px; }
.popup__chiudi { position: absolute; top: 14px; right: 16px; width: 42px; height: 42px; border: 0; background: none; font-size: 30px; line-height: 1; color: var(--verde); cursor: pointer; z-index: 2; }
.popup__chiudi:hover { color: var(--bordeaux); }
.popup .t2 { font-size: clamp(30px, 3.6vw, 46px); padding-right: 30px; }
.scelta-tipo { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 4px; }
.scelta-tipo label { cursor: pointer; }
.scelta-tipo input { position: absolute; opacity: 0; }
.scelta-tipo span { display: block; padding: 14px 16px; border: 1px solid rgba(58, 74, 48, .3); font-size: 19px; color: var(--verde); transition: background .25s, border-color .25s, color .25s; }
.scelta-tipo small { display: block; font-family: var(--f-label); font-size: 12px; color: var(--grigio); margin-top: 3px; }
.scelta-tipo input:checked + span { background: var(--verde); border-color: var(--verde); color: var(--carta); }
.scelta-tipo input:checked + span small { color: var(--beige); }
.scelta-tipo input:focus-visible + span { outline: 2px solid var(--oro); outline-offset: 2px; }
.campo.ha-errore .scelta-tipo span { border-color: #A32A2A; }
.popup .esito { padding: 20px 0 0; }
body.popup-aperto { overflow: hidden; }
@media (max-width: 560px) { .scelta-tipo { grid-template-columns: 1fr; } }

/* ================= bande di colore (pagina La casa) ================= */
.sezione--bordeaux { background: var(--bordeaux); color: var(--carta); }
.sezione--bordeaux .t2, .sezione--bordeaux .t3 { color: var(--carta); }
.sezione--bordeaux .t2 em { color: var(--oro-chiaro); }
.sezione--bordeaux .occhiello { color: var(--oro); }
.sezione--bordeaux .storia__b { color: #EADCCB; }
.sezione--bordeaux .storia__b p:first-child::first-letter { color: var(--oro); }
.sezione--oro { background: var(--oro); color: var(--notte); }
.sezione--oro .occhiello { color: var(--bordeaux); }
.sezione--oro .t3 { color: var(--notte); }
.sezione--oro .valori { border-top-color: rgba(31, 39, 26, .3); }
.sezione--oro .valore { border-color: rgba(31, 39, 26, .22); }
.sezione--oro .valore p { color: #3B3A2A; }
.sezione--oro .valore__n { color: var(--bordeaux); font-weight: 600; }
.banda-stanza { padding: clamp(60px, 8vw, 120px) 0; }
.banda-stanza .stanza-riga { border-top: 0; padding: 0; }
.banda-stanza .t2 + .stanza-riga { margin-top: clamp(30px, 4vw, 56px); }
.banda-stanza .t3 { color: var(--carta); font-size: clamp(30px, 3vw, 44px); }
.banda-stanza .stanza-riga__testo p { color: var(--beige); }
.banda-stanza .stanza-riga__dati { color: var(--oro); }
.banda-stanza .stanza-riga__dati b { color: var(--carta); }
.banda-stanza .occhiello { color: var(--oro); }
.banda-stanza .t2 { color: var(--carta); }
.banda-stanza .t2 em { color: var(--oro-chiaro); }
.carta-da-parati--scura.banda-stanza::before { background: rgba(31, 39, 26, .86); }