/* ============================================================
   Token — ricavati dal CSS reale di stpeterfamilystay.com
   oro #C1B06C · terracotta #9E613D · nero #000 · grigio #2C2C2C
   ============================================================ */
:root{
  --ink:#1A1714;
  --ink-soft:#5A544C;
  --ground:#FBFAF7;
  --surface:#FFFFFF;
  --line:#E3DED3;
  --gold:#C1B06C;
  --gold-deep:#9C8C4E;
  --terra:#9E613D;
  --terra-deep:#834E2F;
  --night:#0B0B0B;
  --night-soft:#211E1A;
  --on-night:#F3EFE6;
  --on-night-soft:#B3AC9E;
  --flag:#2F6B54;
  --measure:66ch;
  --pad:clamp(1.25rem,5vw,4rem);
  --step:clamp(3rem,7vw,5.5rem);
}
:root:not([data-theme="light"]){
  @media (prefers-color-scheme: dark){
    --ink:#F0EBE1; --ink-soft:#A9A296;
    --ground:#100E0C; --surface:#1A1714; --line:#332E27;
    --gold:#D4C486; --gold-deep:#C1B06C;
    --terra:#C27A4E; --terra-deep:#9E613D;
    --night:#060505; --night-soft:#181513;
    --flag:#5FA487;
  }
}
:root[data-theme="dark"]{
  --ink:#F0EBE1; --ink-soft:#A9A296;
  --ground:#100E0C; --surface:#1A1714; --line:#332E27;
  --gold:#D4C486; --gold-deep:#C1B06C;
  --terra:#C27A4E; --terra-deep:#9E613D;
  --night:#060505; --night-soft:#181513;
  --flag:#5FA487;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font-family:Raleway,"Segoe UI",system-ui,sans-serif;
  font-size:16px; line-height:1.65; font-weight:400;
  overflow-x:hidden;                 /* il bug del sito attuale: mai più */
}
img{max-width:100%; height:auto; display:block;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}

h1,h2,h3{font-family:"Cormorant Garamond",Georgia,serif; font-weight:400; text-wrap:balance; margin:0;}
h1{font-size:clamp(2.4rem,7vw,4.6rem); line-height:1.05; letter-spacing:.06em;}
h2{font-size:clamp(1.9rem,4vw,2.9rem); line-height:1.15;}
h3{font-size:clamp(1.25rem,2.4vw,1.6rem); line-height:1.25;}
p{margin:0; max-width:var(--measure);}

.eyebrow{
  font-size:.72rem; letter-spacing:.22em; text-transform:uppercase;
  font-weight:600; color:var(--terra); margin:0;
}
.wrap{width:100%; max-width:1180px; margin-inline:auto; padding-inline:var(--pad);}
section{padding-block:var(--step);}

/* ---------- lingua ---------- */
[data-lang]{display:none;}
body.it [data-lang="it"]{display:revert;}
body.en [data-lang="en"]{display:revert;}
body.it span[data-lang="it"], body.en span[data-lang="en"]{display:inline;}

/* ---------- barra strumenti POC ---------- */
.poc{
  position:sticky; top:0; z-index:60;
  display:flex; flex-wrap:wrap; gap:.75rem 1.25rem; align-items:center;
  background:var(--night-soft); color:var(--on-night);
  padding:.6rem var(--pad); font-size:.8rem;
  border-bottom:1px solid rgba(193,176,108,.28);
}
.poc strong{font-weight:600; letter-spacing:.14em; text-transform:uppercase; font-size:.68rem; color:var(--gold);}
.poc-sp{margin-left:auto;}
.sw{display:inline-flex; border:1px solid rgba(243,239,230,.28); border-radius:2px; overflow:hidden;}
.sw button{
  font:inherit; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase;
  background:transparent; color:var(--on-night-soft); border:0; padding:.35rem .8rem; cursor:pointer;
}
.sw button[aria-pressed="true"]{background:var(--gold); color:#1A1714; font-weight:600;}
.toggle{display:inline-flex; align-items:center; gap:.5rem; cursor:pointer; color:var(--on-night-soft);}
.toggle input{accent-color:var(--gold); width:1rem; height:1rem;}

/* evidenziazione delle modifiche */
.chg{position:relative;}
body.show-chg .chg{outline:2px dashed var(--gold); outline-offset:8px; border-radius:2px;}
.tag{
  display:none; position:absolute; top:-.85rem; left:0; z-index:5;
  background:var(--gold); color:#1A1714; font-size:.62rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; padding:.15rem .55rem; border-radius:2px;
}
/* la regola lingua (0,2,0) vincerebbe su .tag (0,1,0): questa la batte a 0,2,1 */
body.it .tag[data-lang="it"], body.en .tag[data-lang="en"]{display:none;}
body.show-chg.it .tag[data-lang="it"],
body.show-chg.en .tag[data-lang="en"]{display:inline-block;}
.tag.rm{background:var(--terra); color:#fff;}

/* ---------- header ---------- */
.top{
  display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap;
  padding:1rem var(--pad); background:var(--night); color:var(--on-night);
}
.brandmark{display:flex; align-items:center; gap:.75rem; text-decoration:none;}
.brandmark img{width:38px;}
.brandmark span{font-family:"Cormorant Garamond",serif; font-size:1.05rem; letter-spacing:.16em; text-transform:uppercase;}
.nav{display:flex; flex-wrap:wrap; gap:.4rem 1.6rem; margin-left:auto; list-style:none; padding:0;}
.nav a{
  text-decoration:none; font-size:.74rem; letter-spacing:.17em; text-transform:uppercase;
  color:var(--on-night-soft); padding-block:.25rem;
}
.nav a:hover{color:var(--gold);}
.nav a.on{color:var(--on-night); border-bottom:1px solid var(--gold);}

/* ---------- hero ---------- */
.hero{position:relative; background:var(--night); color:var(--on-night); padding:0; isolation:isolate;}
.hero-img{position:absolute; inset:0; z-index:-2;}
.hero-img img{width:100%; height:100%; object-fit:cover;}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg,rgba(11,11,11,.82) 0%,rgba(11,11,11,.55) 45%,rgba(11,11,11,.92) 100%);
}
.hero-inner{
  max-width:1180px; margin-inline:auto; padding:clamp(3.5rem,9vw,6.5rem) var(--pad) clamp(2.5rem,6vw,4rem);
  display:grid; gap:2.5rem;
}
.hero h1{color:#fff;}
.hero .tagline{
  font-family:"Cormorant Garamond",serif; font-size:clamp(1.1rem,2.6vw,1.6rem);
  letter-spacing:.28em; text-transform:uppercase; color:var(--gold); margin:0;
}
.hero .lede{color:#EDE8DE; font-size:1.05rem; max-width:52ch;}

/* box prenotazione */
.book{
  background:rgba(251,250,247,.97); color:#1A1714;
  border-top:3px solid var(--gold); padding:1.5rem; display:grid; gap:1rem;
  box-shadow:0 18px 50px rgba(0,0,0,.45); max-width:960px;
}
.book-row{display:grid; gap:.9rem; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); align-items:end;}
.fld{display:grid; gap:.35rem; min-width:0;}
.fld label{font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:#5A544C;}
.fld input,.fld select{
  font:inherit; font-size:.95rem; padding:.6rem .7rem; width:100%; min-width:0;
  border:1px solid #CFC8BA; border-radius:2px; background:#fff; color:#1A1714;
}
.btn{
  font:inherit; font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600;
  background:var(--terra); color:#fff; border:1px solid var(--terra);
  padding:.72rem 1.5rem; cursor:pointer; text-decoration:none; text-align:center;
  display:inline-block; border-radius:2px;
}
.btn:hover{background:var(--terra-deep); border-color:var(--terra-deep);}
.btn.ghost{background:transparent; color:var(--gold); border-color:var(--gold);}
.btn.ghost:hover{background:var(--gold); color:#1A1714;}
.direct{
  display:flex; flex-wrap:wrap; gap:.5rem 1rem; align-items:baseline;
  font-size:.85rem; color:#4A443C; border-top:1px solid #E3DED3; padding-top:.9rem;
}
.direct b{color:var(--terra-deep); font-weight:600;}

/* ---------- fascia numeri ---------- */
.facts{background:var(--night-soft); color:var(--on-night); padding-block:2.25rem;}
.facts ul{
  list-style:none; margin:0; padding:0; display:grid; gap:1.5rem;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
}
.facts li{display:grid; gap:.2rem;}
.facts .n{font-family:"Cormorant Garamond",serif; font-size:2.1rem; line-height:1; color:var(--gold);}
.facts .l{font-size:.72rem; letter-spacing:.15em; text-transform:uppercase; color:var(--on-night-soft);}

/* ---------- blocchi generici ---------- */
.split{display:grid; gap:clamp(2rem,5vw,3.5rem); align-items:center; grid-template-columns:1fr;}
@media(min-width:860px){ .split{grid-template-columns:1fr 1fr;} .split.flip>figure{order:2;} }
.col{display:grid; gap:1.1rem; align-content:start;}
figure{margin:0;}
figure img{border-radius:2px;}
figcaption{font-size:.78rem; color:var(--ink-soft); margin-top:.6rem; font-style:italic;}

/* ---------- gallery: le foto sono la pagina ---------- */
.gal{margin-top:clamp(2rem,4vw,3rem); display:grid; gap:clamp(.75rem,1.5vw,1.25rem);}
.gal-lead{grid-column:1/-1;}
.gal-grid{display:grid; gap:clamp(.75rem,1.5vw,1.25rem); grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));}
.shot{
  margin:0; position:relative; display:block; width:100%; padding:0; border:0; cursor:zoom-in;
  background:var(--night-soft); overflow:hidden; border-radius:2px; line-height:0;
}
.shot img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease;}
.gal-lead .shot img{aspect-ratio:2/1;}
.gal-grid .shot img{aspect-ratio:3/2;}
.shot:hover img,.shot:focus-visible img{transform:scale(1.03);}
.shot figcaption{
  position:absolute; left:0; right:0; bottom:0; line-height:1.4;
  padding:2.5rem .9rem .7rem; text-align:left; margin:0;
  font-style:normal; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:#F3EFE6; background:linear-gradient(180deg,rgba(11,11,11,0),rgba(11,11,11,.78));
}
.gal-note{
  margin-top:1rem; font-size:.82rem; color:var(--ink-soft);
  display:flex; align-items:center; gap:.5rem;
}

/* lightbox */
.lb{
  position:fixed; inset:0; z-index:100; display:none;
  background:rgba(6,5,5,.94); padding:clamp(1rem,4vw,3rem);
}
.lb[open]{display:grid; place-items:center; grid-template-rows:1fr auto;}
.lb img{max-width:100%; max-height:78vh; width:auto; object-fit:contain; border-radius:2px;}
.lb-cap{color:var(--on-night-soft); font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; padding-top:1rem; text-align:center;}
.lb-x{
  position:absolute; top:1rem; right:1rem; font:inherit; font-size:1.5rem; line-height:1;
  background:transparent; border:1px solid rgba(243,239,230,.4); color:#F3EFE6;
  width:2.4rem; height:2.4rem; border-radius:50%; cursor:pointer;
}
.lb-x:hover{background:rgba(243,239,230,.14);}

/* ---------- nei dintorni ---------- */
.around{background:var(--surface); border-block:1px solid var(--line);}
.around ul{
  list-style:none; margin:1.75rem 0 0; padding:0; display:grid; gap:1.25rem;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.around li{display:grid; gap:.3rem; padding-left:.9rem; border-left:2px solid var(--gold);}
.around .k{font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft);}
.around .v{font-family:"Cormorant Garamond",serif; font-size:1.35rem; line-height:1.2;}

/* elenco servizi */
.amen{list-style:none; margin:0; padding:0; display:grid; gap:.55rem 1.5rem; grid-template-columns:repeat(auto-fit,minmax(190px,1fr));}
.amen li{display:flex; gap:.6rem; align-items:baseline; font-size:.95rem;}
.amen li::before{content:"—"; color:var(--gold-deep); flex:none;}

/* distanze */
.dist{width:100%; border-collapse:collapse; font-size:.92rem;}
.dist th,.dist td{text-align:left; padding:.6rem .5rem; border-bottom:1px solid var(--line);}
.dist th{font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); font-weight:600;}
.dist td:last-child{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap;}
.scroller{overflow-x:auto;}
.pending{
  background:rgba(193,176,108,.18); border-bottom:1px dotted var(--gold-deep);
  padding:0 .28rem; font-style:italic; font-size:.9em;
}

/* studenti */
.students{background:var(--night); color:var(--on-night);}
.students h2{color:#fff;}
.students p{color:#D8D2C6;}
.students .eyebrow{color:var(--gold);}
.cards{display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); margin-top:2.25rem;}
.card{background:var(--night-soft); border:1px solid rgba(193,176,108,.22); padding:1.4rem; display:grid; gap:.55rem;}
.card h3{color:var(--gold); font-size:1.15rem;}
.card p{font-size:.92rem; color:#C9C2B4; margin:0;}

/* Marco */
.marco{background:var(--surface); border-block:1px solid var(--line);}

/* footer */
.foot{background:var(--night); color:var(--on-night-soft); padding-block:3rem 2rem; font-size:.88rem;}
.foot-grid{display:grid; gap:2rem; grid-template-columns:repeat(auto-fit,minmax(210px,1fr));}
.foot h4{font-family:"Cormorant Garamond",serif; font-size:1rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin:0 0 .8rem;}
.foot a{color:var(--on-night-soft); text-decoration:none;}
.foot a:hover{color:var(--gold); text-decoration:underline;}
.foot ul{list-style:none; margin:0; padding:0; display:grid; gap:.45rem;}
.legal{margin-top:2.5rem; padding-top:1.25rem; border-top:1px solid rgba(243,239,230,.14); font-size:.78rem; display:flex; flex-wrap:wrap; gap:.6rem 1.5rem;}

/* ---------- due modi di stare qui ---------- */
.two{background:var(--night); color:var(--on-night);}
.two h2{color:#fff;} .two .eyebrow{color:var(--gold);} .two>.wrap>.col p{color:#D8D2C6;}
.two-grid{display:grid; gap:clamp(1rem,2vw,1.75rem); grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); margin-top:2.5rem;}
.offer{
  display:grid; gap:.75rem; align-content:start; padding:clamp(1.35rem,2.5vw,2rem);
  background:var(--night-soft); border:1px solid rgba(193,176,108,.22); border-top:3px solid var(--terra);
}
.offer.alt{border-top-color:var(--gold);}
.offer h3{color:#fff;}
.offer p{color:#C9C2B4; font-size:.95rem;}
.season{
  font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; font-weight:600;
  color:var(--terra); margin:0;
}
.offer.alt .season{color:var(--gold);}
.offer-facts{list-style:none; margin:.3rem 0; padding:0; display:grid; gap:.4rem;}
.offer-facts li{font-size:.9rem; color:#D8D2C6; display:flex; gap:.55rem;}
.offer-facts li::before{content:"·"; color:var(--gold); font-weight:700;}
.offer-how{border-top:1px solid rgba(243,239,230,.14); padding-top:.85rem; margin-top:.3rem!important;}
.offer-how b{color:#F3EFE6;}
.offer-note{font-size:.82rem!important; color:#9C9587!important; font-style:italic;}
.btn.ghost-dark{background:transparent; color:var(--gold); border-color:var(--gold);}
.btn.ghost-dark:hover{background:var(--gold); color:#1A1714;}

/* riga di smistamento nell'hero */
.route{
  border-top:1px solid #E3DED3; padding-top:.85rem; margin:0;
  font-size:.85rem; color:#4A443C; max-width:none;
}
.route a{color:var(--terra-deep); font-weight:600;}

/* nota "arrivi la mattina?" — chiude la sezione di Marco */
.usp-note{
  position:relative; margin-top:.5rem!important; max-width:var(--measure);
  padding:.95rem 1.1rem; border-left:3px solid var(--terra);
  background:rgba(158,97,61,.07); font-size:.93rem;
}
.usp-note b{color:var(--terra-deep);}

/* ============ aggiunte per la versione B (multipagina) ============ */
.poc-link{color:var(--gold); text-decoration:none; font-size:.78rem;}
.poc-link:hover{text-decoration:underline;}

.hero--short .hero-inner{padding-block:clamp(3rem,7vw,5rem);}

.pagehead{padding-bottom:0;}
.pagehead h1{font-size:clamp(2rem,5vw,3.4rem); letter-spacing:.02em; margin-block:.5rem .9rem;}
.pagehead p{color:var(--ink-soft);}

.book--page{
  max-width:none; box-shadow:none; background:var(--surface);
  border:1px solid var(--line); border-top:3px solid var(--gold);
}

.ota{
  position:relative; margin-top:1.5rem; max-width:none;
  padding:1rem 1.15rem; border-left:3px solid var(--terra);
  background:rgba(158,97,61,.07); font-size:.93rem;
}
.ota b{color:var(--terra-deep);}

.infogrid{
  display:grid; gap:clamp(1.25rem,3vw,2.5rem); margin-top:2.5rem;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));
}
.infogrid h3{font-size:1.15rem; margin-bottom:.5rem;}
.infogrid p{font-size:.93rem; color:var(--ink-soft); margin-bottom:.5rem;}
.two .infogrid p{color:#C9C2B4;}
.big-link{
  font-family:"Cormorant Garamond",Georgia,serif; font-size:1.35rem;
  color:var(--terra); text-decoration:none; border-bottom:1px solid var(--gold);
}
.big-link:hover{color:var(--terra-deep);}

/* ---- innesti Smoobu ---- */
.smoobu-slot{min-height:120px;}
.smoobu-slot iframe{width:100%; border:0; display:block;}
.cal{
  position:relative; margin-top:clamp(2rem,4vw,3rem);
  padding-top:clamp(1.5rem,3vw,2rem); border-top:1px solid var(--line);
}
.cal h2{margin-bottom:.5rem;}
.cal p{color:var(--ink-soft); margin-bottom:1.25rem;}
.calendarWidget{overflow-x:auto;}

.signature{
  font-family:"Cormorant Garamond",Georgia,serif; font-size:1.4rem;
  color:var(--terra); margin-top:.6rem!important;
}

/* ---------- landing "vicino al tuo campus" ---------- */
.mapfig{margin:0;}
.ringmap{
  --ring:var(--line); --home-ring:var(--surface);
  width:100%; max-width:620px; margin-inline:auto; display:block; height:auto;
}
.ringmap .ringlab{
  font-family:Raleway,system-ui,sans-serif; font-size:11px; fill:var(--ink-soft);
  letter-spacing:.08em; text-transform:uppercase;
}
.ringmap .ptlab{
  font-family:Raleway,system-ui,sans-serif; font-size:12.5px; fill:var(--ink); font-weight:500;
}
.ringmap .homelab{
  font-family:"Cormorant Garamond",Georgia,serif; font-size:16px; fill:var(--ink); font-weight:600;
}
.mapfig figcaption{
  max-width:var(--measure); margin:1rem auto 0; text-align:center;
  font-size:.85rem; color:var(--ink-soft); font-style:normal;
}

table.campus td,table.campus th{vertical-align:top; padding:.75rem .6rem;}
table.campus .nome{font-weight:500;}
table.campus .addr{display:block; font-size:.78rem; color:var(--ink-soft); font-weight:400; margin-top:.15rem;}
table.campus .num{white-space:nowrap; text-align:left; font-variant-numeric:tabular-nums;}
table.campus td.act{text-align:right; white-space:nowrap;}
table.campus td.act a{
  display:inline-block; margin-left:.4rem; padding:.3rem .7rem; text-decoration:none;
  font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600;
  border:1px solid var(--line); border-radius:2px; color:var(--terra);
}
table.campus td.act a:hover{background:var(--terra); color:#fff; border-color:var(--terra);}
table.campus tr:target{background:rgba(193,176,108,.18);}

.qalist{display:grid; gap:.6rem; margin-top:2rem;}
.qa{border:1px solid rgba(193,176,108,.25); background:var(--night-soft); padding:.9rem 1.1rem;}
.qa summary{
  cursor:pointer; font-weight:500; color:#F3EFE6; list-style:none;
  display:flex; justify-content:space-between; gap:1rem; align-items:baseline;
}
.qa summary::-webkit-details-marker{display:none;}
.qa summary::after{content:"+"; color:var(--gold); font-size:1.2rem; line-height:1;}
.qa[open] summary::after{content:"–";}
.qa p{margin:.7rem 0 0; font-size:.92rem; color:#C9C2B4;}
.ringmap .ptlab,.ringmap .homelab{
  paint-order:stroke fill; stroke:var(--ground); stroke-width:3.5px; stroke-linejoin:round;
}
.ringmap .ptline{stroke:var(--line); stroke-width:1;}
table.campus td.mezzi{color:var(--ink-soft);}
table.campus .meno{color:var(--line);}

/* ---------- mappe Google della pagina campus ---------- */
.mappe{display:grid; gap:clamp(1rem,2.5vw,2rem); grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));}
.mappe figure{margin:0;}
.mappe img{
  width:100%; height:auto; display:block; border:1px solid var(--line); border-radius:2px;
}
.mappe figcaption{
  margin-top:.7rem; font-size:.85rem; color:var(--ink-soft); font-style:normal; text-align:left;
}
.mappe figcaption strong{color:var(--ink);}
.pin{
  display:inline-block; min-width:1.3em; text-align:center; padding:0 .3em;
  background:var(--gold); color:#1A1714; font-weight:700; font-size:.8em; border-radius:2px;
}
table.campus .sig{
  display:inline-block; min-width:1.5em; text-align:center; margin-right:.55rem;
  padding:.05rem .3rem; border-radius:2px; font-size:.72rem; font-weight:700;
  background:var(--terra); color:#fff; vertical-align:.08em;
}

/* ---------- mappa Google interattiva ---------- */
.mapwrap{margin:0;}
.gmap{
  width:100%; height:clamp(380px,55vh,560px);
  border:1px solid var(--line); border-radius:2px; background:var(--surface);
}
.maphint{
  margin-top:.8rem; font-size:.85rem; color:var(--ink-soft); max-width:none;
}
/* la finestrella che si apre cliccando un segnaposto */
.iw{font-family:Raleway,system-ui,sans-serif; font-size:.88rem; line-height:1.45; color:#1A1714; min-width:190px;}
.iw strong{display:block; font-size:.98rem; margin-bottom:.15rem;}
.iw-a{display:block; color:#5A544C; font-size:.8rem;}
.iw-t{display:block; margin:.45rem 0 .5rem; font-weight:600; color:#834E2F;}
.iw a{
  display:inline-block; margin-right:.5rem; font-size:.74rem; letter-spacing:.08em;
  text-transform:uppercase; font-weight:600; color:#9E613D;
}

/* ---------- interruttore lingua nell'intestazione ---------- */
.nav .lang-sw{
  display:inline-flex; margin-left:.6rem; align-self:center;
  border:1px solid rgba(243,239,230,.28); border-radius:2px; overflow:hidden;
}
.nav .lang-sw a{
  padding:.28rem .7rem; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--on-night-soft); text-decoration:none; border:0; line-height:1.5;
}
.nav .lang-sw a:hover{background:rgba(243,239,230,.1); color:var(--on-night);}
.nav .lang-sw a.on{
  background:var(--gold); color:#1A1714; font-weight:600;
}
.nav .lang-sw a.on:hover{background:var(--gold); color:#1A1714;}

/* nota sopra la tabella: larga quanto la tabella, ma su due colonne
   perche una riga da 1180px e faticosa da leggere */
.nota-tabella{
  max-width:none; margin-bottom:1.75rem;
  padding:1rem 1.15rem; border-left:3px solid var(--gold);
  background:rgba(193,176,108,.09); font-size:.92rem; line-height:1.6;
}
@media (min-width:820px){
  .nota-tabella{ columns:2; column-gap:2.5rem; }
}

/* ---------- hero: velatura leggera e direzionale ----------
   Prima era un velo uniforme all'82-92% di nero: il testo si leggeva,
   ma la foto spariva e la fascia risultava cupa.
   Ora si combinano due sfumature leggere:
   - verticale, solo per staccare il menu in alto e il fondo
   - orizzontale, che tiene un po' piu scuro il lato del testo
   La leggibilita la garantisce l'ombra del testo, non il velo.          */
.hero::after{
  background:
    linear-gradient(180deg,
      rgba(11,11,11,.58) 0%,
      rgba(11,11,11,.16) 34%,
      rgba(11,11,11,.22) 70%,
      rgba(11,11,11,.64) 100%),
    linear-gradient(100deg,
      rgba(11,11,11,.62) 0%,
      rgba(11,11,11,.36) 40%,
      rgba(11,11,11,.05) 70%,
      rgba(11,11,11,0) 100%);
}
/* il testo resta leggibile anche dove la foto e chiara */
.hero h1,.hero .tagline,.hero .lede{
  text-shadow:0 1px 3px rgba(11,11,11,.85), 0 2px 22px rgba(11,11,11,.75);
}
/* l'occhiello e oro su oro quando sotto passa la facciata della chiesa:
   gli serve un contorno piu stretto, non un velo piu scuro */
.hero .tagline{
  text-shadow:0 0 2px rgba(11,11,11,.95), 0 1px 4px rgba(11,11,11,.9), 0 2px 22px rgba(11,11,11,.8);
}

/* ---------- hero: le tre foto a rotazione ----------
   Sequenza: soggiorno ravvicinato, soggiorno largo, la strada di Prati.
   Sette secondi ciascuna, un secondo di dissolvenza: 21 secondi in tutto.
   La prima parte gia visibile — non si carica su una fascia nera.
   Le altre due hanno fetchpriority basso: non rallentano l'apertura.
   Con "riduci animazioni" attivo la rotazione non parte e resta la prima. */
.hero-img img{position:absolute; inset:0;}

@media (prefers-reduced-motion:no-preference){
  .hero-img img{
    opacity:0;
    animation:heroGira 21s linear infinite;
    will-change:opacity;
  }
  .hero-img img:nth-child(1){animation-name:heroGiraPrima; animation-delay:0s;}
  .hero-img img:nth-child(2){animation-delay:7s;}
  .hero-img img:nth-child(3){animation-delay:14s;}
}

@keyframes heroGira{
  0%{opacity:0} 4.76%{opacity:1} 33.33%{opacity:1} 38.1%{opacity:0} 100%{opacity:0}
}
/* la prima c'e gia al caricamento, e rientra alla fine del giro */
@keyframes heroGiraPrima{
  0%{opacity:1} 33.33%{opacity:1} 38.1%{opacity:0} 95.24%{opacity:0} 100%{opacity:1}
}

/* ---------- scorciatoia sulla pagina Prenota ----------
   Compare sopra il motore Smoobu finche il motore non fa scegliere le date.
   Quando Smoobu torna a funzionare si toglie il blocco da body-prenota.html
   e questa regola resta inerte.                                            */
.scorciatoia{
  /* la regola generale p{max-width:66ch} la stringerebbe a meta' del riquadro */
  max-width:none;
  margin:0 0 1.5rem; padding:1rem 1.15rem;
  border-left:3px solid var(--gold); background:rgba(193,176,108,.12);
  font-size:.95rem; line-height:1.6;
}
.scorciatoia a{ color:inherit; text-decoration:underline; text-underline-offset:2px; }

/* ---------- pagina recensioni ----------
   Le citazioni stanno in colonne che si riempiono da sole: le recensioni
   hanno lunghezze molto diverse e una griglia rigida lascerebbe buchi.     */
.quotes{ columns:2; column-gap:2rem; margin-block:2.5rem; }
@media (max-width:820px){ .quotes{ columns:1; } }

.quote{
  break-inside:avoid; margin:0 0 1.6rem;
  padding:1.4rem 1.5rem; background:#fff;
  border:1px solid rgba(26,23,20,.10); border-top:3px solid var(--gold);
}
.quote blockquote{ margin:0; }
.quote blockquote p{
  margin:0; max-width:none;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.12rem; line-height:1.55; color:#1A1714;
}
.quote--breve blockquote p{ font-size:1.45rem; line-height:1.4; }
.quote--lunga{ border-top-color:var(--terra); }

.quote-titolo{
  margin:0 0 .6rem; font-size:.72rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--terra); font-weight:600;
}
.quote figcaption{
  margin-top:1rem; padding-top:.8rem;
  border-top:1px solid rgba(26,23,20,.09);
  display:flex; flex-wrap:wrap; gap:.15rem 0; flex-direction:column;
}
.quote .chi{ font-weight:600; font-size:.95rem; }
.quote .dove{ font-size:.85rem; color:#6B6459; }
.quote .fonte{ font-size:.76rem; letter-spacing:.06em; color:#8A8378; margin-top:.2rem; }
.quote .fonte b{ color:var(--terra); }

.nota-fonte{ max-width:none; font-size:.86rem; color:#6B6459; margin-top:.5rem; }

/* la tabella dei sei punteggi: due coppie voce/voto per riga */
table.voti td{ padding:.55rem .9rem; }
table.voti td.num b{ color:var(--terra); font-size:1.05rem; }

/* gli ospiti che vanno a capo: i paragrafi dentro una citazione */
.quote blockquote p + p{ margin-top:.75rem; }