.elementor-1254 .elementor-element.elementor-element-186e6f9{--display:flex;--margin-top:60px;--margin-bottom:60px;--margin-left:0px;--margin-right:0px;}.elementor-1254 .elementor-element.elementor-element-77540d2{--display:flex;--margin-top:0px;--margin-bottom:30px;--margin-left:0px;--margin-right:0px;}.elementor-1254 .elementor-element.elementor-element-92fb7aa{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 20px) 0px;text-align:center;}.elementor-1254 .elementor-element.elementor-element-92fb7aa .elementor-heading-title{font-size:55px;}.elementor-1254 .elementor-element.elementor-element-bc035ed{--display:flex;}.elementor-1254 .elementor-element.elementor-element-a7bf880{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 20px) 0px;text-align:center;}.elementor-1254 .elementor-element.elementor-element-a7bf880 .elementor-heading-title{font-size:55px;}.elementor-1254 .elementor-element.elementor-element-ffcf50f .gallery-item .gallery-caption{display:none;}@media(max-width:767px){.elementor-1254 .elementor-element.elementor-element-92fb7aa .elementor-heading-title{font-size:40px;}.elementor-1254 .elementor-element.elementor-element-a7bf880 .elementor-heading-title{font-size:40px;}}/* Start custom CSS for image-gallery, class: .elementor-element-ffcf50f *//* 1. CONTENEDOR PRINCIPAL: Forzamos el Grid y limpiamos la basura de WP */
.gallery {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important; /* 4 columnas en PC */
  gap: 20px !important;
  width: 100% !important;
  margin: 0 auto !important;
}

/* Ocultamos los saltos de línea invisibles que a veces mete WordPress */
.gallery::before, 
.gallery::after,
.gallery br {
  display: none !important;
}

/* 2. CADA ITEM (Figure): Matamos los floats y anchos de Elementor */
.gallery .gallery-item {
  width: 100% !important;
  max-width: 100% !important; /* CRÍTICO: Elementor suele poner esto en 33% */
  float: none !important; /* CRÍTICO: Matamos el sistema viejo de columnas */
  margin: 0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
  position: relative !important;
  background-color: #1a1a1a !important;
}

/* 3. ENLACES E ÍCONOS: Deben estirarse al 100% de la celda */
.gallery .gallery-icon, 
.gallery .gallery-icon a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 4. LA IMAGEN: El recorte perfecto */
.gallery .gallery-icon img {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 3 / 4 !important; 
  object-fit: cover !important;
  display: block !important;
  max-width: 100% !important;
  border: none !important;
  padding: 0 !important;
  transition: transform 0.5s ease, filter 0.5s ease !important;
}

/* 5. EFECTO HOVER */
.gallery .gallery-item:hover img {
  transform: scale(1.08) !important;
  filter: brightness(0.8) !important;
}

/* 6. RESPONSIVE: Ajuste automático de columnas */
@media (max-width: 1024px) {
  .gallery { grid-template-columns: repeat(3, 1fr) !important; }
}

@media (max-width: 768px) {
  .gallery { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 480px) {
  .gallery { 
    grid-template-columns: repeat(1, 1fr) !important; 
    gap: 15px !important;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-186e6f9 */.hero-fijo{
    position: relative;
    min-height: 100vh;
}

.hero-fijo::before{
    content:"";
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height:100vh;
    background:url("https://officebm.cl/wp-content/uploads/2026/03/ICONO_OBM-scaled.png") center/cover no-repeat;
    z-index:-1;
    transform: translateZ(0);
    opacity:0.35; 
}/* End custom CSS */