/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 07 2026 | 21:02:43 */
/* OPTIMIZACIÓN IMÁGENES RESPONSIVE - Madrid Happy People */

/* 1. Contenedor con tamaño exacto */
.mhp-hero-image,
.elementor-image img,
.wp-block-image img {
  width: 667px !important;
  height: 444px !important;
  object-fit: cover;
}

/* 2. Srcset inteligente por breakpoint */
@media (max-width: 768px) {
  .mhp-hero-image img,
  .elementor-image img {
    width: 100% !important;
    height: 300px !important;
  }
}

@media (max-width: 480px) {
  .mhp-hero-image img,
  .elementor-image img {
    height: 250px !important;
  }
}

/* 3. Loading lazy + priority */
.mhp-hero-image img {
  loading: lazy;
  fetchpriority: high;
}

/* 4. WebP fallback + blur placeholder */
.mhp-hero-image img {
  background: linear-gradient(45deg, #f0f0f0 25%, transparent 25%), 
              linear-gradient(-45deg, #f0f0f0 25%, transparent 25%), 
              linear-gradient(45deg, transparent 75%, #f0f0f0 75%), 
              linear-gradient(-45deg, transparent 75%, #f0f0f0 75%);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
}

/* 5. Elementor específico - Autopía */
.elementor-widget-image .elementor-image img {
  aspect-ratio: 667 / 444;
  width: 100%;
  height: auto;
  object-fit: cover;
}