
@font-face {
  font-family:'Cormorant Garamond';
  font-style:italic;
  font-weight:300;
  font-display:swap;
  src:url('../fonts/cormorant-garamond-italic-300.ttf') format('truetype');
}
@font-face {
  font-family:'Cormorant Garamond';
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url('../fonts/cormorant-garamond-italic-400.ttf') format('truetype');
}
@font-face {
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:300;
  font-display:swap;
  src:url('../fonts/cormorant-garamond-300.ttf') format('truetype');
}
@font-face {
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('../fonts/cormorant-garamond-400.ttf') format('truetype');
}
@font-face {
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('../fonts/cormorant-garamond-600.ttf') format('truetype');
}
@font-face {
  font-family:'Raleway';
  font-style:normal;
  font-weight:200;
  font-display:swap;
  src:url('../fonts/raleway-200.ttf') format('truetype');
}
@font-face {
  font-family:'Raleway';
  font-style:normal;
  font-weight:300;
  font-display:swap;
  src:url('../fonts/raleway-300.ttf') format('truetype');
}
@font-face {
  font-family:'Raleway';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('../fonts/raleway-400.ttf') format('truetype');
}
@font-face {
  font-family:'Raleway';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('../fonts/raleway-500.ttf') format('truetype');
}

/* ── TOKENS ─────────────────────────────── */
:root {
  --gold:        #c9a35a;
  --gold-lt:     #ddb96a;
  --gold-dim:    rgba(201,163,90,.12);
  --gold-line:   rgba(201,163,90,.22);
  --dark:        #080807;
  --dark-2:      #0d0c0a;
  --dark-3:      #131210;
  --dark-4:      #1a1815;
  --text:        #eeebe5;
  --text-muted:  #96918b;
  --text-dim:    #524e4a;
  --sub:         rgba(255,255,255,.055);
  --ease:        cubic-bezier(.25,.46,.45,.94);
  --ease-out:    cubic-bezier(.16,1,.3,1);
}

/* ── RESET ───────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth }
body { font-family:'Raleway',sans-serif; background:var(--dark); color:var(--text); overflow-x:hidden; cursor:none }
img { display:block; max-width:100% }

/* ── CURSOR ──────────────────────────────── */
.cur,.cur-f { position:fixed; pointer-events:none; z-index:9999; border-radius:50%; transform:translate(-50%,-50%) }
.cur   { width:6px; height:6px; background:var(--gold); transition:transform .14s ease, opacity .3s }
.cur-f { width:28px; height:28px; border:1px solid rgba(201,163,90,.4); z-index:9998;
          transition:left .42s var(--ease), top .42s var(--ease), border-color .3s }

/* ── NAV ─────────────────────────────────── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  padding:28px 6%; display:flex; align-items:center; justify-content:space-between;
  transition:background .5s, padding .5s, box-shadow .5s;
}
nav.scrolled {
  background:rgba(8,8,7,.94); backdrop-filter:blur(20px);
  padding:16px 6%; border-bottom:1px solid var(--sub);
}
.nav-logo {
  font-family:'Raleway',sans-serif; font-weight:300; letter-spacing:9px;
  font-size:11px; color:var(--gold); text-decoration:none; text-transform:uppercase;
  transition:opacity .3s;
}
.nav-logo:hover { opacity:.6 }
.nav-links { display:flex; gap:34px; list-style:none }
.nav-links a {
  font-weight:300; font-size:10px; letter-spacing:4px; text-transform:uppercase;
  color:var(--text-muted); text-decoration:none; position:relative; transition:color .3s;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-3px; left:0; width:0; height:1px;
  background:var(--gold); transition:width .35s var(--ease);
}
.nav-links a:hover { color:var(--gold) }
.nav-links a:hover::after { width:100% }
.nav-cta {
  font-weight:300; font-size:10px; letter-spacing:4px; text-transform:uppercase;
  color:var(--gold); text-decoration:none; padding:10px 20px;
  border:1px solid var(--gold-line); transition:background .3s, color .3s;
}
.nav-cta:hover { background:var(--gold-dim) }

/* hamburger */
.ham { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px }
.ham span { width:22px; height:1px; background:var(--text-muted); display:block; transition:transform .4s var(--ease),opacity .3s }
.ham.open span:nth-child(1) { transform:rotate(45deg) translate(4px,4px) }
.ham.open span:nth-child(2) { opacity:0 }
.ham.open span:nth-child(3) { transform:rotate(-45deg) translate(4px,-4px) }
.mob-menu {
  display:none; position:fixed; inset:0; background:var(--dark); z-index:190;
  flex-direction:column; align-items:center; justify-content:center; gap:44px;
  opacity:0; transition:opacity .4s;
}
.mob-menu.open { display:flex; opacity:1 }
.mob-menu a {
  font-family:'Cormorant Garamond',serif; font-size:36px; font-weight:300;
  letter-spacing:3px; color:var(--text); text-decoration:none; transition:color .3s;
}
.mob-menu a:hover { color:var(--gold) }

/* ── HERO ────────────────────────────────── */
.hero { height:100vh; min-height:680px; position:relative; display:flex; align-items:flex-end; overflow:hidden }
.hero-img {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transform:scale(1.06); transition:transform 9s var(--ease-out);
}
.hero-img.loaded { transform:scale(1) }
.hero-over {
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,8,7,.25) 0%, rgba(8,8,7,.1) 35%, rgba(8,8,7,.78) 85%, rgba(8,8,7,.95) 100%);
}
/* decorative vertical lines */
.hero-lines { position:absolute; inset:0; pointer-events:none }
.hero-lines::before,.hero-lines::after {
  content:''; position:absolute; top:0; bottom:0; width:1px;
  background:linear-gradient(180deg,transparent 0%,var(--gold-line) 50%,transparent 100%);
  opacity:.35;
}
.hero-lines::before { left:6% }
.hero-lines::after  { right:6% }

.hero-content { position:relative; z-index:2; padding:0 6% 10vh; max-width:820px }
.hero-eye {
  display:flex; align-items:center; gap:14px; margin-bottom:22px;
  opacity:0; transform:translateY(16px);
  animation:fadeUp .9s var(--ease) .25s forwards;
}
.hero-eye::before { content:''; width:32px; height:1px; background:var(--gold); display:block }
.hero-eye span { font-size:9px; letter-spacing:7px; text-transform:uppercase; color:var(--gold) }

.hero h1 {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(56px,10vw,120px); line-height:.93; letter-spacing:2px;
  color:var(--text); margin-bottom:30px;
  opacity:0; transform:translateY(30px);
  animation:fadeUp 1.2s var(--ease) .45s forwards;
}
.hero h1 em { font-style:italic; color:var(--gold-lt) }

.hero-sub {
  font-weight:300; font-size:14px; letter-spacing:1.5px;
  color:var(--text-muted); max-width:420px; line-height:1.95;
  opacity:0; transform:translateY(14px);
  animation:fadeUp .9s var(--ease) .75s forwards;
  margin-bottom:40px;
}

/* hero CTA */
.hero-ctas {
  display:flex; gap:14px; flex-wrap:wrap;
  opacity:0; transform:translateY(14px);
  animation:fadeUp .9s var(--ease) 1s forwards;
}
.btn-hero {
  font-weight:300; font-size:10px; letter-spacing:4px; text-transform:uppercase;
  text-decoration:none; padding:14px 30px; transition:background .35s, color .35s, border-color .35s;
  position:relative; overflow:hidden;
}
.btn-hero-solid {
  background:var(--gold); color:var(--dark); border:1px solid var(--gold);
}
.btn-hero-solid:hover { background:var(--gold-lt); border-color:var(--gold-lt) }
.btn-hero-ghost {
  color:var(--text-muted); border:1px solid var(--sub);
}
.btn-hero-ghost:hover { border-color:var(--gold-line); color:var(--gold) }

/* scroll indicator */
.hero-scroll {
  position:absolute; bottom:36px; right:6%; z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:9px;
  opacity:0; animation:fadeIn .8s ease 1.6s forwards;
}
.hero-scroll span { font-size:8px; letter-spacing:5px; text-transform:uppercase; color:var(--text-dim); writing-mode:vertical-rl }
.scroll-line { width:1px; height:52px; background:linear-gradient(180deg,var(--gold),transparent); animation:pulse 2.4s ease-in-out infinite }

/* ── LAYOUT TOKENS ───────────────────────── */
.si { max-width:1300px; margin:0 auto; padding:120px 6% }
.si.narrow { max-width:860px }
.label {
  display:inline-flex; align-items:center; gap:12px;
  font-size:9px; letter-spacing:7px; text-transform:uppercase;
  color:var(--gold); margin-bottom:40px;
}
.label::before { content:''; width:24px; height:1px; background:var(--gold); display:block }
.hdivider { width:32px; height:1px; background:var(--gold); opacity:.55; margin:26px 0 }

/* ── STATUS PILL ─────────────────────────── */
.status-pill {
  display:inline-flex; align-items:center; gap:9px;
  padding:8px 18px; border:1px solid var(--sub);
  font-size:9px; letter-spacing:4px; text-transform:uppercase;
  color:var(--text-muted); margin-bottom:52px;
}
.s-dot { width:7px; height:7px; border-radius:50%; background:#3a3835; flex-shrink:0; transition:background .4s, box-shadow .4s }
.s-dot.open   { background:var(--gold); box-shadow:0 0 7px var(--gold) }
.s-dot.closed { background:#3a3835 }

/* ── SECTION SEPARATORS ──────────────────── */
.sep { position:absolute; left:6%; right:6%; height:1px; background:linear-gradient(90deg,transparent,var(--gold-line),transparent) }
.sep.top { top:0 } .sep.bot { bottom:0 }

/* ── STORY — alternated layout ───────────── */
.story {
  display:grid; grid-template-columns:1fr 1fr;
  gap:90px; align-items:center;
}
.story-text h2 {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(34px,3.8vw,52px); line-height:1.12; letter-spacing:1px;
  margin-bottom:0;
}
.story-text h2 em { font-style:italic; color:var(--gold-lt) }
.story-text p {
  font-weight:300; font-size:14.5px; line-height:2.1;
  color:var(--text-muted); max-width:480px; margin-bottom:0;
}
.story-frame { overflow:hidden; position:relative; background:var(--dark-3) }
.story-frame img {
  width:100%; height:100%; object-fit:cover;
  opacity:.78; transition:transform .9s var(--ease), opacity .5s;
}
.story-frame:hover img { transform:scale(1.04); opacity:.92 }
.story-frame::after { content:''; position:absolute; inset:0; border:1px solid var(--gold-line); pointer-events:none }
.story-deco {
  position:absolute; bottom:-24px; right:-12px;
  font-family:'Cormorant Garamond',serif; font-size:180px;
  font-weight:300; color:var(--gold); opacity:.04; line-height:1; pointer-events:none; user-select:none;
}

/* ── MANIFESTO (testo centrato, tra storia e menu) ── */
.manifesto {
  text-align:center; padding:80px 6%;
  border-top:1px solid var(--sub); border-bottom:1px solid var(--sub);
  background:var(--dark);
}
.manifesto blockquote {
  font-family:'Cormorant Garamond',serif; font-weight:300; font-style:italic;
  font-size:clamp(22px,2.8vw,34px); line-height:1.55; letter-spacing:.5px;
  color:var(--text); max-width:760px; margin:0 auto;
}
.manifesto blockquote em { color:var(--gold-lt); font-style:normal }

/* ── MENU ────────────────────────────────── */
.menu-card { border:1px solid var(--gold-line); padding:52px; background:var(--dark-2); position:relative }
.menu-card::before { content:''; position:absolute; top:0; left:0; width:52px; height:2px; background:var(--gold) }
.menu-card::after  { content:''; position:absolute; bottom:0; right:0; width:52px; height:2px; background:var(--gold) }
.menu-card h2 { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:38px; letter-spacing:2px; margin-bottom:10px }
.menu-card > p { font-weight:300; color:var(--text-muted); font-size:14px; margin-bottom:30px; line-height:1.85 }
.pdf-wrap { border-top:1px solid var(--sub); padding-top:28px; position:relative }
.pdf-shield {
  position:absolute; inset:0; z-index:10;
  background:transparent; pointer-events:all;
  user-select:none; -webkit-user-select:none;
}
.pdf-wrap iframe { width:100%; height:640px; border:none; display:block; pointer-events:none }

/* ── OFFERING SECTIONS ───────────────────── */
.off-a { background:var(--dark-2) }
.off-b { background:var(--dark) }

/* alternated: text-left / image-right and vice versa */
.off-split {
  display:grid; grid-template-columns:1fr 1fr;
  gap:80px; align-items:center;
}
.off-split.reverse { direction:rtl }
.off-split.reverse > * { direction:ltr }

.off-text h2 {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(30px,3.8vw,50px); line-height:1.1; letter-spacing:2px; margin-bottom:20px;
}
.off-text p {
  font-weight:300; font-size:14.5px; line-height:2.1;
  color:var(--text-muted); max-width:440px;
}

/* gallery grids */
.g1   { display:grid; grid-template-columns:1fr; gap:10px }
.g2   { display:grid; grid-template-columns:repeat(2,1fr); gap:10px }
.g3   { display:grid; grid-template-columns:repeat(3,1fr); gap:10px }
.g3f  { display:grid; grid-template-columns:2fr 1fr 1fr; grid-template-rows:auto auto; gap:10px }
.g3f .gi:first-child { grid-row:1/3 }
.g4   { display:grid; grid-template-columns:repeat(4,1fr); gap:10px }

.gi {
  overflow:hidden; position:relative;
  aspect-ratio:4/3; background:var(--dark-3); cursor:zoom-in;
}
.g3f .gi:first-child { aspect-ratio:unset }
.gi img {
  width:100%; height:100%; object-fit:cover;
  opacity:.72; transition:transform .8s var(--ease), opacity .5s;
  display:block;
}
.gi:hover img { transform:scale(1.06); opacity:.9 }

/* full-width single image strip */
.img-strip { width:100%; overflow:hidden; position:relative }
.img-strip img { width:100%; height:460px; object-fit:cover; opacity:.72; transition:opacity .5s }
.img-strip:hover img { opacity:.88 }

/* ── LIGHTBOX ────────────────────────────── */
.lb {
  position:fixed; inset:0; z-index:500;
  background:rgba(8,8,7,.96); backdrop-filter:blur(12px);
  display:none; align-items:center; justify-content:center;
  padding:5vw;
}
.lb.open { display:flex }
.lb img { max-width:90vw; max-height:90vh; object-fit:contain; border:1px solid var(--sub) }
.lb-close {
  position:absolute; top:28px; right:32px;
  font-size:28px; color:var(--text-muted); cursor:pointer;
  transition:color .3s; background:none; border:none; line-height:1;
}
.lb-close:hover { color:var(--gold) }
.lb-nav {
  position:absolute; top:50%; transform:translateY(-50%);
  background:none; border:1px solid var(--sub); color:var(--text-muted);
  font-size:18px; padding:14px 18px; cursor:pointer; transition:border-color .3s, color .3s;
}
.lb-nav:hover { border-color:var(--gold-line); color:var(--gold) }
.lb-prev { left:28px }
.lb-next { right:28px }

/* ── REVIEWS ─────────────────────────────── */
.rev-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px }
.rev-card {
  border:1px solid var(--sub); padding:40px; background:var(--dark-3);
  position:relative; transition:border-color .4s;
}
.rev-card:hover { border-color:var(--gold-line) }
.rev-card::before {
  content:'"'; position:absolute; top:16px; left:26px;
  font-family:'Cormorant Garamond',serif; font-size:68px;
  line-height:1; color:var(--gold); opacity:.13;
}
.stars { display:flex; gap:3px; margin-bottom:14px }
.star  { color:var(--gold); font-size:11px }
.rev-text {
  font-family:'Cormorant Garamond',serif; font-size:19px;
  font-weight:300; font-style:italic; color:var(--text); line-height:1.65;
}

/* ── CONTACTS ────────────────────────────── */
.contacts-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start }
.contacts-grid h2 {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:38px; letter-spacing:2px; margin-bottom:26px;
}
.info-block { margin-bottom:32px }
.info-block h3 {
  font-weight:300; font-size:9px; letter-spacing:5px;
  text-transform:uppercase; color:var(--gold); margin-bottom:10px;
}
.info-block p { font-weight:300; font-size:14px; color:var(--text-muted); line-height:2 }
.hours-grid {
  display:grid; grid-template-columns:auto 1fr;
  gap:2px 22px; font-weight:300; font-size:13.5px;
  color:var(--text-muted); line-height:2.1;
}
.hours-grid .day { color:var(--text-dim); letter-spacing:.5px }
.hours-grid .chiuso { color:var(--text-dim); opacity:.45 }
.msg-label {
  display:block; font-size:9px; letter-spacing:4px;
  text-transform:uppercase; color:var(--text-dim); margin-bottom:10px;
}
.msg-area {
  width:100%; background:var(--dark-3); border:1px solid var(--sub);
  color:var(--text); font-family:'Raleway',sans-serif; font-weight:300;
  font-size:14px; line-height:1.85; padding:18px;
  resize:vertical; min-height:130px; outline:none;
  transition:border-color .3s; margin-bottom:8px;
}
.msg-area:focus { border-color:var(--gold-line) }
.msg-area::placeholder { color:var(--text-dim) }
.msg-hint { font-size:11px; color:var(--text-dim); margin-bottom:20px; letter-spacing:.5px }
.soc-row { display:flex; gap:10px; flex-wrap:wrap; margin-top:28px }
.map-wrap { height:270px; overflow:hidden; border:1px solid var(--sub); margin:24px 0 }
.map-wrap iframe { width:100%; height:100%; border:none; filter:invert(.87) hue-rotate(180deg) brightness(.74) saturate(.5); opacity:.68 }

/* ── BUTTONS ─────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:9px;
  padding:13px 26px; border:1px solid var(--gold-line);
  color:var(--gold); text-decoration:none;
  font-size:10px; letter-spacing:3px; text-transform:uppercase;
  font-weight:300; transition:background .3s, border-color .3s;
  position:relative; overflow:hidden;
}
.btn::before {
  content:''; position:absolute; inset:0;
  background:var(--gold-dim); transform:scaleX(0); transform-origin:left;
  transition:transform .35s var(--ease);
}
.btn:hover::before { transform:scaleX(1) }
.btn span { position:relative; z-index:1 }
.btn svg  { position:relative; z-index:1 }
.btn-solid { background:var(--gold); color:var(--dark); border-color:var(--gold) }
.btn-solid::before { background:var(--gold-lt) }
.btn-solid:hover { color:var(--dark) }

/* ── FOOTER ──────────────────────────────── */
footer {
  background:var(--dark-2); border-top:1px solid var(--sub);
  padding:56px 6% 36px;
  display:flex; align-items:flex-start; justify-content:space-between;
  flex-wrap:wrap; gap:32px;
}
.footer-brand { font-weight:300; font-size:11px; letter-spacing:9px; color:var(--gold); text-transform:uppercase }
.footer-brand small { display:block; font-size:10px; letter-spacing:3px; color:var(--text-dim); margin-top:6px }
.footer-copy { font-weight:300; font-size:10px; letter-spacing:2px; color:var(--text-dim); align-self:flex-end }

/* ── ANIMATIONS ──────────────────────────── */
@keyframes fadeUp  { from { opacity:0; transform:translateY(28px) } to { opacity:1; transform:none } }
@keyframes fadeIn  { from { opacity:0 } to { opacity:1 } }
@keyframes pulse   { 0%,100% { opacity:.35 } 50% { opacity:1 } }

.rv   { opacity:0; transform:translateY(32px); transition:opacity .85s ease, transform .85s ease }
.rv-l { opacity:0; transform:translateX(-36px); transition:opacity .9s ease, transform .9s ease }
.rv-r { opacity:0; transform:translateX(36px);  transition:opacity .9s ease, transform .9s ease }
.rv.on, .rv-l.on, .rv-r.on { opacity:1; transform:none }
.d1 { transition-delay:.08s } .d2 { transition-delay:.18s }
.d3 { transition-delay:.28s } .d4 { transition-delay:.38s }

/* ── RESPONSIVE ──────────────────────────── */
@media(max-width:1024px) {
  .story { grid-template-columns:1fr; gap:52px }
  .story-frame { max-width:460px }
  .off-split { grid-template-columns:1fr; gap:48px }
  .off-split.reverse { direction:ltr }
  .contacts-grid { grid-template-columns:1fr; gap:56px }
  .g3f { grid-template-columns:1fr 1fr }
  .g3f .gi:first-child { grid-column:1/3; grid-row:auto; aspect-ratio:16/9 }
  .g4 { grid-template-columns:repeat(2,1fr) }
}
@media(max-width:768px) {
  .nav-links,.nav-cta { display:none }
  .ham { display:flex }
  .si { padding:80px 6% }
  .hero-ctas { flex-direction:column; align-items:flex-start }
  .g3f,.g3 { grid-template-columns:1fr }
  .g3f .gi:first-child { grid-column:auto; grid-row:auto; aspect-ratio:4/3 }
  .g2,.g4,.rev-grid { grid-template-columns:1fr }
  .menu-card { padding:28px 20px }
  .manifesto { padding:60px 6% }
  .img-strip img { height:300px }
  .lb-nav { display:none }
}

::-webkit-scrollbar { width:3px }
::-webkit-scrollbar-track { background:var(--dark) }
::-webkit-scrollbar-thumb { background:var(--gold) }
::selection { background:var(--gold); color:var(--dark) }

/* Language selector */
.lang-switch {
  position:fixed;
  top:88px;
  right:6%;
  z-index:210;
  display:inline-flex;
  align-items:center;
  border:1px solid var(--gold-line);
  background:rgba(8,8,7,.72);
  backdrop-filter:blur(14px);
  transition:top .45s var(--ease), background .3s, border-color .3s;
}
nav.scrolled ~ .lang-switch,
body:has(nav.scrolled) > .lang-switch {
  top:68px;
}
.lang-switch select {
  appearance:none;
  background:transparent;
  border:0;
  color:var(--gold);
  cursor:pointer;
  font-family:'Raleway',sans-serif;
  font-weight:300;
  font-size:10px;
  letter-spacing:3px;
  text-transform:uppercase;
  padding:10px 30px 10px 14px;
  outline:none;
}
.lang-switch::after {
  content:'';
  position:absolute;
  right:12px;
  top:50%;
  width:6px;
  height:6px;
  border-right:1px solid var(--gold);
  border-bottom:1px solid var(--gold);
  transform:translateY(-65%) rotate(45deg);
  pointer-events:none;
}
.lang-switch option {
  background:var(--dark);
  color:var(--text);
}
@media(max-width:760px) {
  .lang-switch {
    top:74px;
    right:18px;
  }
  body:has(nav.scrolled) > .lang-switch {
    top:62px;
  }
}

/* Harmonized service galleries */
.g1,
.g2,
.g3,
.g3f,
.g4 {
  gap:14px;
}
.g2 {
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.g3f {
  grid-template-columns:1.24fr .88fr .88fr;
  grid-auto-rows:minmax(190px,1fr);
}
.g3f .gi:first-child {
  grid-row:1/3;
}
.gi,
.img-strip {
  border:1px solid var(--sub);
  background:var(--dark-3);
}
.gi {
  aspect-ratio:5/4;
  min-height:0;
}
.g2 .gi {
  aspect-ratio:4/5;
}
.g3f .gi:first-child {
  aspect-ratio:auto;
}
.gi::after,
.img-strip::after {
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  border:1px solid rgba(201,163,90,.08);
  background:linear-gradient(180deg,rgba(8,8,7,0) 42%,rgba(8,8,7,.18) 100%);
}
.gi img,
.img-strip img {
  opacity:.76;
  filter:saturate(.92) contrast(1.03);
}
.gi:hover img,
.img-strip:hover img {
  opacity:.92;
}
.img-strip {
  width:min(1180px,88%);
  margin:0 auto;
  aspect-ratio:21/8;
}
.img-strip img {
  height:100%;
}
#sala .g3f {
  grid-template-columns:1.12fr .94fr .94fr;
}
#sala .g3f .gi:first-child {
  min-height:430px !important;
}
#eventi .g2,
#aperitivi .g2,
#birreria .g2 {
  align-items:stretch;
}
@media(max-width:1024px) {
  .g3f {
    grid-template-columns:1fr 1fr;
    grid-auto-rows:auto;
  }
  .g3f .gi:first-child {
    grid-column:1/3;
    grid-row:auto;
    aspect-ratio:16/9;
  }
  #sala .g3f .gi:first-child {
    min-height:0 !important;
  }
  .img-strip {
    width:88%;
    aspect-ratio:16/8;
  }
}
@media(max-width:640px) {
  .g1,
  .g2,
  .g3,
  .g3f,
  .g4 {
    gap:10px;
  }
  .g2,
  .g3,
  .g3f,
  .g4 {
    grid-template-columns:1fr;
  }
  .g3f .gi:first-child {
    grid-column:auto;
    aspect-ratio:5/4;
  }
  .g2 .gi,
  .gi {
    aspect-ratio:5/4;
  }
  .img-strip {
    width:100%;
    aspect-ratio:4/3;
  }
}

/* PDF menu */
.pdf-viewer {
  width:100%;
  height:640px;
  border:none;
  display:block;
  background:var(--dark-3);
}
.pdf-fallback {
  height:640px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:18px;
  text-align:center;
  padding:28px;
  border:1px solid var(--sub);
  background:var(--dark-3);
}
.pdf-fallback p {
  color:var(--text-muted);
  font-weight:300;
  font-size:14px;
  line-height:1.8;
}

/* Cookie consent */
.cookie-banner,
.cookie-panel {
  position:fixed;
  z-index:600;
  color:var(--text);
  font-family:'Raleway',sans-serif;
}
.cookie-banner {
  left:24px;
  right:24px;
  bottom:24px;
  max-width:760px;
  padding:22px;
  background:rgba(13,12,10,.98);
  border:1px solid var(--gold-line);
  box-shadow:0 18px 60px rgba(0,0,0,.42);
  display:none;
}
.cookie-banner.show { display:block }
.cookie-banner p,
.cookie-panel p {
  color:var(--text-muted);
  font-weight:300;
  font-size:13px;
  line-height:1.75;
}
.cookie-banner h2,
.cookie-panel h2 {
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:28px;
  letter-spacing:1px;
  margin-bottom:8px;
}
.cookie-actions {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}
.cookie-link {
  color:var(--gold);
  text-decoration:none;
  border-bottom:1px solid var(--gold-line);
}
.cookie-panel {
  inset:0;
  background:rgba(8,8,7,.78);
  backdrop-filter:blur(12px);
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.cookie-panel.show { display:flex }
.cookie-box {
  width:min(560px,100%);
  background:var(--dark-2);
  border:1px solid var(--gold-line);
  padding:28px;
}
.cookie-choice {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  padding:18px 0;
  border-top:1px solid var(--sub);
}
.cookie-choice strong {
  display:block;
  font-weight:300;
  font-size:10px;
  letter-spacing:4px;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:6px;
}
.cookie-choice input {
  width:42px;
  height:22px;
  accent-color:var(--gold);
  flex:0 0 auto;
}
.map-consent {
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:24px;
  background:var(--dark-3);
}
.map-consent p {
  color:var(--text-muted);
  font-size:13px;
  line-height:1.7;
  margin-bottom:16px;
}
.footer-links {
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  align-self:flex-end;
}
.footer-links a,
.footer-links button {
  appearance:none;
  background:none;
  border:0;
  color:var(--text-dim);
  cursor:pointer;
  font:inherit;
  font-weight:300;
  font-size:10px;
  letter-spacing:2px;
  text-decoration:none;
}
.footer-links a:hover,
.footer-links button:hover { color:var(--gold) }
@media(max-width:640px) {
  .cookie-banner { left:14px; right:14px; bottom:14px; padding:18px }
  .cookie-box { padding:22px }
}

