
:root {
    --primary-color: #4e69a2; /*#125688*/
    --primary-color-light: #678bd6; /*a1b4df*/
    --primary-color-dark: #425a8a;
    --primary-color-contrast: #ffffff;
}

:root {
    --secondary-color: #55acee;
    --secondary-color-light: #bde1f0;
    --secondary-color-dark: #4c98d4;
    --secondary-color-contrast: #ffffff;
}

:root {
    --background-color: #2b3a59;
    --background-color-contrast: #ececf1;
}

:root {
    --success-color: #239956;
    --success-color-dark: #1d8047;
    --success-color-contrast: #ffffff;
}

:root {
    --danger-color: #ea1d2d;
    --danger-color-dark: #d1382e;
    --danger-color-contrast: #ffffff;
}

:root {
    --disabled-color: #ECECF1;
    --disabled-color-contrast: #5a5a5c;
}

:root {
    --background-color-white: #f8f8f8;
    --background-color-white-rgb: 236, 236, 241;
    --text-color: #343541;
}

:root {
    --border-color: #cfcccc;
}

:root {
    --background-iso1: linear-gradient(180deg, rgba(236,236,241,0.4) 0%, rgba(236,236,241,0.4) 100%), url("../files/global/images/bg-iso.jpg") center / cover no-repeat;
    --background-iso2: linear-gradient(180deg, rgba(189, 225, 240, 0.4) 0%, rgba(189, 225, 240, 0.4) 100%), url("../files/global/images/bg-iso.jpg") center / cover no-repeat;
    --background-iso2dark: linear-gradient(14deg, rgba(43,58,89,0.6971521030287116) 5%, rgba(43,58,89,0.3021941198354342) 100%),url("../files/global/images/bg-iso.jpg") center / cover no-repeat;
    --background-iso3: url("../files/global/images/bg-hexagon.svg") repeat 0 0 / 56px 98px, linear-gradient(85deg, rgba(27,34,48,1) 0%, rgba(43,58,89,1) 60%) no-repeat 0 0 / cover; /* Configuración del gradiente */
    --background-bubble: linear-gradient(180deg, rgba(236,236,241,1) 0%, rgba(236,236,241,0.2) 100%), url("../files/global/images/bg-bubble.svg") center / cover no-repeat;
    --background-points: linear-gradient(180deg, rgba(236,236,241,0.4) 0%, rgba(236,236,241,0.4) 100%), url("../files/global/images/bg-points.svg");
}


/*Transiciones y Animaciones */
:root {
    --transition-duration: 200ms;
    --transition-ease: ease-in-out;
}

/*Espaciado y Layout */
:root {
    --spacing-small: 0.45rem;
    --spacing-medium: 0.70rem;
    --spacing-large: 1rem;
}

/*Sombras y Bordes  */
:root {
    --border-radius-small: 0.25rem;
    --border-radius-medium: 0.5rem;
    --border-radius-large: 1rem;
    --border-light: 1px solid var(--border-color);
    --border: 2px solid var(--border-color);

    --box-shadow-light: 0.1px 0.1px 0.2px rgba(0, 0, 0, 0.017), 0.2px 0.2px 0.4px rgba(0, 0, 0, 0.025), 0.3px 0.3px 0.7px rgba(0, 0, 0, 0.031), 0.4px 0.4px 1.1px rgba(0, 0, 0, 0.035), 0.6px 0.6px 1.6px rgba(0, 0, 0, 0.04), 0.9px 0.9px 2.3px rgba(0, 0, 0, 0.045), 1.3px 1.3px 3.3px rgba(0, 0, 0, 0.049), 1.8px 1.8px 4.7px rgba(0, 0, 0, 0.055), 2.8px 2.8px 7.3px rgba(0, 0, 0, 0.063), 5px 5px 13px rgba(0, 0, 0, 0.08);
    --box-shadow-medium: 0.1px 0.1px 0.2px rgba(0, 0, 0, 0.029), 0.2px 0.2px 0.4px rgba(0, 0, 0, 0.043), 0.3px 0.3px 0.7px rgba(0, 0, 0, 0.054), 0.4px 0.4px 1.1px rgba(0, 0, 0, 0.062), 0.6px 0.6px 1.6px rgba(0, 0, 0, 0.07), 0.9px 0.9px 2.3px rgba(0, 0, 0, 0.078), 1.3px 1.3px 3.3px rgba(0, 0, 0, 0.086), 1.8px 1.8px 4.7px rgba(0, 0, 0, 0.097), 2.8px 2.8px 7.3px rgba(0, 0, 0, 0.111), 5px 5px 13px rgba(0, 0, 0, 0.14);
    --box-shadow-bottom: 0px 0.6px 0.4px rgba(0, 0, 0, 0.13), 0px 1.5px 0.9px rgba(0, 0, 0, 0.098), 0px 2.9px 1.6px rgba(0, 0, 0, 0.086), 0px 5.1px 2.9px rgba(0, 0, 0, 0.074), 0px 9.6px 5.4px rgba(0, 0, 0, 0.06), 0px 23px 13px rgba(0, 0, 0, 0.039);
    --box-shadow-left: -2px 0px 4px rgba(0, 0, 0, 0.15), -4px 0px 8px rgba(0, 0, 0, 0.1);
    --box-shadow-right: 2px 0px 4px rgba(0, 0, 0, 0.15), 4px 0px 8px rgba(0, 0, 0, 0.1);
}

/*Tipografía */
:root {
    --font-size-s1: 1rem;
    --font-size-s2: 1.1rem;
    --font-size-s3: 1.2rem;
    --font-size-s4: 1.4rem;
    --font-size-s5: 1.6rem;
    --font-size-s6: 2rem;
    --font-weight-bold: 600;
    --font-weight-extrabold: 800;
}





body {
    position: relative;
    margin: 0;
    height: 100vh; /* Asegura que ocupe toda la ventana */
    overflow: hidden; /* Evita scroll innecesario */
}

    body::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(180deg, rgba(189, 225, 240, 0.3) 0%, rgba(189, 225, 240, 0.9) 100%), url("../files/images/-seven11nash-380769.jpg") center / cover no-repeat;
        filter: blur(4px); /* Aplica el desenfoque solo al fondo */
        z-index: -1; /* Asegura que el fondo esté detrás del contenido */
    }
