.elementor-kit-3{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-b489c66:#9DBBE5;--e-global-color-e2ca36f:#FA1F02;--e-global-color-275ebee:#EFCE8C;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-3 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.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);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ——— Header “glass” a ancho de viewport ——— */
.hx-glass-nav{
  position: sticky; top:0; left:0; right:0; z-index:9999;
  width:100vw;                               /* ¡Ojo! no 0vw */
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: rgba(255,255,255,.16);
  -webkit-backdrop-filter: blur(10px) saturate(1.05);
  backdrop-filter: blur(10px) saturate(1.05);
  border-bottom: 1px solid rgba(255,255,255,.28);
  box-shadow: 0 10px 26px rgba(0,0,0,.08);
}

/* Limitar el contenido del header al 90% y centrarlo */
.header-hx .e-con-inner,
.header-hx .elementor-container{
  width: 90%;
  max-width: 1400px;
  margin: 0 auto;
}

/* Móvil: header un poco más sólido y 100% de ancho de contenido */
@media (max-width:767px){
  .hx-glass-nav{
    background: rgba(255,255,255,.92);
    border-bottom: 1px solid rgba(0,0,0,.06);
    -webkit-backdrop-filter: blur(6px) saturate(1);
    backdrop-filter: blur(6px) saturate(1);
    box-shadow: 0 6px 18px rgba(0,0,0,.07);
  }
  .header-hx .e-con-inner,
  .header-hx .elementor-container{
    width:100%;
  }
}

/* ——— Píldoras del menú ——— */
:root{ --hx-red:#FA1F02; --hx-gold:#EFCE8C; }

.menu-hx .elementor-nav-menu--main .elementor-item{
  display:inline-block;
  color:var(--hx-red) !important;
  font-weight:800;
  padding:.55rem .9rem;
  border-radius:999px;
  border:1px solid transparent;
  text-decoration:none;
  transition: background .2s, border-color .2s, color .2s;
}
.menu-hx .elementor-nav-menu--main .elementor-item:hover,
.menu-hx .elementor-nav-menu--main .elementor-item.elementor-item-active{
  border-color: var(--hx-gold);
  background: rgba(239,206,140,.18);
  color: var(--hx-red) !important;
}

/* Dropdown móvil más legible */
@media (max-width:1024px){
  .menu-hx .elementor-nav-menu--dropdown{
    background: rgba(30,30,30,.55);
    border:1px solid rgba(255,255,255,.18);
    -webkit-backdrop-filter: blur(8px) saturate(1.05);
    backdrop-filter: blur(8px) saturate(1.05);
    border-radius:16px; padding:10px;
    box-shadow:0 16px 32px rgba(0,0,0,.24);
  }
  .menu-hx .elementor-nav-menu--dropdown a.elementor-item{
    color:#fff !important;
    border-radius:999px;
    border:1px solid transparent;
    padding:.6rem .9rem;
  }
  .menu-hx .elementor-nav-menu--dropdown a.elementor-item:hover{
    border-color: var(--hx-gold);
    background: rgba(239,206,140,.18);
  }
}
/* ========= CONTACTO – layout y proporciones ========= */
/* Contenedor de la sección (asegúrate de que el contenedor tiene la clase: sec-contacto) */
.sec-contacto &gt; .e-con{
  width: min(1200px, 92%);
  margin-inline: auto;
  gap: 28px;
}

/* Escritorio: 3 columnas con FORM más grande y FOTO más pequeña */
@media (min-width: 1025px){
  .sec-contacto &gt; .e-con{
    display: flex;
    align-items: flex-start;
    flex-wrap: nowrap;
  }
  /* Permite que los hijos encojan sin romper layout */
  .sec-contacto &gt; .e-con &gt; .e-con{ min-width: 0; }

  /* 1) FOTO (1ª columna) → más estrecha */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(1){
    flex: 0 1 30%;          /* antes 36% aprox. */
    max-width: 420px;       /* tope seguro */
  }

  /* 2) FORM (2ª columna) → más ancho */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(2){
    flex: 1 1 54%;          /* antes ~44% */
    max-width: 760px;       /* deja crecer el form */
  }

  /* 3) DATOS (3ª columna) → igual/ligeramente más estrecha */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(3){
    flex: 0 0 22%;
    max-width: 380px;
    position: sticky;       /* pegajoso opcional */
    top: 110px;             /* ajusta si el header tapa */
  }
}

/* Tablet: dos columnas (FORM 60% / FOTO 40%), DATOS debajo a 100% */
@media (min-width: 768px) and (max-width: 1024px){
  .sec-contacto &gt; .e-con{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 24px;
  }
  .sec-contacto &gt; .e-con &gt; .e-con{ min-width: 0; }

  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(2){ flex: 1 1 60%; } /* FORM */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(1){ flex: 1 1 40%; } /* FOTO */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(3){ flex: 1 1 100%; }/* DATOS */
}

/* Móvil: todo apilado */
@media (max-width: 767px){
  .sec-contacto &gt; .e-con{ display: block; }
}

/* Imagen: que no se desborde nunca */
.sec-contacto img{ width: 100%; height: auto; display: block; }

/* Tarjeta de datos: borde y sombra suave */
.sec-contacto .e-con &gt; .e-con:nth-child(3) .e-con{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 14px;
  box-shadow: 0 10px 28px rgba(0,0,0,.08);
}

/* Logo dentro del formulario con aire cómodo */
.sec-contacto .e-con &gt; .e-con:nth-child(2) img{
  width: 78px;           /* 72–84px cómodo */
  height: auto;
  margin-bottom: 12px;
}

/* Campos y botón: que ocupen todo el ancho del form */
.sec-contacto form,
.sec-contacto .elementor-form{ width: 100%; max-width: 100%; }
.sec-contacto .elementor-button{ width: 100%; }

/* Un poco más de gap general en escritorio para respirar */
@media (min-width: 1025px){
  .sec-contacto &gt; .e-con{ gap: 32px; }
}
/* Contacto: dar más ancho al formulario en escritorio */
@media (min-width: 1025px){
  /* Foto (1ª columna) un poco más estrecha */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(1){
    flex: 0 0 30%;
    max-width: 360px;
  }
  /* Formulario (2ª columna) más ancho */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(2){
    flex: 1 1 52%;
    max-width: 720px;        /* súbelo/bájalo si quieres afinar */
  }
  /* Tarjeta de datos (3ª columna) igual o un pelín más compacta */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(3){
    flex: 0 0 18%;
    max-width: 360px;
  }
}
@media (min-width: 1025px){
  /* Foto algo más estrecha */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(1){ flex: 0 0 28%; max-width: 340px; }
  /* Formulario un poco más ancho */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(2){ flex: 1 1 54%; max-width: 760px; }
  /* Tarjeta de datos igual/compacta */
  .sec-contacto &gt; .e-con &gt; .e-con:nth-child(3){ flex: 0 0 18%; max-width: 360px; }
}
/* ===== Sección FAQs ===== */

/* Contenedor general con el mismo ancho que Contacto */
.sec-faqs{
  padding-block: 10px;
}
.sec-faqs .hx-head{
  text-align: center;
  width: min(1200px, 92%);
  margin: 0 auto 18px;
}
.sec-faqs .hx-head h2{
  font-size: clamp(28px, 4vw, 38px);
  margin: 0 0 6px;
  font-weight: 800;
}
.sec-faqs .hx-head p{
  margin: 0 0 12px;
  color:#666;
}
/* Colores HumiX del título */
.hx-h{ color:#3B82F6; font-weight:900; }
.hx-umi{ color:#111; font-weight:800; }
.hx-x{ color:#FA1F02; font-weight:900; }

/* Fila de columnas */
.faqs-row{
  width: min(1200px, 92%);
  margin-inline: auto;
  display: flex;
  align-items: flex-start;
  gap: 28px;
}
.faqs-row &gt; .e-con{ min-width: 0; } /* seguridad Elementor */

.sec-faqs .col-foto   { flex: 1 1 42%; max-width: 520px; }
.sec-faqs .col-faq    { flex: 1 1 58%; max-width: 700px; }
.sec-faqs .col-foto img{ width:100%; height:auto; display:block; border-radius: 10px; }
/* ===== FAQs — Estilos ===== */
.faqs-wrap{
  width:min(1200px, 92%);
  margin:0 auto;
}
.faqs-head{
  text-align:center;
  margin:0 0 18px;
}
.faqs-head h2{
  font-size: clamp(26px, 2.6vw, 36px);
  margin:0 0 6px;
}
.faqs-head p{
  margin:0; color:#666;
}

/* Tarjetas FAQ */
.faq{
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
  background:#fff;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  margin:12px 0;
  overflow:hidden;
}
.faq &gt; summary{
  list-style:none;          /* Oculta triángulo por defecto (Chrome/WebKit) */
  padding:16px 18px;
  font-weight:700;
  cursor:pointer;
  position:relative;
}
.faq &gt; summary::after{
  content:"+";
  position:absolute; right:16px; top:50%; transform:translateY(-50%);
  font-weight:900;
}
.faq[open] &gt; summary::after{ content:"–"; }

.faq &gt; div{
  padding:16px 18px;
  color:#444; line-height:1.55;
  border-top:1px solid rgba(0,0,0,.06);
}

/* Accesibilidad */
.faq &gt; summary:focus { outline: 2px solid #efce8c; outline-offset: 3px; }/* End custom CSS */