:root {
    /* ========================================
       UPM ENGINEERING BRAND COLORS
       Based on official logo analysis
       ======================================== */
    
    /* Primary Green Colors */
    --primary-green: #134820;
    --primary-green-dark: #134820;
    --primary-green-light: #1fc331;
    
    /* Green Palette - Full Gradient Steps */
    --green-darkest: #134820;
    --green-darker: #166624;
    --green-dark: #198528;
    --green-medium: #1ca42c;
    --green-light: #1fc331;
    --green-lighter: #4fce57;
    --green-lightest: #7fd985;
    
    /* Background & Surface Colors */
    --surface-white: #ffffff;
    --surface-light: #fefefe;
    --surface-gray-light: #f8f9fa;
    --surface-gray: #e9ecef;
    --surface-green-light: #f0fcf1;
    
    /* Text Colors */
    --text-white: #ffffff;
    --text-dark: #333333;
    --text-gray: #666666;
    --text-light-gray: #999999;
    --text-green-dark: #145a1f;
    --text-green-medium: #2d8c47;
    --text-on-green: #ffffff;
    
    /* Brand Gradients */
    --brand-gradient-primary: linear-gradient(135deg, #134820 0%, #1fc331 100%);
    --brand-gradient-subtle: linear-gradient(135deg, #f0fcf1 0%, #ffffff 100%);
    --brand-gradient-dark: linear-gradient(135deg, #0f3318 0%, #134820 100%);
    
    /* Interactive States */
    --hover-green: #23d637;
    --active-green: #1bb82d;
    --focus-green: #1fc331;
    --disabled-green: #a8d6b0;
    
    /* Shadows & Borders */
    --shadow-light: rgba(19, 72, 32, 0.1);
    --shadow-medium: rgba(19, 72, 32, 0.15);
    --shadow-strong: rgba(19, 72, 32, 0.25);
    --border-light: rgba(19, 72, 32, 0.1);
    --border-medium: rgba(19, 72, 32, 0.2);
    
    /* Status Colors (keeping green theme) */
    --success: #1fc331;
    --warning: #ffc107;
    --error: #dc3545;
    --info: #17a2b8;
}


/* Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
   
}

html,body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    line-height: 1.6;
    color: var(--text-dark);
    overflow-x: hidden;
    width: 100%;
    box-sizing: border-box;
}