:root{
  --bg-main:#F8F6F3;
  --bg-soft:#EFEAE4;
  --text-main:#1C1C1C;
  --text-muted:#7A7A7A;
  --accent:#C6A56A;
  --border-soft: rgba(28,28,28,.10);
}

/* global */
body{ background: var(--bg-main); color: var(--text-main); }
p, .text-main-4{ color: var(--text-muted); }

/* kill hard black blocks */
.bg-dark-black{
  background: var(--bg-soft) !important;
  color: var(--text-main) !important;
}
.bg-dark-black .style-white,
.bg-dark-black .text-clip,
.bg-dark-black p{
  color: var(--text-main) !important;
  -webkit-text-fill-color: var(--text-main) !important;
}

/* convert bg-main-2 (your dark product slider section) into soft premium */
.bg-main-2{
  background: var(--bg-soft) !important;
}

/* remove “white text everywhere” look inside that section */
.bg-main-2 .text-white,
.bg-main-2 .style-white,
.bg-main-2 .name-product,
.bg-main-2 .price-new,
.bg-main-2 .title{
  color: var(--text-main) !important;
}

/* soften product cards in that slider */
.bg-main-2 .card_product--V01{
  border: 1px solid var(--border-soft);
  background: rgba(255,255,255,.35);
  border-radius: 14px;
}
.bg-main-2 .list-product-btn .box-icon{
  background: rgba(255,255,255,.75);
  border: 1px solid var(--border-soft);
}

/* reviews section: remove heavy parallax contrast (make it calm) */
.parallax-wrap.parallaxie{
  background-image: none !important;
  background: var(--bg-soft) !important;
}
.parallax-wrap .text-white{ color: var(--text-main) !important; }

/* icon box: stop dark tan block */
.bg-dark-tan{
  background: var(--bg-soft) !important;
}
.bg-dark-tan .style-white,
.bg-dark-tan .style-white .title,
.bg-dark-tan .style-white .text{
  color: var(--text-main) !important;
}

/* buttons: make gold the only accent */
.tf-btn.btn-fill-2,
.tf-btn.type-large{
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
}
.tf-btn.btn-fill-white{
  background: rgba(255,255,255,.75) !important;
  border: 1px solid var(--border-soft) !important;
  color: var(--text-main) !important;
}

/* ===== FOAE HERO SLIDER FIX ===== */

/* Ensure slider has a real height */
.tf-slideshow .sw-slide-show,
.tf-slideshow .swiper-slide,
.tf-slideshow .slider_wrap {
  height: 800px;              /* desktop hero height */
  min-height: 800px;
  position: relative;
}

/* Make the image layer fill the entire slide */
.tf-slideshow .slider_wrap .sld-image {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

/* Force images to cover, not stretch */
.tf-slideshow .slider_wrap .sld-image img,
.tf-slideshow .slider_wrap .sld-image picture,
.tf-slideshow .slider_wrap .sld-image picture > img {
  width: 100%;
  height: 100%;
  object-fit: cover;          /* KEY */
  object-position: center;    /* center crop */
  display: block;
}

/* Keep text above image */
.tf-slideshow .slider_wrap .sld-content {
  position: relative;
  z-index: 2;
}

/* Optional: add a soft overlay so white text stays readable */
.tf-slideshow .slider_wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,0.45) 0%,
    rgba(0,0,0,0.15) 45%,
    rgba(0,0,0,0.00) 70%
  );
  z-index: 1;
  pointer-events: none;
}

/* Mobile tuning */
@media (max-width: 767px) {
  .tf-slideshow .sw-slide-show,
  .tf-slideshow .swiper-slide,
  .tf-slideshow .slider_wrap {
    height: 640px;
    min-height: 640px;
  }

  /* lighter overlay on mobile if needed */
  .tf-slideshow .slider_wrap::after {
    background: linear-gradient(
      180deg,
      rgba(0,0,0,0.35) 0%,
      rgba(0,0,0,0.05) 55%,
      rgba(0,0,0,0.00) 75%
    );
  }
}

/* Make hero text readable + premium spacing */
.tf-slideshow .content-sld{
  max-width: 700px;
}

/* Stronger overlay (desktop) */
.tf-slideshow .slider_wrap::after{
  background: linear-gradient(
    90deg,
    rgba(0,0,0,0.55) 0%,
    rgba(0,0,0,0.20) 48%,
    rgba(0,0,0,0.00) 72%
  );
}

@media (max-width: 767px){
  .tf-slideshow .content-sld{
    padding-top: 38px;      /* push content up */
    max-width: 92%;
  }

  .tf-slideshow .title-sld{
    font-size: 40px;        /* control huge heading */
    line-height: 1.02;
  }

  .tf-slideshow .sub-title-sld{
    margin-top: 10px;
    font-size: 14px;
    line-height: 1.4;
    max-width: 320px;
  }

  .tf-slideshow .tf-btn{
    margin-top: 14px;
  }
}