/* ==========================================================================
   martamarino.es — correcciones sobre el CSS heredado de Elementor
   --------------------------------------------------------------------------
   Se carga después de todo lo demás y no toca los ficheros de los plugins, así
   que el volcado original sigue siendo reproducible: si hay que rehacerlo, solo
   se vuelve a añadir esta hoja.

   Problema que resuelve: el megamenú de ElementsKit («Obras», con las 16
   series) se salía del viewport por la derecha y la última columna quedaba
   cortada. En el WordPress original el panel se posicionaba respecto a un
   contenedor que aquí no se comporta igual.
   ========================================================================== */

/* --- El panel del megamenú, contenido dentro de la pantalla -------------- */

.elementskit-megamenu-panel {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  transform: none !important;
  box-sizing: border-box;
  padding: 2rem clamp(1rem, 4vw, 3rem) !important;
  /* El fondo lo pone solo este panel. Los elementos interiores lo llevan en
     transparente (más abajo) para que no se apilen dos marcos blancos; sin
     este opaco, el menú se leería sobre la foto de portada. */
  background: #fff !important;
  box-shadow: 0 14px 34px rgb(0 0 0 / 10%);
  border-top: 1px solid #e6e6e6;
}

/* El contenido interior se reparte en columnas iguales que caben siempre,
   en lugar de la retícula fija que desbordaba. */
.elementskit-megamenu-panel .elementor-container,
.elementskit-megamenu-panel .e-con-inner,
.elementskit-megamenu-panel > .elementor {
  max-width: 1280px !important;
  margin-inline: auto !important;
}

.elementskit-megamenu-panel .elementor-section-boxed > .elementor-container {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)) !important;
  gap: .25rem 2rem !important;
  align-items: start;
}

/* Las columnas de Elementor traen anchos en porcentaje calculados para el
   ancho antiguo; dentro de la retícula estorban. */
.elementskit-megamenu-panel .elementor-column,
.elementskit-megamenu-panel .elementor-col-16,
.elementskit-megamenu-panel .elementor-col-20,
.elementskit-megamenu-panel .elementor-col-25 {
  width: auto !important;
  max-width: none !important;
  flex: initial !important;
}

/* Las columnas vacías del original dejaban un hueco grande a la izquierda. */
.elementskit-megamenu-panel .elementor-column:empty,
.elementskit-megamenu-panel .elementor-widget-container:empty {
  display: none !important;
}

/* Quedaba un panel blanco dentro de otro panel blanco: dos marcos
   superpuestos. El fondo lo pone solo el panel exterior. */
.elementskit-megamenu-panel .elementor-section,
.elementskit-megamenu-panel .elementor-element,
.elementskit-megamenu-panel .e-con {
  background: transparent !important;
  box-shadow: none !important;
}

/* Todas las columnas arrancan a la misma altura. */
.elementskit-megamenu-panel .elementor-widget-wrap,
.elementskit-megamenu-panel .elementor-column-wrap {
  align-content: start !important;
  padding: 0 !important;
}

/* --- Enlaces de las series ----------------------------------------------- */

.elementskit-megamenu-panel .ekit_page_list_title_title,
.elementskit-megamenu-panel a {
  display: block;
  padding: .32rem 0;
  line-height: 1.25;
  /* Los títulos de dos palabras se partían en tres líneas y descuadraban las
     columnas. Con esto se reparten de forma equilibrada. */
  text-wrap: balance;
  hyphens: none;
}
.elementskit-megamenu-panel a:hover { opacity: .55; }

/* Espacio uniforme entre entradas de una misma columna. */
.elementskit-megamenu-panel .elementor-widget-elementskit-page-list + .elementor-widget-elementskit-page-list {
  margin-top: .1rem !important;
}

/* --- Barra de navegación principal ---------------------------------------
   Estaba justificada a todo lo ancho y los cuatro enlaces quedaban perdidos
   con huecos enormes entre ellos. */

.elementskit-menu-po-justified > li.elementskit-megamenu-has,
.elementskit-menu-po-justified > li {
  flex: 0 1 auto !important;
}
.elementskit-navbar-nav.elementskit-menu-po-justified {
  justify-content: center !important;
  gap: clamp(1.5rem, 4vw, 3.5rem);
}

/* --- Nada debe provocar barra horizontal --------------------------------- */

html, body { overflow-x: hidden; max-width: 100%; }

/* --- Móvil ---------------------------------------------------------------- */

@media (max-width: 1024px) {
  .elementskit-megamenu-panel {
    position: static !important;
    padding: 1rem !important;
    box-shadow: none;
  }
  .elementskit-megamenu-panel .elementor-section-boxed > .elementor-container {
    grid-template-columns: 1fr !important;
  }
}
