/* TradesFolks Homepage Production QA & Conflict Cleanup — Sprint 812
   Scope: homepage hero/slider only.
   Goal: deterministic responsive geometry and image clarity without redesign. */

/* ----- Canonical hero container ----- */
.home-hero,
.home-hero-section,
.marketplace-hero,
.tf-home-hero,
.hero-slider,
.hero-carousel{
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

/* Never allow old blur/filter rules to affect hero media. */
.home-hero img,
.home-hero-section img,
.marketplace-hero img,
.tf-home-hero img,
.hero-slider img,
.hero-carousel img,
.home-hero picture img,
.hero-slider picture img{
  filter:none !important;
  -webkit-filter:none !important;
  image-rendering:auto;
  backface-visibility:hidden;
  transform:translateZ(0);
}

/* Prevent accidental scale-up transforms from legacy slider layers. */
.home-hero .slide img,
.home-hero-section .slide img,
.hero-slider .slide img,
.hero-carousel .slide img,
.tf-home-hero .slide img{
  scale:1 !important;
}

/* Canonical media coverage.
   Keeps artwork crisp and proportional; avoids width/height distortion. */
.home-hero .slide-media img,
.home-hero .hero-media img,
.home-hero-section .slide-media img,
.home-hero-section .hero-media img,
.marketplace-hero .hero-media img,
.tf-home-hero .hero-media img,
.hero-slider .slide-media img,
.hero-carousel .slide-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}

/* Background-image based slides */
.home-hero .slide,
.home-hero-section .slide,
.hero-slider .slide,
.hero-carousel .slide,
.tf-home-hero .slide{
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center center;
  isolation:isolate;
}

/* Eliminate legacy whole-slide blur/opacity/filter stacking. */
.home-hero .slide::before,
.home-hero-section .slide::before,
.hero-slider .slide::before,
.hero-carousel .slide::before,
.tf-home-hero .slide::before{
  filter:none !important;
  backdrop-filter:none !important;
}

/* Keep readability shading local to content side rather than washing out artwork. */
.home-hero .hero-overlay,
.home-hero-section .hero-overlay,
.hero-slider .hero-overlay,
.hero-carousel .hero-overlay,
.tf-home-hero .hero-overlay{
  background:linear-gradient(
    90deg,
    rgba(8,27,55,.82) 0%,
    rgba(8,27,55,.68) 29%,
    rgba(8,27,55,.30) 49%,
    rgba(8,27,55,.08) 67%,
    rgba(8,27,55,0) 82%
  );
  backdrop-filter:none;
}

/* Avoid cumulative opacity inherited from nested legacy wrappers. */
.home-hero .hero-media,
.home-hero .slide-media,
.home-hero-section .hero-media,
.home-hero-section .slide-media,
.hero-slider .hero-media,
.hero-slider .slide-media,
.hero-carousel .hero-media,
.hero-carousel .slide-media{
  opacity:1 !important;
}

/* Stable clipping and radius ownership */
.home-hero,
.home-hero-section,
.hero-slider,
.hero-carousel,
.tf-home-hero{
  overflow:hidden;
}
.home-hero .slide,
.home-hero-section .slide,
.hero-slider .slide,
.hero-carousel .slide,
.tf-home-hero .slide{
  overflow:hidden;
}

/* Prevent CLS from late hero sizing changes. */
@media(min-width:1200px){
  .home-hero,
  .home-hero-section,
  .marketplace-hero,
  .tf-home-hero,
  .hero-slider,
  .hero-carousel{
    min-height:420px;
  }
}

@media(min-width:768px) and (max-width:1199px){
  .home-hero,
  .home-hero-section,
  .marketplace-hero,
  .tf-home-hero,
  .hero-slider,
  .hero-carousel{
    min-height:360px;
  }
}

/* Desktop composition: keep text readable while preserving right-side artwork. */
@media(min-width:900px){
  .home-hero .slide,
  .home-hero-section .slide,
  .hero-slider .slide,
  .hero-carousel .slide,
  .tf-home-hero .slide{
    background-position:center center;
  }

  .home-hero .hero-content,
  .home-hero-section .hero-content,
  .hero-slider .hero-content,
  .hero-carousel .hero-content,
  .tf-home-hero .hero-content{
    max-width:48%;
    position:relative;
    z-index:3;
  }
}

/* Tablet */
@media(min-width:768px) and (max-width:899px){
  .home-hero .hero-content,
  .home-hero-section .hero-content,
  .hero-slider .hero-content,
  .hero-carousel .hero-content,
  .tf-home-hero .hero-content{
    max-width:58%;
  }
}

/* Mobile: protect focal point, avoid stretched background and content overlap. */
@media(max-width:767px){
  .home-hero,
  .home-hero-section,
  .marketplace-hero,
  .tf-home-hero,
  .hero-slider,
  .hero-carousel{
    min-height:0;
    height:auto;
  }

  .home-hero .slide,
  .home-hero-section .slide,
  .hero-slider .slide,
  .hero-carousel .slide,
  .tf-home-hero .slide{
    min-height:420px;
    background-position:center center;
  }

  .home-hero .hero-overlay,
  .home-hero-section .hero-overlay,
  .hero-slider .hero-overlay,
  .hero-carousel .hero-overlay,
  .tf-home-hero .hero-overlay{
    background:linear-gradient(
      180deg,
      rgba(8,27,55,.20) 0%,
      rgba(8,27,55,.42) 40%,
      rgba(8,27,55,.76) 74%,
      rgba(8,27,55,.88) 100%
    );
  }

  .home-hero .hero-content,
  .home-hero-section .hero-content,
  .hero-slider .hero-content,
  .hero-carousel .hero-content,
  .tf-home-hero .hero-content{
    max-width:100%;
    position:relative;
    z-index:3;
  }

  .home-hero .slide-media img,
  .home-hero .hero-media img,
  .home-hero-section .slide-media img,
  .home-hero-section .hero-media img,
  .hero-slider .slide-media img,
  .hero-carousel .slide-media img{
    object-position:center center;
  }
}

/* Slider controls: deterministic placement and hit area */
.home-hero .slider-arrow,
.home-hero-section .slider-arrow,
.hero-slider .slider-arrow,
.hero-carousel .slider-arrow,
.home-hero .swiper-button-prev,
.home-hero .swiper-button-next,
.hero-slider .swiper-button-prev,
.hero-slider .swiper-button-next{
  z-index:6;
  filter:none;
}

.home-hero .slider-dots,
.home-hero-section .slider-dots,
.hero-slider .slider-dots,
.hero-carousel .slider-dots,
.home-hero .swiper-pagination,
.hero-slider .swiper-pagination{
  z-index:6;
}

/* Motion safety */
@media(prefers-reduced-motion:reduce){
  .home-hero *,
  .home-hero-section *,
  .hero-slider *,
  .hero-carousel *,
  .tf-home-hero *{
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
  }
}