.elementor-5076 .elementor-element.elementor-element-0c676d5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:-1vw;--margin-bottom:0vw;--margin-left:0vw;--margin-right:0vw;}.elementor-5076 .elementor-element.elementor-element-b968cb4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:2vw;--margin-bottom:0vw;--margin-left:0vw;--margin-right:0vw;}.elementor-5076 .elementor-element.elementor-element-58087da{--display:flex;--margin-top:0vw;--margin-bottom:0vw;--margin-left:0vw;--margin-right:0vw;}.elementor-5076 .elementor-element.elementor-element-2d48eb8{--display:flex;border-style:solid;--border-style:solid;--margin-top:0vw;--margin-bottom:0vw;--margin-left:0vw;--margin-right:0vw;}@media(min-width:768px){.elementor-5076 .elementor-element.elementor-element-0c676d5{--width:100%;}.elementor-5076 .elementor-element.elementor-element-58087da{--width:95%;}.elementor-5076 .elementor-element.elementor-element-2d48eb8{--width:100%;}}/* Start custom CSS for html, class: .elementor-element-26e7d15 *//* CONTENEDOR PRINCIPAL */
.descargar-app-banner{
  width:100vw;
  min-height:31.25vw; /* 450px */

  background-color:#000075;

  overflow:hidden;
  display:flex;
  position:relative;

  margin-left:calc(-50vw + 50%);
  margin-right:calc(-50vw + 50%);
  font-family: 'Roboto', sans-serif;
}

/* LADO IZQUIERDO */
.descargar-app-content{
  width:50%;

    padding: 3.47vw 4.17vw 3.47vw 17vw !important;

  color:red !important;

  display:flex;
  flex-direction:column;
  justify-content:center;

  z-index:2;
}

/* SIGNOS DECORATIVOS */
.descargar-app-banner::before,
.descargar-app-banner::after{
  position:absolute;

  font-family:Arial Black;
  font-weight:900;

  color:#0D0D79;

  pointer-events:none;
  user-select:none;

  z-index:1;
}

/* SIGNO SUPERIOR */
.descargar-app-banner::before{
  content:"➜]";

  font-size:10vw;

  left:3vw;
  top:5vw;

  transform:rotate(40deg);
}

/* SIGNOS INFERIORES */
.descargar-app-banner::after{
  content:"➜]➜]";

  font-size:5vw;

  left:13vw;
  top:20vw;

  transform:rotate(10deg);
}

/* TITULOS */
.descargar-app-title{
  color:white;

  position:relative;
  display:inline-block;
  font-size: 3VW;
  font-family: 'Roboto', sans-serif;
}

/* PALABRA DESTACADA */
.descargar-app-kavirt{
  color:#f3cb4e;
  position:relative; /* 👈 NECESARIO para el after */
  display:inline-block; /* 👈 evita que la línea se estire raro */
}

/* ====================================
   RAYA DECORATIVA DEBAJO
==================================== */
.descargar-app-kavirt::after{
  content:"";
  position:absolute;

  left:0;
  bottom:-0.3vw;

  width:100%;
  height:0.35vw;

  background:#f3cb4e;
  border-radius:5vw;
}

/* PARRAFO */
.kavirt-text-descargar-app{
  color:#ffffff;

  font-size:1vw;
  line-height:1.2em;

  margin-bottom:2.08vw; 
  font-size: 1VW;
}

/* DERECHA */
.descargar-app-image{
  width:50%;

  position:relative;
  overflow:hidden;
}

/* IMAGEN */
.descargar-app-image img{
  width:100%;
  height:100%;

  object-fit:cover;
  display:block;

  border-top-left-radius:10% 100%;
  border-bottom-left-radius:10% 100%;

  -webkit-mask-image:linear-gradient(
    to left,
    rgba(0,0,0,1) 25%,
    rgba(0,0,0,0.7) 45%,
    rgba(0,0,0,0.3) 70%,
    rgba(0,0,0,0)
  );

  mask-image:linear-gradient(
    to left,
    rgba(0,0,0,1) 25%,
    rgba(0,0,0,0.7) 45%,
    rgba(0,0,0,0.3) 70%,
    rgba(0,0,0,0)
  );

  mix-blend-mode:screen;
  filter:contrast(1.05) brightness(0.95);
}


/* =========================
   RESPONSIVE TABLET
========================= */

@media(max-width:1024px){

  .descargar-app-title{
    font-size:4vw;
  }

  .kavirt-text-descargar-app{
    font-size:1.8vw;
  }

}


/* =========================
   RESPONSIVE CELULAR
========================= */

@media(max-width:768px){

  .descargar-app-banner{
    flex-direction:column;

    min-height:auto;
  }

  /* TEXTO */
  .descargar-app-content{
    width:100%;

    padding:10vw 7vw;

    text-align:center;

    align-items:center;
  }

  /* TITULO */
  .descargar-app-title{
    font-size:8vw;

    line-height:1.1em;
  }

  /* PARRAFO */
  .kavirt-text-descargar-app{
    font-size:4vw;

    line-height:1.5em;

    margin-bottom:6vw;
  }

  /* IMAGEN */
  .descargar-app-image{
    width:100%;

    height:60vw;
  }

  .descargar-app-image img{

    border-top-left-radius:0;

    border-bottom-left-radius:0;

    border-top-right-radius:12vw;

    -webkit-mask-image:none;
    mask-image:none;

    mix-blend-mode:normal;

    filter:none;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f5ff56b */.titulo{
  text-align: center;
  color: #000075;
  font-size:1.8vw;
  font-family: 'Roboto', sans-serif;
}
.parrafo{
  text-align: center;
  color: black;
  font-size:1.5vw;
  font-family: 'Roboto', sans-serif;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d487a9f *//* CONTENEDOR PRINCIPAL QUE GUARDA TODAS LAS TARJETAS */
.fila-tarjetas{

    /* Hace que el contenedor ocupe todo el ancho disponible */
    width:100%;

    /* Activa Flexbox para organizar elementos horizontalmente */
    display:flex;

    /* Centra horizontalmente todas las tarjetas */
    justify-content:center;

    /* Alinea las tarjetas desde la parte superior */
    align-items:flex-start;

    /* Espacio entre cada tarjeta */
    gap:3vw;

    /* Evita que las tarjetas bajen a otra línea */
    flex-wrap:nowrap;
    
    font-family: 'Roboto', sans-serif;
}


/* TARJETA INDIVIDUAL */
.tarjeta{

    /* Define el ancho de cada tarjeta */
    width:28vw;

    /* Fondo blanco de la tarjeta */
    background:white;

    /* Redondea las esquinas */
    border-radius:2vw;

    /* Espacio interno entre borde y contenido */
    padding:1.8vw;

    /* Hace que el padding no aumente el tamaño total */
    box-sizing:border-box;

    /* Sombra alrededor de la tarjeta */
    box-shadow:0 1vw 3vw rgba(0,0,0,0.15);
    
    
}


/* CONTENEDOR SUPERIOR DE LA TARJETA */
.contenido-superior{

    /* Activa Flexbox */
    display:flex;

    /* Separa elementos hacia extremos opuestos */
    justify-content:space-between;

    /* Centra verticalmente los elementos */
    align-items:center;

    /* Espacio entre elementos internos */
    gap:1vw;
    
}


/* CONTENEDOR DE INFORMACIÓN */
.informacion{

    /* Activa Flexbox */
    display:flex;

    /* Organiza el contenido en columna */
    flex-direction:column;
}


/* ICONOS DE USUARIO Y CONDUCTOR */
.icono-usuario,
.icono-conductor{

    /* Ancho del círculo */
    width:4vw;

    /* Alto del círculo */
    height:4vw;

    /* Color de fondo del círculo */
    background:#C9D6FB;

    /* Convierte el contenedor en círculo */
    border-radius:50%;

    /* Activa Flexbox */
    display:flex;

    /* Centra horizontalmente el icono */
    justify-content:center;

    /* Centra verticalmente el icono */
    align-items:center;
}


/* ESTILOS GENERALES DEL ICONO */
.icono-usuario,
.icono-conductor{

    /* Color del icono */
    color:#090250;

    /* Tamaño del icono */
    font-size:1.6vw;
}


/* ESTILOS ESPECÍFICOS DEL ICONO CONDUCTOR */
.icono-conductor{

    /* Color del icono conductor */
    color:#090250;

    /* Tamaño del icono conductor */
    font-size:1.6vw;
}




/* TÍTULO DE LA TARJETA */
.informacion h2{

    /* Tamaño del texto */
    font-size:1.8vw;

    /* Color del texto */
    color:black;

    /* Espacio superior */
    margin-top:1vw;

    /* Espacio inferior */
    margin-bottom:1vw;

    /* Altura entre líneas */
    line-height:1.1em;
    font-family: 'Roboto', sans-serif;
}


/* COLOR DIFERENTE PARA PARTE DEL TEXTO */
.app-color{

    /* Cambia el color del texto */
    color:#1F5FBF;
}


/* CONTENEDOR DE INFORMACIÓN ANDROID E IOS */
.info-android,
.info-ios{

    /* Activa Flexbox */
    display:flex;

    /* Centra verticalmente */
    align-items:center;

    /* Espacio entre icono y texto */
    gap:0.5vw;
}


/* ICONO DE ANDROID */
.info-android i{

    /* Color del icono */
    color:#000075;

    /* Tamaño del icono */
    font-size:1.2vw;
}


/* ICONO DE IOS */
.info-ios i{

    /* Color del icono */
    color:#000075;

    /* Tamaño del icono */
    font-size:1.2vw;
}


/* TEXTO DE ANDROID E IOS */
.info-android p,
.info-ios p{

    /* Elimina márgenes automáticos */
    margin:0;

    /* Tamaño del texto */
    font-size:.8vw;

    /* Color del texto */
    color:black;
}


/* IMAGEN QR ANDROID */
.codigo-qr img{

    /* Ancho de la imagen QR */
    width:25vw;

    /* Borde azul alrededor del QR */
    border:0.2vw solid #1F5FBF;

    /* Bordes redondeados */
    border-radius:1.5vw;

    /* Convierte la imagen en bloque */
    display:block;
    
    /* Espacio interno */
    padding:1vw;
}


/* IMAGEN QR IOS */
.codigo-qr-ios img{

    /* Ancho de la imagen QR */
    width:25vw;

    /* Borde azul alrededor del QR */
    border:0.2vw solid #1F5FBF;

    /* Bordes redondeados */
    border-radius:1.5vw;

    /* Convierte la imagen en bloque */
    display:block;
    
    /* Espacio interno */
    padding:1vw;
}


/* BOTONES DE DESCARGA */
.boton-descarga,
.boton-ios{

    /* Espacio superior */
    margin-top:2vw;

    /* Hace que el botón ocupe todo el ancho */
    width:100%;

    /* Activa Flexbox */
    display:flex;

    /* Centra horizontalmente contenido */
    justify-content:center;

    /* Centra verticalmente contenido */
    align-items:center;

    /* Espacio entre icono y texto */
    gap:0.7vw;

    /* Espacio interno del botón */
    padding:1.2vw;

    /* Color del texto */
    color:white;

    /* Bordes redondeados */
    border-radius:5vw;

    /* Elimina subrayado del enlace */
    text-decoration:none !important;

    /* Tamaño del texto */
    font-size:0.95vw;

    /* Grosor del texto */
    font-weight:700;
}


/* EFECTO HOVER BOTÓN DESCARGA */
.boton-descarga:hover{

    /* Cambia color de fondo */
    background-color:#C9D6FB;

    /* Cambia color del texto */
    color:#000075;

    /* Agranda ligeramente el botón */
    transform:scale(1.05);
}


/* EFECTO HOVER BOTÓN IOS */
.boton-ios:hover{

    /* Cambia color de fondo */
    background-color:#C9D6FB;

    /* Cambia color del texto */
    color:#000075;

    /* Agranda ligeramente el botón */
    transform:scale(1.05);
}


/* FONDO BOTÓN DESCARGA */
.boton-descarga{

    /* Fondo azul oscuro */
    background:#000075;
}


/* FONDO BOTÓN IOS */
.boton-ios{

    /* Fondo azul oscuro */
    background:#000075;
}


/* ICONOS DENTRO DE LOS BOTONES */
.boton-descarga i,
.boton-ios i{

    /* Tamaño del icono */
    font-size:1vw;
}/* End custom CSS */