/* ==========================================================================
   B&B Cascina Barolo — foglio di stile unico
   I caratteri sono ospitati qui dentro (cartella font/), non su Google:
   il sito non chiama server esterni e non trasferisce l'IP dei visitatori.
   ========================================================================== */

@font-face{
  font-family:"Fraunces";
  src:url("font/fraunces.woff2") format("woff2-variations");
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"Fraunces";
  src:url("font/fraunces-italic.woff2") format("woff2-variations");
  font-weight:100 900;font-style:italic;font-display:swap;
}
@font-face{
  font-family:"Archivo";
  src:url("font/archivo.woff2") format("woff2-variations");
  font-weight:100 900;font-style:normal;font-display:swap;
}

:root{
  --calce:#FBF8F2;
  --calce-2:#EDE5D5;
  --carta:#FFFFFF;
  --inchiostro:#1B1714;
  --inchiostro-2:#5E5449;
  --inchiostro-3:#786C5F;
  --barolo:#6E2337;
  --barolo-2:#8C3049;
  --ottone:#A9854E;
  --oro-chiaro:#C9A96A;
  --filo:#E1D8C6;
  --maxw:1180px;
  --g:clamp(1.25rem,5vw,3.5rem);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--calce);color:var(--inchiostro);
  font-family:"Archivo",system-ui,sans-serif;
  font-size:clamp(1rem,.95rem + .22vw,1.09rem);line-height:1.62;
  font-weight:350;-webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%}
img{display:block;height:auto}
a{color:inherit}
h1,h2,h3{
  font-family:"Fraunces",Georgia,serif;margin:0;line-height:1.06;
  font-weight:380;font-variation-settings:"SOFT" 30,"WONK" 1;letter-spacing:-.015em;
}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--g)}
.stretto{max-width:760px}

/* ————————————— elementi ricorrenti ————————————— */
.indice{
  font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;font-weight:600;
  color:var(--barolo);display:flex;align-items:center;gap:.85rem;margin:0 0 1.4rem;
}
.indice::before{content:"";width:2.2rem;height:1px;background:var(--barolo);opacity:.45;flex:none}

.btn{
  display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.7rem;text-decoration:none;
  font-size:.9rem;font-weight:500;border:1px solid transparent;
  transition:background .18s,color .18s,border-color .18s;
}
.btn-pieno{background:var(--inchiostro);color:var(--calce)}
.btn-pieno:hover{background:var(--barolo)}
.btn-vuoto{border-color:var(--inchiostro-2);color:var(--inchiostro)}
.btn-vuoto:hover{background:var(--inchiostro);color:var(--calce);border-color:var(--inchiostro)}
.btn-chiaro{background:var(--calce);color:var(--inchiostro)}
.btn-chiaro:hover{background:var(--ottone)}
.azioni{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:2.2rem}

.foto{
  position:relative;background:var(--calce-2);border:1px solid var(--filo);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.foto::before{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(-45deg,transparent 0 13px,rgba(110,35,55,.045) 13px 14px);
}
.foto span{
  position:relative;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--inchiostro-3);background:var(--carta);padding:.45rem .8rem;
  border:1px solid var(--filo);text-align:center;max-width:82%;
}
.foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.foto--largo{aspect-ratio:16/9}
.foto--alto{aspect-ratio:4/5}
.foto--quadro{aspect-ratio:1}
.foto--pano{aspect-ratio:21/9}

/* ————————————— testata ————————————— */
.top{
  position:sticky;top:0;z-index:60;background:rgba(251,248,242,.92);
  backdrop-filter:blur(12px) saturate(1.2);border-bottom:1px solid var(--filo);
}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;padding-block:.85rem}
.marca{display:block;line-height:0}
.marca img{height:38px;width:auto}
.menu{display:flex;gap:1.4rem;flex:none}
.menu a{text-decoration:none;font-size:.85rem;white-space:nowrap;color:var(--inchiostro-2);padding-block:.2rem;border-bottom:1px solid transparent}
.menu a:hover{color:var(--barolo);border-bottom-color:var(--barolo)}
.menu a[aria-current=page]{color:var(--inchiostro);border-bottom-color:var(--ottone)}
.azioni-top{display:flex;align-items:center;gap:1.1rem}
.lingua{display:inline-flex;align-items:center;justify-content:center;min-width:2.1rem;height:1.9rem;
  border:1px solid var(--filo);text-decoration:none;font-size:.72rem;font-weight:600;letter-spacing:.09em;
  color:var(--inchiostro-2);background:transparent}
.lingua:hover{border-color:var(--barolo);color:var(--barolo)}
@media(max-width:560px){.lingua{min-width:1.9rem;height:1.75rem;font-size:.68rem}}
.posta{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;font-size:.85rem;color:var(--inchiostro-2);white-space:nowrap;border-bottom:1px solid var(--filo);padding-bottom:.15rem}
.posta:hover{color:var(--barolo);border-bottom-color:var(--barolo)}
.tel{display:inline-flex;align-items:center;gap:.5rem;background:var(--barolo);color:var(--carta);text-decoration:none;padding:.62rem 1.15rem;font-size:.85rem;font-weight:500;white-space:nowrap}
.tel:hover{background:var(--inchiostro)}
.ico-wa{width:1.05em;height:1.05em;fill:currentColor;flex:none}
.ico-m{width:1.15em;height:auto;flex:none}
@media(max-width:1520px){.posta span{display:none}.posta{border-bottom:0}}
@media(max-width:1180px){.posta{display:none}}
.hamb{display:none;background:none;border:1px solid var(--filo);padding:.55rem .7rem;cursor:pointer;line-height:0}
.hamb svg{width:18px;height:14px;stroke:var(--inchiostro);stroke-width:1.6;fill:none}
@media(max-width:1120px){
  .menu{display:none}
  .hamb{display:block}
  .menu.aperto{
    display:flex;flex-direction:column;gap:0;position:absolute;left:0;right:0;top:100%;
    background:var(--carta);border-bottom:1px solid var(--filo);padding:.5rem var(--g) 1.4rem;
  }
  .menu.aperto a{padding-block:.85rem;border-bottom:1px solid var(--calce-2);font-size:1rem}
}
@media(max-width:560px){.tel{display:none}.marca img{height:31px}}

/* ————————————— aperture ————————————— */
.hero{padding-block:clamp(3rem,7vw,5.5rem) clamp(2rem,4vw,3rem);position:relative;overflow:hidden}
.hero .wrap{position:relative;z-index:2}
.hero h1{font-size:clamp(2.55rem,7.2vw,5.2rem);text-wrap:balance;font-variation-settings:"SOFT" 40,"WONK" 1}
.hero h1 em{font-style:italic;color:var(--barolo);font-weight:340}
.diretti{margin:1.9rem 0 0;font-size:.88rem;color:var(--inchiostro-3);display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.4rem}
.diretti a{display:inline-flex;align-items:center;gap:.45rem;color:var(--inchiostro-2);text-decoration:none;border-bottom:1px solid var(--filo);padding-bottom:.12rem}
.diretti a:hover{color:var(--barolo);border-bottom-color:var(--barolo)}
.hero .lede{max-width:46ch;margin:1.8rem 0 0;color:var(--inchiostro-2);font-size:clamp(1.05rem,1rem + .4vw,1.28rem);line-height:1.55}
.filigrana{
  position:absolute;right:.6rem;top:50%;transform:translateY(-38%);
  font-family:"Fraunces",serif;font-weight:300;font-style:italic;
  font-size:clamp(5rem,11vw,11rem);line-height:.86;text-align:right;
  color:var(--calce-2);opacity:.9;z-index:1;pointer-events:none;user-select:none;
  letter-spacing:-.02em;
}
@media(max-width:900px){.filigrana{opacity:.55;font-size:6rem;top:auto;bottom:-1rem;transform:none;right:-.04em}}
@media(max-width:620px){.filigrana{display:none}}

/* apertura delle pagine interne */
.apertura{padding-block:clamp(2.6rem,6vw,4.2rem) clamp(1.6rem,3vw,2.4rem);border-bottom:1px solid var(--filo)}
.apertura h1{font-size:clamp(2.2rem,5.6vw,3.9rem);max-width:16ch}
.apertura .lede{max-width:56ch;margin:1.5rem 0 0;color:var(--inchiostro-2);font-size:clamp(1.02rem,.98rem + .3vw,1.18rem)}
.briciole{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--inchiostro-3);margin:0 0 1.6rem}
.briciole a{text-decoration:none}
.briciole a:hover{color:var(--barolo)}

/* ————————————— il rilievo dei cento metri ————————————— */
.rilievo{background:var(--carta);border-block:1px solid var(--filo);padding-block:clamp(2.2rem,5vw,3.2rem)}
.rilievo svg{width:100%;height:auto;display:block}
.rilievo .verticale{display:none;max-width:290px;margin-inline:auto}
@media(max-width:700px){.rilievo .orizzontale{display:none}.rilievo .verticale{display:block}}
.riga{fill:none;stroke:var(--inchiostro);stroke-width:1.1}
.tacca{stroke:var(--inchiostro-3);stroke-width:1}
.tacca-g{stroke:var(--inchiostro);stroke-width:1.2}
.corpo{fill:none;stroke:var(--inchiostro);stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.passi{fill:none;stroke:var(--barolo);stroke-width:2;stroke-linecap:round;stroke-dasharray:1 11;stroke-dashoffset:760;animation:cammina 3s ease-out .4s forwards}
@keyframes cammina{to{stroke-dashoffset:0}}
.et{font-family:"Archivo",sans-serif;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;fill:var(--inchiostro-3)}
.quota{font-family:"Fraunces",serif;font-size:23px;font-style:italic;fill:var(--barolo)}

/* ————————————— fascia dati ————————————— */
.dati{background:var(--inchiostro);color:var(--calce)}
.dati .wrap{display:grid;gap:0;padding:0}
@media(min-width:720px){.dati .wrap{grid-template-columns:repeat(4,1fr)}}
.dato{padding:1.5rem var(--g);border-bottom:1px solid rgba(247,243,234,.13)}
@media(min-width:720px){
  .dato{padding:1.7rem 1.6rem;border-bottom:0;border-left:1px solid rgba(247,243,234,.13)}
  .dato:first-child{border-left:0;padding-left:0}
  .dato:last-child{padding-right:0}
}
.dato .n{font-family:"Fraunces",serif;font-size:1.85rem;line-height:1;display:block;color:var(--carta)}
.dato .n small{font-size:.9rem;color:var(--oro-chiaro);font-style:italic}
.dato .d{font-size:.79rem;color:#9F9384;margin-top:.5rem;display:block}

/* ————————————— sezioni ————————————— */
.sez{padding-block:clamp(3.4rem,7.5vw,6rem)}
.sez--carta{background:var(--carta);border-block:1px solid var(--filo)}
.sez--scuro{background:var(--inchiostro);color:var(--calce)}
.sez--scuro h2{color:var(--carta)}
.sez--scuro .occhiello{color:#A99D8F}
.sez--scuro .indice{color:var(--ottone)}
.sez--scuro .indice::before{background:var(--ottone)}
.sez h2{font-size:clamp(1.9rem,4.4vw,3.05rem);max-width:17ch}
.occhiello{max-width:52ch;color:var(--inchiostro-2);margin-top:1.3rem}
.testa{display:grid;gap:1.4rem}
@media(min-width:900px){.testa{grid-template-columns:1fr 1fr;align-items:end;gap:3rem}.testa .occhiello{margin-top:0}}
.due{display:grid;gap:clamp(2rem,5vw,4.5rem)}
@media(min-width:920px){.due{grid-template-columns:.85fr 1.15fr;align-items:start}}
.nota{margin-top:1.6rem;font-size:.87rem;color:var(--inchiostro-2);max-width:64ch}

/* ————————————— camere ————————————— */
.camere{display:grid;gap:1px;margin-top:3rem;background:var(--filo);border:1px solid var(--filo)}
@media(min-width:820px){.camere{grid-template-columns:repeat(3,1fr)}}
.camera{background:var(--calce);display:flex;flex-direction:column}
.sez--carta .camera{background:var(--carta)}
.camera .foto{border:0;border-bottom:1px solid var(--filo);aspect-ratio:4/3}
.camera .dentro{padding:1.75rem 1.6rem;display:flex;flex-direction:column;flex:1}
.camera .posti{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--barolo);font-weight:600}
.camera h3{font-size:1.6rem;margin:.6rem 0 .75rem}
.camera p{margin:0;color:var(--inchiostro-2);font-size:.945rem}
.camera .dotaz{margin-top:auto;padding-top:1.3rem;font-size:.775rem;color:var(--inchiostro-3)}
.camera .dentro a{margin-top:1.1rem;font-size:.85rem;color:var(--barolo);text-decoration:none;border-bottom:1px solid var(--filo);align-self:flex-start;padding-bottom:.15rem}
.camera .dentro a:hover{border-bottom-color:var(--barolo)}

/* scheda camera estesa */
.scheda{padding-block:clamp(3rem,6vw,4.5rem);border-bottom:1px solid var(--filo)}
.scheda:last-of-type{border-bottom:0}
.scheda .griglia{display:grid;gap:clamp(1.8rem,4vw,3.2rem)}
@media(min-width:900px){.scheda .griglia{grid-template-columns:1.1fr .9fr;align-items:start}}
.scheda h2{font-size:clamp(1.8rem,4vw,2.6rem)}
.galleria{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--filo);border:1px solid var(--filo)}
.galleria .foto{border:0;aspect-ratio:4/3 !important}
/* con un numero dispari di foto la prima occupa due colonne, cosi' non resta un buco */
.galleria .foto:first-child:nth-last-child(odd){grid-column:1 / -1}
.elenco{list-style:none;padding:0;margin:1.8rem 0 0;display:grid;gap:.55rem}
.elenco li{display:flex;gap:.7rem;font-size:.94rem;color:var(--inchiostro-2)}
.elenco li::before{content:"·";color:var(--barolo);font-weight:700;flex:none}

/* ————————————— la frase ————————————— */
.frase{background:var(--barolo);color:var(--carta);text-align:center;padding-block:clamp(3.6rem,8vw,6rem)}
.frase blockquote{font-family:"Fraunces",serif;font-style:italic;font-weight:300;font-size:clamp(2.1rem,6.2vw,4rem);line-height:1.12;margin:0;max-width:16ch;margin-inline:auto;font-variation-settings:"SOFT" 60,"WONK" 1}
.frase .chi{font-size:.73rem;letter-spacing:.22em;text-transform:uppercase;color:#D9AFB9;margin:1.8rem 0 0}

/* ————————————— punti e luoghi ————————————— */
.punti{display:grid;gap:1px;margin-top:2.8rem;background:var(--filo);border-top:1px solid var(--filo);border-bottom:1px solid var(--filo)}
@media(min-width:780px){.punti{grid-template-columns:repeat(2,1fr)}}
.punto{background:var(--calce);padding:1.8rem 1.7rem 1.9rem;display:flex;gap:1.2rem}
.sez--carta .punto{background:var(--carta)}
.punto .num{font-family:"Fraunces",serif;font-style:italic;font-size:1.1rem;color:var(--barolo);flex:none;padding-top:.15rem;width:1.7rem}
.punto h3{font-size:1.17rem;margin-bottom:.45rem}
.punto p{margin:0;font-size:.925rem;color:var(--inchiostro-2)}

.vicino{display:grid;gap:1.6rem 2rem;margin-top:2.8rem}
@media(min-width:700px){.vicino{grid-template-columns:repeat(3,1fr)}}
.luogo{border-top:1px solid var(--filo);padding-top:1.1rem}
.luogo .dist{font-family:"Fraunces",serif;font-style:italic;font-size:1.5rem;color:var(--barolo);display:block;line-height:1}
.luogo h3{font-size:1.05rem;margin:.55rem 0 .35rem;font-family:"Archivo",sans-serif;font-weight:500;letter-spacing:0}
.luogo p{margin:0;font-size:.87rem;color:var(--inchiostro-2)}

/* ————————————— storia ————————————— */
.epoca{border-top:2px solid var(--inchiostro);padding-top:1.1rem}
.epoca .anno{font-family:"Fraunces",serif;font-style:italic;font-weight:300;font-size:clamp(4rem,10vw,7rem);line-height:.85;display:block}
.epoca .chi{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--inchiostro-3);margin-top:.9rem;display:block}
.testo p+p{margin-top:1.15rem}
.testo p:first-child{margin-top:0}
.confronto{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:clamp(1rem,4vw,2.5rem);margin-top:3rem;padding-top:2rem;border-top:1px solid var(--filo)}
.confronto .v{font-family:"Fraunces",serif;font-size:clamp(1.6rem,4vw,2.4rem);line-height:1;display:block}
.confronto .e{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--inchiostro-3);margin-top:.55rem;display:block}
.confronto .sep{width:1px;height:3.2rem;background:var(--filo)}
.confronto .d{text-align:right}

/* ————————————— domande ————————————— */
.dom{margin-top:2.4rem;border-top:1px solid var(--filo)}
details{border-bottom:1px solid var(--filo)}
summary{list-style:none;cursor:pointer;padding:1.35rem 2.5rem 1.35rem 0;position:relative;font-family:"Fraunces",serif;font-size:1.18rem;line-height:1.25}
summary::-webkit-details-marker{display:none}
summary::after{content:"";position:absolute;right:.4rem;top:1.75rem;width:13px;height:13px;border-right:1.4px solid var(--barolo);border-bottom:1.4px solid var(--barolo);transform:rotate(45deg);transition:transform .22s}
details[open] summary::after{transform:rotate(-135deg);top:1.95rem}
details p{margin:0 0 1.5rem;color:var(--inchiostro-2);max-width:66ch;font-size:.95rem}
summary:hover{color:var(--barolo)}

/* ————————————— contatti e form ————————————— */
.griglia-c{display:grid;gap:clamp(2.5rem,6vw,4.5rem);margin-top:3rem}
@media(min-width:900px){.griglia-c{grid-template-columns:.85fr 1.15fr}}
.reca{list-style:none;padding:0;margin:0;display:grid;gap:1.6rem;align-content:start}
.reca .k{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ottone);display:block;margin-bottom:.35rem}
.reca .v{font-size:1.02rem;line-height:1.5}
.reca a{display:inline-flex;align-items:center;gap:.4rem}

form{display:grid;gap:1.05rem}
.duecol{display:grid;gap:1.05rem}
@media(min-width:560px){.duecol{grid-template-columns:1fr 1fr}}
label{display:block;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:#A99D8F;margin-bottom:.45rem}
input,select,textarea{width:100%;background:transparent;border:1px solid rgba(247,243,234,.28);color:var(--calce);font-family:inherit;font-size:.97rem;padding:.78rem .85rem;border-radius:0}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ottone);background:rgba(247,243,234,.05)}
select option{background:var(--inchiostro);color:var(--calce)}
textarea{min-height:110px;resize:vertical}
input[type=date]{color-scheme:dark}
.consenso{display:flex;gap:.7rem;align-items:flex-start;font-size:.8rem;color:#A99D8F;line-height:1.5;text-transform:none;letter-spacing:0}
.consenso input{width:auto;flex:none;margin-top:.2rem;accent-color:var(--ottone)}
.consenso a{color:var(--oro-chiaro)}
.invia{background:var(--calce);color:var(--inchiostro);border:0;padding:.95rem 1.9rem;font-family:inherit;font-size:.9rem;font-weight:600;cursor:pointer;justify-self:start}
.invia:hover{background:var(--ottone)}
.esca{position:absolute;left:-9999px}

/* ————————————— richiamo finale ————————————— */
.richiamo{background:var(--carta);border-top:1px solid var(--filo);padding-block:clamp(3rem,6vw,4.5rem);text-align:center}
.richiamo h2{font-size:clamp(1.8rem,4.4vw,2.8rem);max-width:20ch;margin-inline:auto}
.richiamo p{max-width:50ch;margin:1.2rem auto 0;color:var(--inchiostro-2)}
.richiamo .azioni{justify-content:center}

/* ————————————— piede ————————————— */
.piede{background:var(--inchiostro);color:#A99D8F;padding-block:clamp(2.8rem,6vw,4rem) 2rem;font-size:.88rem}
.piede a{color:#C4B8A7;text-decoration:none}
.piede a:hover{color:var(--oro-chiaro)}
.piede-griglia{display:grid;gap:2.4rem}
@media(min-width:760px){.piede-griglia{grid-template-columns:1.3fr 1fr 1fr}}
.piede img{height:56px;width:auto}
.piede h4{font-family:"Archivo",sans-serif;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ottone);margin:0 0 .9rem;font-weight:600}
.piede ul{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.piede a{display:inline-flex;align-items:center;gap:.45rem}
.piede .sotto{margin-top:2.8rem;padding-top:1.4rem;border-top:1px solid rgba(247,243,234,.15);display:flex;flex-wrap:wrap;gap:.5rem 2rem;justify-content:space-between;font-size:.775rem;color:#9A8E7F}

/* ————————————— barra fissa su telefono ————————————— */
.barra{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;background:var(--carta);border-top:1px solid var(--filo);padding:.6rem .8rem;gap:.6rem}
.barra a{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;text-decoration:none;padding:.8rem .4rem;font-size:.83rem;font-weight:500}
.barra .b1{background:var(--barolo);color:var(--carta)}
.barra .b2{border:1px solid var(--inchiostro-2);color:var(--inchiostro)}
@media(max-width:640px){.barra{display:flex}body{padding-bottom:4.6rem}}

:focus-visible{outline:2px solid var(--barolo);outline-offset:3px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.passi{stroke-dashoffset:0}}


/* ————————————— le due strutture a confronto ————————————— */
.strutture{display:grid;gap:1px;margin-top:3rem;background:var(--filo);border:1px solid var(--filo)}
@media(min-width:860px){.strutture{grid-template-columns:1fr 1fr}}
.struttura{background:var(--carta);display:flex;flex-direction:column}
.struttura .foto{border:0;border-bottom:1px solid var(--filo);aspect-ratio:16/9}
.struttura .dentro{padding:2rem 1.9rem;display:flex;flex-direction:column;flex:1}
.struttura .posti{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--barolo);font-weight:600}
.struttura h3{font-size:1.85rem;margin:.6rem 0 .85rem}
.struttura p{margin:0;color:var(--inchiostro-2);font-size:.965rem}
.struttura .dotaz{margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--filo);font-size:.775rem;color:var(--inchiostro-3)}
.struttura .dentro a{margin-top:1.5rem;font-size:.88rem;font-weight:500;color:var(--barolo);text-decoration:none;border-bottom:1px solid var(--filo);align-self:flex-start;padding-bottom:.15rem}
.struttura .dentro a:hover{border-bottom-color:var(--barolo)}

/* ————————————— avviso di disponibilità ————————————— */
.avviso{background:var(--calce-2);border-bottom:1px solid var(--filo)}
.avviso .wrap{padding-block:1.5rem}
.avviso p{margin:0;max-width:76ch;font-size:.95rem;color:var(--inchiostro-2);
  border-left:3px solid var(--barolo);padding-left:1.1rem}
.avviso strong{color:var(--inchiostro);font-weight:600}
.avviso a{color:var(--barolo)}


/* ————————————— fascia fotografica a tutta larghezza ————————————— */
.banda{margin:0;line-height:0;background:var(--calce-2)}
.banda img{width:100%;height:clamp(220px,38vw,460px);object-fit:cover;display:block}

/* nella galleria della cascina la prima foto occupa tutta la riga */
.galleria .foto.sopra-tre{grid-column:1 / -1}
@media(max-width:640px){.galleria{grid-template-columns:1fr !important}.galleria .foto.sopra-tre{aspect-ratio:4/3}}


/* ————————————— ingranditore delle fotografie ————————————— */
.galleria .foto img,.foto img[data-grande]{cursor:zoom-in}
.lente{
  position:fixed;inset:0;z-index:200;display:none;
  background:rgba(20,17,14,.94);
  align-items:center;justify-content:center;padding:clamp(.5rem,3vw,3rem);
}
.lente[aperta]{display:flex}
.lente img{
  max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.lente-did{
  position:absolute;left:0;right:0;bottom:clamp(.6rem,2vw,1.4rem);text-align:center;
  color:#D8CFC0;font-size:.85rem;padding-inline:4rem;
}
.lente-btn{
  position:absolute;background:rgba(247,243,234,.12);border:1px solid rgba(247,243,234,.3);
  color:#F7F3EA;width:46px;height:46px;cursor:pointer;font-size:1.4rem;line-height:1;
  display:flex;align-items:center;justify-content:center;padding:0;
}
.lente-btn:hover{background:rgba(247,243,234,.25)}
.lente-chiudi{top:clamp(.6rem,2vw,1.6rem);right:clamp(.6rem,2vw,1.6rem)}
.lente-prec{left:clamp(.6rem,2vw,1.6rem);top:50%;transform:translateY(-50%)}
.lente-succ{right:clamp(.6rem,2vw,1.6rem);top:50%;transform:translateY(-50%)}
.lente-num{position:absolute;top:clamp(.9rem,2vw,1.9rem);left:clamp(.9rem,2vw,1.9rem);
  color:#A99D8F;font-size:.8rem;letter-spacing:.12em}
@media(max-width:560px){.lente-btn{width:40px;height:40px}.lente-did{font-size:.78rem;padding-inline:1rem}}


/* ————————————— piantina di orientamento ————————————— */
.mappa{background:var(--carta);border-block:1px solid var(--filo);padding-block:clamp(2rem,5vw,3.4rem)}
.mappa svg{width:100%;height:auto;display:block}
.strada{fill:none;stroke:var(--filo);stroke-width:9;stroke-linecap:round}
.strada-g{fill:none;stroke:var(--calce-2);stroke-width:14;stroke-linecap:round}
.passi-m{fill:none;stroke:var(--barolo);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:1 9}
.tratto-m{fill:none;stroke:var(--inchiostro-3);stroke-width:1.4;stroke-dasharray:5 7;opacity:.7}
.pieno-b{fill:var(--barolo)}
.qui{font-family:"Fraunces",serif;font-style:italic;font-size:26px;fill:var(--barolo)}
.et-b{font-family:"Archivo",sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;fill:var(--barolo);font-weight:600}
.mappa-nota{margin:1.4rem 0 0;font-size:.83rem;color:var(--inchiostro-3);text-align:center}
@media(max-width:700px){.mappa svg{min-width:640px}.mappa .wrap{overflow-x:auto}}


/* ————————————— promemoria sopra il modulo ————————————— */
.promemoria{
  margin:0 0 1.6rem;padding:1rem 1.2rem;font-size:.9rem;line-height:1.55;
  color:#C4B8A7;background:rgba(247,243,234,.06);
  border-left:3px solid var(--ottone);
}
.promemoria strong{color:var(--calce);font-weight:600}
.minuta{font-size:.85rem;color:var(--inchiostro-3);display:inline-block;margin-top:.4rem}


/* ————————————— fascia dei codici identificativi ————————————— */
.codici{background:var(--calce-2);border-block:1px solid var(--filo)}
.codici .wrap{padding-block:1.3rem}
.codici p{margin:0;max-width:82ch;font-size:.9rem;color:var(--inchiostro-2)}
.codici strong{color:var(--inchiostro);font-weight:600}
.cin{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.92em;letter-spacing:.02em;
  background:var(--carta);padding:.1em .4em;border:1px solid var(--filo)}
.piede .sotto span:nth-child(2),.piede .sotto span:nth-child(3){font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.72rem}

/* date gia' al completo ------------------------------------------------ */
.pieno{border-left:3px solid var(--barolo);background:rgba(110,35,55,.05);
  padding:.95rem 1.2rem;margin:.2rem 0 1.4rem}
.pieno p{margin:0}
.pieno-t{font-weight:600;font-size:.94rem;color:var(--barolo);line-height:1.45}
.pieno-d{margin-top:.35rem !important;font-size:.88rem;color:var(--inchiostro-2);line-height:1.55}
.sez--scuro .pieno{background:rgba(201,169,106,.09);border-left-color:var(--oro-chiaro)}
.sez--scuro .pieno-t{color:var(--oro-chiaro)}
.sez--scuro .pieno-d{color:#C4B8A7}
.griglia-date{list-style:none;padding:0;margin:1.6rem 0 0;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:.6rem}
.griglia-date li{border:1px solid var(--filo);background:var(--carta);
  padding:.7rem .9rem;font-size:.92rem;color:var(--inchiostro);
  display:flex;align-items:center;gap:.6rem}
.griglia-date li::before{content:"";width:.45rem;height:.45rem;background:var(--barolo);
  border-radius:50%;flex:none}
.date-piene .minuta{margin-top:1.4rem}