/* ============================================================
   RISTORANTE LA BELLA ITALIA — CSS COMPLETO
   ============================================================ */

/* --------- VARIABILI --------- */
:root {
  --wine:    #8B1A1A;
  --wine-dk: #6a1212;
  --gold:    #C9A84C;
  --gold-lt: #e8c96a;
  --dark:    #1a1a1a;
  --dark-2:  #2a2a2a;
  --cream:   #FBF7F0;
  --cream-2: #f5efe6;
  --light:   #ffffff;
  --text:    #333333;
  --text-lt: #666666;
  --border:  #e0d5c5;
  --shadow:  0 4px 20px rgba(0,0,0,.1);
  --shadow-lg: 0 8px 40px rgba(0,0,0,.15);
  --radius:  8px;
  --radius-lg: 16px;
  --transition: .3s ease;
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-sans:  'Lato', sans-serif;
  --font-script: 'Dancing Script', cursive;
  /* alias legacy */
  --red: var(--wine);
  --oro: var(--gold);
}

/* --------- RESET & BASE --------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body { font-family: var(--font-sans); color: var(--text); background: var(--cream); line-height: 1.7; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--wine); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--gold); }
ul { list-style: none; }
input, select, textarea, button { font-family: inherit; }
h1,h2,h3,h4 { font-family: var(--font-serif); line-height: 1.3; color: var(--dark); }

/* --------- CONTAINER --------- */
.container { width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 20px; }

/* ============================================================
   TOP BAR
   ============================================================ */
.top-bar { background: var(--dark); color: rgba(255,255,255,.8); font-size: 13px; padding: 8px 0; }
.top-bar-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.top-bar-left { display: flex; gap: 20px; flex-wrap: wrap; }
.top-bar-left span { display: flex; align-items: center; gap: 6px; }
.top-bar-left i { color: var(--gold); }
.top-bar-right { display: flex; align-items: center; gap: 14px; }
.top-bar-right a { color: rgba(255,255,255,.7); font-size: 14px; transition: color var(--transition); }
.top-bar-right a:hover { color: var(--gold); }
.top-whatsapp { background: #25D366; color: #fff !important; padding: 4px 12px; border-radius: 20px; font-weight: 600; display: flex; align-items: center; gap: 5px; }
.top-whatsapp:hover { background: #1da851; }

/* ============================================================
   HEADER
   ============================================================ */
.site-header {
  position: sticky; top: 0; z-index: 100;
  box-shadow: 0 2px 20px rgba(0,0,0,.08);
  border-bottom: 2px solid var(--gold);
}
.site-header::before {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: rgba(251,247,240,.97); backdrop-filter: blur(10px);
}
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 20px; }

/* Logo */
.site-logo-text { display: flex; flex-direction: column; text-decoration: none; }
.logo-name { font-family: var(--font-script); font-size: 28px; color: var(--wine); line-height: 1; }
.logo-slogan { font-size: 11px; color: var(--gold); letter-spacing: 2px; text-transform: uppercase; margin-top: 2px; }

/* Nav */
.nav-menu { display: flex; align-items: center; gap: 4px; }
.nav-menu li a {
  padding: 8px 14px; border-radius: var(--radius);
  font-size: 14px; font-weight: 600; letter-spacing: .5px;
  color: var(--dark); transition: all var(--transition); text-transform: uppercase;
}
.nav-menu li a:hover,
.nav-menu li.current-menu-item a { color: var(--wine); }
.nav-menu li.current-menu-item a { border-bottom: 2px solid var(--gold); }

/* ── Dropdown sub-menu (desktop) ─────────────────────────── */
.nav-menu li { position: relative; }

.nav-menu .menu-item-has-children > a {
  display: inline-flex; align-items: center; gap: 4px;
}
.nav-menu .menu-item-has-children > a::after {
  content: '▾';
  color: var(--gold);
  font-size: 13px; line-height: 1;
  display: inline-block;
  transition: transform .25s ease;
}
.nav-menu .menu-item-has-children:hover > a::after {
  transform: rotate(-180deg);
}

.nav-menu .sub-menu {
  list-style: none; margin: 0; padding: 8px 0;
  position: absolute; top: calc(100% + 5px); left: 0;
  min-width: 220px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0,0,0,.14);
  border: 1px solid var(--border);
  border-top: 3px solid var(--gold);
  z-index: 9999;
  opacity: 0; visibility: hidden;
  transform: translateY(-8px); pointer-events: none;
  transition: opacity .2s ease, transform .2s ease, visibility .2s;
}
.nav-menu .sub-menu::before {
  content: '';
  position: absolute; top: -8px; left: 18px;
  border: 4px solid transparent;
  border-bottom-color: var(--gold);
}
.nav-menu .menu-item-has-children:hover > .sub-menu {
  opacity: 1; visibility: visible;
  transform: translateY(0); pointer-events: auto;
}

.nav-menu .sub-menu li a {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 18px; font-size: 12px; font-weight: 600;
  letter-spacing: .4px; text-transform: uppercase;
  color: var(--text); white-space: nowrap;
  border-bottom: none; border-radius: 0;
  transition: background .15s, color .15s, padding .15s;
}
.nav-menu .sub-menu li a::before {
  content: '›'; color: var(--gold);
  font-size: 16px; font-weight: 700; line-height: 1; flex-shrink: 0;
}
.nav-menu .sub-menu li a:hover {
  background: var(--cream-2); color: var(--wine); padding-left: 22px;
}
/* ─────────────────────────────────────────────────────────── */

/* Header actions */
.header-actions { display: flex; align-items: center; gap: 12px; }
.btn-login { display: flex; align-items: center; gap: 6px; color: var(--dark); font-weight: 600; font-size: 14px; }
.btn-login:hover { color: var(--wine); }
.btn-prenota-header {
  background: var(--wine); color: #fff !important;
  padding: 10px 20px; border-radius: var(--radius);
  font-weight: 700; font-size: 14px; letter-spacing: .5px;
  transition: all var(--transition); white-space: nowrap;
}
.btn-prenota-header:hover { background: var(--gold); color: var(--dark) !important; transform: translateY(-1px); }

/* User dropdown */
.user-menu-wrapper { position: relative; }
.user-menu-toggle {
  display: flex; align-items: center; gap: 8px;
  background: none; border: 2px solid var(--border); border-radius: 30px;
  padding: 6px 14px; cursor: pointer; font-weight: 600;
  transition: border-color var(--transition);
}
.user-menu-toggle:hover { border-color: var(--gold); }
.user-avatar { width: 30px; height: 30px; background: var(--wine); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; }
.user-dropdown {
  position: absolute; top: calc(100% + 8px); right: 0;
  background: #fff; border-radius: var(--radius); box-shadow: var(--shadow-lg);
  min-width: 220px; padding: 8px; border: 1px solid var(--border);
  display: none; z-index: 200;
}
.user-dropdown.open { display: block; animation: fadeInDown .2s ease; }
.user-dropdown-header { padding: 10px 12px 12px; border-bottom: 1px solid var(--border); margin-bottom: 8px; }
.user-dropdown-header strong { display: block; font-size: 14px; color: var(--dark); }
.user-dropdown-header .user-level { font-size: 12px; color: var(--text-lt); }
.user-dropdown a { display: block; padding: 8px 12px; border-radius: 6px; font-size: 14px; color: var(--text); }
.user-dropdown a:hover { background: var(--cream-2); color: var(--wine); }
.user-dropdown .logout-link { color: #cc4444; margin-top: 8px; border-top: 1px solid var(--border); padding-top: 12px; }

/* Hamburger */
.menu-toggle { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 6px; }
.menu-toggle span { display: block; width: 24px; height: 2px; background: var(--dark); transition: all .3s; border-radius: 2px; }
.menu-toggle.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.menu-toggle.active span:nth-child(2) { opacity: 0; }
.menu-toggle.active span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }
.menu-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 90; }
.menu-overlay.active { display: block; }

/* ============================================================
   HERO SECTION
   ============================================================ */
.hero { position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform 8s ease; }
.hero-bg-default { background: linear-gradient(135deg, #1a0a00 0%, #4a1a00 40%, #8B1A1A 100%); }
.hero:hover .hero-bg { transform: scale(1.03); }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,.3) 0%, rgba(0,0,0,.6) 100%); }
.hero-content { position: relative; z-index: 2; text-align: center; color: #fff; max-width: 800px; padding: 40px 20px; }
.hero-tag { display: inline-block; background: var(--gold); color: var(--dark); font-size: 11px; letter-spacing: 3px; text-transform: uppercase; padding: 6px 20px; border-radius: 20px; margin-bottom: 24px; font-weight: 700; }
.hero-title { font-family: var(--font-script); font-size: clamp(48px, 8vw, 96px); color: #fff; margin-bottom: 16px; text-shadow: 0 2px 20px rgba(0,0,0,.5); }
.hero-subtitle { font-size: 18px; color: rgba(255,255,255,.85); letter-spacing: 3px; margin-bottom: 20px; }
.hero-divider { color: var(--gold); margin: 0 10px; }
.hero-desc { font-size: 17px; color: rgba(255,255,255,.75); margin-bottom: 40px; max-width: 600px; margin-left: auto; margin-right: auto; }
.hero-actions { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
.btn-hero-primary {
  background: var(--wine); color: #fff !important; padding: 16px 36px; border-radius: var(--radius);
  font-weight: 700; font-size: 16px; letter-spacing: 1px;
  transition: all var(--transition); border: 2px solid var(--wine);
}
.btn-hero-primary:hover { background: var(--gold); border-color: var(--gold); color: var(--dark) !important; transform: translateY(-2px); box-shadow: 0 8px 25px rgba(201,168,76,.4); }
.btn-hero-secondary { background: transparent; color: #fff !important; padding: 16px 36px; border-radius: var(--radius); font-weight: 700; font-size: 16px; border: 2px solid rgba(255,255,255,.6); transition: all var(--transition); }
.btn-hero-secondary:hover { border-color: var(--gold); color: var(--gold) !important; }
.hero-scroll-indicator { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); z-index: 2; }
.hero-scroll-indicator span { display: block; width: 2px; height: 50px; background: linear-gradient(to bottom, var(--gold), transparent); margin: 0 auto; animation: scrollPulse 2s infinite; }

/* ── Hero Slider ─────────────────────────────────────────── */
.hero-slides { position: absolute; inset: 0; z-index: 0; }
.hero-slide {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: 0;
  transition: opacity 1.2s ease;
}
.hero-slide.active { opacity: 1; }
.hero-bg-default { background: linear-gradient(135deg, #1a0a00 0%, #4a1a00 40%, #8B1A1A 100%); }
/* Ken Burns on active slide */
.hero--slider .hero-slide.active {
  animation: heroKenBurns 8s ease forwards;
}
@keyframes heroKenBurns {
  from { transform: scale(1); }
  to   { transform: scale(1.06); }
}
/* Prev / Next buttons */
.hero-slider-prev,
.hero-slider-next {
  position: absolute; top: 50%; z-index: 3;
  transform: translateY(-50%);
  background: rgba(0,0,0,.35); color: #fff;
  border: 2px solid rgba(255,255,255,.4);
  width: 48px; height: 48px; border-radius: 50%;
  font-size: 18px; line-height: 1;
  cursor: pointer; transition: all .25s;
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(4px);
}
.hero-slider-prev { left: 20px; }
.hero-slider-next { right: 20px; }
.hero-slider-prev:hover,
.hero-slider-next:hover {
  background: var(--wine); border-color: var(--wine);
  transform: translateY(-50%) scale(1.1);
}
/* Dots */
.hero-slider-dots {
  position: absolute; bottom: 80px; left: 50%;
  transform: translateX(-50%);
  z-index: 3; display: flex; gap: 10px;
}
.hero-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: rgba(255,255,255,.45);
  border: 2px solid rgba(255,255,255,.6);
  cursor: pointer; transition: all .25s; padding: 0;
}
.hero-dot.active {
  background: var(--gold); border-color: var(--gold);
  transform: scale(1.3);
}
.hero-dot:hover { background: rgba(255,255,255,.75); }

/* ============================================================
   STRIP NUMERI
   ============================================================ */
.strip-numbers { background: var(--wine); padding: 40px 0; }
.numbers-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.number-item { text-align: center; color: #fff; padding: 20px; }
.number-value { display: block; font-family: var(--font-serif); font-size: 40px; color: var(--gold); font-weight: 700; }
.number-label { font-size: 13px; text-transform: uppercase; letter-spacing: 2px; opacity: .8; margin-top: 8px; }

/* ============================================================
   SECTION HEADERS
   ============================================================ */
.section-header { text-align: center; margin-bottom: 50px; }
.section-tag { display: inline-block; color: var(--gold); font-size: 12px; letter-spacing: 3px; text-transform: uppercase; font-weight: 700; margin-bottom: 12px; }
.section-header h2 { font-size: clamp(28px, 4vw, 42px); color: var(--dark); margin-bottom: 16px; }
.section-header p { color: var(--text-lt); font-size: 17px; max-width: 600px; margin: 0 auto; }
.section-header-white h2 { color: #fff; }
.section-header-white .section-tag { color: var(--gold-lt); }
.section-header-white p { color: rgba(255,255,255,.75); }

/* ============================================================
   SEZIONE INTERNI - MOSAIC
   ============================================================ */
.section-interni { padding: 80px 0; background: var(--cream); }
.interni-mosaic { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 280px; gap: 6px; margin-top: 40px; }
.mosaic-item { position: relative; overflow: hidden; cursor: pointer; background-size: cover; background-position: center; background-color: var(--dark-2); }
.mosaic-large { grid-column: span 2; }
.mosaic-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.8) 0%, transparent 60%);
  display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;
  padding: 24px; opacity: 0; transition: opacity var(--transition);
}
.mosaic-item:hover .mosaic-overlay { opacity: 1; }
.mosaic-item:hover { transform: scale(1.02); }
.mosaic-item { transition: transform var(--transition); }
.mosaic-label { color: #fff; font-family: var(--font-serif); font-size: 20px; font-weight: 600; }
.mosaic-zoom-icon { color: var(--gold); font-size: 20px; margin-top: 8px; }

/* ============================================================
   SEZIONE PIATTI - SLIDER
   ============================================================ */
.section-piatti { background: var(--dark); padding: 80px 0; }
.piatti-slider-wrapper { position: relative; overflow: hidden; margin: 0 -10px; }
.piatti-slider { display: flex; gap: 20px; transition: transform .4s ease; padding: 0 10px; }
.piatto-slide { min-width: calc(25% - 15px); flex-shrink: 0; }
.piatto-card { background: #fff; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); height: 100%; position: relative; transition: transform var(--transition), box-shadow var(--transition); }
.piatto-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.badge-del-giorno { position: absolute; top: 12px; left: 12px; background: var(--gold); color: var(--dark); font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 20px; z-index: 2; letter-spacing: .5px; }
.piatto-image { position: relative; height: 220px; overflow: hidden; background: var(--dark); display: flex; align-items: center; justify-content: center; }
.piatto-image img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
.piatto-placeholder { height: 200px; background: linear-gradient(135deg, var(--cream-2), #e0d0be); display: flex; align-items: center; justify-content: center; }
.piatto-emoji { font-size: 60px; }
.piatto-category { position: absolute; bottom: 8px; right: 8px; background: var(--wine); color: #fff; font-size: 11px; padding: 3px 10px; border-radius: 20px; }
.piatto-body { padding: 20px; padding-top: 14px; border-top: 3px solid var(--cream-2); }
.piatto-title { font-size: 18px; margin-bottom: 8px; color: var(--dark); }
.piatto-desc { font-size: 14px; color: var(--text-lt); margin-bottom: 8px; line-height: 1.6; }
.piatto-allergeni { color: #999; font-size: 12px; margin-bottom: 12px; }
.piatto-price { font-family: var(--font-serif); font-size: 22px; color: var(--wine); font-weight: 700; }
.slider-btn {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: var(--wine); color: #fff; border: none; width: 44px; height: 44px;
  border-radius: 50%; cursor: pointer; z-index: 10; font-size: 16px;
  transition: background var(--transition); display: flex; align-items: center; justify-content: center;
}
.slider-btn:hover { background: var(--gold); color: var(--dark); }
.slider-prev { left: 10px; }
.slider-next { right: 10px; }
.slider-dots { display: flex; justify-content: center; gap: 8px; margin-top: 24px; }
.slider-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.3); cursor: pointer; transition: all var(--transition); border: none; }
.slider-dot.active { background: var(--gold); width: 24px; border-radius: 4px; }
.piatti-cta { text-align: center; margin-top: 40px; }
.btn-outline-gold { border: 2px solid var(--gold); color: var(--gold) !important; padding: 14px 32px; border-radius: var(--radius); font-weight: 700; transition: all var(--transition); display: inline-block; }
.btn-outline-gold:hover { background: var(--gold); color: var(--dark) !important; }

/* ============================================================
   SEZIONE CITAZIONE
   ============================================================ */
.section-quote { background: var(--cream-2); padding: 80px 0; }
.restaurant-quote { text-align: center; max-width: 800px; margin: 0 auto; }
.restaurant-quote p { font-family: var(--font-serif); font-size: clamp(20px, 3vw, 28px); font-style: italic; color: var(--dark); line-height: 1.6; margin-bottom: 20px; }
.restaurant-quote footer { font-size: 14px; color: var(--gold); letter-spacing: 2px; text-transform: uppercase; }
.restaurant-quote::before { content: '\201C'; font-family: Georgia; font-size: 120px; color: var(--gold); line-height: .5; display: block; margin-bottom: 20px; opacity: .3; }

/* ============================================================
   EVENTI HOME
   ============================================================ */
.section-events-home { background: var(--cream); padding: 80px 0; }
.events-home-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.event-home-card { background: #fff; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); transition: transform var(--transition), box-shadow var(--transition); }
.event-home-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.event-home-img { height: 220px; background: linear-gradient(135deg, var(--dark-2), var(--wine)); position: relative; background-size: cover; background-position: center; }
.event-img-default { background: linear-gradient(135deg, #2a1a0a, var(--wine)); }
.event-date-badge { position: absolute; top: 16px; left: 16px; background: #fff; border-radius: var(--radius); padding: 10px 14px; text-align: center; box-shadow: var(--shadow); }
.event-day { display: block; font-size: 28px; font-weight: 700; color: var(--wine); line-height: 1; }
.event-month { display: block; font-size: 12px; color: var(--text-lt); text-transform: uppercase; letter-spacing: 1px; }
.event-home-body { padding: 20px; }
.event-home-body h3 { font-size: 18px; margin-bottom: 8px; color: var(--dark); }
.event-meta { font-size: 13px; color: var(--text-lt); margin-bottom: 12px; display: flex; gap: 12px; flex-wrap: wrap; }
.event-home-body p { font-size: 14px; color: var(--text-lt); margin-bottom: 16px; }
.btn-event-more { background: var(--wine); color: #fff !important; padding: 8px 20px; border-radius: var(--radius); font-size: 14px; font-weight: 600; transition: background var(--transition); display: inline-block; }
.btn-event-more:hover { background: var(--gold); color: var(--dark) !important; }

/* ============================================================
   RECENSIONI
   ============================================================ */
.section-reviews { background: #fff; padding: 80px 0; }
.reviews-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.reviews-slider { display: flex; gap: 20px; overflow-x: auto; padding-bottom: 16px; scroll-snap-type: x mandatory; }
.review-card { background: var(--cream-2); border-radius: var(--radius-lg); padding: 28px; border: 1px solid var(--border); scroll-snap-align: start; min-width: 280px; }
.review-stars { color: var(--gold); font-size: 20px; margin-bottom: 12px; letter-spacing: 2px; }
.review-title { font-size: 16px; margin-bottom: 10px; color: var(--dark); }
.review-text { font-size: 14px; color: var(--text-lt); line-height: 1.7; margin-bottom: 16px; font-style: italic; }
.review-author { font-size: 13px; color: var(--wine); font-weight: 600; }
.star-rating { display: flex; flex-direction: row-reverse; gap: 4px; margin: 8px 0; }
.star-rating input { display: none; }
.star-rating label { font-size: 32px; color: #ddd; cursor: pointer; transition: color var(--transition); }
.star-rating input:checked ~ label,
.star-rating label:hover,
.star-rating label:hover ~ label { color: var(--gold); }

/* ============================================================
   CTA PRENOTAZIONE
   ============================================================ */
.section-booking-cta { background: var(--wine); padding: 70px 0; }
.booking-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; flex-wrap: wrap; }
.booking-cta-text h2 { font-size: clamp(24px, 4vw, 40px); color: #fff; margin-bottom: 12px; }
.booking-cta-text p { color: rgba(255,255,255,.8); font-size: 16px; max-width: 500px; }
.booking-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.btn-whatsapp-cta { background: #25D366; color: #fff !important; padding: 14px 24px; border-radius: var(--radius); font-weight: 700; display: flex; align-items: center; gap: 8px; transition: background var(--transition); }
.btn-whatsapp-cta:hover { background: #1da851; }
.btn-phone-cta { background: rgba(255,255,255,.15); color: #fff !important; border: 1px solid rgba(255,255,255,.3); padding: 14px 24px; border-radius: var(--radius); font-weight: 700; display: flex; align-items: center; gap: 8px; }
.btn-phone-cta:hover { background: rgba(255,255,255,.25); }

/* ============================================================
   PAGE HEROES
   ============================================================ */
.page-hero { position: relative; background: linear-gradient(135deg, #1a0a00, var(--wine)); min-height: 340px; display: flex; align-items: center; }
.page-hero-sm { min-height: 240px; }
.page-hero-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.4); }
.page-hero-content { position: relative; z-index: 2; text-align: center; color: #fff; }
.page-hero-content .section-tag { color: var(--gold); }
.page-hero-content h1 { font-size: clamp(32px, 6vw, 60px); color: #fff; margin: 12px 0; }
.page-hero-content p { font-size: 18px; color: rgba(255,255,255,.8); }

/* ============================================================
   MENU PAGE
   ============================================================ */
.menu-page-wrapper { padding: 60px 0; }
.menu-intro { text-align: center; max-width: 700px; margin: 0 auto 60px; }
.menu-intro p { font-size: 18px; color: var(--text-lt); }
.menu-intro-badges { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 20px; }
.badge { background: var(--cream-2); border: 1px solid var(--border); padding: 8px 16px; border-radius: 20px; font-size: 14px; display: flex; align-items: center; gap: 6px; }
.badge i { color: var(--wine); }
.menu-section { margin-bottom: 70px; }
.menu-section-speciale { background: var(--cream-2); border-radius: var(--radius-lg); padding: 40px; margin-bottom: 60px; }
.menu-section-header { text-align: center; margin-bottom: 40px; }
.menu-section-tag { color: var(--gold); font-size: 12px; letter-spacing: 3px; text-transform: uppercase; font-weight: 700; }
.menu-section-header h2 { font-size: 36px; margin: 12px 0; }
.menu-category-icon { font-size: 40px; display: block; margin-bottom: 12px; }
.menu-divider { display: flex; align-items: center; justify-content: center; margin-top: 16px; }
.menu-divider span { display: block; width: 60px; height: 2px; background: linear-gradient(to right, transparent, var(--gold), transparent); }
.menu-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
.menu-grid-featured { grid-template-columns: repeat(3, 1fr); }
.menu-item-card { background: #fff; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.menu-item-featured { box-shadow: var(--shadow-lg); }
.menu-item-img { height: 180px; overflow: hidden; }
.menu-item-img img { width: 100%; height: 100%; object-fit: cover; }
.menu-item-body { padding: 20px; }
.menu-item-body h3 { font-size: 18px; margin-bottom: 8px; }
.menu-item-desc { font-size: 14px; color: var(--text-lt); margin-bottom: 8px; }
.menu-item-allergeni { font-size: 12px; color: #999; margin-bottom: 12px; }
.menu-item-price { font-family: var(--font-serif); font-size: 24px; color: var(--wine); font-weight: 700; }
.menu-cat-nav { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-bottom: 40px; }
.menu-cat-btn { background: #fff; border: 2px solid var(--border); color: var(--text); padding: 10px 20px; border-radius: 30px; cursor: pointer; font-size: 14px; font-weight: 600; transition: all var(--transition); display: flex; align-items: center; gap: 6px; font-family: var(--font-sans); }
.menu-cat-btn:hover, .menu-cat-btn.active { background: var(--wine); border-color: var(--wine); color: #fff; }
/* ── Menu List ──────────────────────────────────────────────────────────── */
.menu-items-list {
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--border);
  border-radius: 16px; overflow: hidden;
  box-shadow: 0 2px 16px rgba(0,0,0,.05);
}

.menu-list-item {
  display: flex; align-items: flex-start; gap: 20px;
  padding: 20px 16px;
  position: relative;
  transition: background .2s, box-shadow .2s;
}
.menu-list-item::before {
  content: ''; position: absolute; left: 0; top: 14px; bottom: 14px;
  width: 3px; border-radius: 2px; background: var(--gold);
  transform: scaleY(0); transform-origin: center; transition: transform .22s ease;
}
.menu-list-item + .menu-list-item {
  border-top: 1px solid rgba(0,0,0,.07);
}
.menu-list-item:hover { background: rgba(201,168,76,.05); box-shadow: inset 3px 0 0 var(--gold); }
.menu-list-item:hover::before { transform: scaleY(1); }

/* Thumbnail */
.menu-list-thumb {
  width: 96px; height: 96px; border-radius: 12px; overflow: hidden; flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(0,0,0,.13);
}
.menu-list-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.menu-list-thumb-placeholder {
  width: 96px; height: 96px; border-radius: 12px; flex-shrink: 0;
  background: linear-gradient(135deg, var(--cream-2), var(--cream));
  border: 2px dashed var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 32px;
}

/* Info area */
.menu-list-info { flex: 1; min-width: 0; padding-top: 4px; }
.menu-list-header { display: flex; align-items: baseline; gap: 0; margin-bottom: 7px; }
.menu-list-name {
  font-family: var(--font-serif); font-size: 17px; font-weight: 700;
  color: var(--dark); letter-spacing: .2px; flex-shrink: 0;
}
/* Leader dots between name and price */
.menu-list-leader {
  flex: 1; min-width: 16px;
  border-bottom: 1px dotted var(--border); margin: 0 10px 3px; align-self: center;
}
.menu-list-price {
  font-family: var(--font-serif); font-size: 19px; font-weight: 700;
  color: var(--wine); white-space: nowrap; flex-shrink: 0;
  letter-spacing: .5px;
}
.menu-list-desc { font-size: 13.5px; color: var(--text-lt); line-height: 1.55; }
.menu-list-allergeni { font-size: 12px; color: #bbb; margin-top: 5px; }
.menu-list-dots { display: none; }
.menu-allergeni-note { background: #fffbf0; border: 1px solid #f0d870; border-radius: var(--radius); padding: 24px; margin: 40px 0; }
.menu-allergeni-note h4 { color: #8a6a00; margin-bottom: 10px; }
.allergeni-legend { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 12px; font-size: 14px; }
.menu-cta { text-align: center; background: var(--cream-2); border-radius: var(--radius-lg); padding: 50px; margin-top: 40px; }
.menu-cta h3 { font-size: 28px; margin-bottom: 12px; }
.menu-cta p { color: var(--text-lt); margin-bottom: 24px; }

/* ============================================================
   BOTTONI GENERALI
   ============================================================ */
.btn-prenota {
  display: inline-block; background: var(--wine); color: #fff !important;
  padding: 14px 32px; border-radius: var(--radius); font-weight: 700;
  font-size: 16px; transition: all var(--transition); border: none; cursor: pointer;
}
.btn-prenota:hover { background: var(--gold); color: var(--dark) !important; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(139,26,26,.3); }
.btn-outline-dark { display: inline-block; border: 2px solid var(--dark); color: var(--dark) !important; padding: 12px 28px; border-radius: var(--radius); font-weight: 700; transition: all var(--transition); }
.btn-outline-dark:hover { background: var(--dark); color: #fff !important; }
.btn-text { color: var(--wine); font-weight: 600; }
.btn-text:hover { color: var(--gold); }

/* ============================================================
   BOOKING FORM
   ============================================================ */
.booking-form-wrapper { max-width: 760px; margin: 0 auto; }
.booking-methods { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 40px; }
.booking-method-card {
  background: #fff; border: 2px solid var(--border); border-radius: var(--radius-lg);
  padding: 24px 16px; text-align: center; cursor: pointer;
  transition: all var(--transition);
}
.booking-method-card:hover, .booking-method-card.active {
  border-color: var(--wine); background: var(--wine); color: #fff;
}
.method-icon { font-size: 36px; color: var(--wine); margin-bottom: 12px; transition: color var(--transition); }
.booking-method-card:hover .method-icon, .booking-method-card.active .method-icon { color: var(--gold); }
.booking-method-card h3 { font-size: 16px; margin-bottom: 6px; transition: color var(--transition); }
.booking-method-card:hover h3, .booking-method-card.active h3 { color: #fff; }
.booking-method-card p { font-size: 13px; color: var(--text-lt); transition: color var(--transition); }
.booking-method-card:hover p, .booking-method-card.active p { color: rgba(255,255,255,.8); }
.booking-panel { background: #fff; border-radius: var(--radius-lg); padding: 40px; box-shadow: var(--shadow); }
.booking-panel h2 { font-size: 28px; margin-bottom: 30px; color: var(--dark); }
.form-section { margin-bottom: 30px; border-bottom: 1px solid var(--border); padding-bottom: 30px; }
.form-section:last-of-type { border-bottom: none; }
.section-title { font-size: 18px; margin-bottom: 20px; color: var(--wine); font-family: var(--font-sans); font-weight: 700; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-group { display: flex; flex-direction: column; gap: 6px; }
.form-group label { font-size: 14px; font-weight: 600; color: var(--dark); }
.form-group input,
.form-group select,
.form-group textarea {
  border: 1.5px solid var(--border); border-radius: var(--radius); padding: 12px 14px;
  font-size: 15px; transition: border-color var(--transition);
  background: #fff; color: var(--text);
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: none; border-color: var(--wine); box-shadow: 0 0 0 3px rgba(139,26,26,.1); }
.form-group textarea { resize: vertical; }
.checkbox-label { display: flex; align-items: center; gap: 10px; cursor: pointer; font-size: 14px; }
.checkbox-label input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--wine); }
.booking-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 30px; }
.btn-whatsapp-booking { display: flex; align-items: center; gap: 8px; background: #25D366; color: #fff !important; padding: 14px 24px; border-radius: var(--radius); font-weight: 700; font-size: 15px; transition: background var(--transition); }
.btn-whatsapp-booking:hover { background: #1da851; }
.booking-message { padding: 24px; border-radius: var(--radius); margin-top: 20px; }
.booking-message.success { background: #d4edda; border: 1px solid #c3e6cb; color: #155724; }
.booking-message.error { background: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; }
.booking-message h3 { margin-bottom: 10px; }
.booking-login-required { background: var(--cream-2); border-radius: var(--radius-lg); padding: 40px; text-align: center; }

/* ── Welcome banner – logged-in user ── */
.booking-user-banner {
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  background: linear-gradient(135deg, #fdf9f0 0%, #fff8ee 100%);
  border: 1.5px solid var(--gold); border-radius: 14px;
  padding: 18px 24px; margin-bottom: 28px;
  box-shadow: 0 2px 12px rgba(201,168,76,.12);
}
.bub-left { display: flex; flex-direction: column; gap: 5px; }
.bub-greet { font-size: 17px; font-weight: 600; color: var(--dark); font-family: var(--font-serif); }
.bub-hint { font-size: 13px; color: var(--text-lt); }
.bub-hint .fa { color: #28a745; margin-right: 4px; }
.bub-loyalty { display: flex; align-items: center; gap: 14px; }
.bub-level-icon { font-size: 2rem; line-height: 1; }
.bub-loyalty-info { display: flex; flex-direction: column; gap: 2px; }
.bub-level-name { font-size: 15px; font-weight: 800; letter-spacing: .3px; }
.bub-points { font-size: 13px; font-weight: 700; color: var(--dark); }
.bub-next { font-size: 11.5px; color: var(--text-lt); }
.bub-next-max { color: #28a745; font-weight: 700; }

/* ── Availability widget – redesign ── */
.avail-widget {
  border: 1.5px solid #28a745; border-radius: 12px; margin: .75rem 0 1.5rem;
  overflow: hidden; transition: border-color .3s, background .3s;
  background: #edf7ed;
}
.avail-header {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 18px;
}
.avail-icon { font-size: 1.6rem; flex-shrink: 0; }
.avail-summary { flex: 1; }
#avail-count { font-size: 1.55rem; font-weight: 800; line-height: 1; font-family: var(--font-serif); }
#avail-service { font-size: 13px; font-weight: 500; opacity: .75; }
.avail-bar-wrap {
  width: 72px; height: 7px; background: rgba(0,0,0,.12);
  border-radius: 4px; overflow: hidden; flex-shrink: 0;
}
.avail-bar-fill { height: 100%; border-radius: 4px; transition: width .5s ease; }
.avail-sizes {
  display: grid; grid-template-columns: repeat(3,1fr);
  border-top: 1px solid rgba(0,0,0,.07);
}
.avail-size-row {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 10px 8px;
}
.avail-size-row + .avail-size-row { border-left: 1px solid rgba(0,0,0,.07); }
.avail-size-label { font-size: 11.5px; color: var(--text-lt); font-weight: 600; text-align: center; }
.avail-size-count { font-size: 15px; font-weight: 800; font-family: var(--font-serif); }
.avail-sz-ok   { color: #28a745; }
.avail-sz-low  { color: #fd7e14; }
.avail-sz-full { color: #dc3545; }
.avail-sz-badge { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 10px; margin-left: 6px; white-space: nowrap; }
.avail-sz-badge-ok { background: #d4edda; color: #155724; }
.avail-sz-badge-no { background: #f8d7da; color: #721c24; }
.avail-combo-note { font-size: 11.5px; color: var(--text-lt); padding: 8px 18px; border-top: 1px solid rgba(0,0,0,.06); background: rgba(0,0,0,.02); }
.booking-avail-note { background: #fff8e1; border: 1px solid #ffe082; border-radius: 10px; padding: 12px 16px; margin-bottom: 22px; font-size: 13.5px; color: #5d4037; line-height: 1.5; }
.booking-avail-note .fa { color: #f9a825; margin-right: 6px; }
.booking-avail-note a { color: var(--wine); font-weight: 600; }
.field-error { font-size: 12.5px; color: #dc3545; margin-top: 4px; display: block; }
.avail-points-preview {
  display: none; padding: 10px 18px;
  border-top: 1px solid rgba(0,0,0,.07);
  font-size: 13px; color: var(--dark); background: rgba(255,255,255,.6);
}
.avail-points-preview strong { color: var(--wine); }
.booking-info-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 50px; }
.booking-info-card { background: #fff; border-radius: var(--radius); padding: 24px; text-align: center; border: 1px solid var(--border); }
.booking-info-card i { font-size: 28px; color: var(--gold); margin-bottom: 12px; display: block; }
.booking-info-card h4 { font-size: 16px; margin-bottom: 8px; }
.booking-info-card p { font-size: 14px; color: var(--text-lt); }
.prenotazione-wrapper { padding: 60px 0; }
.whatsapp-steps { display: flex; flex-direction: column; gap: 16px; margin-bottom: 30px; }
.wa-step { display: flex; align-items: center; gap: 16px; }
.wa-step-num { width: 32px; height: 32px; background: #25D366; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; }
.wa-quick-book { background: var(--cream-2); border-radius: var(--radius); padding: 24px; }
.wa-quick-book h3 { margin-bottom: 20px; }
.phone-number-display a { font-family: var(--font-serif); font-size: 36px; color: var(--wine); font-weight: 700; display: flex; align-items: center; gap: 12px; }
.phone-hours { margin-top: 24px; }

/* ============================================================
   EVENTI PAGE
   ============================================================ */
.eventi-wrapper { padding: 60px 0; }
.eventi-filter { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-bottom: 40px; }
.filter-btn { background: #fff; border: 2px solid var(--border); color: var(--text); padding: 10px 22px; border-radius: 30px; cursor: pointer; font-size: 14px; font-weight: 600; transition: all var(--transition); font-family: var(--font-sans); }
.filter-btn:hover, .filter-btn.active { background: var(--wine); border-color: var(--wine); color: #fff; }
.eventi-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 60px; }
.evento-card { background: #fff; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); transition: transform var(--transition), box-shadow var(--transition); }
.evento-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.evento-img-wrapper { position: relative; }
.evento-img { height: 240px; background: linear-gradient(135deg, var(--dark-2), var(--wine)); position: relative; background-size: cover; background-position: center; }
.evento-img-default { background: linear-gradient(135deg, #2a1a0a, var(--wine)); }
.evento-date-badge { position: absolute; top: 16px; left: 16px; background: #fff; border-radius: var(--radius); padding: 12px 16px; text-align: center; box-shadow: var(--shadow); }
.ev-day { display: block; font-size: 32px; font-weight: 700; color: var(--wine); line-height: 1; }
.ev-month { display: block; font-size: 12px; color: var(--text-lt); text-transform: uppercase; letter-spacing: 1px; }
.ev-year { display: block; font-size: 11px; color: var(--text-lt); }
.evento-tipo-badge { position: absolute; bottom: 12px; right: 12px; background: var(--gold); color: var(--dark); font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 20px; }
.evento-body { padding: 20px; }
.evento-title { font-size: 20px; margin-bottom: 12px; }
.evento-meta { display: flex; gap: 12px; flex-wrap: wrap; font-size: 13px; color: var(--text-lt); margin-bottom: 12px; }
.ev-gratuito { color: #1a6b3a; font-weight: 600; }
.evento-excerpt { font-size: 14px; color: var(--text-lt); margin-bottom: 20px; line-height: 1.6; }
.evento-actions { display: flex; gap: 10px; }
.btn-evento-detail { background: var(--cream-2); color: var(--dark) !important; padding: 8px 16px; border-radius: var(--radius); font-size: 14px; font-weight: 600; border: 1px solid var(--border); }
.btn-evento-prenota { background: var(--wine); color: #fff !important; padding: 8px 16px; border-radius: var(--radius); font-size: 14px; font-weight: 600; }
.eventi-section-title { font-size: 28px; margin-bottom: 30px; padding-bottom: 12px; border-bottom: 2px solid var(--border); }
.eventi-no-events { text-align: center; padding: 80px 20px; color: var(--text-lt); }
.eventi-no-events i { font-size: 60px; color: var(--border); margin-bottom: 20px; display: block; }
.eventi-past-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.evento-past-card { background: var(--cream-2); border-radius: var(--radius); overflow: hidden; display: flex; gap: 12px; }
.evento-past-card img { width: 80px; height: 80px; object-fit: cover; flex-shrink: 0; }
.evento-past-info { padding: 12px; flex: 1; }
.ev-past-date { font-size: 11px; color: var(--text-lt); }
.evento-past-info h4 { font-size: 14px; margin: 4px 0; }
.evento-past-info a { font-size: 12px; color: var(--wine); font-weight: 600; }

/* ============================================================
   STORIA PAGE
   ============================================================ */
.storia-wrapper { padding: 70px 0; }
.storia-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; margin-bottom: 80px; }
.storia-year-tag { display: inline-block; color: var(--gold); font-size: 12px; letter-spacing: 3px; text-transform: uppercase; font-weight: 700; margin-bottom: 16px; }
.storia-intro-text h2 { font-size: 36px; margin-bottom: 20px; }
.storia-intro-text p { color: var(--text-lt); font-size: 16px; line-height: 1.8; margin-bottom: 16px; }
.storia-lead { font-size: 18px !important; color: var(--text) !important; font-style: italic; }
.storia-img-placeholder { background: linear-gradient(135deg, var(--cream-2), #e0d0be); border-radius: var(--radius-lg); height: 400px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 2px dashed var(--border); }
.storia-img-placeholder span { font-size: 60px; }
.storia-img-placeholder p { color: var(--text-lt); margin-top: 12px; }
.storia-section-title { text-align: center; font-size: 36px; margin-bottom: 50px; }
.timeline { position: relative; max-width: 900px; margin: 0 auto; padding: 20px 0; }
.timeline::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; background: linear-gradient(to bottom, var(--gold), var(--wine)); }
.timeline-item { display: flex; margin-bottom: 40px; }
.timeline-left { flex-direction: row-reverse; }
.timeline-right { flex-direction: row; }
.timeline-dot { width: 16px; height: 16px; background: var(--gold); border: 3px solid #fff; border-radius: 50%; position: absolute; left: 50%; transform: translateX(-50%); margin-top: 20px; z-index: 1; }
.timeline-dot-current { background: var(--wine); width: 22px; height: 22px; }
.timeline-content { width: calc(50% - 40px); padding: 24px; background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.timeline-left .timeline-content { margin-right: 40px; }
.timeline-right .timeline-content { margin-left: 40px; }
.timeline-year { display: inline-block; background: var(--wine); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: 2px; padding: 4px 12px; border-radius: 20px; margin-bottom: 10px; }
.timeline-content h3 { font-size: 20px; margin-bottom: 8px; }
.timeline-content p { font-size: 14px; color: var(--text-lt); line-height: 1.7; }
.timeline-content-current { border: 2px solid var(--gold); }
.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-bottom: 60px; }
.team-card { background: #fff; border-radius: var(--radius-lg); padding: 30px; text-align: center; box-shadow: var(--shadow); }
.team-avatar { font-size: 60px; margin-bottom: 16px; }
.team-card h3 { font-size: 20px; margin-bottom: 6px; }
.team-role { display: block; color: var(--gold); font-size: 13px; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 12px; }
.team-card p { font-size: 14px; color: var(--text-lt); line-height: 1.7; }
.values-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.value-item { text-align: center; padding: 30px 20px; }
.value-icon { font-size: 50px; margin-bottom: 16px; display: block; }
.value-item h3 { font-size: 20px; margin-bottom: 12px; }
.value-item p { font-size: 14px; color: var(--text-lt); line-height: 1.7; }
.storia-cta { text-align: center; background: var(--cream-2); border-radius: var(--radius-lg); padding: 60px; margin-top: 60px; }
.storia-cta h2 { font-size: 36px; margin-bottom: 12px; }
.storia-cta p { color: var(--text-lt); font-size: 16px; margin-bottom: 24px; }

/* ============================================================
   CONTATTI PAGE
   ============================================================ */
.contatti-wrapper { padding: 70px 0; }
.contatti-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.contatti-form-col h2, .contatti-info-col h2 { font-size: 28px; margin-bottom: 28px; }
.contact-form .form-group { margin-bottom: 16px; }
.contatti-info-cards { display: flex; flex-direction: column; gap: 20px; margin-bottom: 24px; }
.contatti-info-item { display: flex; gap: 16px; align-items: flex-start; }
.contatti-icon { width: 40px; height: 40px; background: var(--wine); color: var(--gold); border-radius: var(--radius); display: flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0; }
.contatti-info-item h4 { font-size: 14px; color: var(--text-lt); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px; font-family: var(--font-sans); font-weight: 700; }
.contatti-info-item p, .contatti-info-item a { font-size: 15px; color: var(--dark); }
.contatti-info-item a:hover { color: var(--wine); }
.map-link { display: inline-block; margin-top: 6px; font-size: 13px; color: var(--wine); font-weight: 600; }
.mappa-wrapper { border-radius: var(--radius); overflow: hidden; }
.form-success { background: #d4edda; border: 1px solid #c3e6cb; color: #155724; padding: 24px; border-radius: var(--radius); margin-bottom: 24px; }
.form-error { background: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; padding: 16px; border-radius: var(--radius); margin-bottom: 24px; }

/* ============================================================
   INTERNI PAGE
   ============================================================ */
.interni-wrapper { padding: 60px 0; }
.interni-intro { text-align: center; max-width: 700px; margin: 0 auto 50px; font-size: 17px; color: var(--text-lt); }
.interni-gallery-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 260px; gap: 6px; margin-bottom: 80px; }
.gallery-item { position: relative; overflow: hidden; cursor: pointer; background-size: cover; background-position: center; background-color: var(--dark-2); transition: transform var(--transition); }
.gallery-item:hover { transform: scale(1.02); }
.gallery-item:nth-child(4n+1) { grid-column: span 2; }
.gallery-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.85), transparent 60%); opacity: 0; transition: opacity var(--transition); display: flex; flex-direction: column; justify-content: flex-end; padding: 24px; }
.gallery-item:hover .gallery-overlay { opacity: 1; }
.gallery-overlay h3 { color: #fff; font-size: 18px; margin-bottom: 6px; }
.gallery-overlay p { color: rgba(255,255,255,.75); font-size: 13px; margin-bottom: 12px; }
.gallery-zoom { color: var(--gold); font-size: 20px; }
.interni-spaces { margin-bottom: 70px; }
.interni-spaces h2 { font-size: 36px; text-align: center; margin-bottom: 40px; }
.spaces-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.space-card { background: #fff; border-radius: var(--radius-lg); padding: 32px; box-shadow: var(--shadow); border-top: 4px solid var(--gold); }
.space-icon { font-size: 48px; margin-bottom: 16px; }
.space-card h3 { font-size: 22px; margin-bottom: 12px; }
.space-detail { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--text-lt); margin-bottom: 8px; }
.space-detail i { color: var(--wine); width: 16px; }
.space-card p { font-size: 14px; color: var(--text-lt); margin-top: 12px; line-height: 1.7; }
.interni-cta { background: var(--wine); color: #fff; border-radius: var(--radius-lg); padding: 50px; display: flex; align-items: center; justify-content: space-between; gap: 40px; flex-wrap: wrap; }
.interni-cta-text h2 { font-size: 28px; color: #fff; margin-bottom: 12px; }
.interni-cta-text p { color: rgba(255,255,255,.8); }
.interni-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* ============================================================
   ACCOUNT PAGE
   ============================================================ */
.account-wrapper { padding: 60px 0; }
.account-layout { display: grid; grid-template-columns: 280px 1fr; gap: 40px; align-items: start; }
.account-sidebar { position: sticky; top: 100px; }
.account-profile-card { background: var(--wine); color: #fff; border-radius: var(--radius-lg); padding: 24px; margin-bottom: 16px; display: flex; align-items: center; gap: 16px; }
.account-avatar { width: 50px; height: 50px; background: rgba(255,255,255,.2); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 700; flex-shrink: 0; }
.account-profile-info strong { display: block; font-size: 15px; }
.account-profile-info span { font-size: 12px; opacity: .75; }
.account-level-badge { display: inline-block; background: var(--gold); color: var(--dark); font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 20px; margin-top: 6px; }
.account-nav { background: #fff; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.account-nav-item { display: flex; align-items: center; gap: 10px; padding: 14px 20px; color: var(--text) !important; font-weight: 600; font-size: 14px; border-bottom: 1px solid var(--border); transition: background var(--transition); }
.account-nav-item:last-child { border-bottom: none; }
.account-nav-item:hover, .account-nav-item.active { background: var(--cream-2); color: var(--wine) !important; }
.account-nav-item i { width: 16px; text-align: center; color: var(--gold); }
.account-nav-item.logout { color: #cc4444 !important; }
.account-nav-item.logout:hover { background: #fff0f0; }
.account-content { background: #fff; border-radius: var(--radius-lg); padding: 36px; box-shadow: var(--shadow); }
.account-section h2 { font-size: 26px; margin-bottom: 24px; display: flex; align-items: center; gap: 10px; }
.account-section h2 i { color: var(--gold); }
.dashboard-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 30px; }
.dash-card { border-radius: var(--radius-lg); padding: 24px; text-align: center; color: #fff; }
.dash-card-gold { background: linear-gradient(135deg, #b8930e, var(--gold)); }
.dash-card-red { background: linear-gradient(135deg, var(--wine-dk), var(--wine)); }
.dash-card-dark { background: linear-gradient(135deg, #1a1a2a, #2a2a4a); }
.dash-card i { font-size: 28px; opacity: .8; margin-bottom: 8px; }
.dash-card-value { font-size: 36px; font-weight: 700; font-family: var(--font-serif); }
.dash-card-label { font-size: 12px; opacity: .8; letter-spacing: 1px; text-transform: uppercase; margin-top: 4px; }
.dashboard-quick-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.account-login-required { background: #fff; border-radius: var(--radius-lg); padding: 40px; box-shadow: var(--shadow); max-width: 720px; }
.auth-tabs { display: flex; border-bottom: 2px solid var(--border); margin-bottom: 30px; }
.auth-tab { padding: 14px 28px; background: none; border: none; cursor: pointer; font-size: 16px; font-weight: 600; color: var(--text-lt); border-bottom: 3px solid transparent; margin-bottom: -2px; font-family: var(--font-sans); transition: all var(--transition); }
.auth-tab.active, .auth-tab:hover { color: var(--wine); border-bottom-color: var(--wine); }
.auth-tab-content { display: none; }
.auth-tab-content.active { display: block; }
.register-benefits { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 28px; }
.benefit-item { display: flex; align-items: center; gap: 10px; background: var(--cream-2); padding: 12px 16px; border-radius: var(--radius); font-size: 14px; }
.benefit-item i { color: var(--wine); font-size: 18px; }
.user-bookings-list { display: flex; flex-direction: column; gap: 12px; }
.booking-card { background: var(--cream-2); border-radius: var(--radius); padding: 16px 20px; border-left: 4px solid var(--border); }
.booking-card.stato-confermata { border-left-color: #28a745; }
.booking-card.stato-annullata { border-left-color: #dc3545; }
.booking-card.stato-completata { border-left-color: #17a2b8; }
.booking-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.booking-date { font-weight: 700; color: var(--dark); }
.booking-status { font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 20px; }
.badge-success { background: #d4edda; color: #155724; }
.badge-warning { background: #fff3cd; color: #856404; }
.badge-danger { background: #f8d7da; color: #721c24; }
.badge-info { background: #d1ecf1; color: #0c5460; }
.booking-card-body p { font-size: 14px; color: var(--text-lt); margin-bottom: 4px; }
.booking-card-footer { padding-top: 12px; border-top: 1px solid var(--border); margin-top: 12px; }
.booking-card.stato-annullata .booking-card-body,
.booking-card.stato-annullata .booking-date { opacity: .6; }
.btn-cancel-booking { background: none; border: 1px solid #dc3545; color: #dc3545; border-radius: 6px;
    padding: 6px 14px; font-size: 13px; cursor: pointer; transition: background .15s, color .15s; }
.btn-cancel-booking:hover:not(:disabled) { background: #dc3545; color: #fff; }
.btn-cancel-booking:disabled { opacity: .5; cursor: default; }
.no-bookings { color: var(--text-lt); font-size: 15px; }

/* ============================================================
   LOYALTY
   ============================================================ */
.loyalty-dashboard { display: flex; flex-direction: column; gap: 30px; }
.loyalty-card { background: var(--dark); border-radius: var(--radius-lg); overflow: hidden; }
.loyalty-card-bg { background: linear-gradient(135deg, #1a1a1a, #8B1A1A 60%, #C9A84C); }
.loyalty-card-inner { padding: 32px; }
.loyalty-card-header { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
.loyalty-level-icon { font-size: 40px; }
.loyalty-member-name { font-size: 20px; color: #fff; font-weight: 700; }
.loyalty-level-name { color: var(--gold); font-size: 13px; letter-spacing: 2px; text-transform: uppercase; }
.loyalty-points-display { text-align: center; margin-bottom: 16px; }
.loyalty-pts-number { display: block; font-size: 72px; color: var(--gold); font-family: var(--font-serif); font-weight: 700; line-height: 1; }
.loyalty-pts-label { display: block; color: rgba(255,255,255,.6); font-size: 13px; letter-spacing: 4px; text-transform: uppercase; margin-top: 6px; }
.loyalty-discount-badge { text-align: center; background: var(--gold); color: var(--dark); font-weight: 700; padding: 8px 24px; border-radius: 30px; display: inline-block; font-size: 14px; margin: 0 auto; display: block; width: fit-content; }
.loyalty-progress-section { padding: 20px 32px; background: rgba(0,0,0,.3); color: rgba(255,255,255,.8); font-size: 14px; }
.loyalty-progress-bar { background: rgba(255,255,255,.1); border-radius: 10px; height: 8px; margin-top: 10px; overflow: hidden; }
.loyalty-progress-fill { height: 100%; background: linear-gradient(to right, var(--wine), var(--gold)); border-radius: 10px; transition: width 1s ease; }
.loyalty-levels h3 { font-size: 20px; margin-bottom: 20px; }
.levels-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.level-item { background: #fff; border: 2px solid var(--border); border-radius: var(--radius); padding: 16px; text-align: center; font-size: 12px; }
.level-item.reached { border-color: var(--gold); background: #fffbf0; }
.level-item.current { border-color: var(--wine); background: #fff5f5; font-weight: 700; }
.level-icon { font-size: 28px; display: block; margin-bottom: 8px; }
.level-name { display: block; font-weight: 700; margin-bottom: 4px; color: var(--dark); font-size: 13px; }
.level-pts { display: block; color: var(--text-lt); font-size: 11px; }
.level-discount { display: block; background: var(--wine); color: #fff; border-radius: 20px; padding: 2px 8px; font-size: 10px; margin-top: 6px; }
.loyalty-how h3, .loyalty-history h3 { font-size: 20px; margin-bottom: 16px; }
.how-list { display: flex; flex-direction: column; gap: 10px; }
.how-list li { display: flex; align-items: center; gap: 12px; font-size: 15px; }
.pts-badge { background: var(--wine); color: #fff; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 20px; white-space: nowrap; }
.history-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.history-table th { background: var(--cream-2); padding: 10px 12px; text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; }
.history-table td { padding: 10px 12px; border-bottom: 1px solid var(--border); }
.pts-move.positive { color: #1a6b3a; font-weight: 700; }
.pts-move.negative { color: #cc4444; font-weight: 700; }

/* ============================================================
   LIGHTBOX
   ============================================================ */
.lightbox {
  position: fixed; inset: 0; background: rgba(0,0,0,.95); z-index: 9999;
  display: none; align-items: center; justify-content: center;
  padding: 20px;
}
.lightbox.open { display: flex; }
.lightbox-close { position: absolute; top: 20px; right: 24px; background: none; border: none; color: #fff; font-size: 40px; cursor: pointer; opacity: .7; transition: opacity var(--transition); z-index: 10; }
.lightbox-close:hover { opacity: 1; }
.lightbox-prev, .lightbox-next { background: rgba(255,255,255,.1); border: none; color: #fff; font-size: 24px; width: 50px; height: 50px; border-radius: 50%; cursor: pointer; transition: background var(--transition); }
.lightbox-prev:hover, .lightbox-next:hover { background: var(--wine); }
.lightbox-content { flex: 1; text-align: center; max-width: 90vw; }
.lightbox-img-wrapper { display: flex; align-items: center; justify-content: center; }
.lightbox-img-wrapper img { max-height: 80vh; max-width: 100%; border-radius: var(--radius); }
.lightbox-placeholder { width: 600px; height: 450px; background: linear-gradient(135deg, var(--dark-2), var(--wine)); border-radius: var(--radius-lg); display: flex; align-items: center; justify-content: center; font-size: 60px; max-width: 90vw; }
.lightbox-caption { color: rgba(255,255,255,.8); font-family: var(--font-serif); font-size: 18px; margin-top: 16px; }

/* ============================================================
   REVIEW FORM
   ============================================================ */
.review-form-wrapper { background: var(--cream-2); border-radius: var(--radius-lg); padding: 32px; }
.review-form-wrapper h3 { font-size: 22px; margin-bottom: 24px; }
.review-form .form-group { margin-bottom: 16px; }

/* ============================================================
   AUTH FORM
   ============================================================ */
.auth-form-wrapper { max-width: 620px; }
.auth-form { display: flex; flex-direction: column; gap: 0; }
.password-wrapper { position: relative; }
.password-wrapper input { width: 100%; padding-right: 44px; }
.toggle-pw { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; font-size: 18px; }
.password-strength { height: 4px; border-radius: 2px; margin-top: 6px; background: var(--border); overflow: hidden; }
.auth-switch, .auth-links { text-align: center; margin-top: 20px; font-size: 14px; color: var(--text-lt); }
.auth-links a { color: var(--wine); font-weight: 600; }
.logged-in-welcome { background: var(--cream-2); border-radius: var(--radius-lg); padding: 32px; }
.user-quick-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.btn-whatsapp-sm { background: #25D366; color: #fff !important; padding: 10px 18px; border-radius: var(--radius); font-weight: 700; font-size: 14px; display: flex; align-items: center; gap: 6px; }
.btn-outline { border: 2px solid var(--dark); color: var(--dark) !important; padding: 10px 20px; border-radius: var(--radius); font-weight: 700; font-size: 14px; }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer { background: var(--dark); }
.footer-main { padding: 70px 0 40px; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1.2fr 1.2fr; gap: 40px; }
.footer-logo { font-family: var(--font-script); font-size: 28px; color: var(--gold); margin-bottom: 6px; }
.footer-slogan { color: rgba(255,255,255,.6); font-size: 13px; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 16px; }
.footer-about p { color: rgba(255,255,255,.6); font-size: 14px; line-height: 1.8; }
.footer-social { display: flex; gap: 12px; margin-top: 20px; }
.footer-social a { width: 36px; height: 36px; background: rgba(255,255,255,.1); color: rgba(255,255,255,.7); border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: all var(--transition); }
.footer-social a:hover { background: var(--gold); color: var(--dark); }
.footer-col h4 { color: #fff; font-family: var(--font-sans); font-size: 14px; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,.1); }
.footer-links ul { display: flex; flex-direction: column; gap: 8px; }
.footer-links a { color: rgba(255,255,255,.6); font-size: 14px; transition: color var(--transition); }
.footer-links a:hover { color: var(--gold); }
.contact-item { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 14px; }
.contact-item i { color: var(--gold); margin-top: 3px; width: 14px; }
.contact-item span, .contact-item a { color: rgba(255,255,255,.7); font-size: 14px; line-height: 1.5; }
.contact-item a:hover { color: var(--gold); }
.footer-cta p { color: rgba(255,255,255,.6); font-size: 14px; margin-bottom: 16px; }
.btn-footer-prenota { display: block; background: var(--wine); color: #fff !important; padding: 12px 20px; border-radius: var(--radius); font-weight: 700; text-align: center; margin-bottom: 8px; transition: background var(--transition); }
.btn-footer-prenota:hover { background: var(--gold); color: var(--dark) !important; }
.btn-footer-whatsapp { display: flex; align-items: center; justify-content: center; gap: 8px; background: #25D366; color: #fff !important; padding: 12px 20px; border-radius: var(--radius); font-weight: 700; margin-bottom: 8px; }
.btn-footer-account { display: flex; align-items: center; justify-content: center; gap: 8px; background: rgba(255,255,255,.1); color: rgba(255,255,255,.8) !important; padding: 12px 20px; border-radius: var(--radius); font-size: 14px; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.1); padding: 20px 0; }
.footer-bottom-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.footer-bottom p { color: rgba(255,255,255,.4); font-size: 13px; }
.footer-bottom a { color: rgba(255,255,255,.5); }
.footer-bottom a:hover { color: var(--gold); }
.footer-credits { font-size: 12px; }

/* ============================================================
   ANIMAZIONI
   ============================================================ */
@keyframes fadeInDown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes scrollPulse { 0%,100% { opacity: 1; transform: scaleY(1); } 50% { opacity: .5; transform: scaleY(.7); } }
.fade-in-up { animation: fadeInUp .6s ease both; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .numbers-grid { grid-template-columns: repeat(2, 1fr); }
  .piatto-slide { min-width: calc(33.333% - 14px); }
  .events-home-grid { grid-template-columns: repeat(2, 1fr); }
  .reviews-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .values-grid { grid-template-columns: repeat(2, 1fr); }
  .interni-gallery-grid { grid-template-columns: repeat(3, 1fr); }
  .booking-methods { grid-template-columns: repeat(2, 1fr); }
  .booking-info-cards { grid-template-columns: repeat(2, 1fr); }
  .levels-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
  .top-bar { display: none; }
  .main-navigation { position: fixed; top: 0; right: -300px; bottom: 0; width: min(280px, 88vw); background: #fff; box-shadow: -4px 0 20px rgba(0,0,0,.18); z-index: 9999; padding: 80px 24px 24px; overflow-y: auto; transition: right .3s ease; }
  .main-navigation.open { right: 0; }
  .header-actions { position: relative; z-index: 10000; }
  .nav-menu { flex-direction: column; gap: 0; align-items: stretch; }
  .nav-menu li a { display: block; padding: 14px 0; border-bottom: 1px solid var(--border); font-size: 16px; border-radius: 0; }
  /* Mobile: sub-menu chevron and toggle */
  .nav-menu .menu-item-has-children > a { display: flex; justify-content: space-between; align-items: center; }
  /* Mobile: override desktop hover dropdown with accordion */
  .nav-menu .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; pointer-events: auto; box-shadow: none; border: none; border-left: 3px solid var(--gold); border-top: none; border-radius: 0; background: var(--cream-2); padding: 4px 0; margin: 0 0 0 12px; max-height: 0; overflow: hidden; transition: max-height .3s ease; }
  .nav-menu .sub-menu::before { display: none; }
  .nav-menu .menu-item-has-children.sub-open > .sub-menu { max-height: 500px; }
  .nav-menu .menu-item-has-children:hover > .sub-menu { opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
  .nav-menu .sub-menu li a { padding: 11px 14px; font-size: 14px; border-bottom: 1px solid var(--border); }
  .nav-menu .menu-item-has-children.sub-open > a::after { transform: rotate(-180deg); }
  .menu-toggle { display: flex; }
  .btn-prenota-header { display: none; }
  .hero-title { font-size: 52px; }
  .interni-mosaic { grid-template-columns: repeat(2, 1fr); }
  .mosaic-large { grid-column: span 1; }
  .piatto-slide { min-width: calc(50% - 10px); }
  .events-home-grid { grid-template-columns: 1fr; }
  .reviews-grid { grid-template-columns: 1fr; }
  .booking-cta-inner { flex-direction: column; text-align: center; }
  .timeline::before { left: 20px; }
  .timeline-item { flex-direction: column; }
  .timeline-left, .timeline-right { flex-direction: column; }
  .timeline-content { width: 100%; margin: 0; margin-left: 44px !important; margin-right: 0 !important; }
  .timeline-dot { left: 20px; }
  .team-grid { grid-template-columns: 1fr 1fr; }
  .storia-intro { grid-template-columns: 1fr; }
  .contatti-grid { grid-template-columns: 1fr; }
  .account-layout { grid-template-columns: 1fr; }
  .account-sidebar { position: static; }
  .dashboard-cards { grid-template-columns: 1fr 1fr; }
  .levels-grid { grid-template-columns: repeat(2, 1fr); }
  .form-row { grid-template-columns: 1fr; }
  .booking-user-banner { flex-direction: column; align-items: flex-start; gap: 14px; }
  .booking-methods { grid-template-columns: repeat(2, 1fr); }
  .menu-grid-featured { grid-template-columns: 1fr; }
  .eventi-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 20px; }
  .interni-gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .interni-gallery-grid .gallery-item:nth-child(4n+1) { grid-column: span 1; }
  .spaces-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .account-login-required { padding: 24px 18px; }
  .hero-title { font-size: 38px; }
  .hero-actions { flex-direction: column; align-items: center; }
  .numbers-grid { grid-template-columns: 1fr; }
  .piatto-slide { min-width: 100%; }
  .booking-methods { grid-template-columns: 1fr; }
  .booking-info-cards { grid-template-columns: 1fr; }
  .dashboard-cards { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr; }
  .values-grid { grid-template-columns: 1fr; }
  .interni-cta { flex-direction: column; text-align: center; }
  .menu-grid { grid-template-columns: 1fr; }
  .form-group input, .form-group select, .form-group textarea { font-size: 16px; } /* previene zoom su iOS */
  .hero-actions .btn-prenota, .hero-actions a { width: 100%; text-align: center; box-sizing: border-box; }
  .register-benefits { grid-template-columns: 1fr; }
  .timeline-content { margin-left: 36px !important; }
}

@media (max-width: 600px) {
  .hero-title { font-size: 44px; }
  .section-header h2 { font-size: 26px; }
  .storia-intro-text h2 { font-size: 28px; }
  /* Tabelle con scroll orizzontale su mobile */
  .wp-list-table, .table-responsive, .prenotazioni-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .adm-gruppo-grande-panel { font-size: 14px; }
  .ggp-btn { width: 32px; height: 32px; font-size: 16px; }
}

/* ============================================================
   IDEE REGALO
   ============================================================ */
.regalo-hero { background: linear-gradient(135deg, #1a0a0a 0%, #8B1A1A 60%, #5a1010 100%); }

.regalo-wrapper { padding: 3rem 0 5rem; }

/* Intro bar */
.regalo-intro-bar { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center;
    background: #fff8f0; border: 1px solid #f0e4d0; border-radius: 12px;
    padding: 18px 24px; margin-bottom: 3rem; }
.rib-item { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #555; }
.rib-item span { font-weight: 500; }

/* Section heading */
.regalo-section-title { font-size: 28px; color: var(--dark); text-align: center; margin-bottom: 8px; }
.regalo-section-sub { text-align: center; color: var(--text-lt); max-width: 540px; margin: 0 auto 2.5rem; font-size: 15px; }

/* Cards griglia */
.regalo-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 24px; margin-bottom: 3rem; }

.regalo-card { background: #fff; border: 1.5px solid var(--border); border-radius: 16px;
    padding: 28px 24px; cursor: pointer; transition: transform .2s, box-shadow .2s, border-color .2s;
    display: flex; flex-direction: column; position: relative; overflow: hidden; }
.regalo-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, var(--red), var(--gold)); opacity: 0; transition: opacity .2s; }
.regalo-card:hover { transform: translateY(-6px); box-shadow: 0 16px 40px rgba(139,26,26,.15);
    border-color: var(--red); }
.regalo-card:hover::before { opacity: 1; }

.regalo-card-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 16px; }
.regalo-card-icon { font-size: 40px; line-height: 1; }
.regalo-card-badge { background: var(--red); color: #fff; font-size: 15px; font-weight: 700;
    padding: 4px 14px; border-radius: 20px; white-space: nowrap; }
.regalo-card-badge.custom-badge { background: var(--gold); color: var(--dark); }

.regalo-card h3 { font-size: 18px; color: var(--dark); margin: 0 0 8px; }
.regalo-card p { font-size: 14px; color: var(--text-lt); margin: 0 0 20px; flex: 1; line-height: 1.5; }
.regalo-card-cta { font-size: 13px; font-weight: 700; color: var(--red); letter-spacing: .5px;
    align-self: flex-start; border-bottom: 1px solid transparent; transition: border-color .15s; }
.regalo-card:hover .regalo-card-cta { border-color: var(--red); }

/* Info strip */
.regalo-info-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
    background: var(--cream-2); border-radius: 16px; padding: 32px; }
.ri-col strong { display: block; font-size: 15px; color: var(--dark); margin-bottom: 12px;
    border-bottom: 2px solid var(--gold); padding-bottom: 6px; }
.ri-col ol, .ri-col ul { padding-left: 18px; margin: 0; }
.ri-col li { font-size: 14px; color: var(--text-lt); margin-bottom: 6px; line-height: 1.5; }
.ri-col p { font-size: 14px; color: var(--text-lt); margin: 0 0 4px; }

/* Form wrap */
#regalo-form-wrap { max-width: 680px; margin: 0 auto; }

/* Barra prodotto selezionato */
.regalo-selected-bar { display: flex; align-items: center; justify-content: space-between;
    background: #fff8f0; border: 1.5px solid var(--gold); border-radius: 12px;
    padding: 14px 20px; margin-bottom: 28px; flex-wrap: wrap; gap: 10px; }
.rsb-price { font-weight: 700; font-size: 20px; color: var(--red); }
.rsb-change { background: none; border: none; color: var(--text-lt); cursor: pointer;
    font-size: 13px; text-decoration: underline; }

/* Progress */
.regalo-progress { display: flex; align-items: center; margin-bottom: 36px; }
.regalo-progress-step { display: flex; flex-direction: column; align-items: center; gap: 6px; flex-shrink: 0; }
.rp-num { width: 36px; height: 36px; border-radius: 50%; background: #e0e0e0; color: #999;
    font-weight: 700; font-size: 15px; display: flex; align-items: center; justify-content: center;
    transition: background .3s, color .3s; }
.rp-label { font-size: 12px; color: #999; font-weight: 500; transition: color .3s; }
.rps-active .rp-num { background: var(--red); color: #fff; }
.rps-active .rp-label { color: var(--red); font-weight: 700; }
.rps-done .rp-num { background: #28a745; color: #fff; }
.rps-done .rp-num::before { content: '✓'; }
.regalo-progress-line { flex: 1; height: 2px; background: #e0e0e0; margin: 0 8px 22px; }

/* Step */
.regalo-step { background: #fff; border: 1.5px solid var(--border); border-radius: 16px; padding: 32px; }
.regalo-step h3 { font-size: 20px; color: var(--dark); margin: 0 0 24px; }

/* Custom amount */
.regalo-custom-amount { background: #fff8f0; border: 1.5px solid var(--gold); border-radius: 10px;
    padding: 16px 20px; margin-bottom: 24px; }
.regalo-custom-amount label { font-weight: 700; font-size: 14px; display: block; margin-bottom: 10px; }
.custom-amount-input { display: flex; align-items: center; gap: 0; max-width: 180px; }
.ca-euro { background: var(--cream-2); border: 1.5px solid var(--border); border-right: none;
    padding: 10px 14px; border-radius: 8px 0 0 8px; font-weight: 700; color: var(--red); font-size: 16px; }
.custom-amount-input input { border: 1.5px solid var(--border); border-radius: 0 8px 8px 0;
    padding: 10px 14px; font-size: 18px; font-weight: 700; width: 130px; }

/* Error */
.regalo-error { background: #fdf0f0; border: 1px solid #f5c6cb; color: #721c24;
    border-radius: 8px; padding: 10px 14px; font-size: 13px; margin-bottom: 16px; }

/* Step nav */
.regalo-step-nav { display: flex; justify-content: space-between; align-items: center;
    margin-top: 28px; gap: 12px; flex-wrap: wrap; }

/* Demo banner */
.demo-payment-banner { background: #fff3cd; border: 2px solid #ffc107; border-radius: 10px;
    padding: 14px 20px; margin-bottom: 28px; font-size: 14px; color: #664d03; line-height: 1.6; }

/* Order summary */
.regalo-order-summary { background: var(--cream-2); border-radius: 10px; padding: 18px 20px;
    margin-bottom: 28px; }
.ros-row { display: flex; justify-content: space-between; align-items: center;
    padding: 6px 0; font-size: 15px; }
.ros-total { border-top: 2px solid var(--border); margin-top: 8px; padding-top: 12px;
    font-weight: 700; font-size: 18px; color: var(--dark); }
.ros-dest { font-size: 13px; color: var(--text-lt); margin-top: 8px; padding-top: 8px;
    border-top: 1px solid var(--border); }

/* CC form */
.cc-number-wrap { position: relative; }
.cc-number-wrap input { width: 100%; padding-right: 48px; }
.cc-brand { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 20px; }
.cc-security-note { font-size: 12px; color: #888; text-align: center; margin-top: 16px; }

/* Conferma */
.regalo-confirm-wrap { text-align: center; max-width: 560px; margin: 60px auto;
    background: #fff; border: 1.5px solid var(--border); border-radius: 20px; padding: 48px 40px; }
.rconf-check { width: 72px; height: 72px; background: #d4edda; border-radius: 50%;
    font-size: 32px; color: #155724; display: flex; align-items: center; justify-content: center;
    margin: 0 auto 20px; }
.regalo-confirm-wrap h2 { font-size: 26px; color: var(--dark); margin-bottom: 8px; }
.rconf-demo-tag { background: #fff3cd; color: #856404; font-size: 12px; font-weight: 700;
    padding: 3px 10px; border-radius: 20px; vertical-align: middle; margin-left: 8px; }
.rconf-sub { color: var(--text-lt); font-size: 15px; margin-bottom: 32px; }
.rconf-coupon { background: linear-gradient(135deg, #8B1A1A, #5a1010); border-radius: 16px;
    padding: 28px 32px; margin-bottom: 28px; }
.rconf-coupon-label { color: rgba(201,168,76,.8); font-size: 12px; letter-spacing: 2px;
    text-transform: uppercase; margin-bottom: 10px; }
.rconf-coupon-code { font-family: 'Courier New', monospace; font-size: 28px; font-weight: 700;
    color: #C9A84C; letter-spacing: 4px; }
.rconf-coupon-validity { color: rgba(255,255,255,.7); font-size: 13px; margin-top: 10px; }
.rconf-details { background: var(--cream-2); border-radius: 10px; padding: 16px 20px;
    margin-bottom: 28px; text-align: left; }
.rcd-row { display: flex; justify-content: space-between; padding: 6px 0;
    border-bottom: 1px solid var(--border); font-size: 14px; }
.rcd-row:last-child { border: none; }
.rcd-row span { color: var(--text-lt); }
.rconf-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* Responsive */
@media (max-width: 768px) {
    .regalo-info-strip { grid-template-columns: 1fr; }
    .regalo-step { padding: 20px 18px; }
    .regalo-confirm-wrap { padding: 32px 20px; margin: 30px auto; }
    .rconf-coupon-code { font-size: 20px; letter-spacing: 2px; }
}

/* ── Regalo: sezione eventi ─────────────────────────────────────────────── */
.regalo-divider { display: flex; align-items: center; gap: 16px; margin: 3rem 0 2rem; }
.regalo-divider::before, .regalo-divider::after { content:''; flex:1; height:1px; background:var(--border); }
.regalo-divider span { font-size: 13px; color: #888; font-weight: 600; text-transform: uppercase;
    letter-spacing: 1.5px; white-space: nowrap; }

.regalo-eventi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 24px; margin-bottom: 3rem; }

.regalo-evento-card { background: #fff; border: 1.5px solid var(--border); border-radius: 16px;
    overflow: hidden; cursor: pointer; transition: transform .2s, box-shadow .2s, border-color .2s; }
.regalo-evento-card:hover { transform: translateY(-6px); box-shadow: 0 16px 40px rgba(139,26,26,.15);
    border-color: var(--red); }

.rec-img { height: 160px; background-size: cover; background-position: center;
    position: relative; }
.rec-img-default { background: linear-gradient(135deg, #8B1A1A, #C9A84C); }

.rec-date-badge { position: absolute; top: 12px; left: 12px; background: var(--red); color: #fff;
    border-radius: 10px; padding: 6px 10px; text-align: center; line-height: 1.2; }
.rec-day   { display: block; font-size: 20px; font-weight: 700; }
.rec-month { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; }

.rec-tipo { position: absolute; top: 12px; right: 12px; background: rgba(0,0,0,.55);
    color: #fff; font-size: 11px; padding: 3px 10px; border-radius: 20px; }

.rec-body { padding: 18px 20px; }
.rec-body h3 { font-size: 16px; color: var(--dark); margin: 0 0 10px; line-height: 1.3; }
.rec-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.rec-meta span { font-size: 12.5px; color: var(--text-lt); }
.rec-gratuito { color: #28a745 !important; font-weight: 600; }
.rec-cta { font-size: 13px; font-weight: 700; color: var(--red); }

/* Responsive */
@media (max-width: 600px) {
    .regalo-eventi-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   ADMIN: AGGIUNGI PRENOTAZIONE + SITUAZIONE TAVOLI
   ============================================================ */

/* Banner modalità admin */
.admin-booking-mode-banner { display:flex; align-items:flex-start; gap:14px;
    background:#fff8e1; border:2px solid #ffc107; border-radius:12px;
    padding:16px 20px; margin-bottom:24px; }
.abmb-icon { font-size:28px; flex-shrink:0; }
.admin-booking-mode-banner strong { display:block; font-size:15px; color:#333; margin-bottom:4px; }
.admin-booking-mode-banner p { margin:0; font-size:13px; color:#666; }

/* Pannello gruppo grande */
.adm-gruppo-grande-panel { background:#fff4ec; border:2px solid #fd7e14; border-radius:12px;
    padding:20px 24px; margin:16px 0; }
.ggp-header { display:flex; align-items:flex-start; gap:12px; margin-bottom:18px; }
.ggp-icon { font-size:28px; }
.ggp-header strong { display:block; font-size:15px; color:#333; margin-bottom:3px; }
.ggp-header p { margin:0; font-size:13px; color:#666; }
.ggp-tables { display:flex; flex-direction:column; gap:12px; }
.ggp-row { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.ggp-size-label { font-size:14px; color:#444; }
.ggp-counter { display:flex; align-items:center; gap:10px; }
.ggp-btn { width:34px; height:34px; border-radius:50%; border:2px solid var(--red);
    background:#fff; color:var(--red); font-size:18px; font-weight:700; cursor:pointer;
    display:flex; align-items:center; justify-content:center; transition:background .15s; }
.ggp-btn:hover { background:var(--red); color:#fff; }
.ggp-count { font-size:20px; font-weight:700; min-width:28px; text-align:center; color:var(--dark); }
.ggp-capacity { margin-top:14px; padding-top:12px; border-top:1px solid #f0c090;
    font-size:14px; color:#555; }

/* ── Situazione Tavoli ──────────────────────────────────────── */
.st-hero { background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); }
.st-wrapper { padding: 2.5rem 0 4rem; }

.st-patrimonio { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:2.5rem; }
.stp-card { background:#fff; border:1.5px solid var(--border); border-radius:14px;
    padding:20px; text-align:center; }
.stp-card-total { background:var(--dark); color:#fff; border-color:var(--dark); }
.stp-card-total .stp-label, .stp-card-total .stp-cap { color:rgba(255,255,255,.7); }
.stp-ico { font-size:28px; display:block; margin-bottom:8px; }
.stp-num { font-size:36px; font-weight:700; color:var(--red); line-height:1; }
.stp-card-total .stp-num { color:#C9A84C; }
.stp-label { font-size:13px; font-weight:600; color:var(--dark); margin-top:4px; }
.stp-cap { font-size:12px; color:var(--text-lt); margin-top:2px; }

.st-date-picker { display:flex; align-items:center; gap:16px; flex-wrap:wrap;
    background:#f8f5f0; border-radius:10px; padding:14px 20px; margin-bottom:2rem; }
.st-date-picker label { font-weight:700; font-size:14px; }
.st-date-picker input { border:1.5px solid var(--border); border-radius:8px;
    padding:8px 12px; font-size:15px; }

.st-loading { text-align:center; color:#888; padding:40px; font-size:15px; }

.st-services-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:2rem; }

.st-service-card { border:2px solid; border-radius:14px; padding:24px; }
.stsc-header { font-size:17px; font-weight:700; margin-bottom:16px; }
.stsc-summary { display:flex; align-items:baseline; gap:8px; margin-bottom:16px; }
.stsc-avail { font-size:48px; font-weight:700; line-height:1; }
.stsc-avail-label { font-size:14px; color:#666; }

.stsc-sizes { display:flex; flex-direction:column; gap:10px; margin-bottom:16px; }
.stss-row { display:grid; grid-template-columns:100px 1fr 60px; align-items:center; gap:10px; }
.stss-label { font-size:13px; color:#555; }
.stss-bar-wrap { height:8px; background:#e0e0e0; border-radius:4px; overflow:hidden; }
.stss-bar { height:100%; border-radius:4px; transition:width .4s; }
.stss-bar.stss-ok   { background:#28a745; }
.stss-bar.stss-low  { background:#ffc107; }
.stss-bar.stss-full { background:#dc3545; }
.stss-count { font-size:13px; font-weight:700; text-align:right; }
.stss-count.stss-ok   { color:#28a745; }
.stss-count.stss-low  { color:#856404; }
.stss-count.stss-full { color:#dc3545; }
.stsc-footer { font-size:12px; color:#888; padding-top:12px; border-top:1px solid rgba(0,0,0,.08); }

/* Prenotazioni del giorno */
.st-prenotazioni-title { font-size:18px; color:var(--dark); margin-bottom:14px; }
.st-no-bookings { color:#888; font-style:italic; }
.st-prenotazioni-list { display:flex; flex-direction:column; gap:8px; }
.st-booking-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap;
    background:#fff; border:1px solid var(--border); border-radius:8px; padding:10px 16px; }
.stbr-ora { font-weight:700; font-size:15px; color:var(--red); min-width:45px; }
.stbr-name { font-weight:600; flex:1; min-width:120px; }
.stbr-persone { font-size:13px; color:#555; }
.stbr-canale { font-size:11px; background:#f0f0f0; padding:2px 8px; border-radius:10px; color:#666; }
.stbr-stato { font-size:11px; font-weight:700; padding:2px 10px; border-radius:10px; }
.stbr-note { cursor:help; }

@media (max-width:768px) {
    .st-patrimonio { grid-template-columns:repeat(2,1fr); }
    .st-services-grid { grid-template-columns:1fr; }
}

/* ── ADMIN MODE – prenotazione hero slim ── */
.page-hero-admin-slim { min-height: 80px !important; }
.page-hero-admin-slim .page-hero-content { min-height: 80px; }
.admin-slim-bar { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
.admin-slim-phone { color: rgba(255,255,255,.9); font-size: 1.05rem; }

/* ── "Stai aggiungendo" top banner ── */
.admin-adding-banner-wrap { background: #fffbf0; border-bottom: 2px solid #C9A84C; }
.admin-adding-banner { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 14px 0; }
.aab-icon { font-size: 1.8rem; flex-shrink: 0; }
.aab-text { flex: 1; min-width: 180px; }
.aab-text strong { display: block; font-size: 15px; color: #333; margin-bottom: 2px; }
.aab-text span { font-size: 13px; color: #666; }
.aab-link { font-size: 13px; font-weight: 600; color: #8B1A1A; text-decoration: none; white-space: nowrap; padding: 6px 14px; border: 1.5px solid #8B1A1A; border-radius: 6px; }
.aab-link:hover { background: #8B1A1A; color: #fff; }
.aab-link-back { border-color: #aaa; color: #666; }
.aab-link-back:hover { background: #666; color: #fff; border-color: #666; }

/* ── BREADCRUMB ── */
.breadcrumb-bar { background: #f9f5f0; border-bottom: 1px solid #e8d9c5; padding: .5rem 0; }
.bc-list { list-style: none; display: flex; align-items: center; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; }
.bc-item { display: flex; align-items: center; font-size: .8rem; color: #888; }
.bc-item a { color: #8B1A1A; text-decoration: none; }
.bc-item a:hover { text-decoration: underline; }
.bc-sep { color: #ccc; margin: 0 6px; font-size: .7rem; }
.bc-current span { color: #555; font-weight: 600; }

/* ═══════════════════════════════════════════════════════════════
   CARTA FEDELTÀ PAGE
   ═══════════════════════════════════════════════════════════════ */

/* ── Layout pagina ── */
.page-carta-fedelta { background: var(--cream); }
.cfl-page { padding: 2.5rem 20px 5rem; max-width: 1100px; }

/* ── Blocco generico ── */
.cfl-block {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 2rem 2.5rem;
    margin-bottom: 2rem;
}
.cfl-block-head { margin-bottom: 1.75rem; }
.cfl-block-head h2 {
    font-family: var(--font-serif);
    font-size: 1.4rem; font-weight: 700;
    color: var(--dark); margin: 0 0 .4rem;
}
.cfl-block-head p { font-size: .92rem; color: var(--text-lt); line-height: 1.6; margin: 0; }

/* ── Criteri — tabella righe ── */
.cfl-criteria-table { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.cfl-criteria-row {
    display: grid;
    grid-template-columns: 52px 1fr 90px 160px;
    align-items: center;
    gap: 0;
    padding: 0;
    border-bottom: 1px solid var(--border);
}
.cfl-criteria-row:last-child { border-bottom: none; }
.cfl-criteria-row--bonus { background: #fffbf0; }
.cfl-crit-icon {
    display: flex; align-items: center; justify-content: center;
    font-size: 1.4rem;
    width: 52px;
    align-self: stretch;
    background: var(--cream);
    border-right: 1px solid var(--border);
    padding: 1rem 0;
}
.cfl-criteria-row--bonus .cfl-crit-icon { background: #fff5d6; }
.cfl-crit-label {
    padding: .9rem 1.25rem;
    font-size: .9rem; color: var(--text); line-height: 1.4;
}
.cfl-crit-label strong { font-weight: 700; color: var(--dark); }
.cfl-crit-label small { display: block; font-size: .8rem; color: var(--text-lt); margin-top: .2rem; }
.cfl-crit-pts {
    font-family: var(--font-serif);
    font-size: 1.6rem; font-weight: 700;
    color: var(--wine);
    padding: .9rem .75rem;
    border-left: 1px solid var(--border);
    text-align: center;
}
.cfl-criteria-row--bonus .cfl-crit-pts { color: #9a6d10; }
.cfl-crit-unit {
    padding: .9rem 1rem;
    font-size: .82rem; color: var(--text-lt);
    border-left: 1px solid var(--border);
}

/* nota informativa */
.cfl-note {
    display: flex; align-items: flex-start; gap: .6rem;
    background: #f0f7ff;
    border: 1px solid #c8dff5;
    border-left: 4px solid #4a90d9;
    border-radius: var(--radius);
    padding: .8rem 1.1rem;
    font-size: .88rem; color: #2c4a6e;
    line-height: 1.5;
    margin-bottom: 1.25rem;
}
.cfl-note-icon { flex-shrink: 0; font-size: 1rem; margin-top: .05rem; }

/* riga esempio */
.cfl-example {
    display: flex; align-items: center; flex-wrap: wrap; gap: .5rem;
    background: var(--cream-2);
    border: 1px solid var(--border);
    border-left: 4px solid var(--gold);
    border-radius: var(--radius);
    padding: .9rem 1.25rem;
    margin-top: 1.25rem;
    font-size: .9rem; color: var(--text);
}
.cfl-ex-tag {
    background: var(--gold); color: #fff;
    font-size: .7rem; font-weight: 700;
    letter-spacing: 1.5px; text-transform: uppercase;
    padding: 2px 8px; border-radius: 8px;
    flex-shrink: 0;
}
.cfl-ex-calc { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; margin-left: .25rem; }
.cfl-ex-pill {
    display: inline-flex; align-items: center;
    background: #fff; color: var(--wine);
    border: 1px solid var(--border);
    font-weight: 700; font-size: .85rem;
    padding: 2px 10px; border-radius: 20px;
}
.cfl-ex-pill--total {
    background: var(--wine); color: #fff;
    border-color: var(--wine); font-size: .9rem; padding: 3px 14px;
}

/* ── Livelli — tabella ── */
.cfl-levels-table { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.cfl-levels-thead {
    display: grid;
    grid-template-columns: 52px 1fr 130px 110px 120px;
    background: var(--cream-2);
    border-bottom: 2px solid var(--border);
    padding: .55rem 0;
}
.cfl-levels-thead span {
    padding: .4rem 1rem;
    font-size: .72rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 1px;
    color: var(--text-lt);
}
.cfl-lvl-row {
    display: grid;
    grid-template-columns: 52px 1fr 130px 110px 120px;
    align-items: center;
    border-bottom: 1px solid var(--border);
    transition: background var(--transition);
}
.cfl-lvl-row:last-child { border-bottom: none; }
.cfl-lvl-row:hover { background: var(--cream); }
.cfl-lvl-row--reached { background: #fdfdf8; }
.cfl-lvl-row--current {
    background: linear-gradient(90deg, #fffbf0, #fff);
    border-left: 3px solid var(--gold);
}
.cfl-lvl-icon {
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem; padding: .85rem 0;
    border-right: 1px solid var(--border);
    background: var(--cream);
    align-self: stretch;
}
.cfl-lvl-row--reached .cfl-lvl-icon { background: color-mix(in srgb, var(--c) 8%, white); }
.cfl-lvl-row--current .cfl-lvl-icon { background: rgba(201,168,76,.1); border-color: rgba(201,168,76,.3); }
.cfl-lvl-name {
    padding: .85rem 1.25rem;
    font-family: var(--font-serif);
    font-size: .97rem; font-weight: 700;
    color: var(--dark);
}
.cfl-lvl-pts {
    padding: .85rem 1rem;
    font-size: .85rem; color: var(--text-lt);
    border-left: 1px solid var(--border);
}
.cfl-lvl-disc {
    padding: .85rem 1rem;
    border-left: 1px solid var(--border);
}
.cfl-disc-badge {
    display: inline-block;
    background: color-mix(in srgb, var(--c) 15%, white);
    color: var(--c);
    font-size: .82rem; font-weight: 700;
    padding: 2px 10px; border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--c) 30%, white);
}
.cfl-disc-none { color: #ccc; font-size: .85rem; }
.cfl-lvl-status {
    padding: .85rem 1rem;
    border-left: 1px solid var(--border);
}
.cfl-status-here {
    display: inline-flex; align-items: center; gap: .3rem;
    background: rgba(201,168,76,.15); color: #8a6a10;
    font-size: .78rem; font-weight: 700;
    padding: 3px 10px; border-radius: 10px;
    border: 1px solid rgba(201,168,76,.35);
}
.cfl-status-done {
    font-size: .82rem; color: #16a34a; font-weight: 600;
}
.cfl-status-locked { color: #ddd; font-size: .85rem; }

/* colonne senza status (utente non loggato) */
.cfl-levels-thead:has(span:nth-child(4):last-child) { grid-template-columns: 52px 1fr 130px 110px; }
.cfl-lvl-row:has(.cfl-lvl-disc:last-child) { grid-template-columns: 52px 1fr 130px 110px; }

/* ── Premi — tabella ── */
.cfl-premi-table { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.cfl-premi-thead {
    display: grid;
    grid-template-columns: 52px 1fr 120px 1fr 140px;
    background: var(--cream-2);
    border-bottom: 2px solid var(--border);
}
.cfl-premi-thead span {
    padding: .55rem 1rem;
    font-size: .72rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 1px;
    color: var(--text-lt);
}
.cfl-premio-row {
    display: grid;
    grid-template-columns: 52px 1fr 120px 1fr 140px;
    align-items: center;
    border-bottom: 1px solid var(--border);
    transition: background var(--transition);
}
.cfl-premio-row:last-child { border-bottom: none; }
.cfl-premio-row:hover { background: #fafafa; }
.cfl-premio-row--on {
    background: linear-gradient(90deg, #fffcf0, #fff);
    border-left: 3px solid var(--gold);
}
.cfl-premio-row--on:hover { background: linear-gradient(90deg, #fff9e8, #fffcf0); }
.cfl-premio-row--off { opacity: .75; }
.cfl-pr-icon {
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem; padding: .9rem 0;
    border-right: 1px solid var(--border);
    background: var(--cream);
    align-self: stretch;
}
.cfl-premio-row--on .cfl-pr-icon { background: #fff8e1; }
.cfl-premio-row--off .cfl-pr-icon { filter: grayscale(50%); }
.cfl-pr-nome {
    padding: .9rem 1.25rem;
    font-family: var(--font-serif);
    font-size: .95rem; font-weight: 700;
    color: var(--dark);
}
.cfl-pr-pts {
    padding: .9rem 1rem;
    border-left: 1px solid var(--border);
    text-align: center;
}
.cfl-pts-num {
    display: block;
    font-family: var(--font-serif);
    font-size: 1.5rem; font-weight: 700;
    color: var(--wine); line-height: 1;
}
.cfl-premio-row--on .cfl-pts-num { color: #9a6d10; }
.cfl-pts-lbl { font-size: .72rem; color: var(--text-lt); }
.cfl-pr-desc {
    padding: .9rem 1.25rem;
    font-size: .86rem; color: var(--text-lt);
    line-height: 1.5;
    border-left: 1px solid var(--border);
}
.cfl-pr-progress {
    padding: .9rem 1rem;
    border-left: 1px solid var(--border);
}
.cfl-prog-done {
    display: inline-flex; align-items: center; gap: .25rem;
    font-size: .8rem; font-weight: 700; color: #16a34a;
}
.cfl-prog-bar-wrap {
    height: 5px; background: var(--border);
    border-radius: 10px; overflow: hidden; margin-bottom: .3rem;
}
.cfl-prog-bar {
    height: 100%;
    background: linear-gradient(90deg, var(--gold), var(--wine));
    border-radius: 10px; transition: width .8s ease;
}
.cfl-prog-delta { font-size: .75rem; color: #aaa; white-space: nowrap; }

/* versione senza colonna progresso (guest) */
.cfl-premi-thead:has(span:nth-child(4):last-child) { grid-template-columns: 52px 1fr 120px 1fr; }
.cfl-premio-row:has(.cfl-pr-desc:last-child) { grid-template-columns: 52px 1fr 120px 1fr; }

/* ── CTA block ── */
.cfl-cta-block { background: linear-gradient(135deg, #1c0c06 0%, #3a1010 100%); border-color: transparent; }
.cfl-cta-inner {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 3.5rem; align-items: start;
}
.cfl-cta-text h2 {
    font-family: var(--font-serif);
    font-size: 1.5rem; color: #fff; margin: 0 0 .75rem;
}
.cfl-cta-text p { font-size: .92rem; color: rgba(255,255,255,.7); line-height: 1.7; margin-bottom: 1.5rem; }
.cfl-cta-btns { display: flex; gap: .75rem; flex-wrap: wrap; }
.cfl-benefits-list {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-direction: column; gap: .85rem;
}
.cfl-benefits-list li {
    display: flex; align-items: flex-start; gap: .85rem;
    color: rgba(255,255,255,.8);
}
.cfl-ben-icon {
    flex-shrink: 0; font-size: 1.25rem;
    width: 40px; height: 40px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    margin-top: 2px;
}
.cfl-benefits-list li div { display: flex; flex-direction: column; }
.cfl-benefits-list strong { font-size: .9rem; color: #fff; margin-bottom: .1rem; }
.cfl-benefits-list span { font-size: .82rem; color: rgba(255,255,255,.55); }

/* ── Rewards milestones (shortcode) ── */
.loyalty-rewards { margin-top: 1.75rem; padding-top: 1.5rem; border-top: 1px solid var(--border); }
.loyalty-rewards h3 { font-family: var(--font-serif); font-size: 1.05rem; color: var(--wine); margin-bottom: .6rem; }
.rewards-next-hint {
    font-size: .88rem; color: var(--text-lt); background: var(--cream);
    padding: .6rem 1rem; border-radius: var(--radius);
    margin-bottom: .9rem; border-left: 3px solid var(--gold);
}
.rewards-milestones { display: flex; flex-wrap: wrap; gap: .55rem; }
.reward-ms {
    display: flex; flex-direction: column; align-items: center; gap: .15rem;
    background: var(--cream); border: 1px solid var(--border);
    border-radius: var(--radius); padding: .55rem .7rem;
    min-width: 68px; text-align: center;
    transition: box-shadow var(--transition), transform var(--transition);
}
.reward-ms:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.rms-earned { background: #f0faf4; border-color: #22c55e; }
.rms-icon { font-size: 1.15rem; }
.rms-pts { font-size: .66rem; color: #aaa; }
.rms-nome { font-size: .7rem; font-weight: 600; color: var(--text); line-height: 1.2; }
.rms-delta { font-size: .65rem; color: #bbb; }
.rms-earned .rms-pts { color: #16a34a; }

/* ── utili globali rimasti ── */
.btn-outline-light {
    display: inline-block; border: 2px solid rgba(255,255,255,.5);
    color: #fff; padding: .75rem 1.75rem; border-radius: 50px;
    font-weight: 700; text-decoration: none; font-size: .92rem;
    transition: background var(--transition), border-color var(--transition);
}
.btn-outline-light:hover { background: rgba(255,255,255,.1); border-color: #fff; color: #fff; }
.pts-pill {
    display: inline-flex; align-items: center;
    background: var(--gold); color: #fff;
    font-weight: 700; font-size: .83rem; padding: 3px 11px; border-radius: 20px;
}
.pts-pill-total { background: var(--wine); padding: 5px 14px; }

/* ── Responsive ── */
@media (max-width: 1000px) {
    .cfl-premi-thead,
    .cfl-premio-row { grid-template-columns: 52px 1fr 100px 1fr; }
    .cfl-pr-progress { display: none; }
    .cfl-premi-thead span:last-child { display: none; }
}
@media (max-width: 768px) {
    .cfl-block { padding: 1.5rem; }
    .cfl-cta-inner { grid-template-columns: 1fr; gap: 2rem; }
    .cfl-levels-thead, .cfl-lvl-row { grid-template-columns: 52px 1fr 110px 90px; }
    .cfl-lvl-status, .cfl-levels-thead span:last-child { display: none; }
}
@media (max-width: 640px) {
    .cfl-criteria-row { grid-template-columns: 52px 1fr 70px; }
    .cfl-crit-unit { display: none; }
    .cfl-premi-thead, .cfl-premio-row { grid-template-columns: 52px 1fr 90px; }
    .cfl-pr-desc, .cfl-premi-thead span:nth-child(4) { display: none; }
    .cfl-levels-thead, .cfl-lvl-row { grid-template-columns: 52px 1fr 90px; }
    .cfl-lvl-disc, .cfl-levels-thead span:nth-child(4) { display: none; }
}
@media (max-width: 400px) {
    .cfl-cta-inner { gap: 1.5rem; }
    .cfl-benefits-list li { flex-direction: row; }
}

/* ── Hero ── (rimasto invariato) ──
   usa .page-hero già definito sopra  */
.cf-hero {
    position: relative;
    background: linear-gradient(150deg, #160800 0%, #3a0d0d 50%, var(--wine) 100%);
    min-height: 520px;
    display: flex; align-items: center;
}
.cf-hero-overlay {
    position: absolute; inset: 0;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='1' cy='1' r='1' fill='rgba(255,255,255,.04)'/%3E%3C/svg%3E");
    pointer-events: none;
}
.cf-hero-inner {
    position: relative; z-index: 2;
    padding: 5rem 20px;
    display: flex; flex-direction: column; gap: 3rem;
}
.cf-hero-body { text-align: center; }
.cf-tag {
    display: inline-block;
    border: 1px solid rgba(201,168,76,.5);
    color: var(--gold);
    font-size: 11px; font-weight: 700;
    letter-spacing: 3px; text-transform: uppercase;
    padding: 5px 18px; border-radius: 20px;
    margin-bottom: 1.25rem;
}
.cf-hero-body h1 {
    font-family: var(--font-serif);
    font-size: clamp(2.6rem, 7vw, 4.2rem);
    color: #fff; margin: 0 0 1rem; line-height: 1.1;
}
.cf-hero-body p {
    color: rgba(255,255,255,.75);
    font-size: 1.15rem; max-width: 520px;
    margin: 0 auto; line-height: 1.7;
}
.cf-hero-btns {
    display: flex; justify-content: center;
    gap: 1rem; flex-wrap: wrap; margin-top: 2rem;
}
.cf-btn-primary {
    display: inline-block;
    background: var(--gold); color: var(--dark);
    font-weight: 700; font-size: .95rem;
    padding: .85rem 2.25rem; border-radius: 50px;
    text-decoration: none;
    transition: background var(--transition), transform var(--transition), box-shadow var(--transition);
}
.cf-btn-primary:hover {
    background: var(--gold-lt); color: var(--dark);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(201,168,76,.4);
}
.cf-btn-ghost {
    display: inline-block;
    border: 2px solid rgba(255,255,255,.5);
    color: #fff; font-weight: 700; font-size: .95rem;
    padding: .85rem 2.25rem; border-radius: 50px;
    text-decoration: none;
    transition: border-color var(--transition), background var(--transition);
}
.cf-btn-ghost:hover { border-color: #fff; background: rgba(255,255,255,.1); color: #fff; }

/* stats bar nel hero */
.cf-hero-stats {
    display: flex; align-items: center;
    justify-content: center; flex-wrap: wrap;
    gap: 0;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 16px;
    padding: 1.25rem 2rem;
    backdrop-filter: blur(6px);
}
.cf-hero-stat { text-align: center; padding: 0 2.5rem; }
.cf-hero-stat-num {
    display: block;
    font-family: var(--font-serif);
    font-size: 2.2rem; font-weight: 700;
    color: var(--gold); line-height: 1;
}
.cf-hero-stat-lbl {
    display: block;
    font-size: .78rem; color: rgba(255,255,255,.6);
    text-transform: uppercase; letter-spacing: 1px;
    margin-top: .3rem;
}
.cf-hero-stat-sep {
    width: 1px; height: 40px;
    background: rgba(255,255,255,.15);
    flex-shrink: 0;
}

/* ── Sezioni generali ── */
.cf-sec { padding: 5rem 0; }
.cf-sec-earn    { background: #fff; }
.cf-sec-levels  { background: linear-gradient(150deg, #160800 0%, #3a0d0d 100%); }
.cf-sec-premi   { background: var(--cream); }
.cf-sec-scheda  { background: #fff; }
.cf-sec-cta     { background: linear-gradient(150deg, #160800 0%, #3a0d0d 100%); }

/* ── Section header ── */
.cf-sec-head { text-align: center; margin-bottom: 3rem; }
.cf-tag-sm {
    display: inline-block;
    color: var(--gold); font-size: 11px;
    font-weight: 700; letter-spacing: 3px;
    text-transform: uppercase; margin-bottom: 8px;
}
.cf-sec-head h2 {
    font-family: var(--font-serif);
    font-size: clamp(1.8rem, 3vw, 2.4rem);
    color: var(--wine); margin: 0 0 .6rem; line-height: 1.2;
}
.cf-sec-head p { color: var(--text-lt); font-size: 1rem; max-width: 580px; margin: 0 auto; line-height: 1.7; }
.cf-sec-head--light h2 { color: #fff; }
.cf-sec-head--light p  { color: rgba(255,255,255,.65); }
.cf-sec-head--light .cf-tag-sm { color: var(--gold); }

/* ── Come guadagnare — riga orizzontale ── */
.cf-earn-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.25rem;
    margin-bottom: 2rem;
}
.cf-earn-item {
    display: flex; align-items: center; gap: 1rem;
    background: var(--cream);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 1.25rem 1.5rem;
    transition: box-shadow var(--transition), transform var(--transition);
}
.cf-earn-item:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-3px);
}
.cf-earn-item--gold {
    background: linear-gradient(135deg, #fffbef, #fff9e4);
    border-color: rgba(201,168,76,.35);
}
.cf-earn-icon {
    font-size: 2rem;
    flex-shrink: 0;
    width: 48px; height: 48px;
    display: flex; align-items: center; justify-content: center;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--border);
}
.cf-earn-item--gold .cf-earn-icon { background: rgba(201,168,76,.1); border-color: rgba(201,168,76,.3); }
.cf-earn-body {}
.cf-earn-num {
    font-family: var(--font-serif);
    font-size: 1.9rem; font-weight: 700;
    color: var(--wine); line-height: 1;
}
.cf-earn-item--gold .cf-earn-num { color: #9a6d10; }
.cf-earn-txt {
    font-size: .85rem; color: var(--text-lt);
    line-height: 1.4; margin-top: .15rem;
}
.cf-earn-txt em { font-size: .78rem; color: #aaa; display: block; margin-top: .15rem; }

/* riga esempio */
.cf-earn-example {
    display: flex; align-items: center; flex-wrap: wrap; gap: .5rem;
    background: var(--cream-2);
    border: 1px solid var(--border);
    border-left: 4px solid var(--gold);
    border-radius: var(--radius-lg);
    padding: 1rem 1.75rem;
    font-size: .92rem; color: var(--text);
}
.cf-earn-ex-label {
    background: var(--gold); color: #fff;
    font-size: .72rem; font-weight: 700;
    letter-spacing: 1.5px; text-transform: uppercase;
    padding: 3px 10px; border-radius: 10px;
    margin-right: .25rem;
}
.cf-pill {
    display: inline-flex; align-items: center;
    background: #fff; color: var(--wine);
    border: 1.5px solid var(--border);
    font-weight: 700; font-size: .85rem;
    padding: 3px 12px; border-radius: 20px;
}
.cf-pill--total {
    background: var(--wine); color: #fff;
    border-color: var(--wine);
    font-size: .95rem; padding: 5px 16px;
    box-shadow: 0 3px 10px rgba(139,26,26,.25);
}
.cf-plus, .cf-equals { color: #bbb; font-weight: 700; font-size: 1.1rem; }

/* ── Livelli — card grid (non più track) ── */
.cf-levels-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1rem;
}
.cf-lvl-card {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    border-top: 3px solid rgba(255,255,255,.15);
    border-radius: var(--radius-lg);
    padding: 1.75rem 1rem 1.5rem;
    text-align: center;
    position: relative;
    transition: background var(--transition), border-top-color var(--transition), box-shadow var(--transition), transform var(--transition);
}
.cf-lvl-card:hover {
    background: rgba(255,255,255,.1);
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0,0,0,.3);
}
.cf-lvl-card--reached {
    background: rgba(255,255,255,.1);
    border-top-color: var(--c);
}
.cf-lvl-card--current {
    background: rgba(255,255,255,.14);
    border: 1px solid var(--gold);
    border-top: 3px solid var(--gold);
    box-shadow: 0 0 0 3px rgba(201,168,76,.2), 0 8px 24px rgba(0,0,0,.3);
}
.cf-lvl-badge {
    position: absolute; top: -11px; left: 50%; transform: translateX(-50%);
    background: var(--gold); color: var(--dark);
    font-size: .68rem; font-weight: 700;
    padding: 3px 12px; border-radius: 10px;
    white-space: nowrap; letter-spacing: .5px;
}
.cf-lvl-icon {
    font-size: 2.5rem;
    display: flex; align-items: center; justify-content: center;
    width: 64px; height: 64px; border-radius: 50%;
    background: rgba(255,255,255,.08);
    border: 2px solid rgba(255,255,255,.15);
    margin: 0 auto 1rem;
    transition: background var(--transition), border-color var(--transition);
}
.cf-lvl-card--reached .cf-lvl-icon {
    background: var(--c);
    border-color: var(--c);
    box-shadow: 0 4px 14px rgba(0,0,0,.25);
}
.cf-lvl-card--current .cf-lvl-icon {
    background: var(--c);
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(201,168,76,.25), 0 6px 18px rgba(0,0,0,.3);
}
.cf-lvl-name {
    font-family: var(--font-serif);
    font-size: 1rem; font-weight: 700;
    color: #fff; margin-bottom: .3rem;
}
.cf-lvl-pts { font-size: .78rem; color: rgba(255,255,255,.5); margin-bottom: .5rem; }
.cf-lvl-disc {
    display: inline-block;
    background: rgba(201,168,76,.2);
    color: var(--gold);
    font-size: .78rem; font-weight: 700;
    padding: 2px 10px; border-radius: 12px;
}
.cf-lvl-disc--empty {
    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.3);
    font-weight: 400;
}

/* ── Premi — grid card ── */
.cf-premi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.25rem;
}
.cf-premio {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 1.5rem 1.25rem;
    text-align: center;
    position: relative; overflow: hidden;
    display: flex; flex-direction: column;
    transition: box-shadow var(--transition), transform var(--transition);
}
.cf-premio:hover { box-shadow: var(--shadow-lg); transform: translateY(-3px); }
.cf-premio--on {
    border-color: rgba(201,168,76,.5);
    background: linear-gradient(180deg, #fffcf2 0%, #fff 60%);
}
.cf-premio--on:hover { box-shadow: 0 8px 28px rgba(201,168,76,.22); }
.cf-premio--off { background: #fafafa; }
.cf-premio--off .cf-premio-icon { filter: grayscale(40%); opacity: .8; }
.cf-premio-ribbon {
    position: absolute; top: 0; right: 0;
    background: var(--gold); color: var(--dark);
    font-size: .68rem; font-weight: 700;
    letter-spacing: .5px; text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 0 var(--radius-lg) 0 10px;
}
.cf-premio-top {
    display: flex; align-items: flex-start;
    justify-content: space-between;
    margin-bottom: .75rem;
}
.cf-premio-icon { font-size: 2.2rem; line-height: 1; }
.cf-premio-pts {
    background: var(--cream-2);
    color: var(--text-lt);
    border: 1px solid var(--border);
    font-size: .75rem; font-weight: 700;
    padding: 3px 9px; border-radius: 20px;
    white-space: nowrap; align-self: flex-start;
    margin-top: 4px;
}
.cf-premio--on .cf-premio-pts {
    background: rgba(201,168,76,.15);
    color: #8a6a10; border-color: rgba(201,168,76,.4);
}
.cf-premio-nome {
    font-family: var(--font-serif);
    font-size: .97rem; font-weight: 700;
    color: var(--dark); margin: 0 0 .35rem; text-align: left;
}
.cf-premio-desc {
    font-size: .82rem; color: var(--text-lt);
    line-height: 1.5; text-align: left;
    flex-grow: 1; margin-bottom: .85rem;
}
.cf-premio-bar-wrap {
    height: 5px; background: var(--border);
    border-radius: 10px; overflow: hidden; margin-bottom: .3rem;
}
.cf-premio-bar {
    height: 100%;
    background: linear-gradient(90deg, var(--gold), var(--wine));
    border-radius: 10px; transition: width .8s ease;
}
.cf-premio-delta { font-size: .74rem; color: #bbb; text-align: left; }
.cf-premio-delta--on { color: #16a34a; font-weight: 600; }

/* ── Shortcode scheda ── */
.cf-scheda-wrap { max-width: 900px; margin: 0 auto; }

/* ── CTA sezione ── */
.cf-cta-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
}
.cf-cta-left h2 {
    font-family: var(--font-serif);
    font-size: clamp(1.8rem, 3vw, 2.4rem);
    color: #fff; margin: .5rem 0 1rem;
}
.cf-cta-left p { color: rgba(255,255,255,.7); font-size: 1rem; line-height: 1.7; margin-bottom: 2rem; }
.cf-cta-btns { display: flex; gap: 1rem; flex-wrap: wrap; }
.cf-cta-benefits {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-direction: column; gap: 1rem;
}
.cf-cta-benefits li {
    display: flex; align-items: flex-start; gap: 1rem;
    color: rgba(255,255,255,.85);
}
.cf-ben-icon {
    font-size: 1.5rem; flex-shrink: 0;
    width: 48px; height: 48px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
}
.cf-cta-benefits li div { font-size: .9rem; line-height: 1.5; padding-top: .15rem; }
.cf-cta-benefits li strong { color: #fff; display: block; margin-bottom: .15rem; }

/* ── Rewards milestones nel shortcode ── */
.loyalty-rewards { margin-top: 2rem; padding-top: 1.75rem; border-top: 1px solid var(--border); }
.loyalty-rewards h3 { font-family: var(--font-serif); font-size: 1.1rem; color: var(--wine); margin-bottom: .6rem; }
.rewards-next-hint {
    font-size: .88rem; color: var(--text-lt);
    background: var(--cream); padding: .65rem 1rem;
    border-radius: var(--radius); margin-bottom: 1rem;
    border-left: 3px solid var(--gold);
}
.rewards-milestones { display: flex; flex-wrap: wrap; gap: .6rem; }
.reward-ms {
    display: flex; flex-direction: column; align-items: center; gap: .15rem;
    background: #fff; border: 1px solid var(--border);
    border-radius: var(--radius); padding: .6rem .75rem;
    min-width: 72px; text-align: center;
    transition: box-shadow var(--transition), transform var(--transition);
}
.reward-ms:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.rms-earned { background: #f0faf4; border-color: #22c55e; }
.rms-icon { font-size: 1.2rem; }
.rms-pts { font-size: .67rem; color: #aaa; }
.rms-nome { font-size: .71rem; font-weight: 600; color: var(--text); line-height: 1.2; }
.rms-delta { font-size: .66rem; color: #bbb; }
.rms-earned .rms-pts { color: #16a34a; }

/* btn-outline-light usato altrove nel sito */
.btn-outline-light {
    display: inline-block;
    border: 2px solid rgba(255,255,255,.55);
    color: #fff; padding: .8rem 2rem;
    border-radius: 50px; font-weight: 700;
    text-decoration: none; font-size: .95rem;
    transition: background var(--transition), border-color var(--transition);
}
.btn-outline-light:hover { background: rgba(255,255,255,.1); border-color: #fff; color: #fff; }

/* pts-pill usato in altri template */
.pts-pill {
    display: inline-flex; align-items: center;
    background: var(--gold); color: #fff;
    font-weight: 700; font-size: .84rem;
    padding: 3px 11px; border-radius: 20px;
}
.pts-pill-total { background: var(--wine); padding: 5px 15px; box-shadow: 0 3px 10px rgba(139,26,26,.25); }

/* ── Responsive ── */
@media (max-width: 1100px) {
    .cf-levels-grid { grid-template-columns: repeat(3, 1fr); gap: .85rem; }
    .cf-premi-grid  { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
    .cf-earn-row { grid-template-columns: repeat(2, 1fr); }
    .cf-cta-grid { grid-template-columns: 1fr; gap: 2.5rem; }
    .cf-cta-left { text-align: center; }
    .cf-cta-btns { justify-content: center; }
}
@media (max-width: 640px) {
    .cf-sec { padding: 3.5rem 0; }
    .cf-hero-stat { padding: 0 1.25rem; }
    .cf-hero-stat-num { font-size: 1.7rem; }
    .cf-levels-grid { grid-template-columns: repeat(2, 1fr); }
    .cf-hero-stats { gap: .5rem; flex-wrap: wrap; justify-content: center; }
    .cf-hero-stat-sep { display: none; }
}
@media (max-width: 480px) {
    .cf-earn-row { grid-template-columns: 1fr; }
    .cf-premi-grid { grid-template-columns: 1fr; }
    .cf-levels-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Single evento – layout responsive */
@media (max-width: 860px) {
    .evento-layout {
        grid-template-columns: 1fr !important;
    }
    .evento-altri-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}
@media (max-width: 480px) {
    .evento-altri-grid {
        grid-template-columns: 1fr !important;
    }
}
