.elementor-kit-7{--e-global-color-primary:#1C2841;--e-global-color-secondary:#17325D;--e-global-color-text:#48546B;--e-global-color-accent:#00C48C;--e-global-color-tprnv80:#243453;--e-global-color-tprnv70:#2E4066;--e-global-color-tprnv30:#8494B0;--e-global-color-tprmnhv:#00A876;--e-global-color-tprmntx:#00805A;--e-global-color-tprmnsf:#E4F8F1;--e-global-color-tprbgcl:#F6F8FB;--e-global-color-tprtint:#E8EEF9;--e-global-color-tprbrde:#E3E8F0;--e-global-color-tprtxsf:#646F80;--e-global-color-tprwhte:#FFFFFF;--e-global-color-tprsubh:#CED6E4;--e-global-typography-primary-font-family:"Gilroy";--e-global-typography-primary-font-weight:800;--e-global-typography-primary-letter-spacing:-0.5px;--e-global-typography-secondary-font-family:"Gilroy";--e-global-typography-secondary-font-weight:800;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Inter";--e-global-typography-accent-font-weight:600;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-kit-7 a{color:var( --e-global-color-tprmntx );}.elementor-kit-7 a:hover{color:var( --e-global-color-primary );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:600px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Gilroy ExtraBold — fuente de marca, autoalojada.
   Licencia Radomir Tinkov Free Font EULA: permite uso comercial y webfont. */
@font-face{
  font-family:'Gilroy';
  src:url('https://tuprestamorapido.com/wp-content/uploads/tpr-fonts/Gilroy-ExtraBold.woff2') format('woff2');
  font-weight:800;font-style:normal;font-display:swap;
}

/* El fondo de la foto del hero se ha fundido al color exacto de la sección
   (#1C2841) en el propio archivo, así que ya no hace falta una máscara radial
   para disimular el rectángulo: no hay rectángulo. Solo se suaviza el corte
   inferior del torso, que sí es un borde real. */
.tpr-hero-foto img{
  -webkit-mask-image:linear-gradient(to bottom, #000 76%, transparent 100%);
  mask-image:linear-gradient(to bottom, #000 76%, transparent 100%);
}
.tpr-hero-foto-movil img{
  -webkit-mask-image:linear-gradient(to bottom, #000 80%, transparent 100%);
  mask-image:linear-gradient(to bottom, #000 80%, transparent 100%);
}

/* Ítem activo del menú desplegable en móvil. Elementor le aplica un fondo
   #3F444B por defecto y el texto navy quedaba en 1,50:1. Su regla tiene la
   misma especificidad y carga después, así que aquí hace falta !important. */
.elementor-nav-menu--dropdown a.elementor-item.elementor-item-active,
.elementor-nav-menu--dropdown a.elementor-item.highlighted,
.elementor-nav-menu--dropdown a.elementor-item:hover,
.elementor-nav-menu--dropdown a.elementor-item:focus{
  background-color:#E8EEF9 !important;
  color:#1C2841 !important;
}

/* --- Hero en movil ---------------------------------------------------- */
@media (max-width:880px){

  /* La segunda frase del subtitulo ("De 300 € a 6.000 €, hasta 60 meses")
     solo se ve en escritorio: en movil ese rango ya lo dicen los dos sliders
     del simulador, justo debajo, y alargaba el parrafo a cinco lineas. */
  .tpr-solo-esc{ display:none; }

  /* Sobre el navy, el gris azulado del subtitulo se apagaba en pantallas
     pequenas. Color de #CED6E4 a #EDF2FB (10,07:1 -> 13,24:1) y grosor 500,
     que en fondo oscuro compensa el halo del texto claro. Misma tipografia,
     mismo cuerpo. */
  .tpr-hero-sub, .tpr-hero-sub p{
    color:#EDF2FB !important;
    font-weight:500;
  }
}

/* --- Margenes automaticos --------------------------------------------- */
/* Elementor compone el margen como `{{TOP}}{{UNIT}}`, asi que un "auto" en el
   control sale como `margin: autopx 0px ...` y el navegador descarta la
   declaracion ENTERA. Los dos margenes automaticos del diseno van aqui. */

/* La foto se apoya en el fondo de su columna, a la altura del simulador. */
.tpr-hero-foto{ margin-top:auto !important; }

/* El CTA de cada tarjeta se ancla abajo, ocupe lo que ocupe la descripcion. */
.tpr-card-cta{ margin-top:auto !important; }

/* --- Foto del hero en tableta ----------------------------------------- */
/* Entre 881 y 1024 px las dos columnas del hero pasan a ocupar el 100 %, y
   con el recorte cenido de la foto el hombre salia a casi 900 px de ancho.
   Se le pone un tope para que en esa franja se vea del mismo tamano que
   antes; en escritorio la columna mide 552 px y el tope no llega a actuar. */
@media (max-width:1024px){
  /* Elementor fija la anchura del widget con la misma
     especificidad y carga despues: hace falta !important. */
  .tpr-hero-foto{ max-width:700px !important; }
}

/* --- Escala de la foto en escritorio ---------------------------------- */
/* El hombre ya ocupaba el 95 % del ancho de su columna, asi que para verse un
   11 % mas grande la foto tiene que desbordarla. En pixeles fijos y no en
   porcentaje: la seccion tiene 20 px de padding, asi que -20 px cae siempre
   justo en el borde de la ventana y nunca genera scroll horizontal, tambien
   en la franja de 1025-1250 px donde el hero se parte y la columna es mas
   estrecha. Los 60 px de ancho extra caben en el hueco de 48 px entre
   columnas sin llegar a la tarjeta del simulador. */
@media (min-width:1025px){
  .tpr-hero-foto{
    width:calc(100% + 60px) !important;
    max-width:none !important;
    margin-left:-20px !important;
  }
}

/* --- Tarjetas de finalidad -------------------------------------------- */
/* El cuerpo de la tarjeta lleva `flex_grow: 1` en los datos, pero Elementor
   no llega a emitir la regla, asi que la caja se ajustaba a su texto y el
   `margin-top:auto` del boton no tenia hueco que consumir: los cuatro CTA
   solo quedaban alineados cuando las cuatro descripciones ocupaban las mismas
   lineas. Con esto se alinean siempre, diga lo que diga el texto. */
.tpr-card-cuerpo{ flex-grow:1 !important; }
.tpr-card-cta{ margin-top:auto !important; }

/* --- Titular del hero -------------------------------------------------- */
/* El cuerpo escala con la ventana en vez de estar clavado: asi el titular
   nunca parte dejando una palabra huerfana, cambie el texto lo que cambie.
   El maximo lo marca la linea mas larga, «Te ayudamos a encontrar». */
.tpr-hero-h1 .elementor-heading-title{
  font-size:clamp(32px, 3.5vw, 47px) !important;
}
@media (max-width:1024px){
  .tpr-hero-h1 .elementor-heading-title{ font-size:clamp(28px, 5.2vw, 42px) !important; }
}
@media (max-width:600px){
  .tpr-hero-h1 .elementor-heading-title{ font-size:clamp(23px, 7.4vw, 32px) !important; }
}

/* --- Reclamos del hero ------------------------------------------------- */
/* En triangulo a cualquier ancho: el primero solo arriba, los otros dos
   debajo. Antes, por debajo de 880 px, se apilaban los tres en columna. */
.tpr-hero-checks .elementor-inline-items{
  flex-wrap:wrap;
  row-gap:9px;
}
.tpr-hero-checks .elementor-inline-items > .elementor-icon-list-item:first-child{
  flex-basis:100%;
}
.tpr-hero-checks .elementor-inline-items .elementor-icon-list-item:after{ display:none; }
@media (max-width:880px){
  /* En movil el separador entre los dos de abajo lo da el gap, no el margen
     por defecto del widget en linea. */
  .tpr-hero-checks .elementor-inline-items{ column-gap:18px; }
  .tpr-hero-checks .elementor-inline-items .elementor-icon-list-item{
    /* Elementor lo fija con la misma especificidad y carga despues. */
    margin-right:0 !important;
  }
}
@media (max-width:420px){
  /* Los dos de la segunda fila piden 330 px juntos y a 360 px solo hay 316.
     Bajando un punto la tipografia y apretando el hueco caben en dos lineas,
     que es la disposicion pedida. Por debajo de 330 px pasan a tres. */
  .tpr-hero-checks .elementor-inline-items{ column-gap:10px; }
  .tpr-hero-checks .elementor-icon-list-text{ font-size:14px !important; }
}

/* --- CTA de las tarjetas ----------------------------------------------- */
/* «Encuentra tu prestamo» mide 167 px. El boton da de si en casi todo el
   rango, pero hay dos tramos donde no: de 1030 a 1250 px las cuatro tarjetas
   siguen en fila con el contenedor ya estrechado (util 136 px), y por debajo
   de 360 px se queda en 154. En vez de acortar la etiqueta se ajusta el
   cuerpo y el relleno solo en esos dos tramos. */
@media (min-width:1025px) and (max-width:1250px){
  .tpr-card-cta a{
    font-size:13px !important;
    padding-left:10px !important;
    padding-right:10px !important;
  }
}
@media (max-width:400px){
  .tpr-card-cta a{
    font-size:13.5px !important;
    padding-left:10px !important;
    padding-right:10px !important;
  }
}

/* --- Pie: cadenas largas ----------------------------------------------- */
/* contacto@tuprestamorapido.com no tiene espacios y la columna mide 181 px:
   se salia 56 px y provocaba 5 px de scroll horizontal alrededor de 1100 px. */
footer .elementor-widget-text-editor a,
footer .elementor-widget-text-editor p{
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* --- Mensaje de envio del formulario ----------------------------------- */
/* Por defecto Elementor lo pinta como una linea de texto pequena debajo del
   boton, del mismo tamano que las etiquetas: mucha gente no lo ve y reenvia
   el formulario. Aqui pasa a ser un bloque con entidad propia. */
.elementor-message.elementor-message-success{
  display:block;
  margin-top:22px;
  padding:22px 24px;
  background:#E4F8F1;
  border:1px solid #00C48C;
  border-radius:14px;
  /* #00805A daba 4,49:1 sobre este fondo: justo por debajo del 4,5 de AA. */
  color:#006B4B !important;
  /* Elementor estiliza el mensaje con mas especificidad: sin !important
     la fuente y el peso no llegaban a aplicarse. */
  font-family:'Gilroy','Inter',sans-serif !important;
  font-weight:800 !important;
  font-size:20px !important;
  line-height:1.35;
  text-align:center;
  letter-spacing:-.2px;
}
.elementor-message.elementor-message-success:before{ display:none; }
@media (max-width:600px){
  .elementor-message.elementor-message-success{ font-size:17px !important; padding:18px 18px; }
}
/* El de error mantiene el mismo peso visual, en rojo. */
.elementor-message.elementor-message-danger{
  display:block;
  margin-top:22px;
  padding:18px 22px;
  background:#FBEDEF;
  border:1px solid #D98A97;
  border-radius:14px;
  color:#8E2433 !important;
  font-weight:700 !important;
  font-size:16px !important;
  text-align:center;
}
.elementor-message.elementor-message-danger:before{ display:none; }

/* --- Menú de cabecera entre 1025 y 1100 px y hasta 1260 px (13-sep-2026) ---------- */
/* Con «Blog» el menú necesita 633 px (textos 465 + 14 px de aire por lado). Por debajo
   de 1025 va en hamburguesa; por encima de 1260 cabe tal cual. Entre medias se reduce
   el aire (y en la franja más estrecha, un punto de letra) para que no parta en dos filas. */
@media (min-width:1025px) and (max-width:1100px){
  .elementor-location-header .elementor-nav-menu--main .elementor-item{
    padding-left:9px !important; padding-right:9px !important; font-size:14px !important;
  }
}
@media (min-width:1101px) and (max-width:1260px){
  .elementor-location-header .elementor-nav-menu--main .elementor-item{
    padding-left:12px !important; padding-right:12px !important;
  }
}
@media (min-width:1025px) and (max-width:1060px){
  .elementor-location-header .elementor-nav-menu--main .elementor-item{
    padding-left:7px !important; padding-right:7px !important;
  }
}

/* --- Ningún contenedor más ancho que su hueco (≤1024 px) (13-sep-2026) ------ */
/* Los bloques de lectura tienen ancho fijo (760-840 px) y solo pasan al 100 % en móvil
   (≤767). Entre 768 y 880 px conservaban el ancho de escritorio y desbordaban en 16 de
   17 páginas. En escritorio caben siempre, por eso la regla solo actúa hasta 1024. */
@media (max-width:1024px){
  .elementor .e-con{ max-width:100% !important; }
}/* End custom CSS */