/* ============================================================
   DESIGN TOKENS — Hoey Art & Love
   All visual constants live here. Import in styles.css.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&family=Playfair+Display:ital,wght@0,700;1,400&display=swap');

:root {
  /* --- Palette --- */
  --color-bg:           #faf7ff;
  --color-purple:       #c9a6e4;
  --color-purple-dark:  #7e5bad;
  --color-purple-light: #ede5f7;
  --color-green:        #a8d5a2;
  --color-green-dark:   #5c9e56;
  --color-white:        #ffffff;
  --color-text:         #3d2b56;
  --color-text-muted:   #7a6a8a;
  --color-border:       #e0d4f5;

  /* --- Typography --- */
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-body:    'Nunito', 'Segoe UI', Arial, sans-serif;

  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.875rem;  /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-lg:   1.25rem;   /* 20px */
  --text-xl:   1.5rem;    /* 24px */
  --text-2xl:  2rem;      /* 32px */
  --text-3xl:  2.5rem;    /* 40px */

  /* --- Spacing --- */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;

  /* --- Shape --- */
  --radius-sm:   0.375rem;
  --radius-md:   0.75rem;
  --radius-lg:   1.25rem;
  --radius-pill: 9999px;

  /* --- Shadows --- */
  --shadow-card:  0 2px 8px rgba(126, 91, 173, 0.12);
  --shadow-hover: 0 6px 20px rgba(126, 91, 173, 0.22);
  --shadow-lg:    0 12px 40px rgba(61, 43, 86, 0.18);

  /* --- Transitions --- */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
}