/*
Theme Name: Hello Biz Child
Theme URI: https://elementor.com/products/hello-biz/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-biz
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Biz is a free, user-friendly Hybrid WordPress Theme that was crafted for seamless integration with the Elementor site builder and tailored specifically for business websites. Perfect for beginners, but far from limited to just them, it features a dedicated beginner-oriented “Home” screen to simplify and streamline the web-building process. Hello Biz also integrates with Elementor’s premium features, giving you access to tools like AI, and accessibility enhancements in one place. Whether launching a startup site or refining a company portfolio, Hello Biz offers a solid, responsive foundation for all web creators. Report security bugs through the Patchstack Vulnerability Disclosure Program. The Patchstack team validates, triages, and handles vulnerabilities. Report here: https://patchstack.com/database/wordpress/theme/hello-biz/vdp.
Tags: flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready,style-variations
Version: 1.1.1.1754904426
Updated: 2025-08-11 11:27:06
*/

/*MENU PC*/
/* CONTENEDOR: fila 1 (top) + fila 2 (paneles) */
.contenedor-maximo-menus .contenedor-menus{
  display: grid;
  grid-template-columns: 33% 33% 33%;
  grid-template-areas:
    "principal principal principal"
    "segundo   tercero    cuarto";
  row-gap: 0px;
  column-gap: 0px;
  align-items: start;
  justify-content: start; /* reparte el sobrante */
}

/* Fila 1: el top ocupa todo (span de 1 a -1) */
.menu-principal{ grid-area: principal; grid-column: 1 / -1; }

/* Fila 2: cada panel en su celda */
.segundo-menu{ grid-area: segundo;}
.tercer-menu { grid-area: tercero;}
.cuarto-menu { grid-area: cuarto;}


/* ===== BASE DE TU MENÚ ===== */
.flyout-menu .elementor-nav-menu--main .menu-item-has-children { position: relative; }
.flyout-menu .elementor-nav-menu a { padding: 20px 0 !important; }
.flyout-menu .elementor-nav-menu--layout-horizontal .elementor-nav-menu { column-gap: 1em; }
.elementor-item {
  /*border-bottom: 1px solid transparent;*/
  padding-bottom: 5px !important; /* FIX: faltaba ; */
  /*padding-left: 0 !important;*/
}

.elementor-nav-menu--main.elementor-nav-menu__container.elementor-nav-menu--layout-vertical.e--pointer-none .elementor-item {
  color: #172A26 !important;
  opacity: .5;
  padding-left: 0 !important;
}
.elementor-nav-menu--main.elementor-nav-menu__container.elementor-nav-menu--layout-vertical.e--pointer-none .elementor-item:hover {
  color: #172A26 !important;
  opacity: 1;
}

/* ===== ESTILOS DE LA COLUMNA IZQ DEL 2º (línea sin “brinco”) ===== */
.contenedor-maximo-menus .segundo-menu .elementor-item{ border:0 !important; }
.contenedor-maximo-menus .segundo-menu .elementor-nav-menu > li > a,
.contenedor-maximo-menus .tercer-menu .elementor-nav-menu > li > a {
  flex:1 1 auto;
  display:flex;
  position:relative;
  padding:.4rem 0 .65rem;
  justify-content: space-between;
}
.contenedor-maximo-menus .segundo-menu .elementor-nav-menu > .js-open-third > a::after,
.contenedor-maximo-menus .tercer-menu .elementor-nav-menu > .js-open-fourth > a::after{
  content:">";
  position:relative;
  height:auto;
  padding-right: 1em;
  opacity:0;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .18s ease;
}
.contenedor-maximo-menus .segundo-menu .elementor-nav-menu > li > a:hover::after,
.contenedor-maximo-menus .tercer-menu .elementor-nav-menu > li > a:hover::after{
  transform:scaleX(1) !important;
  opacity: 1;
}
.contenedor-maximo-menus .segundo-menu .elementor-nav-menu > li > a::before{
  content:none !important; opacity:1 !important; transform:none !important; transition:none !important;
}

/* =====================
   ESTADOS CRUZADOS MENÚ (con clases estables)
   ===================== */

/* Parche anti-salto: reserva el subrayado por defecto en TOP */
.menu--top .js-open-second--hobby > a,
.menu--top .js-open-second--profesional > a {
  border-bottom: 1px solid transparent !important;
  transition: border-color .15s ease;
}

/* ===== HOBBY ===== */

/* 1º nivel: subrayar item HOBBY al hover propio */
.menu--top .js-open-second--hobby:hover > a,
.menu--top .js-open-second--hobby > a:hover {
  border-bottom: 1px solid currentColor !important;
}

/* Mantener subrayado HOBBY mientras navegas por su 2º/3º */
.contenedor-menus:has(.menu--2-hobby:hover)  .menu--top .js-open-second--hobby > a,
.contenedor-menus:has(.menu--2-hobby:focus-within)  .menu--top .js-open-second--hobby > a,
.contenedor-menus:has(.menu--3-sustratos:hover) .menu--top .js-open-second--hobby > a,
.contenedor-menus:has(.menu--3-sustratos:focus-within) .menu--top .js-open-second--hobby > a {
  border-bottom: 1px solid currentColor !important;
}

/* 3º → 2º (Hobby): Sustratos (tercero) activa su item en el segundo */
.contenedor-menus:has(.menu--3-sustratos:hover)        .menu--2-hobby .js-open-third--sustratos > a,
.contenedor-menus:has(.menu--3-sustratos:focus-within) .menu--2-hobby .js-open-third--sustratos > a {
  opacity: 1 !important;
}
.contenedor-menus:has(.menu--3-sustratos:hover)        .menu--2-hobby .js-open-third--sustratos > a::after,
.contenedor-menus:has(.menu--3-sustratos:focus-within) .menu--2-hobby .js-open-third--sustratos > a::after,
.contenedor-menus:has(.menu--3-sustratos:hover)        .menu--2-hobby .js-open-third--sustratos::after,
.contenedor-menus:has(.menu--3-sustratos:focus-within) .menu--2-hobby .js-open-third--sustratos::after {
  opacity: 1 !important;
  transform: scaleX(1) !important;
}

/* ===== PROFESIONAL ===== */

/* 1º nivel: subrayar PROFESIONAL al hover propio */
.menu--top .js-open-second--profesional:hover > a,
.menu--top .js-open-second--profesional > a:hover {
  border-bottom: 1px solid currentColor !important;
}

/* Mantener subrayado PROFESIONAL mientras navegas por 2º/3º/4º */
.contenedor-menus:has(.menu--2-pro:hover)            .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--2-pro:focus-within)     .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--3-agricultura:hover)    .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--3-agricultura:focus-within) .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--3-jardineria:hover)     .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--3-jardineria:focus-within)  .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--3-verd:hover)           .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--3-verd:focus-within)    .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--4-abonos:hover)         .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--4-abonos:focus-within)  .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--4-sustratos:hover)      .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--4-sustratos:focus-within)   .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--4-tierras:hover)        .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--4-tierras:focus-within) .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--4-valoracion:hover)     .menu--top .js-open-second--profesional > a,
.contenedor-menus:has(.menu--4-valoracion:focus-within)  .menu--top .js-open-second--profesional > a {
  border-bottom: 1px solid currentColor !important;
}

/* --- CUARTO → TERCERO (Pro) --- */

/* Abonos (4º) → activa su item en 3º (Agricultura) */
.contenedor-menus:has(.menu--4-abonos:hover)        .menu--3-agricultura .js-open-fourth--abonos > a,
.contenedor-menus:has(.menu--4-abonos:focus-within) .menu--3-agricultura .js-open-fourth--abonos > a {
  opacity: 1 !important;
}
.contenedor-menus:has(.menu--4-abonos:hover)        .menu--3-agricultura .js-open-fourth--abonos > a::after,
.contenedor-menus:has(.menu--4-abonos:focus-within) .menu--3-agricultura .js-open-fourth--abonos > a::after,
.contenedor-menus:has(.menu--4-abonos:hover)        .menu--3-agricultura .js-open-fourth--abonos::after,
.contenedor-menus:has(.menu--4-abonos:focus-within) .menu--3-agricultura .js-open-fourth--abonos::after {
  opacity: 1 !important;
  transform: scaleX(1) !important;
}

/* Sustratos (4º) → activa su item en 3º (Agricultura) */
.contenedor-menus:has(.menu--4-sustratos:hover)        .menu--3-agricultura .js-open-fourth--sustratos > a,
.contenedor-menus:has(.menu--4-sustratos:focus-within) .menu--3-agricultura .js-open-fourth--sustratos > a {
  opacity: 1 !important;
}
.contenedor-menus:has(.menu--4-sustratos:hover)        .menu--3-agricultura .js-open-fourth--sustratos > a::after,
.contenedor-menus:has(.menu--4-sustratos:focus-within) .menu--3-agricultura .js-open-fourth--sustratos > a::after,
.contenedor-menus:has(.menu--4-sustratos:hover)        .menu--3-agricultura .js-open-fourth--sustratos::after,
.contenedor-menus:has(.menu--4-sustratos:focus-within) .menu--3-agricultura .js-open-fourth--sustratos::after {
  opacity: 1 !important;
  transform: scaleX(1) !important;
}

/* Tierras de jardinería (4º) → activa en 3º (Jardinería) */
.contenedor-menus:has(.menu--4-tierras:hover)        .menu--3-jardineria .js-open-fourth--tierras > a,
.contenedor-menus:has(.menu--4-tierras:focus-within) .menu--3-jardineria .js-open-fourth--tierras > a {
  opacity: 1 !important;
}
.contenedor-menus:has(.menu--4-tierras:hover)        .menu--3-jardineria .js-open-fourth--tierras > a::after,
.contenedor-menus:has(.menu--4-tierras:focus-within) .menu--3-jardineria .js-open-fourth--tierras > a::after,
.contenedor-menus:has(.menu--4-tierras:hover)        .menu--3-jardineria .js-open-fourth--tierras::after,
.contenedor-menus:has(.menu--4-tierras:focus-within) .menu--3-jardineria .js-open-fourth--tierras::after {
  opacity: 1 !important;
  transform: scaleX(1) !important;
}

/* Valoración de residuos (4º) → activa en 3º (Verd) */
.contenedor-menus:has(.menu--4-valoracion:hover)        .menu--3-verd .js-open-fourth--valoracion > a,
.contenedor-menus:has(.menu--4-valoracion:focus-within) .menu--3-verd .js-open-fourth--valoracion > a {
  opacity: 1 !important;
}
.contenedor-menus:has(.menu--4-valoracion:hover)        .menu--3-verd .js-open-fourth--valoracion > a::after,
.contenedor-menus:has(.menu--4-valoracion:focus-within) .menu--3-verd .js-open-fourth--valoracion > a::after,
.contenedor-menus:has(.menu--4-valoracion:hover)        .menu--3-verd .js-open-fourth--valoracion::after,
.contenedor-menus:has(.menu--4-valoracion:focus-within) .menu--3-verd .js-open-fourth--valoracion::after {
  opacity: 1 !important;
  transform: scaleX(1) !important;
}

/* --- TERCERO → SEGUNDO (Pro) --- */

/* Agricultura (3º) → activa su item en 2º; también cuando estás en Sustratos/Abonos (4º) */
.contenedor-menus:has(.menu--3-agricultura:hover)     .menu--2-pro .js-open-third--agricultura > a,
.contenedor-menus:has(.menu--3-agricultura:focus-within) .menu--2-pro .js-open-third--agricultura > a,
.contenedor-menus:has(.menu--4-sustratos:hover)       .menu--2-pro .js-open-third--agricultura > a,
.contenedor-menus:has(.menu--4-sustratos:focus-within)   .menu--2-pro .js-open-third--agricultura > a,
.contenedor-menus:has(.menu--4-abonos:hover)          .menu--2-pro .js-open-third--agricultura > a,
.contenedor-menus:has(.menu--4-abonos:focus-within)   .menu--2-pro .js-open-third--agricultura > a {
  opacity: 1 !important;
}
.contenedor-menus:has(.menu--3-agricultura:hover)     .menu--2-pro .js-open-third--agricultura > a::after,
.contenedor-menus:has(.menu--3-agricultura:focus-within) .menu--2-pro .js-open-third--agricultura > a::after,
.contenedor-menus:has(.menu--4-sustratos:hover)       .menu--2-pro .js-open-third--agricultura > a::after,
.contenedor-menus:has(.menu--4-sustratos:focus-within)   .menu--2-pro .js-open-third--agricultura > a::after,
.contenedor-menus:has(.menu--4-abonos:hover)          .menu--2-pro .js-open-third--agricultura > a::after,
.contenedor-menus:has(.menu--4-abonos:focus-within)   .menu--2-pro .js-open-third--agricultura > a::after,
.contenedor-menus:has(.menu--3-agricultura:hover)     .menu--2-pro .js-open-third--agricultura::after,
.contenedor-menus:has(.menu--3-agricultura:focus-within) .menu--2-pro .js-open-third--agricultura::after,
.contenedor-menus:has(.menu--4-sustratos:hover)       .menu--2-pro .js-open-third--agricultura::after,
.contenedor-menus:has(.menu--4-sustratos:focus-within)   .menu--2-pro .js-open-third--agricultura::after,
.contenedor-menus:has(.menu--4-abonos:hover)          .menu--2-pro .js-open-third--agricultura::after,
.contenedor-menus:has(.menu--4-abonos:focus-within)   .menu--2-pro .js-open-third--agricultura::after {
  opacity: 1 !important;
  transform: scaleX(1) !important;
}

/* Jardinería (3º) → 2º */
.contenedor-menus:has(.menu--3-jardineria:hover)        .menu--2-pro .js-open-third--jardineria > a,
.contenedor-menus:has(.menu--3-jardineria:focus-within) .menu--2-pro .js-open-third--jardineria > a,
.contenedor-menus:has(.menu--4-tierras:hover)           .menu--2-pro .js-open-third--jardineria > a,
.contenedor-menus:has(.menu--4-tierras:focus-within)    .menu--2-pro .js-open-third--jardineria > a {
  opacity: 1 !important;
}
.contenedor-menus:has(.menu--3-jardineria:hover)        .menu--2-pro .js-open-third--jardineria > a::after,
.contenedor-menus:has(.menu--3-jardineria:focus-within) .menu--2-pro .js-open-third--jardineria > a::after,
.contenedor-menus:has(.menu--4-tierras:hover)           .menu--2-pro .js-open-third--jardineria > a::after,
.contenedor-menus:has(.menu--4-tierras:focus-within)    .menu--2-pro .js-open-third--jardineria > a::after,
.contenedor-menus:has(.menu--3-jardineria:hover)        .menu--2-pro .js-open-third--jardineria::after,
.contenedor-menus:has(.menu--3-jardineria:focus-within) .menu--2-pro .js-open-third--jardineria::after,
.contenedor-menus:has(.menu--4-tierras:hover)           .menu--2-pro .js-open-third--jardineria::after,
.contenedor-menus:has(.menu--4-tierras:focus-within)    .menu--2-pro .js-open-third--jardineria::after {
  opacity: 1 !important;
  transform: scaleX(1) !important;
}

/* Verd (3º) → 2º */
.contenedor-menus:has(.menu--3-verd:hover)        .menu--2-pro .js-open-third--verd > a,
.contenedor-menus:has(.menu--3-verd:focus-within) .menu--2-pro .js-open-third--verd > a,
.contenedor-menus:has(.menu--4-valoracion:hover)  .menu--2-pro .js-open-third--verd > a,
.contenedor-menus:has(.menu--4-valoracion:focus-within) .menu--2-pro .js-open-third--verd > a {
  opacity: 1 !important;
}
.contenedor-menus:has(.menu--3-verd:hover)        .menu--2-pro .js-open-third--verd > a::after,
.contenedor-menus:has(.menu--3-verd:focus-within) .menu--2-pro .js-open-third--verd > a::after,
.contenedor-menus:has(.menu--4-valoracion:hover)  .menu--2-pro .js-open-third--verd > a::after,
.contenedor-menus:has(.menu--4-valoracion:focus-within) .menu--2-pro .js-open-third--verd > a::after,
.contenedor-menus:has(.menu--3-verd:hover)        .menu--2-pro .js-open-third--verd::after,
.contenedor-menus:has(.menu--3-verd:focus-within) .menu--2-pro .js-open-third--verd::after,
.contenedor-menus:has(.menu--4-valoracion:hover)  .menu--2-pro .js-open-third--verd::after,
.contenedor-menus:has(.menu--4-valoracion:focus-within) .menu--2-pro .js-open-third--verd::after {
  opacity: 1 !important;
  transform: scaleX(1) !important;
}

/* =====================
   FIN ESTADOS CRUZADOS
   ===================== */


/* ===== PANELES “JS” (ocultos por defecto + anular nativo en triggers) ===== */
.contenedor-maximo-menus .segundo-menu,
.contenedor-maximo-menus .tercer-menu,
.contenedor-maximo-menus .cuarto-menu{ display:none; }

.menu-principal li.js-open-second > .sub-menu,
.menu-principal a.js-open-second + .sub-menu{ display:none !important; visibility:hidden !important; }
.segundo-menu li.js-open-third > .sub-menu,
.segundo-menu a.js-open-third + .sub-menu{ display:none !important; visibility:hidden !important; }
.tercer-menu li.js-open-fourth > .sub-menu,
.tercer-menu a.js-open-fourth + .sub-menu{ display:none !important; visibility:hidden !important; }

/*Selector idiomes*/
.selector-idiomas .wpml-ls-legacy-list-horizontal {
  padding: 1.25rem 0 !important;
}
.wpml-ls-link {
	padding-bottom: 0 !important;
}
.wpml-ls-link:hover {
  opacity: 0.5;
	padding-bottom: 0 !important;
}
/*****************NUEVO MENU*********************/
/* =========================
   UTILIDADES / RESET
========================= */
.of-v, .of-v > div { overflow: visible !important; flex-wrap: nowrap;
  display: flex;}
.elementor-section, .elementor-container,
.elementor-widget, .elementor-widget-container { overflow: visible; }

/* =========================
   CONTEXTO DEL MENÚ (6 columnas)
========================= */
.menu-top{
  position: relative;
  z-index: 20;
  display: grid; /* FIX: necesario para que grid-template-columns aplique */
  --cols: 6;      /* nº de columnas del menú */
  --gap: 0em;     /* FIX: las custom properties no aceptan !important */
  grid-template-columns: 13% 20% 24% 17% 12% 18% !important;/*13% 20% 24% 17% 12% 18% !important*/
  column-gap: var(--gap) !important; /* FIX: usa la variable declarada */
}
.menu-top > .menu-item{ position: static; overflow: visible; }
.menu-top > .menu-item.col-1 { --i: 1; }
.menu-top > .menu-item.col-2 { --i: 2; }
.menu-top > .menu-item.col-3 { --i: 3; }
.menu-top > .menu-item.col-4 { --i: 4; }
.menu-top > .menu-item.col-5 { --i: 5; }
.menu-top > .menu-item.col-6 { --i: 6; }

/* =========================
   MEGA (fondo 100vw + contenido alineado al grid del menú)
========================= */
.menu-top > .menu-item > .mega-submenu{
  position: absolute;
  top: 100%;
  left: 0;               /* ocupa todo el ancho del .menu-top */
  right: 0;

  /* el grid real lo definimos en .mega-inner */
  padding: 0;
  background: transparent; border: 0; box-shadow: none;

  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
  z-index: 999;
  isolation: isolate;     /* asegura z-index para ::before */
}

/* Fondo full-bleed a 100vw (no afecta al layout) */
.menu-top > .menu-item > .mega-submenu::before{
  content:"";
  position:absolute; top:0; bottom:0;
  left:58%;
  width:110vw;                   /* banda a banda */
  transform: translateX(-50%);   /* centra respecto al viewport */
  background: rgba(255,255,255,.98);
  pointer-events: none;
  z-index: -1;
}

/* =========================
   WRAPPER INTERNO: GRIDs REALES DEL MEGA
========================= */
.mega-submenu > .mega-inner{
  display: grid;
  grid-template-columns: 13% 20% 24% 17% 12% 18%; /*repeat(var(--cols), minmax(0,1fr));  13% 20% 24% 17% 12% 18%*/
  column-gap: 0 !important;
  row-gap: 1em !important;
  width: 100%;
  margin: 0;
  padding: 0;  /* si el header no tiene padding, puedes dejar 0 */
}
.mega-submenu > .mega-inner > .sublist-col,
.mega-submenu > .mega-inner > .submenu-panel{
  min-width: 0;
  /*white-space: normal;
  overflow-wrap: anywhere;*/
}

/* La lista cae bajo la columna del item */
.mega-submenu > .mega-inner > .sublist-col{
  grid-column: var(--i);
}

/* Paneles desde la siguiente columna (i+1) hasta el final */
.menu-top > .menu-item.col-1 > .mega-submenu { --panels-start: 2; }
.menu-top > .menu-item.col-2 > .mega-submenu { --panels-start: 3; }
.menu-top > .menu-item.col-3 > .mega-submenu { --panels-start: 4; }
.menu-top > .menu-item.col-4 > .mega-submenu { --panels-start: 5; }
.menu-top > .menu-item.col-5 > .mega-submenu { --panels-start: 6; }
.menu-top > .menu-item.col-6 > .mega-submenu { --panels-start: 7; } /* fuera de rango => final */

.mega-submenu > .mega-inner > .submenu-panel{
  grid-column: var(--panels-start) / -1;
  display: none;
}

/* =========================
   NIVEL 2 (mostrar panel por trigger)
========================= */
/* Sustratos (Hobby) */
.submenu-hobby:has(.sublist-col .submenu-trigger.key-sustratos:hover) .submenu-sustratos,
.submenu-hobby:has(.sublist-col .submenu-trigger.key-sustratos:focus) .submenu-sustratos,
.submenu-hobby .submenu-sustratos:hover{ display: grid; column-gap: 0;}

/* Agricultura */
.submenu-pro:has(.sublist-col .submenu-trigger.key-agricultura:hover) .submenu-agricultura,
.submenu-pro:has(.sublist-col .submenu-trigger.key-agricultura:focus) .submenu-agricultura,
.submenu-pro .submenu-agricultura:hover{ display: grid; column-gap: 0; }

/* Verd Recycling */
.submenu-pro:has(.sublist-col .submenu-trigger.key-verdrecycling:hover) .submenu-verdrecycling,
.submenu-pro:has(.sublist-col .submenu-trigger.key-verdrecycling:focus) .submenu-verdrecycling,
.submenu-pro .submenu-verdrecycling:hover{
  display: grid;  /* o block si tu panel es 1 columna */
  column-gap: 0;
}

/* Jardinería */
.submenu-pro:has(.sublist-col .submenu-trigger.key-jardineria:hover) .submenu-jardineria,
.submenu-pro:has(.sublist-col .submenu-trigger.key-jardineria:focus) .submenu-jardineria,
.submenu-pro .submenu-jardineria:hover{
  display: grid;
  column-gap: 0;
}

/* =========================
   NIVEL 3 (dentro de .submenu-agricultura)
========================= */
.submenu-agricultura{
  display: grid;
  grid-template-columns: 1fr 2fr;  /* lista / contenido */
  gap: 0rem;
}
.submenu-agricultura > .sublist-col{ grid-column: 1; min-width: 0; }
.submenu-agricultura > .submenu-panel{ grid-column: 2; display: none; min-width: 0; }

/* Sustratos */
.submenu-agricultura:has(.sublist-col .submenu-trigger.key-sustratos:hover) .submenu-sustratos,
.submenu-agricultura:has(.sublist-col .submenu-trigger.key-sustratos:focus) .submenu-sustratos,
.submenu-agricultura .submenu-sustratos:hover{ display: block; }

/* Abonos */
.submenu-agricultura:has(.sublist-col .submenu-trigger.key-abonos:hover) .submenu-abonos,
.submenu-agricultura:has(.sublist-col .submenu-trigger.key-abonos:focus) .submenu-abonos,
.submenu-agricultura .submenu-abonos:hover{ display: block; }

/* Mostrar paneles de nivel 2 en Profesional */
.submenu-pro:has(.sublist-col .submenu-trigger.key-verdrecycling:hover) .submenu-verdrecycling{ display:grid;  column-gap: 0;}
.submenu-pro:has(.sublist-col .submenu-trigger.key-jardineria:hover) .submenu-jardineria{ display:grid;  column-gap: 0;}

/* Estructura interna de cada panel con subnivel (lista izq. + contenido dcha.) */
.submenu-verdrecycling, .submenu-jardineria{
  display:grid; grid-template-columns: 1fr 2fr; gap: 0rem;
}

/* Verd Recycling: nivel 3 */
.submenu-verdrecycling > .sublist-col{ grid-column:1; }
.submenu-verdrecycling > .submenu-panel{ grid-column:2; display:none; }
.submenu-verdrecycling:has(.sublist-col .submenu-trigger.key-valoracionderesiduos:hover) .submenu-valoracionderesiduos{ display:block; }

/* Jardinería: nivel 3 */
.submenu-jardineria > .sublist-col{ grid-column:1; }
.submenu-jardineria > .submenu-panel{ grid-column:2; display:none; }
.submenu-jardineria:has(.sublist-col .submenu-trigger.key-tierrasdejardineria:hover) .submenu-tierrasdejardineria{ display:block; }

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 1024px){
  .menu-top > .menu-item > .mega-submenu{
    position: static; left: 0; right: 0;
    opacity: 1; visibility: visible; transform: none;
    border: 0; box-shadow: none;
  }
  .mega-submenu > .mega-inner{
    grid-template-columns: 1fr;
    column-gap: 0; row-gap: 1rem;
    padding-inline: 0;
  }
  .mega-submenu > .mega-inner > .submenu-panel{ display: block; grid-column: 1; }
  .submenu-agricultura{ grid-template-columns: 1fr; }
}
/* Quita los cortes agresivos */
.mega-submenu *{
  word-break: normal;
  overflow-wrap: normal;
  hyphens: auto;
}
/* Paneles de nivel 2: lista izq. (ancho por contenido) + contenido dcha. flexible */
.submenu-agricultura,
.submenu-verdrecycling,
.submenu-jardineria{
  /* ancho mínimo de la lista = 14rem, y puede crecer hasta lo que mida el texto */
  grid-template-columns: minmax(14rem, max-content) minmax(0, 1fr);
  column-gap: 2rem;
}

/* No partas líneas en la columna de lista */
.submenu-agricultura  > .sublist-col,
.submenu-verdrecycling > .sublist-col,
.submenu-jardineria   > .sublist-col{
  white-space: nowrap;
}

/* (opcional) móvil */
@media (max-width:1024px){
  .submenu-hobby > .mega-inner{ flex-direction: column !important; }
  .submenu-hobby > .mega-inner > .sublist-col{ white-space: normal; width: auto !important; }
}


/*NUEVO*/
/* ===== Estados controlados por jQuery ===== */
.menu-top .mega-submenu{
  opacity: 0; visibility: hidden; transform: translateY(8px);
  pointer-events: none; transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.menu-top .menu-item.is-open > .mega-submenu{
  opacity: 1; visibility: visible; transform: none; pointer-events: auto;
}

/* Los paneles nacen ocultos */
.mega-submenu .submenu-panel{ display: none; }

/* Cuando jQuery añade .is-open, mostramos según data-show */
.mega-submenu .submenu-panel.is-open[data-show="grid"]{ display: grid; }
.mega-submenu .submenu-panel.is-open[data-show="block"]{ display: block; }

/* Atenuar / resaltar items de listas izquierdas */
.mega-submenu .sublist-col > .elementor-widget{ opacity: .5; transition: opacity .15s ease; }
.mega-submenu .sublist-col > .elementor-widget:hover,
.mega-submenu .sublist-col > .elementor-widget.is-active{ opacity: 1; }

/* Subrayado del item TOP abierto (vale para botón o texto) */
.menu-top .menu-item .menu-link .elementor-button,
.menu-top .menu-item .menu-link .elementor-widget-container > p{
  border-bottom: 1px solid transparent;
}
.menu-top .menu-item.is-open .menu-link .elementor-button,
.menu-top .menu-item.is-open .menu-link .elementor-widget-container > p{
  border-bottom-color: currentColor;
}

/* Flechita pegada al texto cuando el trigger está activo o hover */
.submenu-trigger .elementor-widget-container{
  display: inline-flex; align-items: center;
}
.submenu-trigger .elementor-widget-container::after{
  content: ""; /* apagada por defecto */
}
.submenu-trigger.is-active .elementor-widget-container::after,
.submenu-trigger:hover .elementor-widget-container::after{
  content: "›"; margin-left: .35ch; line-height: 1; /* pegadita al texto */
}
/*NUEVOOO - HOVERS MENU*/
/* Subrayado para TODOS los items del TOP (tengan o no mega) */

/* nada de subrayado nativo */
.menu-top .menu-link a{ text-decoration:none; }

/* el “texto” del item (sirve para botón o <p>) */
.menu-top .menu-item .menu-link :is(.elementor-button-text, p){
  position:relative;
  display:inline-block;
  padding-bottom:.35rem;
  opacity:1;
  transition:opacity .15s ease;
}

/* la línea del subrayado */
.menu-top .menu-item .menu-link :is(.elementor-button-text, p)::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:1px;
  background: currentColor;     /* usa el color del texto */
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .18s ease;
}

/* Mostrar la línea (y subir opacidad):
   - hover/focus del item (funciona para todos)
   - cuando el mega está abierto (.is-open)
   - y opcionalmente cuando ese item es la página actual (WP) */
.menu-top > .menu-item:hover .menu-link :is(.elementor-button-text, p),
.menu-top > .menu-item:focus-within .menu-link :is(.elementor-button-text, p),
.menu-top > .menu-item.is-open .menu-link :is(.elementor-button-text, p),
.menu-top > .menu-item.current-menu-item .menu-link :is(.elementor-button-text, p),
.menu-top > .menu-item.current_page_item .menu-link :is(.elementor-button-text, p),
.menu-top > .menu-item.current-menu-ancestor .menu-link :is(.elementor-button-text, p){
  opacity:1;
}
.menu-top > .menu-item:hover .menu-link :is(.elementor-button-text, p)::after,
.menu-top > .menu-item:focus-within .menu-link :is(.elementor-button-text, p)::after,
.menu-top > .menu-item.is-open .menu-link :is(.elementor-button-text, p)::after,
.menu-top > .menu-item.current-menu-item .menu-link :is(.elementor-button-text, p)::after,
.menu-top > .menu-item.current_page_item .menu-link :is(.elementor-button-text, p)::after,
.menu-top > .menu-item.current-menu-ancestor .menu-link :is(.elementor-button-text, p)::after{
  transform:scaleX(1);
}

/*Todos los items del mismo color*/
/* ===== Opacidad en paneles de contenido (lado derecho) ===== */
/* Por defecto atenuados */
.mega-submenu .submenu-panel > .elementor-widget{
  opacity: .59;
  transition: opacity .18s ease;
}

/* En hover/focus suben a 1 */
.mega-submenu .submenu-panel > .elementor-widget:hover,
.mega-submenu .submenu-panel > .elementor-widget:focus,
.mega-submenu .submenu-panel > .elementor-widget:focus-within{
  opacity: 1;
}

/* (Opcional) igualamos la opacidad de la lista izquierda y respetamos el activo */
.mega-submenu .sublist-col > .elementor-widget{
  opacity: .59;
  transition: opacity .18s ease;
}
.mega-submenu .sublist-col > .elementor-widget.is-active,
.mega-submenu .sublist-col > .elementor-widget:hover,
.mega-submenu .sublist-col > .elementor-widget:focus-within{
  opacity: 1;
}
/*flecha en items con submenu*/
/* El ítem que despliega submenú pasa a flex */
.mega-submenu .sublist-col > .submenu-trigger{
  display: inline-flex;          /* no ocupa todo el ancho de la columna */
  align-items: center;
  gap: 2em;                    /* separación texto–flecha */
}

/* Elementor mete <p> con margen: quítalo para centrar mejor */
.mega-submenu .sublist-col > .submenu-trigger > p{ margin: 0; }

/* La flecha como segundo ítem flex */
.mega-submenu .sublist-col > .submenu-trigger::after{
  content: "›";
  display: block;                /* para que sea ítem flex */
  flex: 0 0 auto;
  line-height: 1;
  opacity: 0;
  transition: opacity .18s ease;
  pointer-events: none;
		font-size: 1.3em;
}

/* Activa (hover o cuando el JS dejó .is-active) */
.mega-submenu .sublist-col > .submenu-trigger:hover::after,
.mega-submenu .sublist-col > .submenu-trigger.is-active::after{
  opacity: 1;
}

/*Separacioin grid submenus*/
/* Gutter lateral entre la lista (izq.) y el contenido (dcha.) en TODOS los niveles */
:root{ --panel-gap: 2em; } /* cambia aquí el tamaño si quieres */

.mega-submenu > .mega-inner > .submenu-panel,
.submenu-agricultura > .submenu-panel,
.submenu-verdrecycling > .submenu-panel,
.submenu-jardineria > .submenu-panel{
  padding-left: var(--panel-gap) !important;
  box-sizing: border-box;          /* que el padding no rompa anchos */
}

/* Ajuste opcional: por si el primer elemento del panel tiene margen superior */
.mega-submenu .submenu-panel > *:first-child{ margin-top: 0; }
.mega-inner {
	padding: 1em 0 2em 0 !important;
}

/*Repartición vertical items submenus*/
/* Lista izquierda: apila arriba, sin estirar a toda la altura */
.mega-submenu .sublist-col{
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;  /* quita el space-between */
  align-content: flex-start !important;
}



/* ——— UNIFICAR HOBBY Y PROFESIONAL ——— */

/* 1) Reset al width:100% que añade Elementor dentro del mega  */
.mega-submenu > .mega-inner > .e-con {
  width: auto !important;
  max-width: none !important;
}



/* 3) (Opcional pero recomendado) Misma “pareja” lista/Panel para todos los subniveles
      con la misma lógica que ya usas en Profesional (.submenu-agricultura, etc.). 
      Esto NO cambia el alineado al grid de arriba, sólo define su interior: */
.submenu-hobby,
.submenu-agricultura,
.submenu-verdrecycling,
.submenu-jardineria{
  display: grid;
  grid-template-columns: minmax(18rem, max-content) minmax(0, 1fr);
  column-gap: 2rem;
}
.submenu-hobby > .sublist-col,
.submenu-agricultura > .sublist-col,
.submenu-verdrecycling > .sublist-col,
.submenu-jardineria > .sublist-col{
  white-space: nowrap;
  grid-column: 1;
}
.submenu-hobby > .submenu-panel,
.submenu-agricultura > .submenu-panel,
.submenu-verdrecycling > .submenu-panel,
.submenu-jardineria > .submenu-panel{
  grid-column: 2;
}

/* 4) Ritmo vertical consistente en la lista izquierda (idéntico para todos) */
.mega-submenu .sublist-col > .elementor-widget{
  margin: 0.35rem 0;                 /* ajusta al gusto */
}
.mega-submenu .sublist-col > .elementor-widget > p{
  margin: 0;                         /* Elementor mete <p> con margen */
}



/* Layout general (se queda como está) */
/* .mega-submenu > .mega-inner{ grid-template-columns: 12% 17% 21% 14% 10% 16%; } */

/* Layout específico para HOBBY */
.submenu-hobby > .mega-inner{
  grid-template-columns: 25% 20% 24% 17% 12% 10% !important;  /* las de tu captura */
  column-gap: 0 !important;   /* si quieres mantener cero separación */
  row-gap: 1em !important;               /* el mismo alto entre filas que usas */
}

.sublist-col {
	row-gap: 1em !important;
}
.submenu-panel {
  row-gap: .5em !important;
	height: fit-content !important;
}
@media screen and (min-width: 2560px) {
	.sublist-col {
	row-gap: .5em !important;
}
.submenu-panel {
  row-gap: .25em !important;
	height: fit-content !important;
}
}

/*test menu igualar items top (10/11/25)*/
/* El TOP reparte huecos iguales entre items del ancho de su contenido */
.menu-top{
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: max-content;   /* cada .menu-item = ancho de su texto */
  justify-content: space-between;   /* huecos idénticos entre items */
  align-items: center;
  column-gap: 0;                    /* pon un gap fijo si quieres extra */
}

/* El mega ocupa todo, y “corremos” el contenido hasta el inicio del item */
.menu-top > .menu-item > .mega-submenu{ position:absolute; left:0; right:0; top:100%; }
.mega-submenu > .mega-inner{
  margin-left: var(--x, 0px);
  width: calc(100% - var(--x, 0px));
}


/*___________________________________________________________________________________*/

/***** PLANTILLA CATEGORIES PRODUCTE (ajustes) *****/
.grid-subcategorias{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)); /* 3 columnas en desktop */
  gap: 1em; /* antes 40px */
  
}

.item-subcategoria{
  background-color: transparent;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  height:100%;
}

.item-subcategoria img{
  width:100%;
  aspect-ratio: 1 / 1;          /* más altas (prueba 1/1 si las quieres aún más altas) 5 / 4*/
  object-fit:cover;
  display:block;
  transition: transform .35s ease;
  transform: translateZ(0);    /* evita blur en algunos navegadores */
  will-change: transform;
  -webkit-backface-visibility: hidden; /* FIX: suprime flicker en Safari */
          backface-visibility: hidden;
}
.item-subcategoria img:hover,
.item-subcategoria img:focus-within{ /* accesible con teclado */
  transform: scale(1.09);      /* ajusta 1.05–1.12 al gusto */
}
.item-subcategoria > a {
  display: block;
  overflow: hidden;
}
.contenido-subcategoria{
  padding: 0px;
  display:flex;
  flex-direction: column;
  flex:1;
}

/* Tipografía igual */
/* Apuntem a la classe i no a l'etiqueta: així el dia que canviï
   el tag (h2/h3) l'estil no es trenca. */
.item-subcategoria .titol-subcategoria {
  font-family: acumin-variable, sans-serif;
  font-size:18px;
  font-weight:500;
  margin:1em 0 .5em 0;
  color:#172A26;
}
.item-subcategoria .titol-subcategoria a {
  text-decoration:none;
  color:inherit;
}
.item-subcategoria .titol-subcategoria > a:hover {
  text-decoration: underline;
  color:inherit;
}
.item-subcategoria .descripcion {
  font-size:14px;
  color:#666;
  margin:0;
	line-height: 1.2em;
}
.item-subcategoria .cantidad {
  font-size:13px;
  color:#999;
  margin: 0;
	line-height: 1.2em;
}
.item-subcategoria .meta-subcategoria {
  margin-bottom: 5vh;
}
/* Responsivo: 2 columnas en tablet, 1 en móvil */
@media (max-width: 1024px){  /* Tablet (Elementor) */
  .grid-subcategorias {
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap:1em;
  }
}
@media (max-width: 767px){   /* Mobile (Elementor) */
  .grid-subcategorias {
    grid-template-columns: 1fr;
    gap:1em;
  }
}

/***** PLANTILLA DE PRODUCTE *****/
/*Titulo principal (no del producto)*//*
@media screen and (max-width: 480px) {
	.titulo-cat-producto-ficha h1 {
		font-size: 40px !important;
	}
}
*/
/*flechas carrousel imagenes --> Hobby (amarillo)*/
.carr-img-producto .cls-1 {
  fill: #fff86a !important;
}
/*flechas carrousel imagenes --> Pro (azul)*/
.carr-img-producto-pro .cls-1 {
  fill: #a2c1f5 !important;
}
.carr-img-producto .elementor-swiper-button-next, .carr-img-producto-pro .elementor-swiper-button-next {
	right: -4px !important;
}
.carr-img-producto .elementor-swiper-button-prev, .carr-img-producto-pro .elementor-swiper-button-prev {
	left: -4px !important;
}
/*Componentes de la descripción corta*/
.fila-componentes-desc {
  display: grid !important;
	grid-template-columns: auto 1fr !important;
  grid-template-areas: 'imagen titulo'
                       'imagen descripcion';
  column-gap: 5% !important;
		min-height: 3em !important;
}
/* Si NO hay imagen */
.fila-componentes-desc:not(:has(.img-componente img)) {
		grid-template-columns: 1fr !important;
  grid-template-areas:
    "titulo"
    "descripcion";
	column-gap: 0% !important;
}
.img-componente { grid-area: imagen;
display: flex;
align-items: center !important;}
.img-componente img { 
	max-height: 100% !important;
padding: 0.25em !important}

.tit-componente { grid-area: titulo; display: flex; align-items: flex-start;}
.desc-componente { grid-area: descripcion; display: flex; align-items: flex-end;}


/*Acordeones de todas las descripciones: composicion, caratcteristicas,... */
.acordeon-descripciones summary {
  justify-content: space-between !important;
}

/*Tabla de componentes*/
.grid-componentes {
  grid-template-columns: 50% 25% 25% !important;
}

/*Consejos y aplicaciones*/
/* Fila: número + texto */
.filaflex-consejo-numerado{
  display:flex;
  align-items:flex-start;
  column-gap:2em;              /* separación constante entre número y texto */
}

/* Columna del número (primer hijo) – ancho fijo recomendado */
.filaflex-consejo-numerado > *:first-child{
  flex:0 0 1.5em;       /* no crece, no encoge, base 1.5em */
  width:1.5em;          /* asegura el ancho */
  text-align:center;    /* centra el dígito dentro */
  box-sizing:border-box;
}

/* Columna del texto (segundo hijo) */
.filaflex-consejo-numerado > *:nth-child(2){
  flex:1 1 auto;
  min-width:0;          /* evita que el texto empuje/rompa el layout */
}

/*Eliminar boton "añadir al carrito" de la ficha de productos variables*/
.modulo-agregar-carrito .single_add_to_cart_button,.modulo-agregar-carrito  .stock  {
	display: none !important;
}


/*VARIANTES DE PRODUCTO TIPO PESTAÑAS*/
/* Oculta el select (pero accesible para SR) solo en el módulo */
.modulo-agregar-carrito select.is-sr-only{
  position:absolute !important; left:-9999px !important;
  width:1px !important; height:1px !important; overflow:hidden;
}

/* Refuerzo por si Elementor/Woo intenta mostrar algo */
.modulo-agregar-carrito table.variations th.label,
.modulo-agregar-carrito a.reset_variations{ display:none !important; }

/* Tabs */
.modulo-agregar-carrito .fw-tabs{
  	display:grid;
	grid-template-columns: auto auto auto;
	gap:0px;
	/*flex-wrap:wrap;
	margin:.25rem 0 .5rem;*/
}
.modulo-agregar-carrito .fw-tab{
  appearance:none; -webkit-appearance:none;
  display:inline-flex;
	align-items:center;
	justify-content:flex-start;
  padding:.5em 1em;
  font-size:14px; 
	text-transform:uppercase;
  border:1px solid #cfd6e4;
	border-radius: 6px 6px 0 0;
  background:transparent;
	color:#667087;
	font-weight:500;
  cursor:pointer;
	transition:.2s;
}
.modulo-agregar-carrito .fw-tab:hover{
	/*border-color:#b7c3d9; */
	  background: #a2c1f5;
	border-bottom: 1px solid #000;
	color: #000;
}
.modulo-agregar-carrito .fw-tab.active{
  background: #a2c1f5;
	color:#000;
		border-bottom: 1px solid #000;
  /*box-shadow:inset 0 -2px 0 #274f9d;*/
}
.modulo-agregar-carrito .fw-tab:disabled{
	opacity:.35; cursor:not-allowed;
}

.modulo-agregar-carrito .value {
	padding-right: 0;
	background: transparent;
}


/* =========================
   BOTONS
========================= */

/* Estil base per a tots els botons */
button,
input[type="button"],
input[type="submit"],
.wp-block-button__link,
.elementor-button {
  transition: padding 0.3s ease;
  position: relative;
}

/* Efecte d'allargament lateral en hover sense escalar el text */
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover,
.elementor-button:hover {
  padding-left: 2.5em;
  padding-right: 2.5em;
}


/* =========================
   FADE IN UP
========================= */


/*RESULTATS DE CERCA*/
.e-loop-nothing-found-message__text {
  text-align: left;
}

/* =========================
   OCULTEM PREU DE PRODUCTES VARIABLES
========================= */
.woocommerce-variation-price {
  display: none;
}