/* ==========================================================================
   EZEE CREDIT DESIGN SYSTEM — CSS CUSTOM PROPERTIES
   All theme values are defined here. Edit this file to change the theme.
   ========================================================================== */

:root {

  /* ── BRAND COLORS ─────────────────────────────────────────────────────── */
  --ezee-primary:           #0055A5;   /* Primary blue */
  --ezee-primary-dark:      #003D78;   /* Hover / pressed blue */
  --ezee-primary-light:     #4EA8FF;   /* Light accent blue */
  --ezee-primary-bg:        #E8F1FA;   /* Blue tint surface */
  --ezee-primary-bg-strong: #C8DDEF;   /* Stronger blue tint */

  /* ── NAVY PALETTE (hero, footer, dark sections) ───────────────────────── */
  --ezee-navy:       #0D1B2A;   /* Deep navy */
  --ezee-navy-mid:   #1E3A5F;   /* Mid navy */
  --ezee-navy-light: #2B517A;   /* Lighter navy */

  /* ── TEXT SCALE ───────────────────────────────────────────────────────── */
  --ezee-text:         #1A1A1A;   /* Primary text */
  --ezee-text-muted:   #5C6770;   /* Secondary / caption text */
  --ezee-text-soft:    #8A929C;   /* Placeholder / fine print */
  --ezee-text-inverse: #FFFFFF;   /* Text on dark backgrounds */

  /* ── SURFACE / BACKGROUNDS ────────────────────────────────────────────── */
  --ezee-white:         #FFFFFF;
  --ezee-surface:       #F7F9FC;   /* Light gray-blue alternate sections */
  --ezee-surface-alt:   #EEF4FB;   /* Slightly bluer surface */
  --ezee-border:        #E5E9F0;   /* Default borders */
  --ezee-border-strong: #CDD5DF;   /* Stronger borders */

  /* ── SEMANTIC COLORS ──────────────────────────────────────────────────── */
  --ezee-success:     #22C55E;
  --ezee-success-bg:  #DCFCE7;
  --ezee-warning:     #F59E0B;
  --ezee-warning-bg:  #FEF3C7;
  --ezee-error:       #EF4444;
  --ezee-error-bg:    #FEE2E2;
  --ezee-star:        #F59E0B;   /* Review stars */

  /* ── TYPOGRAPHY ───────────────────────────────────────────────────────── */
  --ezee-font-sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
                     Helvetica, Arial, sans-serif;
  --ezee-font-serif: Georgia, 'Times New Roman', 'Times', serif;
  --ezee-font-mono:  'Fira Code', 'Cascadia Code', Consolas, 'Courier New', monospace;

  /* Weights */
  --ezee-weight-normal:    400;
  --ezee-weight-medium:    500;
  --ezee-weight-semibold:  600;
  --ezee-weight-bold:      700;
  --ezee-weight-extrabold: 800;

  /* Size scale (clamped for fluid type on headings) */
  --ezee-text-xs:   0.75rem;                           /* 12px */
  --ezee-text-sm:   0.875rem;                          /* 14px */
  --ezee-text-base: 1rem;                              /* 16px */
  --ezee-text-lg:   1.125rem;                          /* 18px */
  --ezee-text-xl:   1.25rem;                           /* 20px */
  --ezee-text-2xl:  1.5rem;                            /* 24px */
  --ezee-text-3xl:  clamp(1.75rem, 3vw, 2.25rem);     /* 28→36px */
  --ezee-text-4xl:  clamp(2rem, 4vw, 2.75rem);        /* 32→44px */
  --ezee-text-5xl:  clamp(2.25rem, 5.5vw, 3.5rem);   /* 36→56px */
  --ezee-text-6xl:  clamp(2.5rem, 7vw, 4.5rem);      /* 40→72px */

  /* Line heights */
  --ezee-leading-none:    1;
  --ezee-leading-tight:   1.2;
  --ezee-leading-snug:    1.35;
  --ezee-leading-normal:  1.5;
  --ezee-leading-relaxed: 1.7;
  --ezee-leading-loose:   1.9;

  /* Letter spacing */
  --ezee-tracking-tight:   -0.025em;
  --ezee-tracking-snug:    -0.015em;
  --ezee-tracking-normal:  0em;
  --ezee-tracking-wide:    0.04em;
  --ezee-tracking-wider:   0.08em;
  --ezee-tracking-widest:  0.12em;

  /* ── SPACING (4px base) ───────────────────────────────────────────────── */
  --ezee-space-0:   0;
  --ezee-space-1:   0.25rem;    /* 4px */
  --ezee-space-2:   0.5rem;     /* 8px */
  --ezee-space-3:   0.75rem;    /* 12px */
  --ezee-space-4:   1rem;       /* 16px */
  --ezee-space-5:   1.25rem;    /* 20px */
  --ezee-space-6:   1.5rem;     /* 24px */
  --ezee-space-7:   1.75rem;    /* 28px */
  --ezee-space-8:   2rem;       /* 32px */
  --ezee-space-10:  2.5rem;     /* 40px */
  --ezee-space-12:  3rem;       /* 48px */
  --ezee-space-14:  3.5rem;     /* 56px */
  --ezee-space-16:  4rem;       /* 64px */
  --ezee-space-20:  5rem;       /* 80px */
  --ezee-space-24:  6rem;       /* 96px */
  --ezee-space-32:  8rem;       /* 128px */

  /* Responsive section padding */
  --ezee-section-y:    clamp(3rem, 6vw, 5rem);
  --ezee-section-y-sm: clamp(2rem, 4vw, 3.5rem);

  /* ── LAYOUT ───────────────────────────────────────────────────────────── */
  --ezee-max-content: 740px;    /* Reading column (single posts) */
  --ezee-max-narrow:  960px;    /* Narrow page layouts */
  --ezee-max-wide:    1200px;   /* Standard max width */
  --ezee-max-hero:    1440px;   /* Full-bleed hero containers */

  /* ── BORDER RADIUS ────────────────────────────────────────────────────── */
  --ezee-radius-xs:   4px;
  --ezee-radius-sm:   6px;
  --ezee-radius:      8px;
  --ezee-radius-md:   12px;
  --ezee-radius-lg:   20px;
  --ezee-radius-xl:   28px;
  --ezee-radius-2xl:  40px;
  --ezee-radius-full: 9999px;

  /* ── SHADOWS ──────────────────────────────────────────────────────────── */
  --ezee-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.05);
  --ezee-shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
  --ezee-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08), 0 1px 4px rgba(0, 0, 0, 0.04);
  --ezee-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.10), 0 4px 12px rgba(0, 0, 0, 0.05);
  --ezee-shadow-xl: 0 24px 64px rgba(0, 0, 0, 0.12), 0 8px 24px rgba(0, 0, 0, 0.06);

  /* Blue-tinted button shadows */
  --ezee-shadow-btn:       0 2px 8px rgba(0, 85, 165, 0.28);
  --ezee-shadow-btn-hover: 0 6px 20px rgba(0, 85, 165, 0.38);

  /* Inner / inset shadows */
  --ezee-shadow-inner: inset 0 1px 3px rgba(0, 0, 0, 0.06);

  /* ── TRANSITIONS ──────────────────────────────────────────────────────── */
  --ezee-duration-fast:   150ms;
  --ezee-duration:        220ms;
  --ezee-duration-slow:   350ms;
  --ezee-duration-slower: 500ms;

  --ezee-ease:        cubic-bezier(0.4, 0, 0.2, 1);   /* Material standard */
  --ezee-ease-in:     cubic-bezier(0.4, 0, 1, 1);
  --ezee-ease-out:    cubic-bezier(0, 0, 0.2, 1);
  --ezee-ease-spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);

  /* ── Z-INDEX ──────────────────────────────────────────────────────────── */
  --ezee-z-below:    -1;
  --ezee-z-base:      0;
  --ezee-z-raised:    1;
  --ezee-z-dropdown:  100;
  --ezee-z-sticky:    200;
  --ezee-z-overlay:   300;
  --ezee-z-modal:     400;
  --ezee-z-toast:     500;

  /* ── GRID ─────────────────────────────────────────────────────────────── */
  --ezee-gap:    var(--ezee-space-6);   /* 24px */
  --ezee-gap-sm: var(--ezee-space-4);   /* 16px */
  --ezee-gap-lg: var(--ezee-space-8);   /* 32px */
}