@font-face{font-family:Kinetika;src:url(assets/fonts/Kinetika-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Kinetika;src:url(assets/fonts/Kinetika-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Kinetika;src:url(assets/fonts/Kinetika-MediumItalic.woff2) format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:Kinetika;src:url(assets/fonts/Kinetika-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Kinetika;src:url(assets/fonts/Kinetika-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
:root{--br:#3b2623;--brd:#24160f;--cr:#f3e9df;--bd:#6a2230;--mu:#cdb9ad;--f:Kinetika,"Helvetica Neue",Arial,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--brd);color:var(--cr);font-family:var(--f);font-weight:500;line-height:1.5;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:3px solid var(--cr);outline-offset:3px}
.wrap{width:min(1080px,100% - 40px);margin-inline:auto}
.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px max(20px,calc((100% - 1080px)/2));background:rgba(36,22,15,.88);backdrop-filter:blur(10px)}
.top img{width:120px}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--cr);color:var(--br);font:600 13px/1 var(--f);letter-spacing:.12em;text-transform:uppercase;padding:14px 22px;border-radius:99px;text-decoration:none;border:0;cursor:pointer;min-height:44px}
.pill.ghost{background:transparent;color:var(--cr);border:1.5px solid var(--cr)}
.pill:hover{filter:brightness(.94)}
.tag{font:600 12px/1 var(--f);letter-spacing:.26em;text-transform:uppercase}
.sf{font-style:italic;font-weight:500;letter-spacing:-.035em;line-height:1}
.g{font-weight:700;letter-spacing:-.05em;line-height:.85;color:#fff}
/* hero */
.hero{position:relative;min-height:min(86svh,760px);display:flex;align-items:flex-end;background:#2a1a18 url(assets/nb/hero-schiena.jpg) center 35%/cover;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(20,10,8,.35),rgba(20,10,8,.2) 40%,rgba(20,10,8,.82))}
.hero .wrap{padding:0 0 clamp(28px,6vw,64px)}
.hero .sf{font-size:clamp(34px,10vw,76px);margin:18px 0 0 3px}
.hero .g{font-size:clamp(86px,29vw,250px);margin-left:-.04em}
.hero p{max-width:34ch;margin:22px 0 24px;font-size:18px;letter-spacing:.015em;color:#fff}
.hero p strong{font-weight:600}
.hero .row{display:flex;flex-wrap:wrap;gap:12px}
/* sezioni */
section{padding:clamp(48px,9vw,96px) 0}
.eyebrow{display:block;margin-bottom:14px;color:var(--mu)}
h2{font-size:clamp(34px,9vw,64px);line-height:.95;letter-spacing:-.045em;font-weight:700;color:#fff;margin-bottom:18px}
h2 em{font-weight:500;letter-spacing:-.035em}
.lead{max-width:44ch;color:var(--cr);font-size:17px;letter-spacing:.015em;margin-bottom:26px}
/* open day */
.od{background:var(--br)}
.od-grid{display:grid;gap:28px;align-items:center}
.od-grid img{width:100%;max-width:520px;border-radius:6px}
.closed .od{display:none}
/* november black */
.promo-grid{display:grid;gap:26px;margin-top:30px}
.promo{scroll-margin-top:84px}
.promo img{width:100%;border-radius:6px}
.promo .row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;flex-wrap:wrap}
.lead strong{font-weight:700;color:#fff}
.valid{margin-top:26px;font-size:15px;color:var(--mu)}
/* contatti */
.contact{background:var(--br)}
.contact dl{display:grid;gap:4px 28px;grid-template-columns:auto 1fr;margin:24px 0}
.contact dt{color:var(--mu)}
.links{display:flex;gap:20px;flex-wrap:wrap;margin-top:18px}
.legal{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:26px max(20px,calc((100% - 1080px)/2)) 40px;font-size:13px;color:var(--mu)}
.legal button{background:none;border:0;color:inherit;text-decoration:underline;font:inherit;cursor:pointer;min-height:44px}
dialog{max-width:min(520px,calc(100% - 32px));margin:auto;background:var(--br);color:var(--cr);border:1px solid var(--mu);border-radius:10px;padding:26px}
dialog::backdrop{background:rgba(0,0,0,.6)}
dialog h2{font-size:30px}dialog p{margin-bottom:12px;font-size:15px}
@media(min-width:760px){
 .od-grid{grid-template-columns:1fr 1fr;gap:56px}
 .promo-grid{grid-template-columns:repeat(3,1fr)}
 .hero{background-position:center 30%}
}
