/* ========================================
   VARIABLES Y TOKENS DE DISENO
   Paleta, sombras, radios, transiciones.
   Modificar aqui cambia toda la pagina.
   ======================================== */

:root {
    /* Colores principales */
    --azul-principal: #2C5F8A;
    --azul-oscuro: #1B3A57;
    --azul-claro: #4A89B9;
    --azul-muy-claro: #E8F0F7;

    /* Grises */
    --gris-oscuro: #3A3A3A;
    --gris-medio: #6B7280;
    --gris-claro: #9CA3AF;
    --gris-borde: #E5E7EB;
    --gris-fondo: #F8F9FA;

    /* Neutros */
    --blanco: #FFFFFF;

    /* Sombras */
    --sombra-suave: 0 2px 16px rgba(44, 95, 138, 0.08);
    --sombra-media: 0 4px 24px rgba(44, 95, 138, 0.12);
    --sombra-elevada: 0 8px 40px rgba(44, 95, 138, 0.15);

    /* Forma y movimiento */
    --radio: 12px;
    --transicion: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}