/* ============================================================
   DESIGN TOKENS — Global CSS custom properties
   Loaded on every page via partials/head.php
============================================================ */

:root {
  /* Brand Colors */
  --teal-dark:   #136171;
  --teal-mid:    #429baf;
  --teal-light:  #a8dbcf;
  --purple:      #a75e99;

  /* Pink Palette */
  --pink-bg:     #FEB3D8;
  --pink-100:    #ffd3e5;
  --pink-200:    #ffc6db;
  --pink-300:    #ff9ec1;
  --pink-400:    #feb7d8;
  --pink-500:    #e75480;
  --pink-600:    #d81b60;
  --pink-accent: #f86fd8;

  /* Neutrals */
  --ink-900:  #1f2937;
  --ink-700:  #374151;
  --ink-500:  #6b7280;
  --white:    #ffffff;

  /* Semantic aliases — used across all stylesheets */
  --title-color: var(--teal-dark);
  --card:        var(--white);
  --shadow:      0 10px 25px rgba(31, 41, 55, 0.10);
  --shadow-sm:   0 2px 8px rgba(31, 41, 55, 0.07);
  --shadow-md:   0 4px 16px rgba(0, 0, 0, 0.12);
  --shadow-lg:   0 18px 32px rgba(31, 41, 55, 0.16);

  /* Radius */
  --radius:      14px;
  --radius-sm:   8px;
  --radius-lg:   20px;
  --radius-full: 999px;

  /* Typography */
  --font-body:    'Nunito', 'Chalkboard SE', sans-serif;
  --font-heading: 'Nunito', 'Chalkboard SE', sans-serif;

  /* Transitions */
  --ease:      0.2s ease;
  --ease-slow: 0.35s ease;
}