.elementor-kit-17{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-88b457e:#9DBBE5;--e-global-color-9d5d7be:#FA1F02;--e-global-color-e133d5e:#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-17 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 */--ink:#0f172a; --text:#334155; --smoke:#e8edf3; --red:#FA1F02; --gold:#EFCE8C; --blue:#9DBBE5; --max:1320px; } .hx-inner{ max-width:var(--max); margin:auto; padding:0 22px } /* ====== Header HumiX Gijón – Fix total (Astra/Elementor, sin JS) ====== */
:root{
  --hx-blue:#0b1e35;           /* texto/menu */
  --hx-red:#fa1f02;            /* botón CTA */
  --hx-gold:#efce8c;           /* detalles si quieres */
  --hx-border:#e8edf4;         /* líneas sutiles */
}

/* Contenedor principal */
#hx-header{
  position:relative;
  z-index: 9999;               /* por encima de Astra */
  background:#fff;             /* evita blanco sobre blanco “invisible” */
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
#hx-header .inner{
  max-width:1100px;
  margin:0 auto;
  padding:12px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

/* Marca */
#hx-header .brand img{
  height:40px;
  width:auto;
  display:block;
}

/* Menú de escritorio */
#hx-header .desk{ display:block; }
#hx-header .desk .menu{
  display:flex;
  gap:20px;
  align-items:center;
}
#hx-header .desk .menu a{
  color:var(--hx-blue);
  text-decoration:none;
  font-weight:600;
  line-height:1;
  padding:10px 6px;
}
#hx-header .desk .menu a:hover{
  opacity:.8;
}

/* Botón CTA */
#hx-header .desk .menu .btn,
#hx-nav .btn{
  background:var(--hx-red);
  color:#fff !important;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:700;
}
#hx-header .desk .menu .btn:hover,
#hx-nav .btn:hover{
  filter:brightness(.95);
}

/* Burger (solo móvil) */
#hx-header .burger{
  display:none;                 /* oculto en desktop */
  width:40px; height:40px;
  position:relative;
  border:1px solid var(--hx-border);
  border-radius:10px;
}
#hx-header .burger span{
  position:absolute; left:8px; right:8px;
  height:2px; background:var(--hx-blue);
  top:12px;
}
#hx-header .burger span:nth-child(2){ top:19px; }
#hx-header .burger span:nth-child(3){ top:26px; }

/* Panel móvil (off-canvas) – abre con :target */
#hx-nav{
  position:fixed;
  inset:0 0 0 auto;            /* ancla a la derecha */
  width:min(86vw, 360px);
  background:#fff;
  transform:translateX(100%);
  transition:transform .3s ease;
  box-shadow: -10px 0 30px rgba(0,0,0,.15);
  z-index: 99999;
  padding:18px 20px 28px;
}
#hx-nav .close{
  display:inline-block;
  font-size:24px;
  line-height:1;
  color:var(--hx-blue);
  text-decoration:none;
  margin-bottom:10px;
}
#hx-nav ul{
  list-style:none; padding:0; margin:10px 0 0;
  display:flex; flex-direction:column; gap:8px;
}
#hx-nav a{
  color:var(--hx-blue);
  text-decoration:none;
  font-weight:700;
  padding:12px 8px;
  border-radius:8px;
  display:block;
}
#hx-nav a:hover{ background:#f6f8fb; }

/* Backdrop */
#hx-header .backdrop{
  position:fixed; inset:0;
  background:rgba(0,0,0,.35);
  opacity:0; pointer-events:none;
  transition:opacity .25s ease;
  z-index: 9999;
}

/* Estado abierto usando :target (no JS) */
#hx-nav:target{ transform:translateX(0); }
#hx-nav:target ~ .backdrop{
  opacity:1; pointer-events:auto;
}

/* Responsivo */
@media (max-width:1024px){
  #hx-header .desk{ display:none; }   /* oculta menú escritorio */
  #hx-header .burger{ display:inline-block; }
}

/* Accesibilidad: foco visible */
#hx-header a:focus{ outline:2px solid var(--hx-gold); outline-offset:2px; }

/* Astra “overlay” / headers pegajosos que pisan capas */
.ast-header-break-point #hx-header{ z-index: 9999 !important; }
 ================================= HERO ================================= */ #hx-gij-hero{ position:relative; min-height:86vh; display:flex; align-items:center; justify-content:center; text-align:center; color:#fff; padding:120px 0; background: linear-gradient(180deg, rgba(0,0,0,.44), rgba(0,0,0,.62)), url('http://gijon.humixlanding.com/wp-content/uploads/sites/39/2025/10/control_de_humedades_en_gijon_hero.webp') center/cover no-repeat; } #hx-gij-hero .hx-inner{ position:relative; z-index:1 } #hx-gij-hero .hx-hero-title{ color:#fff!important; font-weight:900; font-size:clamp(2.4rem,6vw,4.2rem); line-height:1.05; margin:0 0 .6rem; text-shadow:0 10px 30px rgba(0,0,0,.35); } #hx-gij-hero .hx-hero-lead{ color:#f1f5f9!important; font-size:clamp(1rem,1.6vw,1.2rem); margin:0 auto 18px; max-width:860px; } /* === 3 BOTONES del hero (limpio, sin duplicados) === */ #hx-gij-hero .elementor-widget-text-editor p{ margin-top:12px } #hx-gij-hero .elementor-widget-text-editor p a{ display:inline-flex; align-items:center; gap:10px; padding:12px 16px; margin:6px 6px 0 0; line-height:1; border-radius:9999px; border:2px solid var(--red); background:var(--red); color:#fff !important; font-weight:800; text-decoration:none !important; } #hx-gij-hero .elementor-widget-text-editor p a[href*="solucion"], #hx-gij-hero .elementor-widget-text-editor p a[href*="soluciones"]{ background:transparent; color:var(--red) !important; } #hx-gij-hero .elementor-widget-text-editor p a[href*="wa.me"], #hx-gij-hero .elementor-widget-text-editor p a[href*="whatsapp"]{ border-color:#25D366; background:#25D366; color:#fff !important; } #hx-gij-hero .elementor-widget-text-editor p a:hover{ transform:translateY(-1px) } /* Importante: NO convertir otros enlaces/iconos del hero (bolita de scroll, etc.) */ #hx-gij-hero .elementor-widget-icon a, #hx-gij-hero a.elementor-icon, #hx-gij-hero .elementor-icon-wrapper a, #hx-gij-hero a[class*="scroll"], #hx-gij-hero a[class*="down"], #hx-gij-hero .elementor-widget-button a.elementor-button-link{ background:transparent !important; border:0 !important; padding:0 !important; margin:0 !important; border-radius:0 !important; color:inherit !important; box-shadow:none !important; } /* Flecha “siguiente sección” (bolita) */ .hx-next{ --size:48px; position:absolute; left:50%; bottom:-24px; transform:translateX(-50%); width:var(--size); height:var(--size); display:grid; place-items:center; background:#fff; border:2px solid var(--gold); border-radius:999px; box-shadow:0 8px 24px rgba(0,0,0,.12); text-decoration:none; z-index:5; transition:transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease; } .hx-next-icon{ width:18px; height:18px; display:inline-block; border-right:3px solid var(--gold); border-bottom:3px solid var(--gold); transform:rotate(45deg); margin-top:-2px; } .hx-next:hover{ transform:translateX(-50%) translateY(-3px); background:var(--gold); border-color:var(--gold) } .hx-next:hover .hx-next-icon{ border-color:#0f172a } /* ===================== SECCIONES BASE ===================== */ .section{ padding:56px 0; position:relative } .section h2{ color:var(--ink); margin:0 0 .6rem } .section p{ color:var(--text) } /* ===================== FRANJA DE EQUIPOS ===================== */ #hx-equipo-band{ background:#0f172a0a; padding:56px 0 } #hx-equipo-band .hx-inner{ text-align:center } #hx-equipo-band .eyebrow{ letter-spacing:.14em; font-weight:800; color:var(--gold); margin:0 0 8px } #hx-equipo-band .section-title{ margin:0 0 8px; color:var(--ink) } #hx-equipo-band .section-subtitle{ margin:0 0 22px; color:var(--text) } /* Rejilla fluida: coloca 5/4/3/2/1 por fila según ancho */ #hx-equipo-band .equip-grid{ display:grid; gap:16px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } #hx-equipo-band .equip-card{ background:#fff; border:1px solid var(--smoke); border-radius:14px; padding:16px; text-align:left; box-shadow:0 12px 30px rgba(6,20,33,.08); text-decoration:none; transition:transform .15s ease, box-shadow .2s ease; } #hx-equipo-band .equip-card:hover{ transform:translateY(-3px); box-shadow:0 18px 42px rgba(6,20,33,.12) } #hx-equipo-band img{ width:100%; height:auto; display:block; border-radius:10px; margin-bottom:10px } #hx-equipo-band h3{ margin:.2rem 0 .25rem; color:var(--ink) } #hx-equipo-band p{ margin:0; color:#475569; font-size:.95rem; line-height:1.35 } /* ===================== FAQS (con imagen lateral) ===================== */ #hx-faqs-hero{ padding:56px 0 } #hx-faqs-hero .hx-inner{ max-width:1100px; margin:auto; padding:0 22px } #hx-faqs-hero .eyebrow{ letter-spacing:.14em; font-weight:800; color:var(--gold); margin:0 0 8px } #hx-faqs-hero .section-title{ margin:0 0 8px; color:var(--ink) } #hx-faqs-hero .section-subtitle{ margin:0 0 20px; color:var(--text) } #hx-faqs-hero .faq-wrap{ display:grid; gap:28px; grid-template-columns:1.25fr 1fr; align-items:stretch; } #hx-faqs-hero .faq-col{ background:#fff; border:1px solid var(--smoke); border-radius:14px; padding:18px; box-shadow:0 12px 30px rgba(6,20,33,.08); } #hx-faqs-hero .faq-art{ border-radius:14px; overflow:hidden; position:relative; min-height:360px; box-shadow:0 16px 40px rgba(6,20,33,.16); background-image: linear-gradient(180deg,rgba(15,23,42,.45),rgba(15,23,42,.25)), url("data:image/svg+xml,%3Csvg width='200' height='200' viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd' opacity='.16'%3E%3Cpath d='M100 10c15 30-10 35-10 60s25 30 10 60c-15-30 10-35 10-60s-25-30-10-60z' fill='%23ffffff'/%3E%3Cpath d='M40 70c10 20-7 24-7 41s18 21 7 41c-11-20 7-24 7-41S50 90 40 70z' fill='%23ffffff'/%3E%3Cpath d='M160 90c12 24-8 28-8 49s20 25 8 49c-12-24 8-28 8-49s-20-25-8-49z' fill='%23ffffff'/%3E%3C/g%3E%3C/svg%3E"), url('http://gijon.humixlanding.com/wp-content/uploads/sites/39/2025/10/faqs_preguntas_frecuentes.webp'); background-size:cover, 320px 320px, cover; background-position:center, right top, center; background-repeat:no-repeat; } @media (max-width:1024px){ #hx-faqs-hero .faq-wrap{ grid-template-columns:1fr } #hx-faqs-hero .faq-art{ min-height:260px; margin-top:8px } } /* Acordeón de Elementor (títulos visibles) */ #hx-faqs-hero .elementor-accordion .elementor-tab-title{ background:#fff; border:1px solid var(--smoke); border-radius:12px; margin-top:12px; padding:14px 16px; color:var(--ink); font-weight:700; } #hx-faqs-hero .elementor-accordion .elementor-tab-title a{ color:inherit !important; display:block } #hx-faqs-hero .elementor-accordion .elementor-tab-content{ background:#fff; border:1px solid var(--smoke); border-top:0; border-radius:0 0 12px 12px; padding:14px 16px; color:#334155; } /* ===================== FOOTER (sin cambios de look) ===================== */ /* ... (tu bloque actual del footer ya está bien, no lo repito para no alargar) ... */ /* === HÉROE · Botones consistentes para los 3 enlaces === */ /* Espacio sobre la fila de CTAs si están en el mismo párrafo */ #hx-gij-hero .elementor-widget-text-editor p{ margin-top:12px; } /* 1) Base: TODOS los enlaces directos del párrafo -&gt; botón rojo */ #hx-gij-hero .elementor-widget-text-editor p &gt; a{ display:inline-flex !important; align-items:center !important; gap:10px !important; padding:12px 16px !important; margin:6px 6px 0 0 !important; line-height:1 !important; border-radius:9999px !important; border:2px solid #FA1F02 !important; background:#FA1F02 !important; color:#fff !important; font-weight:800 !important; text-decoration:none !important; box-shadow:none !important; vertical-align:middle; } /* 2) “Ver soluciones” =&gt; ghost rojo (detecta varias rutas) */ #hx-gij-hero .elementor-widget-text-editor p &gt; a[href*="solucion"], #hx-gij-hero .elementor-widget-text-editor p &gt; a[href*="soluciones"], #hx-gij-hero .elementor-widget-text-editor p &gt; a[href*="humedad-por"], #hx-gij-hero .elementor-widget-text-editor p &gt; a[href*="/filtraciones"]{ background:transparent !important; color:#FA1F02 !important; } /* 3) WhatsApp =&gt; verde oficial */ #hx-gij-hero .elementor-widget-text-editor p &gt; a[href*="wa.me"], #hx-gij-hero .elementor-widget-text-editor p &gt; a[href*="whatsapp"]{ border-color:#25D366 !important; background:#25D366 !important; color:#fff !important; } /* 4) Hover sutil */ #hx-gij-hero .elementor-widget-text-editor p &gt; a:hover{ transform:translateY(-1px); } /* 5) NO convertir en botón iconos/chevron/scroll/otros elementos */ #hx-gij-hero .elementor-widget-icon a, #hx-gij-hero a.elementor-icon, #hx-gij-hero-hero .elementor-icon-wrapper a, #hx-gij-hero a[class*="scroll"], #hx-gij-hero a[class*="down"], #hx-gij-hero .elementor-widget-button a.elementor-button-link{ background:transparent !important; border:0 !important; padding:0 !important; margin:0 !important; border-radius:0 !important; color:inherit !important; box-shadow:none !important; } /* Responsive: un poco menos de padding en móvil */ @media (max-width:900px){ #hx-gij-hero .elementor-widget-text-editor p &gt; a{ padding:10px 14px !important; } } /* ====== BASE DE CONTENEDOR Y SECCIONES ====== */ :root{ --max:1320px; } .section{ padding:56px 0; position:relative; } .section &gt; .hx-inner{ max-width:var(--max); margin:0 auto; padding:0 22px; } /* Por si alguna inner pierde el ancho centrado */ .hx-inner{ max-width:var(--max); margin:0 auto; padding:0 22px; } /* ====== REJILLAS UTILITARIAS (colapsan en móvil) ====== */ .grid-3{ display:grid; gap:18px; grid-template-columns:repeat(3,minmax(0,1fr)); } .grid-2{ display:grid; gap:18px; grid-template-columns:repeat(2,minmax(0,1fr)); } @media (max-width:980px){ .grid-3, .grid-2{ grid-template-columns:1fr; } } /* ====== TARJETAS Y MEDIOS ====== */ .card{ background:#fff; border:1px solid #e8edf3; border-radius:18px; padding:16px; box-shadow:0 10px 30px rgba(6,20,33,.08); } .media{ position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:18px; background:#f1f4f8; } .media img{ width:100%; height:100%; object-fit:cover; display:block; } /* Limitar cualquier imagen “suelta” dentro de secciones para que no desborde */ .section img{ max-width:100%; height:auto; display:block; } /* ====== QUIÉNES SOMOS (2 columnas en desktop) ====== */ #hx-gij-quienes .grid{ display:grid; gap:18px; grid-template-columns:1.4fr 1fr; } @media (max-width:980px){ #hx-gij-quienes .grid{ grid-template-columns:1fr; } } #hx-gij-quienes .card{ padding:24px; } /* ====== SERVICIOS (3 columnas en desktop) ====== */ #hx-gij-servicios .grid{ display:grid; gap:18px; grid-template-columns:repeat(3,minmax(0,1fr)); } @media (max-width:980px){ #hx-gij-servicios .grid{ grid-template-columns:1fr; } } #hx-gij-servicios .card{ padding:22px; border-radius:22px; } #hx-gij-servicios .media{ margin:10px 0 14px; box-shadow:0 10px 30px rgba(6,20,33,.08); } /* ====== CONTACTO (por si perdió rejilla) ====== */ #hx-gij-contacto .elementor-container{ gap:22px; } #hx-gij-contacto .card, #hx-gij-contacto .elementor-widget-image img{ border-radius:14px; box-shadow:0 10px 30px rgba(6,20,33,.08); } #hx-gij-contacto .elementor-form .e-form__fields{ display:grid; grid-template-columns:1fr 1fr; gap:14px 16px; } @media (max-width:767px){ #hx-gij-contacto .elementor-form .e-form__fields{ display:block; } } /* ====== “Por si acaso” de Elementor: evitar desbordes ====== */ .elementor img{ max-width:100%; height:auto; } /* ===== Footer HumiX – RESCATE COMPLETO ===== */ #hx-footer{ position:relative; background:#0f172a; color:#e5edf6; padding:44px 0 26px; overflow:visible; /* para que la flecha sobresalga */ } /* Línea dorada superior de ancho completo */ #hx-footer::before{ content:""; position:absolute; left:0; right:0; top:0; height:6px; background:linear-gradient(90deg,#EFCE8C 0%,#f3deb1 50%,#EFCE8C 100%); box-shadow:0 1px 0 rgba(0,0,0,.08); } /* Contenedor interno */ #hx-footer .hx-inner{ max-width:var(--max,1320px); margin:auto; padding:0 22px; } /* Rejilla principal: Marca | Enlaces | Contacto */ #hx-footer .f-grid{ display:grid; gap:24px; grid-template-columns:1.2fr 1fr 1fr; align-items:start; } /* Marca */ #hx-footer .brand img{ height:44px; width:auto; display:block; margin:0 0 10px; } #hx-footer .brand .claim{ margin:6px 0 4px; color:#cfd8e3; } #hx-footer .brand .hours{ margin:0 0 14px; color:#9fb0c5; font-size:.95rem; } #hx-footer .brand .cta{ display:inline-block; background:#FA1F02; color:#fff; text-decoration:none; padding:12px 18px; border-radius:12px; font-weight:800; box-shadow:0 10px 24px rgba(250,31,2,.25); transition:filter .2s, transform .15s; } #hx-footer .brand .cta:hover{ filter:brightness(1.05); transform:translateY(-1px); } /* Enlaces / Contacto */ #hx-footer h4{ color:#fff; margin:0 0 10px; font-weight:800; } #hx-footer .links ul, #hx-footer .contact .list{ margin:0; padding:0; list-style:none; } #hx-footer .links a, #hx-footer .contact a{ color:#e5edf6; text-decoration:none; } #hx-footer .links a:hover, #hx-footer .contact a:hover{ text-decoration:underline; } /* Legal */ #hx-footer .legal{ display:flex; gap:8px; justify-content:center; align-items:center; margin-top:26px; color:#9fb0c5; font-size:.95rem; text-align:center; } #hx-footer .legal a{ color:#cfd8e3; text-decoration:none; } #hx-footer .legal a:hover{ text-decoration:underline; } #hx-footer .legal .sep{ color:#42536a; } /* Botón “volver arriba” */ #hx-footer .hx-backtop{ --size:48px; position:absolute; left:50%; top:-24px; transform:translateX(-50%); width:var(--size); height:var(--size); display:grid; place-items:center; background:#fff; border:2px solid #EFCE8C; border-radius:999px; box-shadow:0 8px 24px rgba(0,0,0,.12); text-decoration:none; z-index:5; transition:transform .18s, background .18s, border-color .18s, box-shadow .18s; } #hx-footer .hx-backtop-icon{ width:18px; height:18px; display:inline-block; border-right:3px solid #EFCE8C; border-bottom:3px solid #EFCE8C; transform:rotate(-135deg); /* chevron hacia arriba */ } #hx-footer .hx-backtop:hover{ transform:translateX(-50%) translateY(-3px); background:#EFCE8C; border-color:#EFCE8C; box-shadow:0 12px 28px rgba(0,0,0,.16); } #hx-footer .hx-backtop:hover .hx-backtop-icon{ border-color:#0f172a; } /* Responsive footer */ @media (max-width:980px){ #hx-footer .f-grid{ grid-template-columns:1fr; } #hx-footer .brand img{ height:40px; } #hx-footer .legal{ padding:0 12px; flex-wrap:wrap; } } /* Por si el tema intenta forzar colores/espacios dentro del footer */ #hx-footer a{ color:inherit; } #hx-footer p{ margin:0; } #hx-footer, #hx-footer .elementor-widget-container, #hx-footer .e-con { background:#0f172a !important; } /* ===== HumiX · 3 BOTONES en el HERO (rescate) ===== */ /* Un poco de aire antes de la fila de CTAs */ #hx-gij-hero .elementor-widget-text-editor p{ margin-top: 14px !important; } /* 1) Cualquier enlace en el párrafo de texto del hero → botón rojo */ #hx-gij-hero .elementor-widget-text-editor p a{ display:inline-flex !important; align-items:center !important; gap:10px !important; padding:12px 16px !important; margin:6px 6px 0 0 !important; line-height:1 !important; border-radius:9999px !important; border:2px solid #FA1F02 !important; background:#FA1F02 !important; color:#fff !important; font-weight:800 !important; text-decoration:none !important; box-shadow:none !important; vertical-align:middle !important; } /* 2) “Ver soluciones” → estilo ghost (rojo contorno) */ #hx-gij-hero .elementor-widget-text-editor p a[href*="solucion" i], #hx-gij-hero .elementor-widget-text-editor p a[href*="soluciones" i]{ background:transparent !important; color:#FA1F02 !important; } /* 3) WhatsApp → verde oficial */ #hx-gij-hero .elementor-widget-text-editor p a[href*="wa.me" i], #hx-gij-hero .elementor-widget-text-editor p a[href*="whatsapp" i]{ border-color:#25D366 !important; background:#25D366 !important; color:#fff !important; } /* 4) Hover sutil */ #hx-gij-hero .elementor-widget-text-editor p a:hover{ transform:translateY(-1px) !important; } /* 5) MUY IMPORTANTE: no toques los iconos/chevron del hero */ #hx-gij-hero .elementor-widget-icon a, #hx-gij-hero a.elementor-icon, #hx-gij-hero .elementor-icon-wrapper a, #hx-gij-hero a[class*="scroll"], #hx-gij-hero a[class*="down"]{ background:transparent !important; border:0 !important; padding:0 !important; margin:0 !important; border-radius:0 !important; color:inherit !important; box-shadow:none !important; } /* ===== BOTONES DEL HERO (con tus clases) ===== */ #hx-gua-hero .hx-hero-cta{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:14px; } /* Base para TODOS los botones del bloque */ #hx-gij-hero .hx-hero-cta a{ display:inline-flex; align-items:center; gap:10px; padding:12px 16px; line-height:1; border-radius:9999px; font-weight:800; text-decoration:none; margin:6px 6px 0 0; transition:transform .15s ease, filter .2s ease; } /* 1) Rojo sólido: Solicitar diagnóstico */ #hx-gij-hero .hx-hero-cta .btn-primary{ border:2px solid #FA1F02; background:#FA1F02; color:#fff; box-shadow:0 10px 24px rgba(250,31,2,.25); } #hx-gij-hero .hx-hero-cta .btn-primary:hover{ transform:translateY(-1px); filter:brightness(1.05); } /* 2) Rojo “ghost”: Ver soluciones */ #hx-gij-hero .hx-hero-cta .btn-ghost{ border:2px solid #FA1F02; background:transparent; color:#FA1F02; } #hx-gij-hero .hx-hero-cta .btn-ghost:hover{ background:rgba(250,31,2,.10); } /* 3) WhatsApp verde oficial */ #hx-gij-hero .hx-hero-cta .btn-wa{ border:2px solid #25D366; background:#25D366; color:#fff; box-shadow:0 10px 24px rgba(37,211,102,.25); } #hx-gij-hero .hx-hero-cta .btn-wa:hover{ transform:translateY(-1px); filter:brightness(1.05); } /* Seguridad: no tocar la bolita/chevron ni otros iconos del hero */ #hx-gij-hero .elementor-widget-icon a, #hx-gij-hero a.elementor-icon, #hx-gij-hero .elementor-icon-wrapper a, #hx-gij-hero a[class*="scroll"], #hx-gij-hero a[class*="down"]{ background:transparent !important; border:0 !important; padding:0 !important; margin:0 !important; border-radius:0 !important; color:inherit !important; box-shadow:none !important; } /* ===== Chips bajo el H1 del hero ===== */ #hx-gij-hero .hx-chips-hero{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin:12px auto 8px; /* espacio entre título y párrafo */ } #hx-gij-hero .hx-chips-hero .chip{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; line-height:1; font-weight:700; font-size:.95rem; color:#fff; /* “glass” */ border:1px solid rgba(255,255,255,.28); background:rgba(0,0,0,.18); -webkit-backdrop-filter:saturate(140%) blur(6px); backdrop-filter:saturate(140%) blur(6px); border-radius:999px; white-space:nowrap; } #hx-gij-hero .hx-chips-hero .chip .dot{ width:10px; height:10px; border-radius:999px; background:linear-gradient(90deg,#9DBBE5,#EFCE8C,#FA1F02); box-shadow:0 0 0 2px rgba(255,255,255,.25) inset; flex:0 0 10px; } @media (max-width:600px){ #hx-gij-hero .hx-chips-hero .chip{ font-size:.9rem; } } /* ====== FAQs — grid 2 col + estilo tarjeta e imagen ====== */ #hx-faqs-hero{ padding:56px 0; } #hx-faqs-hero .hx-inner{ max-width: var(--max, 1320px); margin:auto; padding:0 22px; } /* Encabezado consistente con el resto */ #hx-faqs-hero .eyebrow{ letter-spacing:.14em; font-weight:800; color:#EFCE8C; margin:0 0 8px; } #hx-faqs-hero .section-title{ margin:0 0 8px; color:#0f172a; } #hx-faqs-hero .section-subtitle{ margin:0 0 20px; color:#334155; } /* Rejilla dos columnas (FAQ / figura) */ #hx-faqs-hero .faq-wrap{ display:grid; gap:28px; align-items:stretch; grid-template-columns: 1.25fr 1fr; } /* Columna izquierda como tarjeta */ #hx-faqs-hero .faq-col{ background:#fff; border:1px solid #e8edf3; border-radius:14px; padding:18px; box-shadow:0 12px 30px rgba(6,20,33,.08); } /* Si usas acordeón de Elementor */ #hx-faqs-hero .elementor-accordion .elementor-tab-title{ background:#fff; border:1px solid #e8edf3; border-radius:12px; margin-top:12px; padding:14px 16px; color:#0f172a; font-weight:700; } #hx-faqs-hero .elementor-accordion .elementor-tab-title a{ color:inherit !important; display:block; } #hx-faqs-hero .elementor-accordion .elementor-tab-content{ background:#fff; border:1px solid #e8edf3; border-top:0; border-radius:0 0 12px 12px; padding:14px 16px; color:#334155; } /* Si mantienes el <ul class="faq-fake"> de demo */ #hx-faqs-hero .faq-fake{ list-style:none; margin:16px 0 0; padding:0; } #hx-faqs-hero .faq-fake li{ border:1px solid #e8edf3; border-radius:10px; margin:10px 0; overflow:hidden; background:#fff; } #hx-faqs-hero .faq-fake .q{ width:100%; text-align:left; padding:12px 14px; font-weight:700; background:#f8fafc; border:0; cursor:pointer; color:#0f172a; } #hx-faqs-hero .faq-fake .a{ padding:12px 14px; color:#475569; border-top:1px solid #e8edf3; } /* Columna derecha con imagen creativa */ #hx-faqs-hero .faq-art{ border-radius:18px; overflow:hidden; position:relative; min-height: 560px; box-shadow:0 30px 70px rgba(15,23,42,.18); background-image: linear-gradient(180deg,rgba(15,23,42,.06),rgba(0,0,0,.08)), url('https://gijon.humixlanding.com/wp-content/uploads/sites/39/2025/10/faqs_preguntas_frecuentes.webp'); background-size:cover; background-position:center; background-repeat:no-repeat; } /* Responsive */ @media (max-width:1024px){ #hx-faqs-hero .faq-wrap{ grid-template-columns:1fr; } #hx-faqs-hero .faq-art{ min-height:320px; order:2; } } @media (max-width:640px){ #hx-faqs-hero .faq-art{ min-height:240px; } } /* Grid de dos columnas en FAQs */ #hx-faqs-hero .faq-wrap{ display:grid; grid-template-columns: 1.25fr 1fr; /* izquierda FAQ / derecha imagen */ gap:28px; align-items:stretch; } /* Figura derecha con imagen */ #hx-faqs-hero .hx-faqs-figure{ min-height:560px; border-radius:18px; box-shadow:0 30px 70px rgba(15,23,42,.18); background-image: linear-gradient(180deg,rgba(15,23,42,.45),rgba(15,23,42,.25)), url("http://http://gijon.humixlanding.com/wp-content/uploads/sites/39/2025/10/faqs_preguntas_frecuentes.webp"); background-size:cover; background-position:center; background-repeat:no-repeat; } /* Responsive: SOLO aquí pasamos a 1 columna */ @media (max-width:1024px){ #hx-faqs-hero .faq-wrap{ grid-template-columns:1fr; } #hx-faqs-hero .hx-faqs-figure{ min-height:320px; order:2; margin-top:8px; } } @media (max-width:640px){ #hx-faqs-hero .hx-faqs-figure{ min-height:240px; } } /* Limpiar cualquier fondo interno que añada Elementor dentro del hero */ #hx-gij-hero, #hx-gij-hero &gt; .elementor-container, #hx-gij-hero .elementor-container, #hx-gij-hero .e-con, #hx-gij-hero .elementor-background-overlay{ background: none !important; background-image: none !important; } /* HERO: recorta la capa de fondo y aplica parallax SOLO dentro */ #hx-gij-hero{ position: relative; overflow: hidden; /* &lt;— recorta el fondo al tamaño del hero */ min-height: 86vh; /* tu altura */ display: flex; align-items: center; } /* Fondo con parallax confinado al hero (NO más position: fixed) */ #hx-gij-hero::before{ content: &quot;&quot;; position: absolute; /* &lt;— queda “dentro” del hero y se recorta */ inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0,0,0,.44), rgba(0,0,0,.62)), url(&#039;https://gijon.humixlanding.com/wp-content/uploads/sites/39/2025/10/control_de_humedades_en_gijon_hero.webp;) center / cover no-repeat; /* Parallax real sin JS y recortado al hero */ background-attachment: fixed; will-change: background-position; } /* Móvil/tablet: la mayoría ignoran fixed, así que lo desactivamos */ @media (max-width: 1024px){ #hx-gij-hero::before{ background-attachment: scroll; } } /* (Opcional) por si alguna otra sección llevaba parallax global */ .section, .elementor-section{ background-attachment: scroll !important; } /* Layout de la sección FAQs */ #hx-faqs-hero .faq-wrap{ display:grid; grid-template-columns: 1fr 1fr; gap:24px; align-items:stretch; } /* La figura: asegura ALTURA y la imagen de fondo */ #hx-faqs-hero .hx-faqs-figure{ display:block; min-height: 420px; /* ← sin esto no se ve */ border-radius: 16px; background-image: url('IMAGE_URL'); /* ← pon aquí la URL de Gijón en https */ background-size: cover; background-position: center; background-repeat: no-repeat; box-shadow: 0 6px 24px rgba(0,0,0,.12); position: relative; isolation: isolate; } #hx-faqs-hero .hx-faqs-figure::after{ /* leve oscurecido para contraste */ content:""; position:absolute; inset:0; background:rgba(0,0,0,.08); border-radius: inherit; } /* Responsive */ @media (max-width: 1024px){ #hx-faqs-hero .faq-wrap{ grid-template-columns: 1fr; } #hx-faqs-hero .hx-faqs-figure{ min-height: 300px; } } /* Demo acordeón mínimo (opcional) */ #hx-faqs-hero .faq-fake{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; } #hx-faqs-hero .faq-fake .q{ width:100%; text-align:left; padding:12px 14px; border-radius:10px; background:#f4f6fa; border:1px solid #e6e9f2; font-weight:600; cursor:pointer; } #hx-faqs-hero .faq-fake .a{ padding:12px 14px 6px; color:#334155; } /* ===== FIX FAQs: usa una sola figura y URL correcta ===== */ #hx-faqs-hero .faq-wrap{ display:grid; gap:28px; align-items:stretch; grid-template-columns:1.25fr 1fr; } #hx-faqs-hero .hx-faqs-figure{ min-height:560px; border-radius:18px; box-shadow:0 30px 70px rgba(15,23,42,.18); background-image: linear-gradient(180deg,rgba(15,23,42,.45),rgba(15,23,42,.25)), url("https://gijon.humixlanding.com/wp-content/uploads/sites/39/2025/10/faqs_preguntas_frecuentes.webp"); background-size:cover; background-position:center; background-repeat:no-repeat; } @media (max-width:1024px){ #hx-faqs-hero .faq-wrap{ grid-template-columns:1fr; } #hx-faqs-hero .hx-faqs-figure{ min-height:320px; order:2; margin-top:8px; } } @media (max-width:640px){ #hx-faqs-hero .hx-faqs-figure{ min-height:240px; } } /* ===== FIX HERO: quita ; de la URL y fuerza https ===== */ #hx-gij-hero::before{ content:""; position:absolute; inset:0; z-index:-1; background: linear-gradient(180deg, rgba(0,0,0,.44), rgba(0,0,0,.62)), url("https://gijon.humixlanding.com/wp-content/uploads/sites/39/2025/10/control_de_humedades_en_gijon_hero.webp") center / cover no-repeat; background-attachment: fixed; } @media (max-width:1024px){ #hx-gij-hero::before{ background-attachment: scroll; } } #hx-nav:target { transform: translateY(0); } #hx-nav:target ~ .backdrop { opacity: 1; pointer-events: auto; } /* Oculta cualquier cabecera del tema Astra si quedara activa */ .site-header, .main-header-bar, .ast-primary-header-bar, .ast-above-header-bar, .ast-below-header-bar { display: none !important; visibility: hidden !important; } /* Sin rellenos extra del tema arriba */ .site-header .ast-container, .ast-container { padding-top: 0 !important; margin-top: 0 !important; }
:root{ --hx-h:64px; }
#hx-header{
  position:sticky; top:0; inset-inline:0; z-index:9999;
  background:#fff; border-bottom:1px solid #eef2f7; box-shadow:0 2px 8px rgba(0,0,0,.04);
}
body.admin-bar #hx-header{ top:32px; }
@media (max-width:782px){ body.admin-bar #hx-header{ top:46px; } }

#hx-header .inner{
  max-width:1320px; margin:auto; padding:0 16px; height:var(--hx-h);
  display:flex; align-items:center; gap:20px;
}
#hx-header .brand img{ height:40px; width:auto; display:block; }

/* Nav escritorio */
#hx-header .desk{ margin-left:auto; }
#hx-header .desk .menu{ display:flex; align-items:center; gap:20px; list-style:none; margin:0; padding:0; }
#hx-header .desk .menu a{ text-decoration:none; color:#0f172a; font-weight:500; }
#hx-header .desk .menu a.btn{
  padding:10px 14px; border-radius:999px; background:#FA1F02; color:#fff !important;
}

/* Burger (sin JS) */
#hx-header .burger{ display:none; margin-left:auto; width:40px; height:40px; position:relative; font-size:0; }
#hx-header .burger::before, #hx-header .burger::after, #hx-header .burger span{
  content:""; position:absolute; left:8px; right:8px; height:2px; background:#0f172a;
}
#hx-header .burger::before{ top:12px; }
#hx-header .burger span{ top:19px; }
#hx-header .burger::after{ bottom:12px; }

/* Drawer móvil por :target */
#hx-nav{ /* panel */
  position:fixed; inset:var(--hx-h) 0 0 auto; width:78%;
  max-width:360px; background:#fff; box-shadow:-12px 0 24px rgba(0,0,0,.18);
  transform:translateX(100%); transition:transform .25s ease; z-index:9999; padding:18px 16px;
}
#hx-nav .menu{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
#hx-nav a{ text-decoration:none; color:#0f172a; font-size:16px; font-weight:600; }
#hx-nav a.btn{ display:inline-block; padding:12px 14px; border-radius:999px; background:#FA1F02; color:#fff !important; }

/* Scrim para cerrar tocando fuera */
#hx-close{ /* overlay clicable */
  position:fixed; inset:var(--hx-h) 0 0 0; background:rgba(15,23,42,.38);
  opacity:0; pointer-events:none; transition:opacity .25s ease; z-index:9998;
}

/* Estado abierto (cuando #hx-nav es el :target) */
#hx-nav:target{ transform:none; }
#hx-nav:target ~ #hx-close{ opacity:1; pointer-events:auto; }

/* Responsive */
@media (max-width:1024px){
  :root{ --hx-h:60px; }
  #hx-header .desk{ display:none; }     /* oculta nav desktop en móvil */
  #hx-header .burger{ display:block; }  /* muestra hamburguesa */
}

/* Oculta menús del tema (Astra) para evitar duplicados */
.skip-link, .main-navigation, .site-navigation, .ast-mobile-header-wrap,
.ast-desktop-header-content, .ast-primary-header-bar, .ast-header-break-point .main-header-bar{
  display:none !important;
}
/* Altura y base */
:root{ --hx-h:64px; }
@media (max-width:1024px){ :root{ --hx-h:60px; } }

#hx-header{ position:sticky; top:0; z-index:9999; background:#0b2238; }
#hx-header .inner{ height:var(--hx-h); display:flex; align-items:center; gap:20px; padding:0 16px; }
#hx-header .brand img{ height:40px; width:auto; display:block; }

/* Escritorio visible, móvil oculto */
#hx-header .desk{ margin-left:auto; }
@media (max-width:1024px){
  #hx-header .desk{ display:none; }   /* &lt;-- clave */
  #hx-header .burger{ display:block; }
}

/* Burger */
#hx-header .burger{ display:none; margin-left:auto; width:40px; height:40px; position:relative; font-size:0; }
#hx-header .burger::before, #hx-header .burger::after, #hx-header .burger span{
  content:&quot;&quot;; position:absolute; left:8px; right:8px; height:2px; background:#fff;
}
#hx-header .burger::before{ top:12px; }
#hx-header .burger span{ top:19px; }
#hx-header .burger::after{ bottom:12px; }

/* Drawer móvil (derecha) */
#hx-nav{
  position:fixed; inset:var(--hx-h) 0 0 auto; width:78%; max-width:360px;
  background:#fff; transform:translateX(100%); transition:transform .25s ease;
  z-index:9999; padding:18px 16px; box-shadow:-12px 0 24px rgba(0,0,0,.18);
}
#hx-nav .menu{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
#hx-nav a{ color:#0f172a; text-decoration:none; font-weight:600; }
#hx-nav a.btn{ background:#FA1F02; color:#fff; padding:12px 14px; border-radius:999px; display:inline-block; }

/* Abrir/cerrar via :target */
#hx-close{
  position:fixed; inset:var(--hx-h) 0 0 0; background:rgba(15,23,42,.38);
  opacity:0; pointer-events:none; transition:opacity .25s ease; z-index:9998;
}
#hx-nav:target{ transform:none; }
#hx-nav:target ~ #hx-close{ opacity:1; pointer-events:auto; }

/* Evitar que Astra pinte nada por detrás */
.ast-mobile-header-wrap,
.ast-desktop-header-content,
.ast-primary-header-bar,
.main-header-bar,
.site-header{ display:none !important; }

/* El botón flotante de WhatsApp no debe tapar el menú */
.whatsapp-float, .wa__btn_w2, .wa__btn_popup { pointer-events:auto; z-index:99999; }
#hx-nav, #hx-header { z-index:100000; } /* header y drawer por encima */
/* --- HAMBURGUESA VISIBLE --- */
#hx-header .burger{
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; margin-left:auto;
  position:relative; color:#fff; background:transparent;
  border:1px solid rgba(255,255,255,.25); border-radius:999px;
}

#hx-header .burger::before,
#hx-header .burger::after,
#hx-header .burger span{
  content:&quot;&quot;; position:absolute; left:50%; transform:translateX(-50%);
  width:22px; height:3px; background:currentColor; border-radius:2px;
}

/* barra central */
#hx-header .burger span{ top:50%; margin-top:-1.5px; }
/* barra superior e inferior */
#hx-header .burger::before{ top:12px; }
#hx-header .burger::after{ bottom:12px; }

/* asegúrate de que se muestre encima de todo */
#hx-header .burger{ z-index:100001; }
/* Ocultar burger en escritorio */
@media (min-width:1025px){
  #hx-header .burger{ display:none !important; }
}
/* --- FAQ base --- */
.faq-wrap{ display:grid; gap:24px; align-items:start; }
.faq-fake{ list-style:none; margin:0; padding:0; }
.faq-fake li{ border-bottom:1px solid #e9eef4; padding:12px 0; }

/* Botón de pregunta */
.faq-fake .q{
  display:flex; align-items:center; justify-content:space-between;
  width:100%; text-align:left; background:none; border:0; padding:10px 0;
  font:600 16px/1.3 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color:#0f172a; cursor:pointer;
}
.faq-fake .q::after{
  content:"+"; font-weight:700; margin-left:12px; transition:transform .2s ease;
}

/* Respuesta cerrada por defecto */
.faq-fake .a{
  max-height:0; overflow:hidden; opacity:0;
  transition:max-height .25s ease, opacity .25s ease;
  color:#334155; padding-right:4px;
}

/* Abierta al enfocar el bloque (CSS-only) */
.faq-fake li:focus-within .a{
  max-height:400px; opacity:1;
}
.faq-fake li:focus-within .q::after{
  content:"–"; transform:rotate(0);
}

/* Accesibilidad al navegar con teclado */
.faq-fake .q:focus-visible{
  outline:2px solid #9DBBE5; outline-offset:2px;
}/* End custom CSS */