/* ============================================================
   FAIRDEAL — Design tokens
   Single source of truth for colour, type, space, motion, shadow.
   ============================================================ */
:root {
  /* ---- Brand colour ---- */
  --primary:        #1FB5E5;
  --primary-dark:   #0F8FB8;
  --primary-darker: #0A6E8E;
  --primary-tint:   #E8F7FC;
  --primary-tint-2: #F4FBFD;

  --ink:        #0A1929;
  --text:       #1A2332;
  --text-muted: #5B6478;
  --text-soft:  #8B95A1;

  --bg:     #FFFFFF;
  --warm:   #FAF7F2;
  --warm-2: #F5F1EA;

  --border:      #E5E9F0;
  --border-soft: #F0F2F5;

  --gold: #C49A5C;

  /* External brand colours (keep distinct from --primary) */
  --whatsapp:       #25D366;
  --whatsapp-hover: #1FA755;
  --star:           #F59E0B;
  --google-blue:    #4285F4;

  /* ---- Type ---- */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'DM Sans', system-ui, -apple-system, sans-serif;

  --t-display: clamp(2.5rem, 1.5rem + 4vw, 5rem);
  --t-h1:      clamp(2rem, 1.3rem + 2.6vw, 3.5rem);
  --t-h2:      clamp(1.5rem, 1.1rem + 1.6vw, 2.4rem);
  --t-h3:      1.25rem;
  --t-body:    1rem;
  --t-small:   0.875rem;

  /* ---- Space (4 px base) ---- */
  --s-1:  0.25rem;
  --s-2:  0.5rem;
  --s-3:  0.75rem;
  --s-4:  1rem;
  --s-6:  1.5rem;
  --s-8:  2rem;
  --s-12: 3rem;
  --s-16: 4rem;
  --s-24: 6rem;

  /* ---- Layout ---- */
  --max-w:     1600px;
  --pad-x:     clamp(1.25rem, 4vw, 3.5rem);
  --radius:    12px;
  --radius-lg: 18px;

  /* ---- Motion ---- */
  --ease-out-soft:   cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --t-fast: 180ms;
  --t-base: 320ms;
  --t-slow: 600ms;

  /* ---- Shadow ---- */
  --shadow-1: 0 1px 2px rgba(10,25,41,0.04), 0 2px 6px rgba(10,25,41,0.06);
  --shadow-2: 0 4px 12px rgba(10,25,41,0.08), 0 12px 28px -8px rgba(10,25,41,0.12);
  --shadow-3: 0 12px 28px -16px rgba(10,25,41,0.2), 0 24px 48px -20px rgba(10,25,41,0.18);
  --shadow-cyan: 0 12px 28px -12px rgba(31,181,229,0.45);
  --shadow-gold: 0 12px 28px -12px rgba(196,154,92,0.35);
}
