/* ═══════════════════════════════════════════════════════════════
       ROOT VARIABLES
    ═══════════════════════════════════════════════════════════════ */
    :root {
      --color-primary:        #4DBD9F;
      --color-primary-dark:   #3aa589;
      --color-hero-bg:        #DDE9E3;
      --color-page-bg:        #ffffff;
      --color-text:           #1a1a1a;
      --color-text-muted:     #555555;
      --color-btn-bg:         #4DBD9F;
      --color-btn-text:       #ffffff;
      --color-btn-hover-text: #000000;

      --font-heading: 'Spectral', serif;
      --font-body:    'Karla', sans-serif;
      --font-btn:     'Josefin Sans', sans-serif;

      --radius-card:  28px;
      --radius-img:   clamp(18px, 2vw, 36px);
      --radius-btn:   999px;
      --radius-input: 10px;
    }