/* ============================================================
   AGE CONSULTANT — BRAND DESIGN SYSTEM
   Brand Colors: Black, White, and Vibrant Red
   - Vibrant Red (Primary / Accent):   #E01E2E
   - Vibrant Red Dark (Hover):         #B91420
   - Vibrant Red Light (Tint):         #FEF2F2
   - Deep Black (Headings / Elements): #0A0A0A
   - Neutral Ink (Body Text):          #18181B
   - Muted Ink (Secondary Text):       #52525B
   - Crisp White (Page / Cards):       #FFFFFF
   - Soft Neutral Light:               #F8F9FA
   - Clean Border:                     #E5E7EB
   - Sleek Obsidian Footer:            #0C0C0E
   Fonts: Petrona (headings), Work Sans (body), Caveat (script)
   Radius Scale:
   - Small elements & buttons: 10px / fully-rounded pill: 999px
   - Cards, boxes & containers: 16px
   ============================================================ */

:root {
  /* ─── COLOR PALETTE ─────────────────────────────────────── */
  --color-primary:        #E01E2E;   /* Vibrant Red */
  --color-primary-dark:   #B91420;   /* Deep Vibrant Red (hover) */
  --color-primary-light:  #FEF2F2;   /* Soft red tint */
  --color-primary-border: rgba(224, 30, 46, 0.25);

  --color-red:            #E01E2E;   /* Vibrant Red */
  --color-red-dark:       #B91420;   /* Deep Vibrant Red */
  --color-red-light:      #FEF2F2;   /* Soft Red Tint */
  --color-red-border:     rgba(224, 30, 46, 0.30);

  /* Legacy alias mapped to brand red for compatibility */
  --color-gold:           #E01E2E;   /* Vibrant Red accent */
  --color-gold-dark:      #B91420;   /* Deep red */
  --color-gold-light:     #FEF2F2;   /* Clean red background tint */
  --color-gold-border:    rgba(224, 30, 46, 0.25);

  --color-black:          #0A0A0A;   /* Pure rich black */
  --color-ink:            #111827;   /* High-contrast dark ink text */
  --color-ink-muted:      #52525B;   /* Clean neutral muted body text */
  --color-ink-light:      #9CA3AF;   /* Subtle placeholder / lines */

  --color-bg-page:        #FFFFFF;   /* Pure crisp white */
  --color-bg-cream:       #F8F9FA;   /* Soft clean ultra-light neutral */
  --color-bg-white:       #FFFFFF;   /* Pure white */
  --color-bg-card:        #FFFFFF;   /* Clean white */

  --color-border:         #E5E7EB;   /* Clean modern light gray border */
  --color-border-subtle:  rgba(0, 0, 0, 0.08);

  --color-footer-bg:      #0C0C0E;   /* Sleek obsidian black footer */
  --color-footer-dark:    #050507;   /* Deepest black gradient edge */
  --color-footer-text:    #FFFFFF;   /* Pure white footer text */
  --color-footer-sub:     rgba(255, 255, 255, 0.70);

  --color-success:        #16A34A;
  --color-error:          #DC2626;

  /* ─── TYPOGRAPHY ─────────────────────────────────────────── */
  --font-heading: 'Petrona', Georgia, "Times New Roman", serif;
  --font-body:    'Work Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-script:  'Caveat', cursive, sans-serif;

  --text-xs:   0.8125rem;  /* 13px */
  --text-sm:   0.875rem;   /* 14px */
  --text-base: 1rem;       /* 16px */
  --text-lg:   1.125rem;   /* 18px */
  --text-xl:   1.25rem;    /* 20px */
  --text-2xl:  1.5rem;     /* 24px */
  --text-3xl:  1.875rem;   /* 30px */
  --text-4xl:  2.25rem;    /* 36px */
  --text-5xl:  3rem;       /* 48px */
  --text-6xl:  3.75rem;    /* 60px */

  --weight-normal:    400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;

  --leading-tight:   1.15;
  --leading-snug:    1.32;
  --leading-normal:  1.5;
  --leading-relaxed: 1.68;

  /* ─── SPACING SCALE ──────────────────────────────────────── */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-5:  1.25rem;
  --sp-6:  1.5rem;
  --sp-8:  2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;
  --sp-24: 6rem;

  --section-py: clamp(4rem, 6.5vw, 5.5rem);

  /* ─── STRICT GLOBAL BORDER RADIUS ────────────────────────── */
  --r-btn:  10px;      /* Standard small buttons, stat circles, badges */
  --r-card: 16px;      /* ALL cards, boxes, and containers */
  --r-pill: 999px;     /* Fully-rounded CTA buttons, chips, pill badges */

  /* ─── MODERN LAYERED SHADOW SYSTEM ───────────────────────── */
  --shadow-sm:    0 2px 8px rgba(0, 0, 0, 0.04);
  --shadow-card:  0 2px 8px rgba(0, 0, 0, 0.04), 0 12px 28px rgba(0, 0, 0, 0.06);
  --shadow-hover: 0 6px 18px rgba(0, 0, 0, 0.07), 0 18px 36px rgba(224, 30, 46, 0.12);
  --shadow-btn:   0 4px 14px rgba(224, 30, 46, 0.28);
  --shadow-btn-h: 0 8px 24px rgba(224, 30, 46, 0.40);
  --shadow-nav:   0 2px 14px rgba(0, 0, 0, 0.06);

  /* ─── GLOBAL UNIFIED TRANSITIONS ─────────────────────────── */
  --btn-transition:  220ms ease-out;
  --card-transition: 240ms ease-out;
  --fast:            150ms ease;
  --base-t:          220ms ease-out;

  /* ─── LAYOUT ─────────────────────────────────────────────── */
  --max-w: 1200px;
  --nav-h: 88px;
}