/* Reset e configurações base */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


html {
    font-size: 1.48vh;
    scroll-behavior: smooth;
}


body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    line-height: 1.5;
    color: #0B1220;
    background: #ffffff;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 100vw;
    box-sizing: border-box;
}

.page-root {
    background: #ffffff;
    margin: 0;
    padding: 0;
}

.impacto-root {
    background: #ffffff;
    margin: 0;
    padding: 0;
}

.impacto-root section {
    margin-top: 0;
    margin-bottom: 0;
}

.impacto-root section:first-of-type {
    margin-top: 0;
}

.impacto-root section:last-of-type {
    margin-bottom: 0;
}




/* DIN Typography System */
:root {
    /* DIN Font Weights */
    --din-regular: 400;
    --din-medium: 500;
    --din-bold: 700;
    
    /* Universal Typography Variables */
    --font-h1: 4vw;
    --font-h2: 3vw;
    --font-h3: 2.5vw;
    --font-h4: 2vw;
    --font-p: 1.5vw;
    
    /* Typography Scale */
    --text-xs: 1.2vh;    /* 12px */
    --text-sm: 1.4vh;   /* 14px */
    --text-base: 1.6vh;     /* 16px */
    --text-lg: 1.8vh;   /* 18px */
    --text-xl: 2vh;    /* 20px */
    --text-2xl: 2.4vh;    /* 24px */
    --text-3xl: 3vh;  /* 30px */
    --text-4xl: 3.6vh;   /* 36px */
    --text-5xl: 4.8vh;      /* 48px */
    --text-6xl: 6vh;   /* 60px */
}


/* Tokens de design */
:root {
    /* Cores */
    --blue-primary: #16A34A;
    --blue-hover: #15803D;
    --blue-light: #86EFAC;
    --blue-bg: rgba(22, 163, 74, 0.06);
    --gray-900: #0B1220;
    --gray-600: #6B7280;
    --gray-300: #E5E7EB;
    --gray-200: #EEF2F7;
    --gray-100: #F8FAFC;
    --purple: #8B5CF6;
    --magenta: #A855F7;
    --green: #16A34A;
    --white: #FFFFFF;
    
    /* Spacing (grid de 8px) */
    --space-1: 0.37vh; /* 4px */
    --space-2: 0.74vh;  /* 8px */
    --space-3: 1.11vh; /* 12px */
    --space-4: 1.48vh;    /* 16px */
    --space-6: 2.22vh;  /* 24px */
    --space-8: 2.96vh;    /* 32px */
    --space-12: 4.44vh;   /* 48px */
    --space-16: 5.93vh;   /* 64px */
    --space-18: 6.67vh; /* 72px */
    --space-22: 8.15vh; /* 88px */
    
    /* Border radius */
    --radius-sm: 0.74vh;   /* 8px */
    --radius-md: 1.11vh;  /* 12px */
    --radius-lg: 1.48vh;     /* 16px */
    --radius-xl: 1.85vh;  /* 20px */
    --radius-2xl: 2.59vh; /* 28px */
    --radius-3xl: 2.96vh;    /* 32px */
    --radius-full: 9999vh;
    
    /* Shadows */
    --shadow-sm: 0 0.37vh 1.11vh rgba(15, 23, 42, 0.06);
    --shadow-md: 0 0.74vh 1.85vh rgba(15, 23, 42, 0.06);
    --shadow-lg: 0 0.93vh 2.78vh rgba(15, 23, 42, 0.06);
    
    /* Container */
    --container-max: 58.33vw;
    --container-padding: var(--space-6);
}

/* Universal Typography Styles */
h1 { 
    font-size: var(--font-h1); 
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 2vh;
}

h2 { 
    font-size: var(--font-h2); 
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 1.5vh;
}

h3 { 
    font-size: var(--font-h3); 
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 1vh;
}

h4 { 
    font-size: var(--font-h4); 
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 0.8vh;
}

p { 
    font-size: var(--font-p); 
    font-weight: 400;
    line-height: 1.5;
    margin-bottom: 1vh;
}

/* Responsive Typography Adjustments */
/* Mobile (até 480px) */
@media (max-width: 480px) {
    :root {
        --font-h1: 5vw;
        --font-h2: 4vw;
        --font-h3: 3vw;
        --font-h4: 2.5vw;
        --font-p: 2vw;
    }
    
    h1 { 
        margin-bottom: 1.5vh;
    }
    
    h2 { 
        margin-bottom: 1.2vh;
    }
    
    h3 { 
        margin-bottom: 0.8vh;
    }
    
    h4 { 
        margin-bottom: 0.6vh;
    }
    
    p { 
        margin-bottom: 0.8vh;
    }
}

/* Tablet (481px - 768px) */
@media (min-width: 481px) and (max-width: 768px) {
    :root {
        --font-h1: 4.5vw;
        --font-h2: 3.5vw;
        --font-h3: 2.8vw;
        --font-h4: 2.2vw;
        --font-p: 1.7vw;
    }
}

/* Desktop pequeno (769px - 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    :root {
        --font-h1: 3.8vw;
        --font-h2: 2.8vw;
        --font-h3: 2.3vw;
        --font-h4: 1.8vw;
        --font-p: 1.4vw;
    }
}

/* Desktop grande (1025px+) */
@media (min-width: 1025px) {
    :root {
        --font-h1: 3.5vw;
        --font-h2: 2.5vw;
        --font-h3: 2vw;
        --font-h4: 1.6vw;
        --font-p: 1.2vw;
    }
}

.container {
    max-width: 65vw;
    margin: 0 auto;
}