
:root {
  --color1: #b8d6b9;
  --color2: #2b3180;
  --color3: #fcb001;
}

.bgcolor1{
  background-color: var(--color1);
}


.button-bgcolor1{
  background-color: var(--color1);
  color: #fff!important;
}

.button-bgcolor1:hover{
  background-color: #fff!important;
  color: #333!important;
}

.button2-bgcolor2{
   background-color: #fff!important;
  color: #333!important;
}

.button2-bgcolor2:hover{
  background-color: #b8d6b9!important;
  color: #fff!important;
}

.txtcolor1{
  color: var(--color1);
}


.txtcolor3{
  color: var(--color3);
}

.txtcolor3:hover{
  color: var(--color1);
}

.bgcolor2{
  background-color: var(--color2);
}

.bgcolor3{
  background-color: #dbeddc!important;
}

.svgimg{
  width: 100%;
  max-width: 64px;
}

.svgimg2{
  width: 64px;
  position: relative;
  margin: 0 auto;
}

a.colorhoverclaro{
  color:#fff!important;
}

a.colorhoverclaro:hover{
  color:#b8d6b9!important;
}


.bg-zoe-blue {
    background-color: var(--color2) !important;
  }

  /* Transición suave para todos los enlaces del footer */
  .footer-link, 
  .social-icon-btn, 
  .footer-contact-link {
    transition: all 0.3s ease-in-out;
    color: #ffffff;
    text-decoration: none;
  }

  /* Cambios al pasar el cursor (Hover a Verde Corporativo) */
  .footer-link:hover, 
  .footer-contact-link:hover {
    color: var(--color1) !important;
  }

  /* Estilos específicos para íconos de Redes Sociales (Outline) */
  .social-icon-btn {
    width: 38px;
    height: 38px;
    border: 1px solid #ffffff;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .social-icon-btn:hover {
    border-color: var(--color1) !important;
    background-color: var(--color1);
  }

  .social-icon-btn:hover i {
    color: var(--color2) !important; /* El ícono contrasta con el verde en hover */
  }

  /* Alineación limpia para ítems de contacto */
  .contact-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
    color: #ffffff;
  }


.txtfs-14{
  font-size: 14px!important;
}


/* Media query para dispositivos móviles */
@media (max-width: 767px) {
    .navbar-brand .mobile-logo {
        width: 100% !important;
        max-width: 150px !important;
        height: auto;
        display: inline-block; /* O block si quieres que use su propia línea */
    }

    /* Opcional: Ocultar los otros logos en móvil si el tema no lo hace */
    .navbar-brand .default-logo,
    .navbar-brand .alt-logo {
        display: none !important;
    }

    .header-button span{
     font-size: 8px!important;
     padding: 2px!important;
    }
}


/* Forzar menú hamburguesa por debajo de 1400px */
@media (max-width: 1500px) {

}

/* BOTON DE MENU  FREE A QUOTE */
@media (max-width: 991px) {
    /* 1. Permitir que el contenedor flexible se encoja proporcionalmente si es necesario */
    .col.col-lg-3.text-end {
        flex: 0 1 auto !important;
        max-width: 45% !important; /* Limita el ancho máximo para no colisionar con el logo */
        padding-left: 0 !important;
    }

    /* 2. Relleno y dimensiones dinámicas para el botón */
    .header-button .btn {
        padding: 6px clamp(6px, 2vw, 12px) !important; /* El padding horizontal escala automáticamente */
        height: auto !important;
        min-height: 36px !important;
        max-width: 100% !important; /* Evita que el botón sobrepase su columna */
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    /* 3. Tipografía fluida y prevención de saltos de línea */
    .header-button .btn span, 
    .header-button .btn span span {
        /* Se adapta suavemente entre 10px y 13px según el ancho del teléfono */
        font-size: clamp(10px, 2.8vw, 13px) !important; 
        line-height: 1 !important;
        display: inline-block !important;
        transform: none !important;
        white-space: nowrap !important; /* Garantiza que el texto permanezca en una sola línea */
        text-overflow: ellipsis !important; /* Si la pantalla es ultra estrecha, maneja el exceso limpiamente */
    }
}
/* BOTON DE MENU  FREE A QUOTE */

@media (max-width: 767px) {
    #submit-btn {
        width: 100% !important;
        display: block !important;
        font-size: 18px
    }
}



/* Botón Flotante Móvil */
@media (max-width: 767px) {
    .btn-float-call {
        position: fixed;
        bottom: 20px;
        right: 20px;
        width: 55px;
        height: 55px;
        background-color: #2b3180; /* Verde de llamada */
        color: #ffffff !important;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
        font-size: 22px;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
        z-index: 9999;
        text-decoration: none;
        transition: transform 0.2s ease;
    }

    .btn-float-call:active {
        transform: scale(0.92);
    }
}

/* ******************************************MENU NAV RESPONSIVE****************************************** */

/* Quitar la flecha doble de Bootstrap */
.navbar-nav .dropdown-toggle::after,
.navbar-nav .dropdown > a::after {
    display: none !important;
}

/* --- MÓVIL (Menor a 992px) --- */
/* Quitar la flecha CSS automática de Bootstrap */
.navbar-nav .dropdown-toggle::after {
    display: none !important;
}

/* Ajuste móvil para alinear texto y flecha en una sola fila visual */
@media (max-width: 991px) {
    .navbar-nav .simple-dropdown {
        display: flex !important;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }
    .navbar-nav .simple-dropdown > a {
        width: auto !important;
    }
    .navbar-nav .simple-dropdown > .dropdown-toggle {
        padding: 10px 15px;
        cursor: pointer;
    }
    .navbar-nav .simple-dropdown .dropdown-menu {
        width: 100% !important;
        position: static !important;
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
    }
}
/* ******************************************MENU NAV RESPONSIVE****************************************** */


/* ******************************************PRIVACY****************************************** */

/* RESET EXTREMO DE ESPACIOS PARA PRIVACY POLICY */
/* AJUSTE INTERMEDIO DE ESPACIADOS Y COLOR */
.privacy-policy-wrapper,
.privacy-policy-wrapper * {
    color: #333333 !important;
}


/* Espaciado intermedio EXCLUSIVO entre secciones */
.privacy-policy-wrapper section {
    margin-bottom: 35px !important; /* Ajusta este valor si quieres más o menos espacio entre secciones */
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    min-height: 0 !important;
}
/* Espacio sutil entre párrafos dentro de una misma sección */
.privacy-policy-wrapper p {
    margin-bottom: 10px !important;
    padding: 0 !important;
    line-height: 1.6 !important;
}

/* Títulos con separación limpia respecto al párrafo de abajo */
.privacy-policy-wrapper h1,
.privacy-policy-wrapper h2,
.privacy-policy-wrapper h3,
.privacy-policy-wrapper h4,
.privacy-policy-wrapper h5 {
    color: #111111 !important;
    margin-top: 0 !important;
    margin-bottom: 10px !important;
    padding: 0 !important;
}

/* Listas con sangría e interlineado cómodo */
.privacy-policy-wrapper ul {
    margin-top: 6px !important;
    margin-bottom: 12px !important;
    padding-left: 20px !important;
}

.privacy-policy-wrapper li {
    margin-bottom: 6px !important;
    padding: 0 !important;
}
        /* ******************************************PRIVACY****************************************** */




