/* ==========================================================
   Menu Natale — versione pulita (NO topbar, NO indice)
   Titoli sezioni moderni (no spacing eccessivo)
   Spazio leggero tra piatti della stessa portata
   ========================================================== */

:root{
  --bg: #0f0f10;
  --card: #171717;
  --text: #eaeaea;

  --brand: #d8b168;   /* oro ambrato */
  --brand-2: #7b633b; /* oro scuro */
  --ring: rgba(216,177,104,.25);

  --shadow: 0 12px 30px rgba(0,0,0,.42);
  --radius: 18px;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }

body{
  margin:0;
  color: var(--text);
  background: var(--bg);
  font-family: "Titillium Web", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* pagina */
.menu-page{
  width:min(980px, 100%);
  margin:0 auto;
  padding:22px 16px 42px;
}

/* HERO */
.menu-hero{
  position: relative;
  border:1px solid #1f2a24;
  border-radius: var(--radius);
  padding:26px 18px 18px;

  background:
    /* luce fredda dall’alto */
    radial-gradient(
      900px 420px at 50% -10%,
      rgba(210, 235, 220, .12),
      transparent 60%
    ),
    /* accento laterale elegante */
    radial-gradient(
      520px 320px at 90% 60%,
      rgba(170, 200, 185, .08),
      transparent 65%
    ),
    /* base verde bosco */
    linear-gradient(
      135deg,
      #0f1f1a 0%,
      #10231d 45%,
      #0b1713 100%
    );

  box-shadow: var(--shadow);
}

.meta-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  color: rgba(234,234,234,.82);
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
  font-size:12px;
}

.meta-row .dot{
  width:6px; height:6px;
  border-radius:999px;
  background: var(--brand);
  box-shadow: 0 0 0 4px rgba(216,177,104,.14);
}

/* titolo hero */
.hero-title{
  margin:12px 0 12px;
  text-align:center;
  line-height:1.02;
}
.hero-title__small{
  display:block;
  font-family: "Archivo Black", system-ui;
  letter-spacing:.08em;
  font-size:40px;
  color:#f4e7c4;
  text-transform:uppercase;
}
.hero-title__big{
  display:block;
  font-family: "Archivo Black", system-ui;
  letter-spacing:.03em;
  font-size:76px;
  background: linear-gradient(90deg, #b99256 0%, #ffe6a6 50%, #6d5432 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-transform:uppercase;
}

/* pill prezzo + CTA */
.hero-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.price-pill{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.55rem .95rem;
  border-radius:999px;
  border:1px solid #3a2f20;
  background:#221a12;
  color:#f0ddaa;
  font-weight:900;
  box-shadow: var(--shadow);
}
.price-pill strong{ color:#ffe6a6; }
.price-pill span{ opacity:.95; }

.cta{
  display:inline-flex;
  align-items:center;
  gap:10px;
  height:42px;
  padding:0 14px;
  border-radius:14px;
  text-decoration:none;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:12px;
  color:#ffe6a6;
  border:1px solid rgba(216,177,104,.34);
  background: linear-gradient(135deg, rgba(216,177,104,.22), rgba(34,26,18,.85));
}
.cta:hover{ box-shadow: 0 0 0 4px var(--ring); }

/* sezioni */
.menu-section{
  margin-top:22px;
}

/* header sezione: NIENTE letter-spacing enorme */
.menu-section .head{
  margin:0 2px 10px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
}

.menu-section .head h2{
  margin:0;
  font-family: "Archivo Black", system-ui;
  color:#f2d7aa;
  text-transform:uppercase;
  letter-spacing:.06em;     /* leggero, non “spaziatissimo” */
  font-size:16px;
  opacity:.98;
}

/* linea divisoria sottile tra sezioni */
.menu-section:not(:first-of-type)::before{
  content:"";
  display:block;
  height:1px;
  background:linear-gradient(to right, transparent, rgba(216,177,104,.20), transparent);
  margin:18px 0 18px;
}

/* ✅ leggero spazio tra piatti della stessa portata */
.items{
  display:grid;
  gap:10px; /* questo è lo spazio tra i piatti */
}

/* card piatti */
.menu-item.card{
  position:relative;
  padding:14px 16px 14px 18px;
  border-radius:16px;
  border:1px solid #2a2218;
  background:
    linear-gradient(to right, rgba(216,177,104,.06), transparent 30%),
    var(--card);
  box-shadow: var(--shadow);
}

/* barra laterale sottile */
.menu-item.card::before{
  content:"";
  position:absolute;
  left:0; top:12px; bottom:12px; width:3px;
  border-radius:2px;
  background: linear-gradient(180deg, #b99256 0%, #6d5432 100%);
  opacity:.85;
}

.dish{
  margin:0;
  text-align:left;
  color:#f4e7c4;
  font-weight:800;
  letter-spacing:.1px;
  font-size:18px;
  line-height:1.25;
}

/* compresi */
.coperto.card{
  border-radius:16px;
  border:1px solid #3a2e1e;
  background: linear-gradient(180deg,#1a1410 0%, #1d1711 100%);
  color:#e8d8b4;
  font-weight:600;
  padding:14px 16px;
  box-shadow: var(--shadow);
}
.coperto.card strong{
  color:#f5e3b3;
  font-weight:700;
}

/* prenota */
.prenota.card{
  border-radius:16px;
  border:1px solid #2a2218;
  background:
    radial-gradient(520px 220px at 10% 10%, rgba(216,177,104,.10), transparent 60%),
    var(--card);
  padding:16px;
  box-shadow: var(--shadow);
}

.prenota__title{
  font-family: "Archivo Black", system-ui;
  color:#f2d7aa;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:14px;
  margin-bottom:10px;
}

.prenota__nums{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}


.tel{
  display:inline-flex;
  align-items:center;
  gap:10px;

  padding:10px 14px;
  border-radius:14px;

  color:#f4e7c4;
  font-weight:900;
  font-size:18px;
  text-decoration:none;

  border:1px solid rgba(216,177,104,.16);
  background: rgba(23,23,23,.55);

  white-space:nowrap;
}

.tel:hover{
  border-color: rgba(216,177,104,.34);
  box-shadow: 0 0 0 4px var(--ring);
  color:#ffe6a6;
}

/* responsive */
@media (max-width:700px){
  .hero-title__small{ font-size:34px; }
  .hero-title__big{ font-size:56px; }
  .dish{ font-size:16.5px; }
  .items{ gap:9px; }
}

/* ==========================================================
   DOWNLOAD MENU PDF — icona SVG (NO FONT, NO BUG)
   ========================================================== */

.menu-download{
  margin-top: 36px;
  display:flex;
  justify-content:center;
}

.download-btn{
  display:inline-flex;
  align-items:center;
  gap:12px;

  padding:14px 22px;
  border-radius:999px;

  font-weight:900;
  font-size:15px;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-decoration:none;

  color: rgba(244,231,196,.95);
  border:1px solid rgba(244,231,196,.45);

  background:
    radial-gradient(200px 80px at 20% 30%, rgba(210,235,220,.18), transparent 60%),
    linear-gradient(135deg, #0f1f1a 0%, #10231d 45%, #0b1713 100%);

  box-shadow: 0 14px 36px rgba(0,0,0,.45);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.download-btn:hover{
  transform: translateY(-2px);
  border-color: rgba(244,231,196,.75);
  box-shadow: 0 18px 44px rgba(0,0,0,.55);
}

.download-btn:active{ transform: translateY(0); }

/* ICONA PDF SVG */
.pdf-icon{
  width:22px;
  height:22px;
  flex-shrink:0;
}

/* mobile */
@media (max-width: 600px){
  .download-btn{
    width:100%;
    justify-content:center;
    padding:14px 18px;
    font-size:14px;
  }
}
