/* Astro mirror — ajustes finos home vs yogaduville.com.br */

/* * Hero — uma única fonte de verdade (sobrescreve patches conflitantes no CSS espelhado).
 * Posição ~52–55% mantém as pessoas abaixo do menu, como no WP live.
 */
#banner,
.elementor-81 .elementor-element.elementor-element-3ba68207:not(.elementor-motion-effects-element-type-background),
.elementor-81 .elementor-element.elementor-element-3ba68207 > .elementor-motion-effects-container > .elementor-motion-effects-layer,
#banner .elementor-background-overlay,
#banner .elementor-motion-effects-container,
#banner .elementor-background-slideshow__slide__image {
  background-image: url('/images/wp-uploads/2025/04/bg-yogaduville-scaled.webp') !important;
  background-size: cover !important;
  background-position: 50% 54% !important;
  background-repeat: no-repeat !important;
  background-color: #fff0f5 !important;
}

#banner,
.elementor-81 .elementor-element.elementor-element-3ba68207 {
  display: block !important;
  min-height: clamp(340px, 40vw, 700px) !important;
  max-height: none !important;
  overflow: hidden !important;
  margin-top: 0 !important;
  isolation: auto !important;
}

@media screen and (max-width: 1024px) {
  #banner,
  .elementor-81 .elementor-element.elementor-element-3ba68207 {
    min-height: clamp(360px, 52vw, 680px) !important;
  }

  #banner,
  .elementor-81 .elementor-element.elementor-element-3ba68207:not(.elementor-motion-effects-element-type-background),
  .elementor-81 .elementor-element.elementor-element-3ba68207 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background-position: 50% 56% !important;
  }
}

@media screen and (max-width: 767px) {
  #banner,
  .elementor-81 .elementor-element.elementor-element-3ba68207 {
    min-height: clamp(380px, 62vh, 760px) !important;
  }

  #banner,
  .elementor-81 .elementor-element.elementor-element-3ba68207:not(.elementor-motion-effects-element-type-background),
  .elementor-81 .elementor-element.elementor-element-3ba68207 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background-image: url('/images/wp-uploads/2025/04/bg-yogaduville-scaled-mobile.webp') !important;
    background-position: 50% 58% !important;
  }
}

/* Grelha de diferenciais sobrepõe o hero */
.elementor-81 .elementor-element.elementor-element-49ef1716 {
  margin-top: -150px !important;
}

/*
 * Blog — Elementor usa padding-bottom + img absolute (classe elementor-has-item-ratio
 * é adicionada por JS no WP; no espelho estático replicamos em CSS).
 */
.elementor-81 .elementor-posts-container .elementor-post__thumbnail {
  position: relative !important;
  height: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}

.elementor-81 .elementor-element.elementor-element-5ffc2fba .elementor-posts-container .elementor-post__thumbnail {
  padding-bottom: calc(0.66 * 100%) !important;
}

.elementor-81 .elementor-posts-container .elementor-post__thumbnail img {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: auto !important;
  height: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  transform: translate(-50%, -50%) !important;
  object-fit: cover !important;
  display: block !important;
}

.elementor-81 .elementor-post__card:hover .elementor-post__thumbnail img {
  transform: translate(-50%, -50%) scale(1.03) !important;
  transition: transform 0.3s ease;
}

/* Parcerias / loja — cards com mesma altura de imagem */
.elementor-81 .ha-card .ha-card-figure {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  max-height: none !important;
  overflow: hidden !important;
  margin: 0 !important;
  border-radius: 10px;
}

.elementor-81 .ha-card--top .ha-card-figure {
  display: block !important;
}

.elementor-81 .ha-card .ha-card-figure img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Loja virtual — produtos quadrados uniformes */
.elementor-81 .elementor-widget-ha-card .ha-card-figure img,
.elementor-81 .e-grid .ha-card-figure img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* Fundos lazy-load Elementor */
.elementor-81 .e-con.e-parent:not(.e-lazyloaded) {
  --background-lazy-loaded: 1;
}