
@font-face{font-family:Caslon Display;src:url(fonts/libre-caslon-display-latin-400-normal.woff2) format('woff2');font-display:swap}
@font-face{font-family:Caslon;src:url(fonts/libre-caslon-text-latin-400-normal.woff2) format('woff2');font-display:swap}
@font-face{font-family:Caslon;src:url(fonts/libre-caslon-text-latin-400-italic.woff2) format('woff2');font-style:italic;font-display:swap}
@font-face{font-family:Caslon;src:url(fonts/libre-caslon-text-latin-700-normal.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Karla;src:url(fonts/karla-latin-400-normal.woff2) format('woff2');font-display:swap}
@font-face{font-family:Karla;src:url(fonts/karla-latin-400-italic.woff2) format('woff2');font-style:italic;font-display:swap}
@font-face{font-family:Karla;src:url(fonts/karla-latin-600-normal.woff2) format('woff2');font-weight:600;font-display:swap}
/* colori presi dall'insegna: blu dello scudo, oro della cornice, giallo della casa */
:root{--blu:#14254d;--blu-2:#0b1630;--oro:#b98d36;--oro-chiaro:#dcc07a;--muro:#ecd78c;--carta:#f7f1e1;--carta-2:#fffaf0;--inchiostro:#17203a;--matita:#5f6170;--filo:#cfc3a0}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--carta);color:var(--inchiostro);font:400 1.08rem/1.6 Karla,system-ui,sans-serif;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-family:Caslon,Georgia,serif;font-weight:400;color:var(--blu);line-height:1.05}
p{margin:0}
section{scroll-margin-top:72px}
.wrap{width:min(1280px,100% - clamp(2rem,6vw,6rem));margin-inline:auto}
:focus-visible{outline:2px solid var(--oro);outline-offset:3px}
.maiuscolo{font:400 .78rem/1.2 Caslon,serif;letter-spacing:.32em;text-transform:uppercase;color:var(--oro)}
.filetto{display:flex;align-items:center;gap:1rem}
.filetto::before,.filetto::after{content:"";flex:1;height:1px;background:currentColor;opacity:.6}
.link{display:inline-flex;align-items:center;gap:.5rem;padding:.2rem 0;border-bottom:1px solid currentColor;font-weight:600;text-decoration:none;transition:gap .25s,color .25s}
.link:hover{gap:.85rem;color:var(--oro)}
.bottone{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3.25rem;padding:0 1.6rem;border:1.5px solid var(--blu);background:var(--blu);color:#fff;font:600 .95rem/1 Karla;letter-spacing:.04em;text-decoration:none;cursor:pointer;transition:background .25s,color .25s}
.bottone:hover{background:transparent;color:var(--blu)}
.bottone.oro{background:var(--oro-chiaro);border-color:var(--oro-chiaro);color:var(--blu-2)}.bottone.oro:hover{background:transparent;color:var(--oro-chiaro)}
.bottone svg{width:1.15rem;height:1.15rem}
.avviso{background:var(--blu-2);color:#cfd5e4;text-align:center;font-size:.8rem;padding:.5rem 1rem}

/* testata: trasparente sull'apertura, carta quando si scorre */
.testata{position:fixed;left:0;right:0;top:var(--av,34px);z-index:40;color:#f3ecdc;transition:background .4s,top .3s,color .4s,border-color .3s;border-bottom:1px solid transparent}
.testata.piena{top:0;color:var(--inchiostro);background:rgb(247 241 225 / .95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-color:var(--filo)}
.testata .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:72px;gap:1rem}
.testata nav{display:flex;gap:1.6rem;font-size:.93rem}
.testata nav a{text-decoration:none}.testata nav a:hover{color:var(--oro)}
.marchio{display:flex;align-items:center;gap:.6rem;text-decoration:none;justify-self:center;transition:opacity .5s,transform .5s}
.testata:not(.piena) .marchio{opacity:0;transform:translateY(6px);pointer-events:none}
.marchio svg{width:2.2rem;height:2.75rem}
.marchio b{font:400 1.5rem/1 Caslon Display,serif;letter-spacing:.2em;color:var(--blu)}
.t-dx{justify-self:end;display:flex;align-items:center;gap:1.4rem;font-size:.93rem}
.t-dx a{text-decoration:none}
@media (max-width:980px){.testata nav{display:none}.testata .wrap{grid-template-columns:auto 1fr}.marchio{justify-self:start}.t-dx .tel-t{display:none}}

/* apertura: una giornata del Blue, dalle 7:30 alle 20:00 */
.film{position:relative;height:calc(100svh - var(--av,34px));min-height:580px;overflow:hidden;background:var(--blu-2);color:#fff;isolation:isolate}
.film .scatto{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.3s ease}
.film .scatto.on{opacity:1}
.film .scatto img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:transform 7s linear}
.film .scatto.on img{transform:scale(1)}
.film::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgb(11 22 48 / .55),rgb(11 22 48 / 0) 30%,rgb(11 22 48 / 0) 45%,rgb(11 22 48 / .82));pointer-events:none}
.orologio{position:absolute;z-index:2;left:clamp(1.2rem,5vw,5rem);bottom:clamp(6rem,15vh,9rem);display:grid;gap:.4rem}
.orologio .ora{font:400 clamp(4.4rem,13vw,10rem)/.85 Caslon Display,serif;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.orologio .cosa{font:italic clamp(1.25rem,2.4vw,1.9rem)/1.2 Caslon,serif;color:var(--oro-chiaro);min-height:1.3em}
.orologio .cambio{animation:sale .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes sale{from{opacity:0;transform:translateY(14px)}}
.tacche{position:absolute;z-index:2;left:clamp(1.2rem,5vw,5rem);right:clamp(1.2rem,5vw,5rem);bottom:clamp(2.2rem,6vh,3.4rem);display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}
.tacche button{display:grid;gap:.45rem;padding:0;border:0;background:none;color:#fff;font:600 .78rem/1 Karla;letter-spacing:.14em;text-align:left;cursor:pointer;opacity:.6;transition:opacity .3s}
.tacche button[aria-current="true"],.tacche button:hover{opacity:1}
.tacche i{height:2px;background:rgb(255 255 255 / .3);overflow:hidden}
.tacche i b{display:block;height:100%;background:var(--oro-chiaro);transform:scaleX(0);transform-origin:left}
.tacche button.fatto i b{transform:scaleX(1)}
.tacche button[aria-current="true"] i b{animation:avanza var(--dur,2.6s) linear forwards}
@keyframes avanza{to{transform:scaleX(1)}}
/* l'ultimo fotogramma: la casa con le luci accese, e l'insegna */
.titoli{position:absolute;z-index:3;inset:0;display:grid;place-items:center;text-align:center;padding:5rem 1.2rem 7rem;opacity:0;pointer-events:none;transition:opacity 1.2s ease}
.film.fine .titoli{opacity:1;pointer-events:auto}
.film.fine .orologio{opacity:0;transition:opacity .6s}
.film.fine::after{background:radial-gradient(60% 55% at 50% 50%,rgb(11 22 48 / .55),rgb(11 22 48 / .25) 70%),linear-gradient(180deg,rgb(11 22 48 / .5),rgb(11 22 48 / 0) 30%,rgb(11 22 48 / .7))}
.titoli .stemma{display:block;width:clamp(70px,9vh,96px);height:auto;margin:0 auto}
.titoli h1{margin-top:.8rem;font:400 clamp(4.4rem,13vw,9.6rem)/.88 Caslon Display,serif;letter-spacing:.08em;color:#fff}
.titoli .cafe{margin-top:.35rem;font:400 clamp(1.6rem,3.6vw,2.6rem)/1.1 Caslon,serif;color:#fff}
.titoli .bb{width:min(80vw,21rem);margin:.6rem auto 0;color:var(--oro-chiaro);font:700 clamp(1.2rem,2.4vw,1.6rem)/1 Caslon,serif}
.titoli .orari{margin-top:1.6rem;font:italic 1.1rem Caslon,serif;color:#e6dcc4}
.titoli .az{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem 1.6rem;margin-top:1.8rem}
.titoli .link{color:#fff}
.salta{position:absolute;z-index:4;right:clamp(1.2rem,5vw,5rem);top:calc(72px + 1rem);padding:.5rem .9rem;border:1px solid rgb(255 255 255 / .4);background:rgb(11 22 48 / .3);color:#fff;font:600 .78rem/1 Karla;letter-spacing:.12em;cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.film.fine .salta{display:none}
@media (max-width:640px){.tacche button span{font-size:.68rem;letter-spacing:.06em}.orologio{bottom:6.4rem}}

/* la giornata */
.giornata{--fondo:#f3e6bf;--testo:var(--inchiostro);--tenue:var(--matita);background:var(--fondo);color:var(--testo);padding:clamp(4.5rem,9vw,8rem) 0;transition:background 1s,color 1s}
.giornata[data-ora="pranzo"]{--fondo:#f6e7a9}
.giornata[data-ora="pomeriggio"]{--fondo:#efcf9f}
.giornata[data-ora="sera"]{--fondo:#14254d;--testo:#f3ecdc;--tenue:#bcc4da}
.giornata h2,.giornata h3{color:var(--testo);transition:color 1s}
.g-testa{display:grid;gap:1.5rem 4rem;align-items:end}
@media (min-width:900px){.g-testa{grid-template-columns:auto 1fr}}
.g-testa h2{font-size:clamp(2.6rem,5.4vw,4.8rem);max-width:12ch}
.g-testa h2 em{color:var(--oro)}
.g-testa p{max-width:28rem;color:var(--tenue);transition:color 1s}
.cielo{position:relative;margin-top:clamp(2.5rem,5vw,4rem);height:110px}
.cielo svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.cielo path{fill:none;stroke:currentColor;stroke-opacity:.3;stroke-width:1.5}
.sole{position:absolute;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ffe9a8,#eeb441 62%,#d48a1d);box-shadow:0 0 36px rgb(238 180 65 / .55);transition:left .9s cubic-bezier(.3,1.2,.4,1),top .9s cubic-bezier(.3,1.2,.4,1),background 1s,box-shadow 1s;pointer-events:none}
.giornata[data-ora="sera"] .sole{background:radial-gradient(circle at 62% 38%,#fffbea,#e3ddc6 62%,#b4ad94);box-shadow:0 0 36px rgb(255 255 255 / .25)}
.orario{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgb(23 32 58 / .25);border-bottom:1px solid rgb(23 32 58 / .25)}
.giornata[data-ora="sera"] .orario,.giornata[data-ora="sera"] .orario button{border-color:rgb(255 255 255 / .2)}
.orario button{position:relative;display:grid;gap:.2rem;justify-items:start;padding:1rem 1.1rem;border:0;border-left:1px solid rgb(23 32 58 / .25);background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}
.orario button:first-child{border-left:0}
.orario button b{font:400 clamp(1.15rem,2vw,1.55rem)/1 Caslon,serif}
.orario button span{font:italic .85rem Caslon,serif;opacity:.7}
.orario button::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--oro);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.orario button[aria-selected="true"]::after{transform:none}
.scena{display:grid;gap:clamp(2rem,5vw,5rem);align-items:center;margin-top:clamp(2.5rem,5vw,4rem)}
@media (min-width:900px){.scena{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.scena-foto{position:relative;aspect-ratio:4/5;max-height:640px;overflow:hidden;background:rgb(0 0 0 / .08)}
.scena-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.05);transition:opacity .9s,transform 1.6s}
.scena-foto img.on{opacity:1;transform:none}
.scena-testo .quando{font:400 clamp(2.6rem,5vw,4rem)/1 Caslon Display,serif;color:var(--oro)}
.scena-testo h3{margin-top:.6rem;font-size:clamp(2.2rem,4.2vw,3.6rem)}
.scena-testo p{margin-top:1.2rem;max-width:30rem;font-size:1.12rem;color:var(--tenue);transition:color 1s}
.scena-testo ul{margin:1.6rem 0 0;padding:0;list-style:none;font:italic 1.05rem/1.9 Caslon,serif}
.scena-testo li::before{content:"— ";color:var(--oro)}
.scena-testo .link{margin-top:2rem}
.adesso{margin-top:1.4rem;font-size:.85rem;color:var(--tenue)}
.cambia{animation:sale .6s ease both}
@media (max-width:640px){.orario button{padding:.8rem .45rem}.orario button b{display:none}.orario button span{font:400 1.02rem/1 Caslon,serif;opacity:1}.cielo{height:84px}.sole{width:38px;height:38px;margin:-19px 0 0 -19px}}

/* la carta, con i prezzi veri */
.carta-sez{padding:clamp(4.5rem,9vw,8rem) 0;background:var(--carta)}
.carta-testa{display:grid;gap:1.5rem 4rem;align-items:end}
@media (min-width:900px){.carta-testa{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.carta-testa h2{font-size:clamp(2.8rem,5.6vw,5rem)}
.carta-testa h2 em{color:var(--oro)}
.carta-testa p{color:var(--matita);font-size:1.1rem;max-width:32rem}
.nove{display:flex;align-items:center;gap:1.4rem;margin-top:2.6rem;padding:1.4rem 1.6rem;background:var(--blu);color:#fff}
.nove b{font:400 clamp(3.4rem,6vw,4.6rem)/.9 Caslon Display,serif;color:var(--oro-chiaro);white-space:nowrap}
.nove p{font:400 clamp(1.15rem,2vw,1.4rem)/1.35 Caslon,serif}
.nove small{display:block;margin-top:.3rem;font:400 .9rem Karla;color:#bcc4da}
.carta{position:relative;margin-top:2rem;padding:clamp(2rem,4vw,3.4rem) clamp(1.4rem,4vw,3.4rem);background:var(--carta-2);border:1px solid var(--blu);outline:1px solid var(--blu);outline-offset:-8px}
.carta-cols{display:grid;gap:0 clamp(2rem,5vw,4.5rem)}
@media (min-width:860px){.carta-cols{grid-template-columns:1fr 1fr}}
.portata{padding:1.6rem 0;border-bottom:1px solid var(--filo);break-inside:avoid}
.portata h3{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;font:400 .95rem/1.2 Caslon,serif;letter-spacing:.24em;text-transform:uppercase}
.portata h3 small{font:italic 1.05rem Caslon,serif;letter-spacing:0;text-transform:none;color:var(--oro);white-space:nowrap}
.portata dl{margin:1rem 0 0}
.portata dt{font:400 1.25rem/1.25 Caslon,serif;color:var(--inchiostro)}
.portata dd{margin:.15rem 0 .8rem;font-size:.95rem;color:var(--matita)}
.carta-piede{display:grid;gap:1rem 3rem;margin-top:1.8rem;font-size:.85rem;color:var(--matita)}
@media (min-width:860px){.carta-piede{grid-template-columns:1.2fr 1fr}}
.asporto{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;margin-top:2rem;padding:1.2rem 0;border-top:2px solid var(--blu);border-bottom:2px solid var(--blu)}
.asporto p{font:400 clamp(1.2rem,2.2vw,1.6rem)/1.3 Caslon,serif;color:var(--blu)}
.asporto p em{color:var(--oro)}

/* la chef */
.chef{background:var(--blu);color:#e8ebf3;padding:clamp(4.5rem,9vw,8rem) 0;overflow:hidden}
.chef h2{color:#fff;font-size:clamp(2.8rem,5.6vw,5rem)}
.chef h2 em{color:var(--oro-chiaro)}
.chef-griglia{display:grid;gap:clamp(2.5rem,6vw,5rem);align-items:center}
@media (min-width:960px){.chef-griglia{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.chef-testo p{margin-top:1.3rem;max-width:30rem;font-size:1.12rem;color:#c3cadd}
.chef-testo .link{margin-top:1.6rem;color:var(--oro-chiaro)}
.chef-foto{position:relative;min-height:520px}
.chef-foto figure{position:absolute;margin:0;background:#fff;padding:12px 12px 3rem;box-shadow:0 30px 60px -30px rgb(0 0 0 / .7)}
.chef-foto figure img{width:100%;height:100%;object-fit:cover}
.chef-foto figcaption{position:absolute;left:0;right:0;bottom:.8rem;text-align:center;font:italic 1rem Caslon,serif;color:var(--blu)}
.chef-foto .uno{left:0;top:0;width:58%;aspect-ratio:3/4.3;transform:rotate(-3deg)}
.chef-foto .due{right:0;bottom:0;width:52%;aspect-ratio:3/4.3;transform:rotate(4deg)}
.chef-foto .due img{filter:grayscale(1) contrast(1.05)}
.nastro{margin-top:clamp(3rem,6vw,5rem);display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.6rem;scrollbar-width:thin;scrollbar-color:var(--oro) transparent}
.nastro figure{flex:0 0 clamp(240px,28vw,360px);margin:0;scroll-snap-align:start}
.nastro img{width:100%;aspect-ratio:4/5;object-fit:cover}
.nastro figcaption{margin-top:.6rem;font:italic 1rem Caslon,serif;color:#c3cadd}

/* Privé 33 */
.prive{position:relative;padding:clamp(5rem,10vw,9rem) 0;background:#120b07;color:#e9dcc6;text-align:center;overflow:hidden;isolation:isolate}
.prive::before{content:"";position:absolute;left:50%;bottom:-30%;width:120vw;height:90%;transform:translateX(-50%);z-index:-1;background:radial-gradient(50% 50% at 50% 50%,rgb(232 128 40 / .35),rgb(150 60 10 / .12) 45%,transparent 70%);animation:fiamma 3.2s ease-in-out infinite alternate}
@keyframes fiamma{0%{opacity:.75;transform:translateX(-50%) scale(1)}35%{opacity:.95}60%{opacity:.8;transform:translateX(-50%) scale(1.04)}100%{opacity:1;transform:translateX(-50%) scale(.98)}}
.prive .marca{font:400 clamp(3.2rem,7vw,5.6rem)/1 Caslon Display,serif;letter-spacing:.24em;color:#e3c48c}
.prive .marca+p{margin-top:.6rem;font:400 .82rem Karla;letter-spacing:.42em;text-transform:uppercase;color:#bfa77c}
.prive h2{margin-top:2.6rem;color:#f4e7cf;font-size:clamp(2.2rem,4.6vw,3.8rem)}
.prive h2 em{display:block;color:#e3c48c}
.prive .tre{margin-top:1.4rem;font:italic 1.25rem Caslon,serif;color:#d9c9ab}
.prive .percorso{max-width:36rem;margin:2.4rem auto 0;padding:1.6rem 0;border-top:1px solid rgb(227 196 140 / .3);border-bottom:1px solid rgb(227 196 140 / .3)}
.prive .percorso b{display:block;font:400 .9rem Caslon,serif;letter-spacing:.3em;color:#e3c48c}
.prive .percorso p{margin-top:.8rem;color:#cbbda3}
.prive .dove{margin-top:1.6rem;font-size:.92rem;color:#a99878}
.prive .bottone{margin-top:2rem;background:#e3c48c;border-color:#e3c48c;color:#1a0f08}
.prive .bottone:hover{background:transparent;color:#e3c48c}

/* le camere */
.camere{background:var(--carta);padding:clamp(4.5rem,9vw,8rem) 0}
.ca-testa{display:grid;gap:2rem 4rem;align-items:end}
@media (min-width:900px){.ca-testa{grid-template-columns:minmax(0,1fr) auto}}
.camere h2{font-size:clamp(2.8rem,5.6vw,5rem)}
.camere h2 em{color:var(--oro)}
.ca-testa p{max-width:32rem;color:var(--matita);font-size:1.1rem}
.chiave{width:clamp(110px,12vw,150px);justify-self:end;transform-origin:50% 5%;animation:dondola 4.5s ease-in-out infinite}
@keyframes dondola{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
@media (max-width:899px){.chiave{display:none}}
.ca-griglia{display:grid;gap:clamp(2rem,5vw,4rem);margin-top:clamp(2.5rem,5vw,4rem);align-items:start}
@media (min-width:980px){.ca-griglia{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}}
.colori{display:grid;gap:1.2rem}
.colori-foto{position:relative;aspect-ratio:5/4;overflow:hidden;background:var(--blu-2)}
.colori-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s}
.colori-foto img.on{opacity:1}
.colori-scelta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}
.colori-scelta p{font:400 1.35rem/1.3 Caslon,serif;color:var(--blu)}
.colori-scelta em{color:var(--oro)}
.campioni{display:flex;gap:.6rem}
.campioni button{width:2.7rem;height:2.7rem;border-radius:50%;border:3px solid var(--carta);background:var(--c);box-shadow:0 0 0 1px var(--filo);cursor:pointer;transition:transform .25s,box-shadow .25s}
.campioni button:hover{transform:scale(1.08)}
.campioni button[aria-pressed="true"]{box-shadow:0 0 0 2px var(--blu);transform:scale(1.12)}
.dettagli{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:1.4rem}
.dettagli figure{position:relative;margin:0;overflow:hidden}
.dettagli img{width:100%;aspect-ratio:3/4;object-fit:cover}
.dettagli figcaption{position:absolute;left:0;bottom:0;padding:.3rem .55rem;background:var(--blu);color:#e8ebf3;font:italic .8rem Caslon,serif}
@media (max-width:560px){.dettagli{grid-template-columns:1fr 1fr}}
.scheda{margin:2rem 0 0;display:grid;gap:0 2.5rem}
@media (min-width:600px){.scheda{grid-template-columns:1fr 1fr}}
.scheda div{display:flex;justify-content:space-between;gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--filo)}
.scheda dt{color:var(--matita);font:italic 1rem Caslon,serif}
.scheda dd{margin:0;text-align:right}
.registro{position:sticky;top:96px;padding:clamp(1.6rem,3vw,2.4rem);background:var(--carta-2);border:1px solid var(--filo);box-shadow:10px 10px 0 var(--muro)}
.registro h3{font-size:1.9rem}
.registro>p{margin-top:.4rem;color:var(--matita);font-size:.95rem}
.righe{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem 1.2rem;margin-top:1.6rem}
.riga{display:grid;gap:.15rem;min-width:0}
.riga.tutta{grid-column:1/-1}
.riga label{font:italic .9rem Caslon,serif;color:var(--matita)}
.riga input,.riga select,.riga textarea{width:100%;min-height:2.6rem;padding:.35rem 0;border:0;border-bottom:1px solid var(--blu);border-radius:0;background:transparent;color:var(--inchiostro);font:inherit;font-size:16px}
.riga input:focus,.riga select:focus,.riga textarea:focus{outline:none;border-bottom:2px solid var(--oro)}
.conto{margin-top:1.3rem;font:italic 1.05rem Caslon,serif;color:var(--blu);min-height:1.6rem}
.registro .bottone{width:100%;margin-top:1.2rem}
.regole{margin-top:1.4rem;font-size:.86rem;color:var(--matita);line-height:1.7}
.regole b{color:var(--inchiostro);font-weight:600}

/* la strada */
.strada{background:var(--muro);padding:clamp(4.5rem,9vw,7rem) 0}
.st-griglia{display:grid;gap:clamp(2.5rem,6vw,6rem);align-items:center}
@media (min-width:900px){.st-griglia{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.strada h2{font-size:clamp(2.6rem,5vw,4.4rem)}
.strada p{margin-top:1.2rem;max-width:30rem;font-size:1.1rem;color:#4d4934}
.strada .link{margin-top:2rem}
.linea{position:relative;margin:0;padding:0 0 0 3.2rem;list-style:none}
.linea::before{content:"";position:absolute;left:1.05rem;top:1.5rem;bottom:1.5rem;width:4px;background:var(--blu)}
.linea li{position:relative;display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:1rem 0;border-bottom:1px dashed rgb(20 37 77 / .25)}
.linea li::before{content:"";position:absolute;left:-2.55rem;top:1.25rem;width:16px;height:16px;border-radius:50%;background:var(--muro);border:4px solid var(--blu)}
.linea li span{font:400 1.25rem Caslon,serif;color:var(--blu)}
.linea li small{font:italic .95rem Caslon,serif;color:#6b6544}
.linea li.qui{padding:1.4rem 0}
.linea li.qui::before{display:none}
.linea li.qui svg{position:absolute;left:-3.25rem;top:.95rem;width:38px;height:47px}
.linea li.qui span{font:400 1.9rem Caslon Display,serif;letter-spacing:.14em}

/* contatti */
.contatti{padding:clamp(4.5rem,9vw,8rem) 0}
.co-griglia{display:grid;gap:clamp(2.5rem,6vw,5rem);align-items:start}
@media (min-width:900px){.co-griglia{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.contatti h2{font-size:clamp(2.6rem,5vw,4.4rem)}
.biglietto{margin-top:2.2rem;padding:2rem;background:var(--carta-2);border:1px solid var(--filo);box-shadow:10px 10px 0 var(--muro);display:grid;gap:1.1rem;max-width:30rem}
.biglietto .testa{display:flex;align-items:center;gap:.9rem;padding-bottom:1rem;border-bottom:1px solid var(--filo)}
.biglietto .testa svg{width:2.6rem;height:3.2rem}
.biglietto .testa b{display:block;font:400 1.7rem/1 Caslon Display,serif;letter-spacing:.18em;color:var(--blu)}
.biglietto .testa small{font:italic .95rem Caslon,serif;color:var(--oro)}
.biglietto a,.biglietto p{display:flex;justify-content:space-between;gap:1rem;text-decoration:none;font-size:1rem}
.biglietto span{font:italic .95rem Caslon,serif;color:var(--matita)}
.biglietto a:hover b{color:var(--oro)}
.biglietto a b,.biglietto p b{font-weight:600;text-align:right}
.lettera{padding:clamp(1.6rem,3vw,2.4rem);border-top:3px solid var(--blu);background:var(--carta-2)}
.lettera h3{font-size:1.9rem}
.lettera textarea{min-height:6.5rem;resize:vertical}
.lettera .bottone{width:100%;margin-top:1.4rem}
.lettera .nota{margin-top:.8rem;font-size:.82rem;color:var(--matita)}

.piede{background:var(--blu-2);color:#a7b0c8;padding:3.2rem 0 calc(3.2rem + env(safe-area-inset-bottom));font-size:.9rem}
.piede .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1.5rem 3rem}
.piede b{color:#fff;font:400 1.3rem Caslon Display,serif;letter-spacing:.18em}
.piede a{text-decoration:none}.piede a:hover{color:#fff}
.piede .crediti{flex-basis:100%;padding-top:1.4rem;border-top:1px solid rgb(255 255 255 / .08);font-size:.8rem}

.barra{display:none}
@media (max-width:760px){
  .barra{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:1fr 1fr 1fr;padding-bottom:env(safe-area-inset-bottom);background:var(--blu-2);transform:translateY(110%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
  .barra.su{transform:none}
  .barra a{display:grid;place-items:center;min-height:3.4rem;color:#fff;text-decoration:none;font-weight:600;font-size:.92rem;border-left:1px solid rgb(255 255 255 / .1)}
  .barra a:first-child{border-left:0}
  .barra a.wa{background:#1e8c4a}
  .piede{padding-bottom:6rem}
}

.js [data-sale]{opacity:0;transform:translateY(20px);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1)}
.js [data-sale].vista{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js [data-sale]{opacity:1;transform:none;transition:none}.chiave,.prive::before{animation:none}.sole,.scena-foto img,.giornata,.film .scatto,.film .scatto img,.colori-foto img{transition:none}.film .scatto img{transform:none}.cambia,.orologio .cambio{animation:none}}

/* prenota un tavolo */
.tavolo{padding:clamp(4.5rem,9vw,8rem) 0;background:var(--muro)}
.ta-griglia{display:grid;gap:clamp(2.5rem,6vw,5rem);align-items:start}
@media (min-width:960px){.ta-griglia{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}}
.tavolo h2{font-size:clamp(2.8rem,5.6vw,5rem)}
.tavolo h2 em{color:var(--oro)}
.tavolo .intro{margin-top:1.2rem;max-width:32rem;font-size:1.1rem;color:#4d4934}
.passo{margin-top:2.2rem}
.passo>b{display:block;font:400 .82rem Caslon,serif;letter-spacing:.26em;text-transform:uppercase;color:var(--blu)}
.giorni{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:.9rem}
.giorni button,.orari button{border:1px solid rgb(20 37 77 / .25);background:var(--carta-2);color:var(--inchiostro);font:inherit;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.giorni button{display:grid;gap:.15rem;justify-items:center;padding:.6rem .2rem}
.giorni button small{font:italic .8rem Caslon,serif;color:var(--matita)}
.giorni button b{font:400 1.5rem/1 Caslon Display,serif}
.giorni button[aria-pressed="true"],.orari button[aria-pressed="true"]{background:var(--blu);border-color:var(--blu);color:#fff}
.giorni button[aria-pressed="true"] small{color:var(--oro-chiaro)}
.altra-data{display:inline-flex;align-items:center;gap:.6rem;margin-top:.8rem;font:italic .95rem Caslon,serif;color:var(--matita)}
.altra-data input{min-height:2.4rem;border:0;border-bottom:1px solid var(--blu);background:transparent;font:inherit;font-size:16px;color:var(--inchiostro)}
.fasce{display:grid;gap:.9rem;margin-top:.9rem}
.fascia{display:grid;grid-template-columns:7.5rem 1fr;align-items:center;gap:.8rem}
.fascia>span{font:italic 1rem Caslon,serif;color:var(--matita)}
.orari{display:flex;flex-wrap:wrap;gap:6px}
.orari button{min-width:4.2rem;padding:.55rem .7rem;font-weight:600;font-size:.95rem}
.persone{display:flex;align-items:center;gap:1rem;margin-top:.9rem}
.persone button{width:3rem;height:3rem;border:1.5px solid var(--blu);background:transparent;color:var(--blu);font:400 1.6rem/1 Caslon,serif;cursor:pointer}
.persone button:hover{background:var(--blu);color:#fff}
.persone output{min-width:5.5rem;text-align:center;font:400 2.6rem/1 Caslon Display,serif;color:var(--blu)}
.biglietto-t{position:sticky;top:96px;padding:2rem 1.8rem;background:var(--carta-2);border:1px solid var(--blu);outline:1px solid var(--blu);outline-offset:-7px;text-align:center}
.biglietto-t svg.stemma{display:block;width:2.6rem;height:3.25rem;margin:0 auto}
.biglietto-t .tit{margin-top:.6rem;font:400 .82rem Caslon,serif;letter-spacing:.3em;text-transform:uppercase;color:var(--oro)}
.biglietto-t .per{margin-top:1rem;font:400 clamp(2.2rem,4vw,3rem)/1 Caslon Display,serif;color:var(--blu)}
.biglietto-t .quando-t{margin-top:.6rem;font:italic 1.2rem Caslon,serif;color:var(--inchiostro)}
.biglietto-t .strappo{margin:1.4rem -1.8rem;border-top:2px dashed var(--filo)}
.biglietto-t .riga{text-align:left}
.biglietto-t .bottone{width:100%;margin-top:1.3rem}
.biglietto-t .nota{margin-top:.8rem;font-size:.82rem;color:var(--matita)}
@media (max-width:560px){.fascia{grid-template-columns:1fr}.giorni button b{font-size:1.2rem}.giorni{gap:4px}}

/* anteprima delle camere nella pagina principale */
.cam-anteprima{display:grid;gap:clamp(2rem,5vw,4.5rem);align-items:center}
@media (min-width:900px){.cam-anteprima{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.mosaico{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.mosaico img{width:100%;aspect-ratio:3/5;object-fit:cover}
.mosaico img:nth-child(even){margin-top:2.2rem}
.cam-anteprima .bottone{margin-top:2rem}

/* pagina camere */
.pagina-camere .testata{position:sticky;top:0;color:var(--inchiostro);background:rgb(247 241 225 / .95);border-color:var(--filo)}
.pagina-camere .testata .marchio{opacity:1;transform:none;pointer-events:auto}
.cam-hero{padding:clamp(3rem,7vw,5.5rem) 0 clamp(2rem,4vw,3rem)}
.cam-hero h1{font-size:clamp(3.2rem,7vw,6.4rem)}
.cam-hero h1 em{color:var(--oro)}
.cam-hero p{margin-top:1.2rem;max-width:34rem;font-size:1.15rem;color:var(--matita)}
.cam-hero .az{display:flex;flex-wrap:wrap;gap:1rem 1.8rem;align-items:center;margin-top:2rem}
.indietro{display:inline-block;margin-bottom:1.6rem;font:italic 1rem Caslon,serif;color:var(--matita);text-decoration:none}
.indietro:hover{color:var(--oro)}
