.elementor-224548 .elementor-element.elementor-element-b4d38c3{--display:flex;}.elementor-224548 .elementor-element.elementor-element-963aafb{--grid-columns:1;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:1024px){.elementor-224548 .elementor-element.elementor-element-963aafb{--grid-columns:2;}}@media(max-width:767px){.elementor-224548 .elementor-element.elementor-element-963aafb{--grid-columns:1;}}/* Start custom CSS for container, class: .elementor-element-b4d38c3 *//* ==========================================================================
   1. CONTENEDOR Y ESPACIADO GENERAL (DESKTOP)
   ========================================================================== */
.elementor-loop-container {
  row-gap: var(--size-l, 4rem) !important; /* Gap amplio para pantallas grandes */
}

.elementor-loop-container .e-loop-item {
  position: relative;
}

/* ==========================================================================
   2. DIVISOR ENTRE ÍTEMS (DESKTOP)
   ========================================================================== */
.elementor-loop-container .e-loop-item:has(~ .e-loop-item)::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  margin-inline: auto;
  width: calc(100% - 3.125rem); /* Margen lateral de 25px (1.5625rem) a cada lado */
  inset-block-end: calc(var(--size-l, 4rem) / -2); /* Centrado vertical en el gap de desktop */
  height: 1px;
  background-color: #d1d5db;
}

/* ==========================================================================
   3. INVERTIR FOTO Y TEXTO EN ÍTEMS PARES (SOLO DESKTOP)
   ========================================================================== */
@media (min-width: 1025px) {
  .e-loop-item:nth-child(even) .loop-listing-media {
    order: 2;
  }

  .e-loop-item:nth-child(even) .loop-listing-content {
    order: 1;
  }
}

/* ==========================================================================
   4. RESPONSIVE: TABLET Y MOBILE (<= 1024px)
   ========================================================================== */
@media (max-width: 1024px) {
  .elementor-loop-container {
    gap: var(--size-m) !important;
    row-gap: var(--size-m) !important;
  }

  /* Oculta la línea divisoria en tablets y móviles para evitar cortes */
  .elementor-loop-container .e-loop-item::after {
    display: none;
  }
}/* End custom CSS */