/* ═══════════════════════════════════════════════════════════════
   Frutta e Verdura di Remus — Design Tokens (drop-in layer)
   Imported PRIMA di styles.css/redesign.css. Questi token sono il
   sistema canonico esportato dal Design System; le CSS esistenti
   mantengono i propri nomi locali ma possono adottare questi
   gradualmente (--g-900, --gold-700, --ivory, ecc.).
   Fonti @font-face restano in styles.css per evitare duplicazioni.
   ═══════════════════════════════════════════════════════════════ */

:root {
  /* ─────────── BRAND PRIMARY: Greens ─────────── */
  --g-950: #050f05;
  --g-900: #0a1f0a;
  --g-850: #0f2e0f;
  --g-800: #1a4a1a;
  --g-700: #245524;
  --g-600: #2d6a2d;
  --g-500: #3d8b3d;
  --g-400: #5aad5a;
  --g-accent: #7fc24a;
  --g-100: #e6f4e6;
  --g-50:  #f0f9f0;

  /* ─────────── BRAND ACCENT: Warm golds / oranges ─────────── */
  --gold-900: #8a5a10;
  --gold-700: #c8860a;
  --gold-500: #f5a623;
  --gold-400: #f5a742;
  --gold-300: #ffd166;
  --gold-200: #f4a261;
  --gold-100: #fdf3e0;

  /* ─────────── NEUTRALS: warm ivory ─────────── */
  --ivory:    #fdfcf8;
  --ivory-2:  #f7f4ee;
  --ivory-3:  #ede9df;
  --cream:    #faf6ef;
  --stone:    #9e9485;
  --ink:      #1c1c1c;
  --ink-2:    #1a2d1a;
  --ink-soft: #5a5245;
  --ink-mute: #6b5f55;
  --ink-on-dark:      #fdfcf8;
  --ink-on-dark-dim:  rgba(253, 252, 248, 0.68);

  /* ─────────── SEMANTIC ─────────── */
  --whatsapp: #25d366;
  --danger:   #b91c1c;
  --info:     #2563eb;

  /* ─────────── SPACING (8px grid + 4px half-step) ─────────── */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;

  /* ─────────── RADII ─────────── */
  --r-xs: 4px;
  --r-sm: 10px;
  --r:    18px;
  --r-lg: 24px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* ─────────── SHADOWS — warm tone (not pure black) ─────────── */
  --shadow-xs: 0 1px 4px rgba(30, 20, 10, 0.07);
  --shadow-sm: 0 2px 10px rgba(30, 20, 10, 0.09);
  --shadow:    0 4px 24px rgba(30, 20, 10, 0.11);
  --shadow-lg: 0 8px 44px rgba(30, 20, 10, 0.14);
  --shadow-xl: 0 16px 64px rgba(30, 20, 10, 0.17);
  --glow-warm:  0 16px 40px rgba(244, 162, 97, 0.35);
  --glow-green: 0 10px 30px rgba(127, 194, 74, 0.35);

  /* ─────────── MOTION ─────────── */
  --t:        0.22s cubic-bezier(0.4, 0, 0.2, 1);
  --t-spring: 0.4s  cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ─────────── TYPE FAMILIES ─────────── */
  --font-display: "Playfair Display", Georgia, serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* ─────────── TYPE SCALE — semantic ─────────── */
  --t-display-xl: clamp(2.6rem, 10vw, 9rem);
  --t-display-lg: clamp(2.4rem, 7vw, 5rem);
  --t-display:    clamp(2rem, 6vw, 4.2rem);
  --t-display-sm: clamp(1.9rem, 5vw, 3rem);
  --t-h1: 2.4rem;
  --t-h2: 1.8rem;
  --t-h3: 1.25rem;
  --t-h4: 1.05rem;
  --t-body-lg: 1.12rem;
  --t-body:    1rem;
  --t-body-sm: 0.92rem;
  --t-caption: 0.82rem;
  --t-eyebrow: 0.78rem;
}