/* ═══════════════════════════════════════
   ELLIE CARE — Design Tokens
   ═══════════════════════════════════════ */
:root {
  /* Brand Colors */
  --blue-deep: #0A1D9E;
  --blue-dark: #0a1854;
  --mint: #A6F1CA;
  --mint-btn: #A6F1CA;
  --pink: #F3A4FF;
  --white: #ffffff;
  --gray-bg: #F2F2F2;

  /* Text */
  --text-dark: #1a1a2e;
  --text-muted: #5a5a7a;

  /* Surfaces */
  --card-bg: rgba(255,255,255,0.92);
  --glass-bg: rgba(255,255,255,0.95);
  --glass-border: rgba(255,255,255,0.2);

  /* Radius */
  --radius: 20px;
  --radius-sm: 12px;
  --radius-pill: 50px;
  --radius-full: 999px;

  /* Spacing */
  --section-pad-x: clamp(1.5rem, 6vw, 5rem);
  --section-pad-y: 6rem;
  --max-width: 1200px;
  --max-width-sm: 1100px;
  --max-width-xs: 920px;

  /* Motion */
  --ease-premium: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Shadows */
  --shadow-soft: 0 2px 8px rgba(0,0,0,0.03);
  --shadow-card: 0 4px 24px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-hover: 0 20px 40px rgba(0,0,0,0.15), 0 8px 16px rgba(0,0,0,0.08);
  --shadow-fab: 0 18px 50px rgba(0,0,0,0.18);

  /* Gradients */
  --gradient-mint-pink: linear-gradient(135deg, rgba(166,241,202,0.2) 0%, rgba(243,164,255,0.15) 100%);
  --gradient-pink-mint: linear-gradient(135deg, rgba(243,164,255,0.15) 0%, rgba(166,241,202,0.1) 100%);
  --gradient-blue: linear-gradient(180deg, var(--blue-deep) 0%, var(--blue-dark) 100%);
  --gradient-footer: linear-gradient(135deg, var(--blue-deep) 0%, var(--blue-dark) 100%);
  --gradient-separator: linear-gradient(90deg, transparent 0%, rgba(166,241,202,0.3) 50%, transparent 100%);

  /* Decorative borders */
  --border-subtle: 1px solid rgba(0,0,0,0.06);
  --border-mint: 1px solid rgba(166,241,202,0.3);
  --border-pink: 1px solid rgba(243,164,255,0.3);
}

/* Mobile overrides */
@media (max-width: 900px) {
  :root {
    --section-pad-x: 16px;
    --section-pad-y: 4rem;
  }
}