:root {
    /* ════════════════════════════════
       CORE THEME — 8 colors to rule them all
       Change here = entire site updates
    ════════════════════════════════ */

    /* 1. Brand */
    --primary:      #B402FC;
    --primary-dark: #7B2FBE;

    /* 2. Backgrounds */
    --bg:           #ffffff;
    --bg-alt:       #f8f2ff;
    --bg-dark:      #161619;

    /* 3. Text */
    --text:         #161619;
    --text-muted:   #5F6172;

    /* 4. Border */
    --border:       #E0E0E0;


    /* ════════════════════════════════
       DERIVED — do not edit
    ════════════════════════════════ */

    /* Brand variants */
    --primary-light: #b00cf7;
    --primary-glow:  rgba(180, 2, 252, 0.14);

    /* Aliases for existing CSS */
    /* Legacy aliases — custome.css uses these, do not remove */
    --purpul:     var(--primary);
    --white:      var(--bg);
    --black:      var(--text);
    --dark-text:  var(--text);
    --dark:       var(--bg-alt);
    --header:     var(--bg);
    --dark-black: #0F0D0D;
    --light-text: #BFBFBF;
    --text-white: #ffffff;

    /* Borders */
    --dark-border:       #9E9E9E;
    --light-dark-border: #DADADA;
    --light-border:      #C6C6C6;
    --glass-border:      #D3D3D3;
    --career:            #D6D6D6;
    --glass:             #f5f5f580;
    --about:             #232323;

    /* Header / Nav / Footer */
    --sticky-header: var(--bg-dark);
    --footer-black:  var(--bg-dark);
    --active:        #ffffff;
    --mode:          #E7E7E7;
    --round-white:   #ffffff;
    --btn-white:     #ffffff;
    --btn-black:     #000000;

    /* Shadows */
    --light-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    --dark-shadow:  rgba(149, 157, 165, 0.2) 0px 8px 24px;
    --shadow-soft:  0 20px 55px rgba(15, 13, 13, 0.08);
    --shadow-card:  0 18px 40px rgba(15, 13, 13, 0.08);

    /* Spacing / UI */
    --divider:             rgba(15,13,13,0.08);
    --radius:              24px;
    --section-space:       clamp(72px, 2vw, 120px);
    --section-space-tight: clamp(28px, 4vw, 44px);
    --blue:                #1636F2;

    /* Status colors */
    --agrc:        #22C55E;
    --agrc-dim:    rgba(34, 197, 94, 0.12);
    --agrc-border: rgba(34, 197, 94, 0.2);
    --dpdp:        #3B82F6;
    --dpdp-dim:    rgba(59, 130, 246, 0.1);
    --dpdp-border: rgba(59, 130, 246, 0.2);
}