.elementor-kit-27{--e-global-color-primary:#9DBBE5;--e-global-color-secondary:#FA1F02;--e-global-color-text:#5F5F5F;--e-global-color-accent:#EFCE8C;--e-global-color-bb30197:#F6F3EB;--e-global-typography-primary-font-family:"Raleway";--e-global-typography-primary-font-size:3rem;--e-global-typography-primary-font-weight:900;--e-global-typography-primary-text-transform:uppercase;--e-global-typography-secondary-font-family:"Raleway";--e-global-typography-secondary-font-size:2rem;--e-global-typography-secondary-font-weight:700;--e-global-typography-text-font-family:"Raleway";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Raleway";--e-global-typography-accent-font-weight:700;}.elementor-kit-27 button,.elementor-kit-27 input[type="button"],.elementor-kit-27 input[type="submit"],.elementor-kit-27 .elementor-button{background-color:var( --e-global-color-primary );color:#FFFFFF;}.elementor-kit-27 button:hover,.elementor-kit-27 button:focus,.elementor-kit-27 input[type="button"]:hover,.elementor-kit-27 input[type="button"]:focus,.elementor-kit-27 input[type="submit"]:hover,.elementor-kit-27 input[type="submit"]:focus,.elementor-kit-27 .elementor-button:hover,.elementor-kit-27 .elementor-button:focus{background-color:#02010100;color:var( --e-global-color-primary );border-style:solid;border-width:1px 1px 1px 1px;}.elementor-kit-27 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-kit-27{--e-global-typography-primary-font-size:2rem;--e-global-typography-secondary-font-size:1.5rem;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* =========================
   HUMIX.PE · GLOBAL (LIMPIO)
   ========================= */

/* Smooth scroll para anclas + offset (header visible) */
html{ scroll-behavior:smooth; }
:target{ scroll-margin-top: 120px; }
@media (max-width:900px){ :target{ scroll-margin-top: 86px; } }

/* =========================
   HUMIX.PE · Layout WIDE (no blog)
   ========================= */

/* 1) Contenedor global más ancho */
.elementor-section.elementor-section-boxed > .elementor-container{
  max-width: 1600px !important; /* 1440–1700 según te guste */
}

/* 2) Menos márgenes laterales generales */
.elementor-container{
  padding-left: 24px !important;
  padding-right: 24px !important;
}

/* 3) En pantallas muy grandes, aún más ancho */
@media (min-width: 1600px){
  .elementor-section.elementor-section-boxed > .elementor-container{
    max-width: 1760px !important;
  }
}

/* 4) En móvil, ajusta padding */
@media (max-width: 767px){
  .elementor-container{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}
/* =========================
   HUMIX.PE · Estilo crema (páginas de servicio)
   ========================= */
.hx-cream{ background:#F2EFE6; }
.hx-cream .hx-wrap{ max-width:1380px; margin:0 auto; padding: 0 clamp(16px,3vw,44px); }

.hx-cream h1, .hx-cream h2{
  color:#111;
  font-weight:900;
  letter-spacing:-.6px;
  text-transform: uppercase;
}
.hx-cream p{ color: rgba(0,0,0,.72); line-height:1.55; }

.hx-card-white{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius: 22px;
  box-shadow: 0 16px 45px rgba(0,0,0,.08);
  padding: clamp(16px,2.4vw,24px);
}

.hx-btn-gold{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 12px 16px; border-radius: 14px;
  background:#efce8c; color:#1b1406;
  font-weight:900; text-decoration:none;
  box-shadow: 0 18px 40px rgba(0,0,0,.14);
}
.hx-btn-ghost{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 12px 16px; border-radius: 14px;
  background: rgba(255,255,255,.65);
  border: 1px solid rgba(0,0,0,.10);
  color:#111; font-weight:900; text-decoration:none;
}

.hx-pills{ display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.hx-pill{
  padding:10px 12px; border-radius:999px;
  background:#fff;
  border:1px solid rgba(0,0,0,.10);
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
  font-weight:800; font-size:13px;
}
/* Capilaridad: offset extra al llegar a la sección solución */
#solucion{ scroll-margin-top: 140px; }
@media (max-width:900px){
  #solucion{ scroll-margin-top: 96px; }
}
/* Mantengo la sección vieja “apagada” pero sin ocupar espacio ni afectar */
.hx-old-diag{
  display:none !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
}
.hxP-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 22px 70px rgba(15,23,42,.14);
  filter: brightness(1.02);
}
/* Fondo global blanco luminoso premium */
body{
  background:
    radial-gradient(1100px 520px at 20% 0%, rgba(157,187,229,.22), transparent 58%),
    radial-gradient(900px 520px at 80% 10%, rgba(239,206,140,.18), transparent 55%),
    #ffffff !important;
}

/* Anula cualquier “beige/cream” */
.hx-cream{ background: transparent !important; }
.elementor-section, .elementor-container{
  background-color: transparent !important;
}

/* Si algún contenedor/section tiene fondo beige inline, esto ayuda */
[class*="hx-cream"]{ background: transparent !important; }
/* Header flotando sobre hero, sin franja */
.elementor-location-header{
  position: absolute !important;
  top: 0; left: 0; right: 0;
  z-index: 9999 !important;
  background: transparent !important;
}

/* Que el hero arranque pegado arriba */
body{ margin:0 !important; }
.hxP-hero{ border-radius: 0 !important; min-height: 100vh !important; }

/* Compensa para que el contenido no quede bajo el header */
.hxP-wrap{ padding-top: clamp(86px, 9vh, 130px) !important; }
.hx-cream{ background: #ffffff !important; }
body{ background:#fff !important; }
.elementor-section, .elementor-container{ background: transparent !important; }
/* Solo mostrar botones ES/EN/DE (data-lang). Oculta cualquier cosa rara (ej: "Delaware") */
.hxP-lang > *:not([data-lang]){ display:none !important; }/* End custom CSS */