:root {
    /* Main Brand Colors */
    --color-primary: #003d7c;      /* Pertamina Blue */
    --color-primary-dark: #002855; /* Pertamina Blue Dark */
    --color-primary-light: #0054a6; /* Pertamina Blue Light */
    --color-primary-rgb: 0, 61, 124;

    --color-secondary: #1b6d24;    /* Brand Green */
    --color-secondary-dark: #134d19;
    --color-secondary-rgb: 27, 109, 36;

    /* Earth Tones / Bambu Theme */
    --color-bambu-light: #e8f5e9;
    --color-bambu-accent: #81c784;
    --color-earth-brown: #8d6e63;
    
    /* Backgrounds */
    --color-bg-body: #faf9f6;      /* Warm off-white */
    --color-bg-white: #ffffff;
    --color-bg-soft: #f0f2f5;

    /* Text Colors */
    --color-text-main: #171c1f;
    --color-text-muted: #424751;
    --color-text-light: #ffffff;

    /* UI Elements & Borders */
    --color-border: #e0e3e7;
    --color-border-light: #e2e8f0;
    
    /* State Colors */
    --color-danger: #c9302c;
    --color-warning: #d99b3b;
    --color-success: #1b6d24;
    --color-info: #0054a6;
    
    /* Selection */
    --color-selection-bg: #0054a6;
    --color-selection-text: #afcbff;

    /* Typography Variables (Fluid) */
    --font-sans: 'Inter', sans-serif;
    --font-heading: 'Montserrat', sans-serif;
    --text-sm: clamp(0.875rem, 0.8vw + 0.6rem, 0.9rem);
    --text-base: clamp(1rem, 0.5vw + 0.8rem, 1.125rem);
    --text-lg: clamp(1.125rem, 0.6vw + 0.9rem, 1.25rem);
    --text-xl: clamp(1.25rem, 1vw + 0.9rem, 1.5rem);
    --text-2xl: clamp(1.5rem, 1.5vw + 1rem, 2rem);
    --text-3xl: clamp(1.75rem, 2vw + 1.1rem, 2.5rem);
    --text-4xl: clamp(2rem, 3vw + 1rem, 3rem);
    --text-5xl: clamp(2.5rem, 4vw + 1rem, 4rem);

    /* Radius & Shapes */
    --radius-organic: 24px;
    --radius-card: 16px;
}

/* Custom Text Colors Override */
.text-primary { color: var(--color-primary) !important; }
.text-secondary { color: var(--color-secondary) !important; }
.text-tertiary { color: #830005 !important; }
.text-success { color: var(--color-success) !important; }
.text-warning { color: var(--color-warning) !important; }
.text-info { color: var(--color-info) !important; }
.text-secondary-fixed { color: #a3f69c !important; }

/* Background Tinted Classes */
.bg-primary\/10 { background-color: rgba(0, 61, 124, 0.1) !important; }
.bg-secondary\/10 { background-color: rgba(27, 109, 36, 0.1) !important; }
.bg-tertiary\/10 { background-color: rgba(131, 0, 5, 0.1) !important; }
.bg-success\/10 { background-color: rgba(27, 109, 36, 0.1) !important; }
.bg-warning\/10 { background-color: rgba(217, 155, 59, 0.1) !important; }
.bg-info\/10 { background-color: rgba(0, 84, 166, 0.1) !important; }