/* ============================================================
   LENDOLOGY DESIGN TOKENS
   Single source of truth. Match tailwind.config.mjs + lp-* CSS
   used on lendology.com.au
   ============================================================ */

:root {
  /* ---- BRAND COLOURS ---- */

  /* Navy — primary text, dark surfaces, brand anchor */
  --ld-navy:         #12253a;
  --ld-navy-deep:    #0c1d2e;  /* hero bgs, footer */
  --ld-navy-50:      #f0f5fb;
  --ld-navy-100:     #d9e6f4;
  --ld-navy-200:     #b3cde9;
  --ld-navy-300:     #7ea8d6;
  --ld-navy-400:     #4a7fbe;
  --ld-navy-500:     #2b5fa2;
  --ld-navy-600:     #1e4a86;
  --ld-navy-700:     #1a3a6b;
  --ld-navy-800:     #162f57;
  --ld-navy-900:     #12253a;

  /* Mint — accent, CTAs, highlights. One hero colour. Use with restraint. */
  --ld-mint:         #1edcaa;
  --ld-mint-dark:    #087358;  /* accessible text on light bg */
  --ld-mint-light:   #e6fdf5;  /* hover surface, soft fills */
  --ld-mint-mid:     rgba(30, 220, 170, 0.12);
  --ld-mint-50:      #edfdf8;
  --ld-mint-100:     #d0faf0;
  --ld-mint-200:     #a4f4e1;
  --ld-mint-300:     #69e9cc;
  --ld-mint-400:     #2ed5b2;
  --ld-mint-500:     #1edcaa;
  --ld-mint-600:     #0bac85;
  --ld-mint-700:     #0b896d;
  --ld-mint-800:     #0d6d58;
  --ld-mint-900:     #0d5a49;

  /* Neutrals */
  --ld-white:        #ffffff;
  --ld-cream:        #faf9f7;     /* warm marketing surface */
  --ld-fog:          #f5f7fa;     /* cool section break */
  --ld-text:         #0d1b2a;
  --ld-text-mid:     #4a5568;
  --ld-text-soft:    #718096;
  --ld-border:       rgba(18, 37, 58, 0.08);
  --ld-border-mid:   rgba(18, 37, 58, 0.14);

  /* ---- TYPE ---- */
  --ld-font-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Scale (rem) */
  --ld-fs-display:   3.5rem;   /* 56 */
  --ld-fs-h1:        2.5rem;   /* 40 */
  --ld-fs-h2:        2rem;     /* 32 */
  --ld-fs-h3:        1.5rem;   /* 24 */
  --ld-fs-h4:        1.25rem;  /* 20 */
  --ld-fs-body-lg:   1.125rem; /* 18 */
  --ld-fs-body:      1rem;     /* 16 */
  --ld-fs-small:     0.875rem; /* 14 */
  --ld-fs-micro:     0.75rem;  /* 12 - kicker/eyebrow */

  /* Line heights */
  --ld-lh-display:   1.1;
  --ld-lh-heading:   1.15;
  --ld-lh-body:      1.7;
  --ld-lh-tight:     1.3;

  /* Tracking */
  --ld-tracking-display: -0.02em;
  --ld-tracking-h:       -0.015em;
  --ld-tracking-kicker:   0.09em;

  /* Weights */
  --ld-fw-regular:   400;
  --ld-fw-medium:    500;
  --ld-fw-semi:      600;
  --ld-fw-bold:      700;
  --ld-fw-xbold:     800;

  /* ---- SPACING (8px grid) ---- */
  --ld-space-1:      0.25rem;  /* 4  */
  --ld-space-2:      0.5rem;   /* 8  */
  --ld-space-3:      0.75rem;  /* 12 */
  --ld-space-4:      1rem;     /* 16 */
  --ld-space-5:      1.25rem;  /* 20 */
  --ld-space-6:      1.5rem;   /* 24 */
  --ld-space-8:      2rem;     /* 32 */
  --ld-space-10:     2.5rem;   /* 40 */
  --ld-space-12:     3rem;     /* 48 */
  --ld-space-16:     4rem;     /* 64 */
  --ld-space-section:    5rem; /* 80 - standard section rhythm */
  --ld-space-section-lg: 7.5rem;

  /* Container */
  --ld-wrap-max:     1140px;
  --ld-wrap-pad:     28px;

  /* ---- RADIUS ---- */
  --ld-r-sm:         6px;
  --ld-r-md:         10px;
  --ld-r-lg:         14px;
  --ld-r-xl:         20px;
  --ld-r-2xl:        1rem;
  --ld-r-3xl:        1.5rem;
  --ld-r-pill:       9999px;

  /* ---- SHADOWS ---- */
  --ld-shadow-card:    0 2px 20px 0 rgba(18,37,58,0.08);
  --ld-shadow-card-lg: 0 8px 40px 0 rgba(18,37,58,0.12);
  --ld-shadow-mint:    0 4px 24px 0 rgba(30,220,170,0.25);
  --ld-shadow-nav:     0 1px 8px rgba(0,0,0,0.05);

  /* ---- MOTION ---- */
  --ld-ease:         cubic-bezier(0.2, 0.8, 0.2, 1);
  --ld-dur-fast:     140ms;
  --ld-dur:          170ms;
  --ld-dur-slow:     300ms;
}

/* Base */
.ld-base {
  font-family: var(--ld-font-sans);
  color: var(--ld-text);
  -webkit-font-smoothing: antialiased;
  line-height: var(--ld-lh-body);
}