/* Design tokens — warm cream + olive + terracotta.
 * Pivoted from sage-pale (v0.1) to a richer kitchen/cookbook aesthetic
 * after operator feedback that the original was too pale and too
 * minimalist. Warm photography does the heavy lifting; tokens give it
 * a frame.
 */

:root {
  /* ---------- color ---------- */

  /* Backgrounds — warm cream family */
  --bg-base:        #F4EBD9;   /* warm cream — page bg */
  --bg-elevated:    #FDF8EC;   /* card surface, slightly lighter */
  --bg-accent:      #E8D9BA;   /* warm sand, for section breaks */
  --bg-deep:        #2A1F1A;   /* deep warm brown for inverted sections */

  /* Text — warm dark browns */
  --text-primary:   #2A1F1A;
  --text-secondary: #5C4D43;
  --text-muted:     #8B7E73;
  --text-inverse:   #FDF8EC;

  /* Olive — primary brand color, more saturated than the old sage */
  --olive-primary:  #6A8246;
  --olive-deep:     #475A2E;
  --olive-darker:   #354522;
  --olive-light:    #B8C29C;
  --olive-faint:    #E0E2C5;
  --olive-edge:     #C9CDA5;

  /* Terracotta — warm earth accent, replaces apricot */
  --terracotta:       #C56E45;
  --terracotta-deep:  #9F4D2A;
  --terracotta-faint: #F1D7C5;

  /* Gold — for true_save callouts and highlights */
  --gold:        #D89C3E;
  --gold-deep:   #B07820;
  --gold-faint:  #F4E2B8;

  /* Danger — warmer red, matches the palette */
  --danger:        #B85037;
  --danger-faint:  #EFCAC0;

  /* ---------- typography ---------- */
  /* All Hebrew-strong sans. Heebo for body, Assistant for display
   * (both Google Fonts, full Hebrew glyph coverage at every loaded
   * weight). The previous serif (Frank Ruhl Libre) is gone — its
   * heavy weights rendered poorly in Hebrew and it sometimes fell
   * back to Arial. */
  --font-hebrew:  'Heebo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-display: 'Assistant', 'Heebo', system-ui, -apple-system, sans-serif;
  --font-english: 'Heebo',  system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    ui-monospace, 'JetBrains Mono', 'Cascadia Mono', monospace;

  --text-xs:    14px;
  --text-sm:    16px;
  --text-base:  20px;
  --text-lg:    28px;
  --text-xl:    40px;
  --text-2xl:   60px;
  --text-3xl:   80px;

  --leading-tight:  1.1;
  --leading-snug:   1.3;
  --leading-normal: 1.55;
  --leading-relaxed: 1.7;

  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semibold: 600;
  --weight-bold:    700;
  --weight-black:   900;

  /* ---------- spacing ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 40px;
  --space-6: 64px;
  --space-7: 96px;
  --space-8: 128px;

  /* ---------- radius ---------- */
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 40px;
  --radius-pill: 9999px;

  /* ---------- shadows — warmer + deeper ---------- */
  --shadow-card:        0 6px 24px  rgba(42, 31, 26, 0.10);
  --shadow-card-hover:  0 12px 40px rgba(42, 31, 26, 0.16);
  --shadow-photo:       0 24px 64px rgba(42, 31, 26, 0.22);
  --shadow-button:      0 4px 16px  rgba(71, 90, 46, 0.30);
  --shadow-button-hover: 0 8px 28px rgba(53, 69, 34, 0.40);
  --shadow-warm-glow:   0 0 80px rgba(216, 156, 62, 0.18);

  /* ---------- motion ---------- */
  --easing-out: cubic-bezier(0.16, 1, 0.3, 1);
  --easing-in-out: cubic-bezier(0.7, 0, 0.3, 1);
  --duration-quick:  180ms;
  --duration-medium: 320ms;
  --duration-slow:   600ms;

  /* ---------- layout ---------- */
  --container-max: 1280px;
  --container-narrow: 880px;
  --gutter: var(--space-4);

  /* ---------- z ---------- */
  --z-nav: 10;
  --z-modal: 100;
}
