﻿/* ============================================================
   PROYECTO : DeoNell Consultora
   ARCHIVO  : variables.css
   VERSION  : 0.1.0
   FECHA    : Agosto 2026

   DESCRIPCIÓN
   -----------
   Variables globales utilizadas para mantener una identidad
   visual consistente en todo el sitio web.
============================================================ */

:root {
    /* ========================================================
       IDENTIDAD VISUAL
    ======================================================== */

    --color-azul-institucional: #10295a;
    --color-azul-profundo: #071b45;
    --color-violeta-principal: #6535b5;
    --color-violeta-claro: #8256cf;
    --color-turquesa-principal: #18a6ab;
    --color-turquesa-claro: #49c5c9;
    /* ========================================================
       COLORES DE TEXTO
    ======================================================== */

    --color-texto-principal: #10295a;
    --color-texto-secundario: #596273;
    --color-texto-suave: #7b8493;
    --color-texto-claro: #ffffff;
    /* ========================================================
       COLORES DE FONDO
    ======================================================== */

    --color-fondo-principal: #ffffff;
    --color-fondo-suave: #f6f7fb;
    --color-fondo-footer: #171043;
    /* ========================================================
       BORDES
    ======================================================== */

    --color-borde-suave: #e3e6ee;
    --radio-pequeno: 6px;
    --radio-medio: 12px;
    --radio-grande: 20px;
    --radio-redondo: 999px;
    /* ========================================================
       SOMBRAS
    ======================================================== */

    --sombra-suave: 0 8px 24px rgba(16, 41, 90, 0.10);
    --sombra-media: 0 14px 36px rgba(16, 41, 90, 0.16);
    --sombra-boton: 0 10px 24px rgba(101, 53, 181, 0.28);
    /* ========================================================
       TIPOGRAFÍA
    ======================================================== */

    --fuente-principal: "Poppins", "Segoe UI", Arial, sans-serif;
    --peso-regular: 400;
    --peso-medio: 500;
    --peso-semi-negrita: 600;
    --peso-negrita: 700;
    --tamano-texto-pequeno: 0.875rem;
    --tamano-texto-normal: 1rem;
    --tamano-texto-destacado: 1.125rem;
    --tamano-titulo-pequeno: 1.75rem;
    --tamano-titulo-medio: 2.5rem;
    --tamano-titulo-grande: 3.5rem;
    --altura-linea-texto: 1.7;
    --altura-linea-titulo: 1.15;
    /* ========================================================
       ESPACIADOS
    ======================================================== */

    --espacio-1: 0.25rem;
    --espacio-2: 0.5rem;
    --espacio-3: 0.75rem;
    --espacio-4: 1rem;
    --espacio-5: 1.5rem;
    --espacio-6: 2rem;
    --espacio-7: 3rem;
    --espacio-8: 4rem;
    --espacio-9: 6rem;
    /* ========================================================
       CONTENEDORES
    ======================================================== */

    --ancho-maximo-contenido: 1320px;
    --margen-lateral-escritorio: 40px;
    --margen-lateral-movil: 22px;
    --altura-encabezado: 118px;
    /* ========================================================
       TRANSICIONES
    ======================================================== */

    --transicion-rapida: 0.18s ease;
    --transicion-normal: 0.30s ease;
    --transicion-lenta: 0.50s ease;
    /* ========================================================
       CAPAS
    ======================================================== */

    --capa-base: 1;
    --capa-encabezado: 100;
    --capa-modal: 1000;
}
