/* ==========================================================
   TRINITY ECUADOR
   VARIABLES GLOBALES
   ========================================================== */

:root{

    /*=========================================================
      COLORES PRINCIPALES
    =========================================================*/

    --color-primary:#0F4C81;
    --color-primary-light:#2F80ED;
    --color-primary-dark:#0A3559;

    --color-secondary:#19B5FE;

    --color-success:#2ECC71;

    --color-white:#FFFFFF;

    --color-background:#F7F9FC;

    --color-section:#FFFFFF;

    --color-border:#E4EAF2;

    /*=========================================================
      ESCALA DE GRISES
    =========================================================*/

    --gray-50:#FAFBFC;
    --gray-100:#F4F6F8;
    --gray-200:#E6ECF2;
    --gray-300:#D5DEE8;
    --gray-400:#A8B4C3;
    --gray-500:#718096;
    --gray-600:#556170;
    --gray-700:#3C4858;
    --gray-800:#2D3748;
    --gray-900:#1A202C;

    /*=========================================================
      TIPOGRAFÍA
    =========================================================*/

    --font-family:'Poppins',sans-serif;

    --font-light:300;
    --font-regular:400;
    --font-medium:500;
    --font-semibold:600;
    --font-bold:700;
    --font-extra-bold:800;

    /*=========================================================
      TAMAÑOS
    =========================================================*/

    --fs-12:0.75rem;
    --fs-14:0.875rem;
    --fs-16:1rem;
    --fs-18:1.125rem;
    --fs-20:1.25rem;
    --fs-24:1.5rem;
    --fs-28:1.75rem;
    --fs-32:2rem;
    --fs-36:2.25rem;
    --fs-42:2.625rem;
    --fs-48:3rem;
    --fs-56:3.5rem;
    --fs-64:4rem;

    /*=========================================================
      ESPACIADOS
    =========================================================*/

    --space-4:4px;
    --space-8:8px;
    --space-12:12px;
    --space-16:16px;
    --space-20:20px;
    --space-24:24px;
    --space-32:32px;
    --space-40:40px;
    --space-48:48px;
    --space-56:56px;
    --space-64:64px;
    --space-80:80px;
    --space-96:96px;
    --space-120:120px;

    /*=========================================================
      CONTENEDORES
    =========================================================*/

    --container-width:1280px;

    --container-lg:1180px;

    --container-md:960px;

    --container-sm:768px;

    /*=========================================================
      BORDER RADIUS
    =========================================================*/

    --radius-xs:4px;
    --radius-sm:8px;
    --radius-md:12px;
    --radius-lg:18px;
    --radius-xl:24px;
    --radius-2xl:32px;
    --radius-circle:50%;

    /*=========================================================
      SOMBRAS
    =========================================================*/

    --shadow-xs:0 2px 6px rgba(0,0,0,.05);

    --shadow-sm:0 6px 20px rgba(0,0,0,.06);

    --shadow-md:0 12px 35px rgba(15,76,129,.08);

    --shadow-lg:0 25px 60px rgba(15,76,129,.12);

    --shadow-xl:0 35px 80px rgba(15,76,129,.18);

    /*=========================================================
      TRANSICIONES
    =========================================================*/

    --transition-fast:.25s ease;

    --transition-normal:.35s ease;

    --transition-slow:.55s ease;

    /*=========================================================
      BOTONES
    =========================================================*/

    --btn-height:56px;

    --btn-padding:0 34px;

    /*=========================================================
      NAVBAR
    =========================================================*/

    --navbar-height:90px;

    --topbar-height:42px;

    /*=========================================================
      HERO
    =========================================================*/

    --hero-height:100vh;

    /*=========================================================
      Z-INDEX
    =========================================================*/

    --z-dropdown:100;

    --z-fixed:500;

    --z-navbar:900;

    --z-modal:9999;

    /*=========================================================
      GRADIENTES
    =========================================================*/

    --gradient-primary:linear-gradient(
        135deg,
        #0F4C81 0%,
        #2F80ED 100%
    );

    --gradient-soft:linear-gradient(
        180deg,
        #FFFFFF 0%,
        #F5F9FF 100%
    );

    --gradient-hero:linear-gradient(
        135deg,
        rgba(15,76,129,.96) 0%,
        rgba(47,128,237,.90) 100%
    );

    /*=========================================================
      BLUR
    =========================================================*/

    --blur:16px;

}