/* =========================================================
   TEMA "NOTTE" — la palette del menù d'autunno, ma di sera
   Due soli fondi, alternati: PETROLIO SCURO #123540 e CREMA #FFEBD7.
   Stessi colori e stesso carattere della carta, cambia il contrasto.
   L'hero è petrolio: la superficie "base" è petrolio, la "alt" crema.
   ========================================================= */

:root {
  /* ---- i due fondi, gli unici del sito ---- */
  --bg-base: #123540;   /* petrolio scuro */
  --bg-alt:  #ffebd7;   /* crema */

  /* ---- superficie petrolio ---- */
  --fg-base:      rgba(255, 245, 232, .9);
  --head-base:    #fff5e8;
  --lead-base:    rgba(255, 245, 232, .74);
  --eyebrow-base: #efd9bf;
  --card-base:    rgba(255, 245, 232, .07);
  --line-base:    rgba(255, 245, 232, .22);
  --ic-base:      #ffebd7;
  --ic-ink-base:  #123540;
  --scrim-base:   rgba(9, 30, 37, .95);

  /* ---- superficie crema ---- */
  --fg-alt:      #21465a;
  --head-alt:    #163b49;
  --lead-alt:    #4c6e7e;
  --eyebrow-alt: #bf1e2d;
  --card-alt:    #fff5e8;
  --line-alt:    rgba(22, 59, 73, .18);
  --ic-alt:      #163b49;
  --ic-ink-alt:  #ffebd7;
  --scrim-alt:   rgba(255, 235, 215, .95);

  /* ---- token generici, per i pochi punti che li usano ancora ---- */
  --navy-900: #0f2c37;
  --navy-800: #163b49;
  --navy-700: #1f4d5e;
  --navy:     #355b6d;
  --blue:     #6e9aab;
  --blue-200: #a7c4cf;
  --blue-050: #dce8ec;
  --sand:      #ffebd7;
  --sand-dark: #efd9bf;
  --paper:     #123540;
  --ink:       #21465a;
  --ink-soft:  #4c6e7e;
  --coral:      #bf1e2d;
  --coral-dark: #98151f;

  --font-display: 'Montserrat', 'Segoe UI', system-ui, sans-serif;
  --font-body:    'Montserrat', 'Segoe UI', system-ui, sans-serif;

  /* hero: fondo pieno, senza sfumature — i colori restano due */
  --hero-bg:   var(--bg-base);
  --hero-ink:  #fff5e8;
  --hero-sub:  rgba(255, 245, 232, .74);
  --hero-wave: #6e9aab;
  --hero-ring: rgba(255, 235, 215, .16);

  /* fasce di servizio: sempre petrolio, in cima e in fondo alla pagina */
  --strip-bg:   var(--bg-base);
  --strip-ink:  rgba(255, 235, 215, .8);
  --footer-bg:  var(--bg-base);
  --footer-ink: rgba(255, 235, 215, .8);
  --dock-bg:    #0f2c37;
  --dock-ink:   #fff5e8;

  --header-ink:      #fff5e8;
  --nav-ink:         rgba(255, 245, 232, .8);
  --nav-ink-hover:   #fff5e8;
  --header-stuck-bg: rgba(18, 53, 64, .95);

  --radius:    10px;
  --radius-lg: 16px;
}

body { background: var(--bg-base); }

h1, h2, h3, h4 { font-weight: 700; letter-spacing: -.02em; }
h1 em, .lead em { font-family: var(--font-script); font-style: normal; font-weight: 400; }
.hero h1 em { color: var(--blue); }

/* il corsivo a mano della carta, per le note di categoria */
.menu__panel > .lead {
  font-family: var(--font-script);
  font-size: clamp(.95rem, 1.4vw, 1.05rem);
  line-height: 1.9;
}

@media (max-width: 1100px) { .nav { background: var(--bg-base); } }

.btn { border-radius: 8px; }
.btn--primary { color: #fff; box-shadow: 0 10px 24px rgba(191, 30, 45, .3); }
.hero__cta .btn { font-size: .92rem; }

/* ---------- menù: nomi in evidenza, prezzi in rosso ---------- */
.dish__name { font-weight: 600; }
.dish__price { font-weight: 700; color: var(--coral); }
.dish__desc { font-weight: 300; }
.tab { font-weight: 600; }

/* sul fondo petrolio il rosso non si legge: i prezzi passano al crema */
.section--base .dish__price { color: var(--head-base); }

.feat, .deliv { border-radius: var(--radius); }
.info__ic, .feat__ic, .deliv__ic { border-radius: 8px; }

.strip__inner svg { color: rgba(255, 235, 215, .7); }
.socials a { border-color: rgba(255, 235, 215, .32); }
.footer__bottom { border-top-color: rgba(255, 235, 215, .18); color: rgba(255, 235, 215, .68); }
