:root{
  --ink:#2E2621;        /* bruno del logo */
  --oro:#C9A45C;        /* oro del logo */
  --salvia:#8D9E91;     /* verde del bagno */
  --gesso:#E9E7DF;      /* intonaco, fondo pagina */
  --carta:#F6F4EE;
  --linea:#CFCBC0;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--gesso);color:var(--ink);
  font-family:"EB Garamond",Georgia,serif;font-size:19px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,nav,button,.jost{font-family:"Jost",system-ui,sans-serif;font-weight:400}
h2{font-size:clamp(1.5rem,3.6vw,2.1rem);letter-spacing:.09em;margin:0 0 .8em;font-weight:300}
h3{font-size:1.02rem;letter-spacing:.13em;margin:0 0 .4em;font-weight:500}
p{margin:0 0 1em;max-width:62ch}
.wrap{max-width:1060px;margin:0 auto;padding:0 24px}
section{padding:clamp(54px,8.5vw,100px) 0}
.chiusa{font-style:italic;color:#6E6255;margin-top:1.3em}

/* ---- barra in alto ---- */
.topbar{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;justify-content:space-between;
  align-items:center;padding:16px 24px;gap:14px}
.topbar nav a{font-family:Jost,sans-serif;font-size:.78rem;letter-spacing:.15em;text-decoration:none;
  opacity:.75;border-bottom:1px solid transparent;padding-bottom:4px}
.topbar nav a:hover,.topbar nav a[aria-current]{opacity:1;border-bottom-color:var(--oro)}
.langs{display:flex;gap:12px}
.lang{background:none;border:0;font:inherit;font-family:Jost,sans-serif;font-size:.78rem;
  letter-spacing:.16em;cursor:pointer;opacity:.55;padding:4px 2px;border-bottom:1px solid transparent;color:inherit}
.lang[aria-pressed="true"]{opacity:1;border-bottom-color:var(--oro)}
.lang:focus-visible,.topbar nav a:focus-visible{outline:2px solid var(--oro);outline-offset:3px}
.onhero{color:#F3EFE6}

/* ---- hero ---- */
.hero{position:relative;min-height:100svh;display:grid;place-items:center;overflow:hidden;background:#1d1814}
.hero>picture>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62}
.hero-in{position:relative;text-align:center;padding:40px 24px}
.hero-in img{width:min(460px,78vw);height:auto;margin:0 auto;filter:drop-shadow(0 2px 18px rgba(0,0,0,.45))}
.hero-in p{color:#F3EFE6;max-width:32ch;margin:26px auto 0;font-size:1.06rem;font-style:italic;
  text-shadow:0 1px 14px rgba(0,0,0,.55)}
.scroll{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);color:#F3EFE6;
  font-family:Jost,sans-serif;font-size:.72rem;letter-spacing:.22em;text-decoration:none;opacity:.75}

/* ---- testata pagina interna ---- */
.testata{background:var(--ink);color:var(--carta);padding:clamp(96px,14vh,150px) 0 clamp(40px,7vw,72px)}
.testata h1{font-size:clamp(1.9rem,5vw,3rem);font-weight:300;letter-spacing:.06em;margin:0 0 .3em}
.testata p{color:#C2B8AB;max-width:52ch;margin:0}

.intro{background:var(--carta)}
.intro .wrap{max-width:720px;text-align:center}
.intro p{margin-left:auto;margin-right:auto;font-size:1.18rem;line-height:1.8}
.rule{width:52px;height:1px;background:var(--oro);margin:0 auto 32px}

.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:center}
.split.flip .txt{order:2}
@media(max-width:780px){.split{grid-template-columns:1fr}.split.flip .txt{order:0}}
.frame{position:relative}
.frame img{width:100%;height:100%;object-fit:cover}
.frame::after{content:"";position:absolute;inset:10px -10px -10px 10px;border:1px solid var(--oro);z-index:-1}

.gal{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.gal img{width:100%;height:100%;object-fit:cover}
.g-a{grid-column:span 4;aspect-ratio:4/3}
.g-b{grid-column:span 2;aspect-ratio:3/4}
.g-c{grid-column:span 2;aspect-ratio:3/4}
.g-d{grid-column:span 4;aspect-ratio:4/3}
@media(max-width:700px){.gal{grid-template-columns:repeat(2,1fr)}
  .g-a,.g-d{grid-column:span 2;aspect-ratio:4/3}.g-b,.g-c{grid-column:span 1;aspect-ratio:3/4}}

.scuro{background:var(--ink);color:var(--carta)}
.scuro h2,.scuro h3{color:var(--carta)}
.scuro .frame::after{border-color:rgba(201,164,92,.55)}
.scuro .chiusa{color:#B0A596}

.dett{list-style:none;padding:0;margin:1.4em 0 0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0 34px}
.dett li{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.16);font-size:.96rem}
.avviso{margin-top:26px;font-size:.95rem;color:#C2B8AB;border-left:2px solid var(--oro);padding-left:14px}

/* ---- regole ---- */
.regole{background:var(--carta)}
.regole ul{list-style:none;padding:0;margin:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:0 40px}
.regole li{padding:12px 0;border-bottom:1px solid var(--linea);font-size:.98rem}
.regole b{font-family:Jost,sans-serif;font-weight:500;font-size:.8rem;letter-spacing:.1em;
  display:block;color:#6E6255}

/* ---- elenchi citta' ---- */
.cols{columns:2;column-gap:48px}
@media(max-width:700px){.cols{columns:1}}
.locali{margin:0 0 34px;break-inside:avoid}
.locali h3{color:var(--salvia);border-bottom:1px solid var(--linea);padding-bottom:8px;margin-bottom:12px}
.locali ol{list-style:none;padding:0;margin:0;counter-reset:n}
.locali li{counter-increment:n;padding:7px 0 7px 30px;position:relative;font-size:.98rem;line-height:1.45}
.locali li::before{content:counter(n);position:absolute;left:0;top:8px;font-family:Jost,sans-serif;
  font-size:.72rem;color:var(--oro);letter-spacing:.05em}
.locali span{display:block;color:#6E6255;font-size:.88rem}

/* ---- contatti ---- */
.contact{background:var(--salvia);color:#1F2A22}
.contact h2{color:#1F2A22}
.cgrid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,6vw,70px)}
@media(max-width:780px){.cgrid{grid-template-columns:1fr}}
label{display:block;font-family:Jost,sans-serif;font-size:.74rem;letter-spacing:.14em;margin:16px 0 5px}
input,textarea{width:100%;padding:11px 13px;border:1px solid rgba(31,42,34,.3);background:rgba(255,255,255,.62);
  font-family:"EB Garamond",serif;font-size:1rem;color:#1F2A22;border-radius:2px}
input:focus,textarea:focus{outline:2px solid var(--ink);outline-offset:1px;background:#fff}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
button.send{margin-top:26px;padding:13px 34px;background:var(--ink);color:var(--carta);border:0;
  font-family:Jost,sans-serif;font-size:.82rem;letter-spacing:.16em;cursor:pointer;border-radius:2px}
button.send:hover{background:#463830}

footer{background:var(--ink);color:#B9B1A6;font-size:.85rem;padding:38px 0}
footer a{color:#B9B1A6}
footer .wrap{display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:space-between}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

/* ---- logo ripetuto nelle pagine interne ---- */
.marchio{display:block;width:min(300px,62vw);margin:0 0 26px}
.testata .wrap{max-width:760px}

/* ---- fascia di passaggio tra le pagine ---- */
.passaggio{background:var(--carta)}
.passaggio .split{align-items:center}
.passaggio h2{margin-bottom:.5em}
.vaia{display:inline-block;margin-top:8px;font-family:Jost,sans-serif;font-size:.82rem;
  letter-spacing:.14em;text-decoration:none;border-bottom:1px solid var(--oro);padding-bottom:5px}
.vaia:hover{border-bottom-width:2px}
.vaia:focus-visible{outline:2px solid var(--oro);outline-offset:4px}

/* ---- indirizzi / arrivo ---- */
.arrivo .wrap{max-width:760px}
.arrivo .dettaglio{margin-top:1.6em;border-top:1px solid var(--linea);padding-top:1.2em}

.testata .avviso{color:#D9CFBF;font-size:.97rem}
.testata .avviso b{color:var(--oro)}
