/* ==========================================================
   BRESE — Pizzeria · Pub · Birreria (Est. 2018)
   Design tokens ufficiali. Importare in ogni pagina del sito.
   ========================================================== */

@import url("https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@400;600;700&family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400&family=Yellowtail&display=swap");

:root {
  /* --- Palette primaria (campionata dal logo) --- */
  --brese-nero:        #140B0C; /* Nero Brese — sfondo principale, testo su oro */
  --brese-carbone:     #221816; /* Carbone — superfici, card su fondo scuro */
  --brese-fumo:        #3A2E28; /* Fumo — bordi, divisori su scuro */
  --brese-oro:         #C9A24A; /* Oro Brese — colore firma, CTA, titoli */
  --brese-oro-chiaro:  #E8D48A; /* Oro Chiaro — highlight, hover */
  --brese-bronzo:      #8A5A14; /* Bronzo — ombre dell'oro, testo oro su crema */
  --brese-crema:       #F7F1D7; /* Crema — testo su scuro, sfondi chiari */
  --brese-pergamena:   #EDE3C4; /* Pergamena — sezioni chiare alternate */

  /* --- Accenti di prodotto (uso minimo: badge, etichette, filetti) ---
     Il dualismo Pizza & Sushi: rosso del forno vs verde del wasabi */
  --brese-rosso-forno:  #A63A22; /* Pizza */
  --brese-verde-wasabi: #5F6F2E; /* Sushi */

  /* --- Gradiente oro (riprende il nastro del logo) --- */
  --brese-gradiente-oro: linear-gradient(135deg,
      #7A4E10 0%, #B98F39 22%, #F3E39A 48%, #C9A24A 70%, #8A5A14 100%);

  /* --- Tipografia --- */
  --font-display: "Josefin Sans", "Century Gothic", sans-serif; /* titoli, maiuscolo */
  --font-script:  "Yellowtail", cursive;                         /* accenti calligrafici */
  --font-body:    "DM Sans", system-ui, sans-serif;              /* testo corrente */

  /* Scala tipografica (rapporto ~1.25) */
  --fs-xs:   0.8rem;
  --fs-sm:   0.9rem;
  --fs-base: 1.0625rem;
  --fs-lg:   1.3rem;
  --fs-xl:   1.75rem;
  --fs-2xl:  2.4rem;
  --fs-3xl:  clamp(2.6rem, 6vw, 4.2rem);

  --tracking-display: 0.14em; /* spaziatura maiuscole come nel logo */

  /* --- Spazi, raggi, ombre --- */
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 1rem;
  --space-4: 1.5rem;  --space-5: 2.5rem; --space-6: 4rem; --space-7: 6rem;
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-pill: 999px;
  --shadow-oro: 0 6px 24px rgba(201, 162, 74, 0.25);
  --shadow-scuro: 0 10px 30px rgba(0, 0, 0, 0.45);
}