/* ===========================================
   GLOBAL CSS - FUNDESI
   Colores, tipografías y estilos universales
   Archivo: css/global.css
   =========================================== */

/* Paleta institucional FUNDESI
   NOTA:
   - Estas variables se usan en TODO el sitio.
   - Si las borras, cualquier var(--fundesi-...) dejará de funcionar. */
:root {
    --fundesi-red:   #E3312D;   /* rojo institucional FUNDESI */
    --fundesi-yellow:#FFD447;   /* amarillo */
    --fundesi-green: #0F8A3B;   /* verde medio */
    --fundesi-green-dark: #0B4F38; /* verde oscuro */
    --fundesi-gray:  #212121;  /* gris texto principal */
    --fundesi-light: #F5F5F5;  /* gris muy claro de fondo */
    --gray-100:      #f3f4f6;
    --gray-200:      #e5e7eb;
    --gray-600:      #4b5563;
}

/* Reset básico */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Estilo base del body */
body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--fundesi-gray);
    background-color: #ffffff;
    margin: 0;
}

/* ===========================================
   SECCIONES Y TÍTULOS GENERALES
   (usados en varias páginas)
   =========================================== */

/* Espaciado vertical estándar */
.section-padding {
    padding: 3rem 0;
}

/* Título principal de cada sección */
.section-title {
    font-weight: 800;
    color: var(--fundesi-green-dark);
    margin-bottom: 0.5rem;
}

/* Subtítulo debajo de los títulos */
.section-subtitle {
    color: var(--gray-600);
    margin-bottom: 1.5rem;
    max-width: 42rem;
}

/* Fondo gris claro para secciones alternas */
.bg-light-fundesi {
    background-color: var(--gray-100);
}

/* Texto gris suave reutilizable */
.text-muted-fundesi {
    color: var(--gray-600);
}