/* Casa Peppe — casapeppe.com. Built on the Casa Peppe Design System. */
@font-face{font-family:"Suffragette";src:url("../fonts/Suffragette-Regular.otf") format("opentype");font-weight:400;font-display:swap}
@font-face{font-family:"Gotham";src:url("../fonts/Gotham-Black.otf") format("opentype");font-weight:900;font-display:swap}
@font-face{font-family:"Zapfino Forte";src:url("../fonts/ZapfinoForteLTPro.otf") format("opentype");font-weight:400;font-display:swap}
@font-face{font-family:"Palatino Nova";src:url("../fonts/PalatinoNova-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Palatino Nova";src:url("../fonts/PalatinoNova-Italic.ttf") format("truetype");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Palatino Nova";src:url("../fonts/PalatinoNova-Bold.ttf") format("truetype");font-weight:700;font-display:swap}

:root{
--terracotta:#D46A4F;--rosso:#A73223;--crema:#F6DEA2;--oliva:#AEA168;--arancio:#FD8A2D;
--sabbia:#CEB392;--mattone:#79301F;--vino:#490013;--blu:#2A3D98;--latte:#EDF2EE;--nero:#1C1410;
--hair:rgba(167,50,35,.35);--hair-dark:rgba(246,222,162,.35);
--f-display:"Suffragette","Cormorant Garamond",serif;
--f-label:"Gotham","Montserrat",sans-serif;
--f-script:"Zapfino Forte","Pinyon Script",cursive;
--f-body:"Palatino Nova","Palatino Linotype","Book Antiqua",Palatino,serif;
--m:clamp(20px,4vw,56px);--max:1280px;--r:32px;
--ease:cubic-bezier(.22,.61,.36,1);--header:84px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 64px)}
body{margin:0;background:var(--crema);color:var(--rosso);font-family:var(--f-body);font-size:18px;line-height:1.4;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:4px}
a:hover{text-decoration-thickness:2px}
p{margin:0;text-wrap:pretty}
h1,h2,h3,h4{margin:0;font-weight:400}
:focus-visible{outline:2px solid var(--arancio);outline-offset:3px}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;z-index:100;background:var(--crema);padding:8px 12px}

/* type */
.display{font-family:var(--f-display);text-transform:uppercase;line-height:.9;letter-spacing:0}
.d-xl{font-size:clamp(64px,11vw,184px)}.d-l{font-size:clamp(48px,7vw,112px)}.d-m{font-size:clamp(40px,4.6vw,64px)}.d-s{font-size:clamp(32px,3vw,44px)}
.eyebrow{font-family:var(--f-label);font-weight:900;text-transform:uppercase;letter-spacing:.16em;font-size:12px;line-height:1.2}
.eyebrow.lg{font-size:15px}
.script{font-family:var(--f-script);line-height:1.5;text-transform:none}
.lead{font-size:clamp(22px,2.4vw,32px);line-height:1.25}
.body-l{font-size:20px;line-height:1.45}
.italic{font-style:italic}
.on-dark{color:var(--crema)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--f-label);font-weight:900;text-transform:uppercase;letter-spacing:.16em;font-size:12px;line-height:1;padding:15px 24px;border:1.5px solid var(--rosso);background:var(--rosso);color:var(--crema);text-decoration:none;cursor:pointer;transition:background .32s var(--ease),color .32s var(--ease),border-color .32s var(--ease)}
.btn:hover{background:var(--mattone);border-color:var(--mattone);text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn.outline{background:transparent;color:var(--rosso)}.btn.outline:hover{background:var(--rosso);color:var(--crema)}
.btn.sm{padding:11px 16px;font-size:10px}
.btn.lg{padding:18px 32px;font-size:13px}
.dark .btn,.btn.dk{background:var(--crema);border-color:var(--crema);color:var(--rosso)}
.dark .btn:hover,.btn.dk:hover{background:var(--arancio);border-color:var(--arancio)}
.dark .btn.outline,.btn.dk.sec{background:transparent;color:var(--crema)}
.dark .btn.outline:hover,.btn.dk.sec:hover{background:var(--crema);color:var(--rosso)}
.tlink{font-family:var(--f-label);font-weight:900;text-transform:uppercase;letter-spacing:.16em;font-size:12px;text-decoration:underline;text-underline-offset:6px}
.btns{display:flex;gap:14px;flex-wrap:wrap;align-items:center}

/* ticket notch */
.ticket{-webkit-mask:radial-gradient(circle at 0 0,#0000 var(--r),#000 calc(var(--r) + .5px)) 0 0/51% 51% no-repeat,radial-gradient(circle at 100% 0,#0000 var(--r),#000 calc(var(--r) + .5px)) 100% 0/51% 51% no-repeat,radial-gradient(circle at 0 100%,#0000 var(--r),#000 calc(var(--r) + .5px)) 0 100%/51% 51% no-repeat,radial-gradient(circle at 100% 100%,#0000 var(--r),#000 calc(var(--r) + .5px)) 100% 100%/51% 51% no-repeat;mask:radial-gradient(circle at 0 0,#0000 var(--r),#000 calc(var(--r) + .5px)) 0 0/51% 51% no-repeat,radial-gradient(circle at 100% 0,#0000 var(--r),#000 calc(var(--r) + .5px)) 100% 0/51% 51% no-repeat,radial-gradient(circle at 0 100%,#0000 var(--r),#000 calc(var(--r) + .5px)) 0 100%/51% 51% no-repeat,radial-gradient(circle at 100% 100%,#0000 var(--r),#000 calc(var(--r) + .5px)) 100% 100%/51% 51% no-repeat}
.ticket.photo{background:center/cover no-repeat;aspect-ratio:4/5}
.ticket.photo img{width:100%;height:100%;object-fit:cover}
.shadow{filter:drop-shadow(0 18px 22px rgba(28,20,16,.35))}

/* header */
.hdr{position:sticky;top:0;z-index:50;height:var(--header);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 var(--m);background:var(--crema);border-bottom:1px solid var(--hair);transition:background .32s var(--ease),border-color .32s var(--ease)}
.hdr .brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.hdr .brand img{height:40px;width:auto}.hdr .brand img.wm{height:30px}
.hdr .lt{display:none}
.hdr nav{display:flex;align-items:center;gap:26px}
.hdr nav a.nl{font-family:var(--f-label);font-weight:900;text-transform:uppercase;letter-spacing:.14em;font-size:11px;text-decoration:none;opacity:.78;padding:4px 0;border-bottom:1.5px solid transparent}
.hdr nav a.nl:hover,.hdr nav a.nl[aria-current]{opacity:1;border-bottom-color:currentColor}
.lang{font-family:var(--f-label);font-weight:900;font-size:11px;letter-spacing:.14em;display:flex;gap:6px}
.lang a{text-decoration:none;opacity:.55}.lang a[aria-current]{opacity:1}
.burger{display:none;background:none;border:0;color:inherit;cursor:pointer;padding:8px;font-family:var(--f-label);font-weight:900;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
body.over .hdr:not(.solid){background:transparent;border-bottom-color:transparent;color:var(--crema)}
body.over .hdr:not(.solid) .dk-logo{display:none}body.over .hdr:not(.solid) .lt{display:block}
body.over .hdr:not(.solid) .btn{background:var(--crema);border-color:var(--crema);color:var(--rosso)}
body.over main{margin-top:calc(var(--header) * -1)}
@media (max-width:1080px){
 :root{--header:108px}
 .hdr{flex-wrap:wrap;height:var(--header);align-content:center;row-gap:6px;column-gap:16px;padding-top:8px;padding-bottom:0}
 .hdr .brand img{height:34px}.hdr .brand img.wm{height:24px}
 .hdr nav{order:3;width:calc(100% + var(--m) * 2);margin:0 calc(var(--m) * -1);padding:0 var(--m) 6px;gap:20px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .hdr nav::-webkit-scrollbar{display:none}
 .hdr nav a.nl{white-space:nowrap;padding:8px 0}
 .hdr nav .lang{white-space:nowrap}
 .hdr nav .btn{white-space:nowrap;flex:none}
}
.burger{display:none!important}

/* sections */
.sec{padding:clamp(72px,9vw,128px) var(--m)}
.wrap{max-width:var(--max);margin:0 auto}
.bg-rosso{background:var(--rosso);color:var(--crema)}
.bg-crema{background:var(--crema);color:var(--rosso)}
.bg-oliva{background:var(--oliva);color:var(--crema)}
.bg-latte{background:var(--latte);color:var(--vino)}
.bg-vino{background:var(--vino);color:var(--crema)}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:clamp(32px,5vw,72px);align-items:start}
.split.center{align-items:center}
.stack{display:flex;flex-direction:column;gap:22px}
.stack.sm{gap:12px}
.measure{max-width:620px}
.photo-bg{position:relative;background:center/cover no-repeat;isolation:isolate}
.photo-bg::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--scrim,rgba(28,20,16,.3))}

/* hero */
.hero{min-height:min(94vh,900px);display:flex;flex-direction:column;justify-content:flex-end;padding:calc(var(--header) + 48px) var(--m) clamp(32px,4vw,56px);--scrim:linear-gradient(180deg,rgba(28,20,16,.5),rgba(28,20,16,.28) 35%,rgba(28,20,16,.6))}
.hero .wm{width:100%;max-width:1160px;height:auto}
.hero-foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;margin-top:28px}
.page-hero{min-height:min(70vh,640px);display:flex;align-items:flex-end;padding:calc(var(--header) + 48px) var(--m) clamp(40px,5vw,72px);--scrim:linear-gradient(180deg,rgba(28,20,16,.3),rgba(28,20,16,0) 35%,rgba(28,20,16,.55))}
.page-title{padding:clamp(56px,7vw,96px) var(--m) clamp(32px,4vw,48px);text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px}

/* pillars */
.pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:24px}
.pillar{display:flex;flex-direction:column;gap:18px}
.pillar .cap{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}

/* menu */
.catnav{position:sticky;top:var(--header);z-index:30;background:var(--crema);border-bottom:1px solid var(--hair);overflow-x:auto;scrollbar-width:none}
.catnav::-webkit-scrollbar{display:none}
.catnav ul{list-style:none;margin:0 auto;padding:0 var(--m);display:flex;gap:28px;max-width:var(--max);justify-content:safe center}
.catnav a{display:block;white-space:nowrap;padding:18px 0 14px;font-family:var(--f-label);font-weight:900;font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;opacity:.6;border-bottom:2px solid transparent}
.catnav a:hover,.catnav a.on{opacity:1;border-bottom-color:currentColor}
.mcat{padding:clamp(56px,7vw,96px) var(--m)}
.mcat.alt{background:var(--latte);color:var(--vino)}
.mcat.alt .spirit{border-bottom-color:rgba(73,0,19,.2)}
.mcat-head{max-width:var(--max);margin:0 auto 40px;display:flex;align-items:baseline;gap:16px;flex-wrap:wrap}
.mcat-head .script{font-size:clamp(26px,3vw,40px)}
.mcat-head .note{margin-left:auto;font-style:italic;font-size:16px}
.mgrid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));column-gap:clamp(32px,6vw,96px);row-gap:28px}
.mgrid.compact{row-gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.mi{display:grid;grid-template-columns:1fr auto;column-gap:20px;row-gap:4px;align-items:baseline}
.mi .n{font-family:var(--f-label);font-weight:900;text-transform:uppercase;letter-spacing:.06em;font-size:13px;line-height:1.35}
.mi .p{font-style:italic;font-size:16px;white-space:nowrap;text-align:right}
.mi .d{grid-column:1/-1;font-size:16px;line-height:1.4;max-width:520px}
.mi .p small{display:block;font-size:13px;opacity:.85}
.mgroup{max-width:var(--max);margin:0 auto 36px}
.mgroup h3{font-style:italic;font-size:24px;margin:0 0 18px;padding-bottom:8px;border-bottom:1px solid currentColor;opacity:.95}
.extras{max-width:var(--max);margin:40px auto 0;padding-top:24px;border-top:1px solid currentColor}
.mi-head{display:grid;grid-template-columns:1fr auto;max-width:var(--max);margin:0 auto 16px}
.cols3{display:grid;grid-template-columns:repeat(3,64px);gap:8px;text-align:right}
.spirit{display:grid;grid-template-columns:1fr repeat(3,64px);gap:8px;align-items:baseline;padding:6px 0;border-bottom:1px solid var(--hair)}
.spirit .p{font-style:italic;font-size:15px;text-align:right}
.spirit-head{font-family:var(--f-label);font-weight:900;font-size:10px;letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:8px}
.price-note{max-width:var(--max);margin:0 auto;padding:32px var(--m) 0;font-style:italic;font-size:15px;text-align:center}

/* info */
.hours{width:100%;border-collapse:collapse;font-size:17px}
.hours td{padding:10px 0;border-bottom:1px solid var(--hair)}
.dark .hours td,.bg-rosso .hours td{border-bottom-color:var(--hair-dark)}
.hours td:last-child{text-align:right;font-style:italic}
.map{width:100%;aspect-ratio:4/3;border:0;filter:sepia(.35) saturate(.85)}

/* gallery */
.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));grid-auto-flow:dense;gap:16px}
.gal button{padding:0;border:0;background:none;cursor:zoom-in;display:block;aspect-ratio:4/5;overflow:hidden}
.gal button.wide{grid-column:span 2;aspect-ratio:auto}
@media (max-width:640px){.gal button.wide{grid-column:auto;aspect-ratio:4/5}}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.gal button:hover img{transform:scale(1.03)}
.lightbox{position:fixed;inset:0;z-index:90;background:rgba(28,20,16,.92);display:none;align-items:center;justify-content:center;padding:24px}
.lightbox.open{display:flex}
.lightbox img{max-height:88vh;max-width:92vw;object-fit:contain}
.lightbox button{position:absolute;top:18px;right:22px;background:none;border:0;color:var(--crema);font-family:var(--f-label);font-weight:900;letter-spacing:.16em;font-size:11px;cursor:pointer;padding:10px}

/* pattern band */
.pattern{position:relative;overflow:hidden;--scrim:rgba(28,20,16,.6)}
.pattern::after{content:"";position:absolute;inset:0;z-index:-1;background:url(../img/logos/illustration-cream.png) 0 0/72px auto space;opacity:.9}
.cta-box{position:relative;background:var(--rosso);color:var(--crema);padding:clamp(32px,4vw,48px);display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center;max-width:520px;margin:0 auto}


/* footer */
.ftr{background:var(--rosso);color:var(--crema);padding:72px var(--m) 32px}
.ftr-grid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px;align-items:start}
.ftr-grid .stack{gap:10px}
.ftr a{text-decoration:none}.ftr a:hover{text-decoration:underline}
.ftr-bottom{max-width:var(--max);margin:56px auto 0;padding-top:24px;border-top:1px solid var(--hair-dark);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:14px}
.sig{display:flex;align-items:center;gap:14px}
.sig img{height:38px;width:auto}
.sig .script{font-size:18px;line-height:1}
.sig b{font-size:14px;letter-spacing:.02em}

.reveal{opacity:0;transform:translateY(16px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

.band{height:clamp(260px,38vw,520px);background:center/cover no-repeat}