/* Add custom CSS styles below */ 


.home-block--square-images figure {
    background-color: white;
  }

  .home-block--square-images img {
    object-fit: contain;
  }


body > section:nth-child(13) > div > div > div > a > img{
  width: 500px;
  margin: auto;
}
body.index .swiper.s-slider-container{
padding: 0.8rem 0;
}
.s-product-card-image img.loaded {
background:white;
object-fit: cover;
border-radius: 12px;
opacity: 1;
}
section:nth-child(12) .container {
    max-width:100%
}


.banner--fixed img{
background:transparent;
}

#app > div.app-inner.flex.flex-col.min-h-full > section.s-block.s-block--banners.container > div > a > div{
background-size: cover !important;
}

#app > div.app-inner.flex.flex-col.min-h-full > section:nth-child(4){
margin-top:0px !important;
}
.s-block .container {
    width: 100%;
    max-width: 1200px;
}
.footer .footer-list li a, .title--has-dash.mb-20  {
  color: white !important;
}
body > div.app-inner.flex.flex-col.min-h-full > section:nth-child(13) > div > a > img{
width:500px;
margin:auto;
}


body > footer{
  background-color: #835D06;
  color: white;
}

#app > div.app-inner.flex.flex-col.min-h-full > section.s-block.s-block--banners.container > div > a > div {
    background-size: contain !important;
}
}
#app > div.app-inner.flex.flex-col.min-h-full > section > div > a > img{

background-color:transparent;}

 section.s-block.s-block--banners.container a.banner-entry.square-photos {
    height:172px !important;
    background:transparent;
    
}
#app > div.app-inner.flex.flex-col.min-h-full > section.s-block.s-block--banners.container > div > a > div {
    background-size: contain !important;
}
p.text-gray-400.mb-2\.5.md\:mb-0 {
    color:#dda57d !important;
}
div#splide01-track {
    padding:20px;
}
/* Desktop: 4 images per row */
@media (min-width: 992px) {

  .home-block--square-images .row {
    display: flex;
    flex-wrap: wrap;
    margin-left: 0;
    margin-right: 0;
  }

  .home-block--square-images .row > div {
    flex: 0 0 25%;
    max-width: 25%;
  }

  /* Optional: figure height for desktop */
  .home-block--square-images figure {
    height: 250px; /* adjust as needed */
    padding: 0;
    overflow: hidden; /* images cropped, text usually safe */
  }

}

@media (max-width: 991px) {

  .home-block--square-images .row {
    display: flex;
    flex-wrap: wrap;
    margin-left: 5px;
    margin-right: 5px;
  }

  .home-block--square-images .row > div {
    flex: 0 0 50%;
    max-width: 50%;
  }

  

  .home-block--square-images img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
  }

}