/*
Theme Name: Vermentino Ghiacciato
Theme URI: https://vermentinoghiacciato.it
Author: Fausto Farinelli
Description: Tema premium per Vermentino Ghiacciato — progetto culturale ed enologico. Design editoriale, cinematografico, mediterraneo.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
Text Domain: vermentino-ghiacciato
*/

/* ═══ VARIABLES ═════════════════════════════════════════════════ */
:root {
  --ivory:   #F8F5EF;
  --ivory2:  #F2EDE4;
  --ivory3:  #EAE3D8;
  --white:   #FDFCFA;
  --gold:    #A8823A;
  --gold2:   #C9A85C;
  --gold3:   #E2D0A2;
  --sand:    #C4B49A;
  --granite: #6E6B65;
  --ink:     #2C2A26;
  --ink2:    #1A1916;
  --line:    rgba(168,130,58,0.18);
  --serif:   'Cormorant Garamond', Georgia, serif;
  --sans:    'Raleway', sans-serif;
  --ease:    cubic-bezier(0.16,1,0.3,1);
}

/* ═══ RESET ══════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 17px; }
body {
  background: var(--ivory);
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 300;
  line-height: 1.8;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: var(--ivory); }
::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 2px; }
h1,h2,h3,h4 { font-family: var(--serif); font-weight: 400; line-height: 1.12; letter-spacing: 0.01em; }
p { max-width: 60ch; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

/* ═══ LAYOUT ══════════════════════════════════════════════════════ */
.cap { max-width: 1200px; margin: 0 auto; padding: 0 clamp(1.5rem,5vw,4.5rem); }

/* ═══ TYPOGRAPHY HELPERS ═════════════════════════════════════════ */
.eyebrow {
  font-family: var(--sans);
  font-size: 0.58rem;
  font-weight: 500;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--gold);
}
.ornament { display: flex; align-items: center; gap: 1rem; margin: 1.2rem 0; }
.ornament-line { flex: 1; height: 1px; background: var(--line); }
.ornament-diamond { width: 5px; height: 5px; background: var(--gold); transform: rotate(45deg); flex-shrink: 0; }

/* ═══ BUTTONS ════════════════════════════════════════════════════ */
.btn {
  display: inline-block;
  font-family: var(--sans);
  font-size: 0.6rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 0.8rem 2rem;
  border: 1px solid currentColor;
  cursor: pointer;
  background: transparent;
  transition: background .3s var(--ease), color .3s var(--ease);
}
.btn-gold  { color: var(--gold); border-color: var(--gold); }
.btn-gold:hover  { background: var(--gold); color: var(--ivory); }
.btn-ink   { color: var(--ink); border-color: rgba(44,42,38,.3); }
.btn-ink:hover   { background: var(--ink); color: var(--ivory); }
.btn-ivory { color: var(--ivory); border-color: rgba(248,245,239,.35); }
.btn-ivory:hover { background: var(--ivory); color: var(--ink); }

/* ═══ REVEAL ANIMATION ═══════════════════════════════════════════ */
.rv { opacity: 0; transform: translateY(22px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.rv.in { opacity: 1; transform: none; }
.d1 { transition-delay: .08s; }
.d2 { transition-delay: .18s; }
.d3 { transition-delay: .30s; }
.d4 { transition-delay: .42s; }

/* ═══ NAVBAR ══════════════════════════════════════════════════════ */
#vg-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 900;
  padding: 1.4rem clamp(1.5rem,5vw,4.5rem);
  display: flex; align-items: center; justify-content: space-between;
  transition: background .4s, box-shadow .4s, padding .4s;
}
#vg-nav.sc {
  background: rgba(248,245,239,.96);
  backdrop-filter: blur(14px);
  box-shadow: 0 1px 0 rgba(168,130,58,.1);
  padding-top: .9rem; padding-bottom: .9rem;
}
/* Navbar su hero chiaro: testi scuri dall'inizio */
.nav-logo { font-family: var(--serif); font-size: 1rem; letter-spacing: .08em; color: var(--ink); transition: color .4s; }
#vg-nav.sc .nav-logo { color: var(--ink); }
.nav-links { display: flex; gap: 2.2rem; list-style: none; }
.nav-links a { font-size: .56rem; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--granite); transition: color .3s; }
#vg-nav.sc .nav-links a { color: var(--granite); }
.nav-links a:hover { color: var(--gold); }
.hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; background: none; border: none; padding: 4px; }
.hamburger span { display: block; width: 22px; height: 1px; background: var(--ink); transition: background .4s; }
#vg-nav.sc .hamburger span { background: var(--ink); }
#mobile-nav {
  display: none; position: fixed; inset: 0;
  background: var(--white); z-index: 899;
  flex-direction: column; align-items: center; justify-content: center; gap: 2.2rem;
}
#mobile-nav.open { display: flex; }
#mobile-nav a { font-family: var(--serif); font-size: 2rem; font-weight: 300; color: var(--ink); transition: color .2s; }
#mobile-nav a:hover { color: var(--gold); }
#mobile-close { position: absolute; top: 1.8rem; right: 2rem; background: none; border: none; font-family: var(--sans); font-size: .6rem; letter-spacing: .22em; text-transform: uppercase; color: var(--granite); cursor: pointer; }

/* ═══ HERO — sfondo carta avorio ═════════════════════════════════ */
#hero {
  min-height: 100dvh;
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  background: var(--ivory);
  position: relative; overflow: hidden;
}
/* Texture carta come sfondo reale */
.hero-texture {
  position: absolute; inset: 0;
  background-image: url('images/hero-texture.jpg');
  background-size: cover;
  background-position: center;
  opacity: 1;
}
/* Velatura avorio chiara sopra la texture per ammorbidire */
.hero-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 70% 55% at 50% 40%, rgba(248,245,239,.45) 0%, transparent 70%),
    radial-gradient(ellipse 50% 40% at 15% 80%, rgba(168,130,58,.04) 0%, transparent 55%);
}
/* Linee decorative dorate sottili */
.hero-rules { position: absolute; inset: 0; pointer-events: none; }
.hero-rules::before, .hero-rules::after {
  content: ''; position: absolute; left: 8%; right: 8%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(168,130,58,.22) 25%, rgba(168,130,58,.22) 75%, transparent);
}
.hero-rules::before { top: 18%; }
.hero-rules::after  { bottom: 18%; }
/* Manteniamo hero-noise e hero-bg-img per compatibilità */
.hero-noise { display: none; }
.hero-bg-img { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .12; }
.hero-inner { position: relative; z-index: 2; padding: 2rem 1.5rem; max-width: 820px; margin: 0 auto; }
/* Testi scuri su sfondo chiaro */
.hero-tag { font-size: .56rem; font-weight: 500; letter-spacing: .35em; text-transform: uppercase; color: var(--gold); margin-bottom: 2.5rem; opacity: 0; animation: fu 1s var(--ease) .25s forwards; }
.hero-title { font-family: var(--serif); font-size: clamp(3.5rem,9.5vw,8rem); font-weight: 300; letter-spacing: .05em; color: var(--ink); line-height: .95; opacity: 0; animation: fu 1.1s var(--ease) .5s forwards; }
.hero-title-em { display: block; font-style: italic; color: var(--gold); font-size: .56em; letter-spacing: .1em; margin-top: .15em; }
.hero-author { font-family: var(--serif); font-size: clamp(.85rem,1.6vw,1rem); font-style: italic; color: var(--granite); margin: 1.8rem auto .5rem; opacity: 0; animation: fu .9s var(--ease) .85s forwards; }
.hero-sub { font-family: var(--serif); font-size: clamp(.9rem,1.7vw,1.1rem); font-style: italic; color: var(--granite); margin: .3rem auto 2.5rem; opacity: 0; animation: fu .9s var(--ease) 1s forwards; }
.hero-cta { opacity: 0; animation: fu .9s var(--ease) 1.2s forwards; display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.hero-scroll { position: absolute; bottom: 2.2rem; left: 50%; transform: translateX(-50%); z-index: 2; display: flex; flex-direction: column; align-items: center; gap: .6rem; opacity: 0; animation: fi 1s var(--ease) 2s forwards; color: rgba(110,107,101,.5); font-size: .5rem; letter-spacing: .25em; text-transform: uppercase; }
.scroll-bar { width: 1px; height: 36px; background: linear-gradient(to bottom, rgba(168,130,58,.5), transparent); animation: sp 2.5s ease-in-out infinite; }

@keyframes fu { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:none; } }
@keyframes fi { from { opacity:0; } to { opacity:1; } }
@keyframes sp { 0%,100% { opacity:.45; transform:scaleY(1); } 50% { opacity:1; transform:scaleY(1.3); } }

/* ═══ SECTION COMMON ══════════════════════════════════════════════ */
.sec { padding: clamp(4rem,8vw,6.5rem) 0; }
.sec-head { text-align: center; margin-bottom: 4rem; }
.sec-head h2 { font-size: clamp(2.2rem,4.5vw,3.4rem); font-weight: 300; letter-spacing: .02em; margin: .4rem 0 1rem; color: var(--ink); }
.sec-head p { color: var(--granite); font-size: .9rem; line-height: 1.95; margin: 0 auto; max-width: 50ch; }

/* ═══ IL PROGETTO ════════════════════════════════════════════════ */
#progetto { background: var(--white); }
.pillars { display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid var(--line); }
.pillar { padding: 2.5rem 2rem; text-align: center; border-right: 1px solid var(--line); transition: background .4s; }
.pillar:last-child { border-right: none; }
.pillar:hover { background: var(--ivory2); }
.pillar-n { font-family: var(--serif); font-size: 3rem; font-weight: 300; font-style: italic; color: var(--gold3); line-height: 1; margin-bottom: .4rem; display: block; }
.pillar h3 { font-size: 1.08rem; font-weight: 400; margin-bottom: .6rem; color: var(--ink); }
.pillar p { font-size: .76rem; color: var(--granite); line-height: 1.85; max-width: none; }

/* ═══ IL LIBRO ═══════════════════════════════════════════════════ */
#libro { background: var(--ivory2); }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem,6vw,6rem); align-items: center; }
.split-rev { direction: rtl; }
.split-rev > * { direction: ltr; }
.split-text h2 { font-size: clamp(2rem,4vw,3rem); font-weight: 300; margin: .4rem 0 1.2rem; color: var(--ink); }
.split-text p { font-size: .86rem; line-height: 2; color: var(--granite); margin-bottom: 1.2rem; }
.libro-img-wrap { display: flex; justify-content: center; }
.libro-real-img {
  width: clamp(260px,44vw,520px);
  border-radius: 1px;
  box-shadow: 12px 20px 60px rgba(44,42,38,.18), -3px -3px 15px rgba(253,252,250,.8);
}
.libro-cap { margin-top: 1rem; text-align: center; font-family: var(--serif); font-style: italic; font-size: .76rem; color: var(--sand); letter-spacing: .03em; }

/* ═══ IL VINO ════════════════════════════════════════════════════ */
#vino { background: var(--white); }
.bottle-wrap { display: flex; flex-direction: column; align-items: center; gap: 1.2rem; justify-content: center; }
.bottle-real-img { width: clamp(200px,28vw,360px); filter: drop-shadow(0 20px 50px rgba(44,42,38,.15)); }
.bottle-label { text-align: center; border: 1px solid var(--line); padding: 1rem 1.4rem; background: var(--white); min-width: 200px; }
.bl-name { font-family: var(--serif); font-size: 1rem; letter-spacing: .05em; color: var(--ink); }
.bl-sub  { font-size: .52rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); margin-top: .25rem; }
.bl-docg { font-size: .5rem; letter-spacing: .15em; text-transform: uppercase; color: var(--granite); margin-top: .15rem; }
.vino-quote { font-family: var(--serif); font-size: .98rem; font-style: italic; color: var(--gold); padding: .7rem 0 .7rem 1rem; border-left: 2px solid var(--gold3); margin: 1.2rem 0 1.8rem; max-width: 32ch; }

/* ═══ I PERSONAGGI ═══════════════════════════════════════════════ */
#personaggi { background: var(--ink2); padding: clamp(4rem,8vw,6.5rem) 0; }
#personaggi .sec-head h2 { color: var(--ivory); }
#personaggi .sec-head p  { color: rgba(248,245,239,.5); }
.cast-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; }
.cast-card { border: 1px solid rgba(168,130,58,.14); overflow: hidden; background: rgba(248,245,239,.02); transition: border-color .4s; }
.cast-card:hover { border-color: rgba(168,130,58,.35); }
.cast-card img { width: 100%; aspect-ratio: 480/820; object-fit: cover; object-position: top; display: block; }
.cast-cta { text-align: center; margin-top: 3rem; }
.cast-cta p { font-size: .8rem; color: rgba(248,245,239,.4); max-width: 46ch; margin: 1rem auto 2rem; }

/* ═══ GALLERIA ═══════════════════════════════════════════════════ */
#galleria { background: var(--ivory3); }
.gal-grid { display: grid; grid-template-columns: 5fr 3fr 4fr; grid-template-rows: 240px 210px; gap: 8px; margin-top: 2.5rem; }
.gal-cell { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.gal-cell:nth-child(1) { grid-column:1/2; grid-row:1/2; background: #C9BFA8; }
.gal-cell:nth-child(2) { grid-column:2/3; grid-row:1/2; background: #8B9E87; }
.gal-cell:nth-child(3) { grid-column:3/4; grid-row:1/2; background: #A8A49C; }
.gal-cell:nth-child(4) { grid-column:1/2; grid-row:2/3; background: #BEB8A5; }
.gal-cell:nth-child(5) { grid-column:2/4; grid-row:2/3; background: #8FA5A8; }
.gal-inner { text-align: center; transition: transform .7s var(--ease); }
.gal-cell:hover .gal-inner { transform: scale(1.04); }
.gal-cell img, .gal-cell video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gal-letter { font-family: var(--serif); font-size: clamp(3.5rem,7vw,6rem); font-style: italic; font-weight: 300; color: rgba(42,40,38,.22); line-height: 1; }
.gal-word   { font-size: .6rem; letter-spacing: .32em; text-transform: uppercase; color: rgba(42,40,38,.65); margin-top: .7rem; font-weight: 500; }
.gal-cell::after { content: attr(data-label); position: absolute; bottom: 0; left: 0; right: 0; padding: 1.2rem 1rem .8rem; background: linear-gradient(to top, rgba(42,40,38,.35), transparent); font-size: .55rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(42,40,38,.75); opacity: 0; transition: opacity .35s; }
.gal-cell:hover::after { opacity: 1; }

/* ═══ MANIFESTO ══════════════════════════════════════════════════ */
#manifesto { background: var(--white); padding: clamp(5rem,12vw,10rem) 0; text-align: center; }
.manifesto-body { max-width: 720px; margin: 0 auto; padding: 0 2rem; }
.manifesto-mark { font-family: var(--serif); font-size: 4.5rem; font-weight: 300; color: var(--gold3); line-height: .75; display: block; margin-bottom: .8rem; }
.manifesto-q { font-family: var(--serif); font-size: clamp(1.5rem,3.2vw,2.4rem); font-weight: 300; font-style: italic; line-height: 1.45; color: var(--ink); max-width: none; }
.manifesto-attr { font-size: .58rem; letter-spacing: .22em; text-transform: uppercase; color: var(--gold); margin-top: 2rem; }

/* ═══ CONTATTI ═══════════════════════════════════════════════════ */
#contatti { background: var(--ivory2); }
.cont-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(2.5rem,6vw,6rem); margin-top: 3.5rem; align-items: start; }
.cont-form { display: flex; flex-direction: column; gap: 1rem; }
.fg { display: flex; flex-direction: column; gap: .4rem; }
.fg label { font-size: .55rem; letter-spacing: .2em; text-transform: uppercase; color: var(--sand); }
.fg input, .fg select, .fg textarea { background: transparent; border: none; border-bottom: 1px solid rgba(168,130,58,.2); color: var(--ink); font-family: var(--sans); font-size: .84rem; font-weight: 300; padding: .5rem 0; outline: none; transition: border-color .3s; width: 100%; }
.fg input:focus, .fg select:focus, .fg textarea:focus { border-bottom-color: var(--gold); }
.fg input::placeholder, .fg textarea::placeholder { color: rgba(110,107,101,.4); }
.fg textarea { resize: vertical; min-height: 90px; }
.fg select option { background: var(--ivory2); }
.form-notice { display: none; font-size: .75rem; padding: .7rem .9rem; margin-top: .4rem; }
.form-notice.ok  { background: rgba(46,125,94,.1); border-left: 2px solid #2E7D5E; color: #2E7D5E; display: block; }
.form-notice.err { background: rgba(192,57,43,.1); border-left: 2px solid #C0392B; color: #C0392B; display: block; }
.cont-info { display: flex; flex-direction: column; gap: 2rem; }
.ci-block .eyebrow { margin-bottom: .4rem; }
.ci-block p { font-size: .78rem; color: var(--granite); max-width: none; line-height: 1.85; }
.ci-block a { color: var(--granite); transition: color .2s; }
.ci-block a:hover { color: var(--gold); }
.ci-div { height: 1px; background: rgba(168,130,58,.1); }
.social-row { display: flex; gap: .8rem; margin-top: .5rem; flex-wrap: wrap; }
.social-link { font-size: .55rem; letter-spacing: .18em; text-transform: uppercase; color: var(--granite); border: 1px solid var(--line); padding: .3rem .7rem; transition: .25s; }
.social-link:hover { border-color: var(--gold); color: var(--gold); }

/* ═══ FOOTER ══════════════════════════════════════════════════════ */
footer { background: var(--ink2); padding: 2.8rem clamp(1.5rem,5vw,4.5rem); color: rgba(248,245,239,.65); }
.ft-top { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2rem; }
.ft-brand  { font-family: var(--serif); font-size: .95rem; letter-spacing: .1em; color: rgba(248,245,239,.85); }
.ft-domain { font-size: .6rem; letter-spacing: .13em; color: var(--gold2); margin-top: .3rem; }
.ft-nav    { display: flex; gap: 1.5rem; flex-wrap: wrap; justify-content: center; }
.ft-nav a  { font-size: .6rem; letter-spacing: .15em; text-transform: uppercase; color: rgba(248,245,239,.65); transition: color .2s; }
.ft-nav a:hover { color: var(--gold2); }
.ft-right  { text-align: right; font-size: .62rem; letter-spacing: .08em; line-height: 2; color: rgba(248,245,239,.7); }
.ft-bottom { max-width: 1200px; margin: 1.8rem auto 0; padding-top: 1.2rem; border-top: 1px solid rgba(168,130,58,.2); display: flex; justify-content: space-between; font-size: .58rem; color: rgba(248,245,239,.55); flex-wrap: wrap; gap: .4rem; }

/* ═══ ADMIN BAR ═══════════════════════════════════════════════════ */
.admin-bar #vg-nav { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar #vg-nav { top: 46px; } }

/* ═══ EVENTI ══════════════════════════════════════════════════════ */
.vg-eventi-sec { background: var(--white); }
.vg-eventi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
  margin-top: 1rem;
}
.vg-evento-card {
  background: var(--white);
  padding: 2.4rem 2rem;
  display: flex;
  flex-direction: column;
  gap: .85rem;
  position: relative;
  transition: background .35s;
}
.vg-evento-card:hover { background: var(--ivory); }
.vg-evento-card.vg-evento-passato { opacity: .58; }
.vg-evento-card.vg-evento-passato:hover { opacity: .8; }
.vg-evento-badge {
  font-family: var(--sans);
  font-size: .52rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--granite);
  border: 1px solid var(--line);
  padding: .2rem .7rem;
  display: inline-block;
  align-self: flex-start;
}
.vg-evento-badge--live { color: var(--gold); border-color: var(--gold); }
.vg-evento-data { display: flex; flex-direction: column; gap: .1rem; margin-top: .3rem; }
.vg-evento-giorno {
  font-family: var(--serif);
  font-size: 1.05rem;
  font-weight: 400;
  color: var(--gold);
  letter-spacing: .02em;
}
.vg-evento-ora { font-size: .7rem; color: var(--granite); letter-spacing: .1em; }
.vg-evento-titolo {
  font-family: var(--serif);
  font-size: 1.35rem;
  font-weight: 400;
  line-height: 1.25;
  color: var(--ink);
  letter-spacing: .01em;
}
.vg-evento-desc { font-size: .82rem; line-height: 1.85; color: var(--granite); flex: 1; }
.vg-evento-luogo {
  font-size: .72rem;
  color: var(--granite);
  letter-spacing: .06em;
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-top: auto;
  padding-top: .8rem;
  border-top: 1px solid var(--line);
}
.vg-evento-luogo-icon { color: var(--gold); font-size: .8rem; flex-shrink: 0; }
.vg-evento-btn { align-self: flex-start; margin-top: .5rem; font-size: .58rem; padding: .65rem 1.5rem; }

/* ── Galleria foto evento ── */
.vg-evento-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  margin: .4rem 0;
  border-radius: 2px;
  overflow: hidden;
}
.vg-gal-img {
  display: block;
  aspect-ratio: 4/3;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}
.vg-gal-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s var(--ease);
}
.vg-gal-img:hover img { transform: scale(1.06); }
.vg-gal-hidden { display: none; }
.vg-gal-img[data-remaining] {
  display: block;
  position: relative;
}
.vg-gal-more {
  position: absolute; inset: 0;
  background: rgba(42,40,38,.55);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif);
  font-size: 1.4rem;
  font-weight: 300;
  color: var(--ivory);
  letter-spacing: .04em;
}

/* ── Lightbox semplice ── */
#vg-lightbox {
  display: none;
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(26,25,22,.95);
  align-items: center; justify-content: center;
  flex-direction: column;
  cursor: zoom-out;
}
#vg-lightbox.open { display: flex; }
#vg-lightbox img {
  max-width: 90vw; max-height: 85vh;
  object-fit: contain;
  border: none;
  box-shadow: 0 20px 80px rgba(0,0,0,.5);
}
#vg-lb-close {
  position: absolute; top: 1.5rem; right: 1.8rem;
  background: none; border: none;
  font-family: var(--sans); font-size: .6rem;
  letter-spacing: .22em; text-transform: uppercase;
  color: rgba(248,245,239,.4); cursor: pointer;
  transition: color .2s;
}
#vg-lb-close:hover { color: var(--ivory); }
#vg-lb-prev, #vg-lb-next {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: none; border: 1px solid rgba(248,245,239,.2);
  color: rgba(248,245,239,.6); font-size: .7rem;
  letter-spacing: .15em; text-transform: uppercase;
  padding: .6rem 1.1rem; cursor: pointer;
  transition: border-color .2s, color .2s;
}
#vg-lb-prev { left: 1.5rem; }
#vg-lb-next { right: 1.5rem; }
#vg-lb-prev:hover, #vg-lb-next:hover { border-color: var(--gold); color: var(--gold); }
#vg-lb-counter {
  position: absolute; bottom: 1.5rem;
  font-size: .56rem; letter-spacing: .2em; text-transform: uppercase;
  color: rgba(248,245,239,.35);
}

/* ═══ RESPONSIVE ══════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .pillars { grid-template-columns: repeat(2,1fr); }
  .pillar:nth-child(2) { border-right: none; }
  .pillar:nth-child(1), .pillar:nth-child(2) { border-bottom: 1px solid var(--line); }
}
@media (max-width: 860px) {
  .split, .split-rev { grid-template-columns: 1fr; }
  .split-rev { direction: ltr; }
  .cast-grid { grid-template-columns: 1fr; }
  .vg-eventi-grid { grid-template-columns: 1fr; }
  .gal-grid { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .gal-cell:nth-child(1) { grid-column:1/2; grid-row:auto; }
  .gal-cell:nth-child(2) { grid-column:2/3; grid-row:auto; }
  .gal-cell:nth-child(3) { grid-column:1/2; grid-row:auto; }
  .gal-cell:nth-child(4) { grid-column:2/3; grid-row:auto; }
  .gal-cell:nth-child(5) { grid-column:1/3; grid-row:auto; }
  .cont-grid { grid-template-columns: 1fr; }
  .ft-top { grid-template-columns: 1fr; text-align: center; }
  .ft-right { text-align: center; }
  .nav-links { display: none; }
  .hamburger { display: flex; }
}
@media (max-width: 580px) {
  .pillars { grid-template-columns: 1fr; }
  .pillar { border-right: none !important; border-bottom: 1px solid var(--line); }
  .pillar:last-child { border-bottom: none; }
  .gal-grid { grid-template-columns: 1fr; }
  .gal-cell { grid-column: 1 !important; grid-row: auto !important; min-height: 180px; }
}