/* ==============================================
   VARIABLES — improx-group/assets/css/global/variables.css
   ============================================== */

:root {

    /* ── Brand Colors ── */
    --color-primary:        #0057FF;
    --color-primary-dark:   #0044D4;
    --color-primary-light:  #E8F1FF;
    --color-primary-muted:  #EAF2FF;

    --color-navy:           #0F172A;
    --color-navy-mid:       #1E293B;
    --color-navy-soft:      #334155;

    --color-slate:          #475569;
    --color-muted:          #64748B;
    --color-muted-light:    #94A3B8;

    --color-border:         #E2E8F0;
    --color-border-light:   #F1F5F9;

    --color-surface:        #F8FAFC;
    --color-white:          #FFFFFF;

    --color-success:        #10B981;
    --color-warning:        #F59E0B;
    --color-error:          #EF4444;

    /* ── Classic accent (premium touches: dividers, quote marks, badges) ── */
    --color-gold:           #B08D57;
    --color-gold-light:     #F6EFE3;

    /* ── Accent Palette (used for department color coding) ── */
    --accent-consulting:    #6366F1;
    --accent-cloud:         #06B6D4;
    --accent-marketing:     #F97316;
    --accent-data:          #10B981;
    --accent-business:      #8B5CF6;
    --accent-software:      #0057FF;
    --accent-it:            #EC4899;
    --accent-va:            #F59E0B;

    /* ── Typography ── */
    --font-family:          'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-family-display:  'Fraunces', 'Georgia', 'Times New Roman', serif;
    --font-size-xs:         0.75rem;   /* 12px */
    --font-size-sm:         0.875rem;  /* 14px */
    --font-size-base:       1rem;      /* 16px */
    --font-size-md:         1.125rem;  /* 18px */
    --font-size-lg:         1.25rem;   /* 20px */
    --font-size-xl:         1.5rem;    /* 24px */
    --font-size-2xl:        2rem;      /* 32px */
    --font-size-3xl:        2.25rem;   /* 36px */
    --font-size-4xl:        2.75rem;   /* 44px */
    --font-size-5xl:        3.625rem;  /* 58px */

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

    --line-height-tight:    1.2;
    --line-height-snug:     1.4;
    --line-height-base:     1.6;
    --line-height-relaxed:  1.8;
    --line-height-loose:    2;

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

    --section-padding:      6.25rem 0;  /* 100px */
    --section-padding-lg:   7.5rem 0;   /* 120px */
    --section-padding-sm:   5rem 0;     /* 80px */

    /* ── Layout ── */
    --container-max:        1200px;
    --container-wide:       1400px;
    --container-narrow:     900px;

    /* ── Borders ── */
    --radius-sm:    6px;
    --radius-md:    10px;
    --radius-lg:    14px;
    --radius-xl:    20px;
    --radius-2xl:   30px;
    --radius-full:  9999px;

    /* ── Shadows ── */
    --shadow-xs:    0 1px 3px rgba(0,0,0,.08);
    --shadow-sm:    0 4px 12px rgba(0,0,0,.07);
    --shadow-md:    0 10px 30px rgba(0,0,0,.08);
    --shadow-lg:    0 20px 50px rgba(15,23,42,.12);
    --shadow-xl:    0 30px 80px rgba(15,23,42,.16);

    /* ── Transitions ── */
    --transition-fast:   0.15s ease;
    --transition-base:   0.25s ease;
    --transition-slow:   0.4s ease;

    /* ── Z-Index ── */
    --z-dropdown:   100;
    --z-sticky:     200;
    --z-overlay:    300;
    --z-modal:      400;
    --z-toast:      500;
}
