@charset "UTF-8";
/*
Designed by Central Digital
February
Web Development: Kevin Argueta
*/

/* ==========================================
   PRELOADER
   ========================================== */
#preloader {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: #ffffff;
    z-index: 9999; /* Z-index altísimo para que cubra el Navbar también */
    display: flex;
    justify-content: center;
    align-items: center;
}

/* El círculo giratorio */
.vas4-spinner {
    width: 60px;
    height: 60px;
    border: 6px solid #e0e6ed; /* Gris muy clarito de fondo */
    border-top: 6px solid #2485C0; /* Tu azul principal corporativo */
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

/* La animación matemática del giro */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* El input oculto que tenías (lo mantenemos por si tu plantilla lo necesita) */
#slotInput {
    visibility: hidden !important; 
    width: 0; height: 0; 
    display: none !important;
}

/* :::::::: Global Config ::::::::: */
html, body {
    overflow-x: hidden;
}
/* Colors for Text */
.tx-Wht   {Color: #FFFFFF;}
.tx-Blk   {color: #000000;}
.tx-Gry1  {color: #181818;}
.tx-Gry2  {color: #525252;}
.tx-Gry3  {color: #8e8e8e;}
.tx-Gry4  {color: #f6f6f6;}
.tx-Blu1  {color: #142f81;}
.tx-Blu2  {color: #102c6c;}
.tx-Red1  {color: #d40f19;}
.tx-Red2  {color: #b40d15;}
/* Color for Blocks */
.bg-Wht   {background: #FFFFFF;}
.bg-Blk   {background: #000000;}
.bg-Gry1  {background: #181818;}
.bg-Gry2  {background: #525252;}
.bg-Gry3  {background: #f6f6f6;}
.bg-Gry4  {background: #8e8e8e;}
.bg-Blu1  {background: #142f81; position: relative; overflow: hidden;}
.bg-Blu2  {background: #102c6c; position: relative; overflow: hidden;}
.bg-Red1  {background: #d40f19;}
.bg-Red2  {background: #b40d15;}
/* Text Weight */
.tx-Lgh     {font-weight: 300;}
.tx-Reg     {font-weight: 400;}
.tx-Bld     {font-weight: 600;}
.tx-Hvy     {font-weight: 800;}
/* Letter Spacing */
.lttr-Sp1  {letter-spacing: -1.5px;}
.lttr-Sp2  {letter-spacing: -1.0px;}
.lttr-Sp3  {letter-spacing: -0.5px;}
.lttr-Sp4  {letter-spacing: -0.2px;}
.lttr-Sp5  {letter-spacing: 2px;}
.lttr-Sp6  {letter-spacing: 6px;}
.lttr-Sp7  {letter-spacing: 8px;}
.lttr-Sp8  {letter-spacing: 10px;}
.lttr-Sp9  {letter-spacing: 15px;}
.lttr-Sp10 {letter-spacing: 20px;}

/* :::::::: Fonts ::::::::: */
body       {font-family: "Roboto", sans-serif;}
.Mnt-Fnt   {font-family: 'Montserrat', sans-serif;}
.Ops-Fnt   {font-family: "Open Sans", sans-serif;}
.Rbt-Fnt   {font-family: "Roboto", sans-serif;}

/* Headers */
.Hdg1      {font-size: 7em; letter-spacing: -2px;}
.Hdg2      {font-size: 5em; letter-spacing: -1.5px;}
.Hdg3      {font-size: 3em; letter-spacing: -1px;}
.Hdg4      {font-size: 2.5em; letter-spacing: 0.5px;}
.Hdg5      {font-size: 2em; letter-spacing: 0.5px;}
/* Paragraph */
.Tx1       {font-size: 1.7em; letter-spacing: 0px;}
.Tx2       {font-size: 1.5em; letter-spacing: 0px;}
.Tx3       {font-size: 1.2em; letter-spacing: 0px;}
.Tx4       {font-size: 1em; letter-spacing: 0px;}
.Tx5       {font-size: 0.8em; letter-spacing: 0px;}
.Tx6       {font-size: 0.6em; letter-spacing: 0px;}


/* :::::::::: HELPERS :::::::::: */
/* Center-Img BLock */
.center-img-blck     {display: block !important; margin: auto !important;}
/* Center Img Inherit */
.center-img-inht img {margin: 0 auto !important;}
/* Reset Padding */
.pddng-rst           {padding: 0px !important;}
/* Disabled «Resize» @ Textarea */
textarea            {resize: none !important;}
/* Reset Link */
.link-rst           {color: inherit;}
.link-rst:hover     {color: inherit;}
.link-G             {text-decoration: none;}
.link-G:hover       {text-decoration: none;}
/* Reset Lihe Height and Margin */
.Rst-Mrg            {margin: 0px !important;}
.Rst-LH             {line-height: inherit;}
/* Reset List */
.List-Rst           {list-style: none; margin-left: 0px;}
/* Button Corners 15px */
.btn-10-radius      {border-radius: 10px;}

/* Tamaño del logo cuadrado de VAs4USA */
.vas-logo {
    width: 110px; /* Tamaño amplio para escritorio */
    height: auto;
    object-fit: contain;
}

/* Ajuste para celulares */
@media (max-width: 991px) {
    .vas-logo {
        width: 85px; /* Un poco más pequeño para que no robe espacio al botón de menú */
    }
}
/* ==========================================
   DROPDOWN ON HOVER (Solo para PC)
   ========================================== */
@media (min-width: 992px) {
    /* Muestra el menú cuando el ratón pasa por encima del elemento padre */
    .navbar .dropdown:hover .dropdown-menu {
        display: block;
        margin-top: 0 !important; /* Evita que haya un hueco y el menú se cierre accidentalmente al bajar el ratón */
        animation: fadeDropdown 0.2s ease-in-out; /* Una pequeña animación suave (opcional) */
    }
    
    /* Pequeño ajuste para que el botón principal siga funcionando como un enlace si lo necesitas */
    .navbar .dropdown .dropdown-toggle:active {
        pointer-events: none;
    }
}

/* Animación de aparición suave */
@keyframes fadeDropdown {
    0% { opacity: 0; transform: translateY(5px); }
    100% { opacity: 1; transform: translateY(0); }
}

/* ==========================================
   FOOTER HOVER EFFECTS
   ========================================== */
.text-white-hover {
    transition: color 0.3s ease-in-out;
}

.text-white-hover:hover {
    color: #ffffff !important;
}

/* Transición suave para los íconos de redes sociales */
.transition-colors {
    transition: color 0.3s ease;
}

/* Buttons */
.vas4-btn-blue {
    padding: 1% 2%;
    border-radius: 10px;
    background-color: #142f81;
    color: #fff;
    transition: 1s;
}
.vas4-btn-blue:hover {background-color: #18399c; color: #fff;}

/* Borders */
.vas4-red-border {border-color: #d40f19 !important;}
.vas4-blue-border {border-color: #142f81 !important;}

.va-footer-box {padding: 100px 15px 100px 15px;}