/* Variables globales del tema */
:root {
    /* Colores */
    --color-primary: #333333;
    --color-secondary: #666666;
    --color-accent: #999999;
    --color-background: #ffffff;
    --color-light-gray: #f8f8f8;
    
    /* Tipografía */
    --font-title: 'Montserrat', sans-serif;
    --font-body: 'Inter', sans-serif;
    --font-size-base: 16px;
    --line-height-base: 1.6;
    
    /* Espaciado */
    --spacing-unit: 2rem;
    --spacing-small: 1rem;
    --spacing-medium: 2rem;
    --spacing-large: 4rem;
    
    /* Bordes y Sombras */
    --border-radius: 8px;
    --border-radius-small: 4px;
    --box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    --box-shadow-large: 0 8px 16px rgba(0, 0, 0, 0.1);
    
    /* Transiciones */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;
    
    /* Layout */
    --header-height: 103px;
    --container-max-width: 1400px;
    --container-padding: 2rem;
    --grid-gap: 20px;
}

/* Media queries para variables responsivas */
@media (max-width: 768px) {
    :root {
        --header-height: 80px;
        --container-padding: 1rem;
        --grid-gap: 15px;
        --spacing-unit: 1.5rem;
    }
}

@media (max-width: 480px) {
    :root {
        --header-height: 70px;
        --container-padding: 0.75rem;
        --grid-gap: 10px;
        --spacing-unit: 1rem;
    }
}