/* ===== KPM: Split Hero (image à droite, fade à gauche) ===== */
/*TEST KIWA*/
.kiwaki-cta3 {
    background: black !important;
}
.tax-product_cat .woocommerce-products-header{
  position: relative !important;
  z-index: 2;
  isolation: isolate;
  overflow: hidden;

  width: 100vw;
  max-width: none !important;
  left: 50%;
  margin-left: -50vw;
  margin-right: -50vw;

  padding: 50px 200px 50px;
  background: transparent !important;
  border-bottom: 1px solid rgba(255,255,255,.10);
}

/* Centre le contenu */
.tax-product_cat .woocommerce-products-header > *{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

/* Couche gauche : abstract + overlay + fondu vers la droite */
/* Couche gauche : abstract + overlay + fondu vers la droite */
.tax-product_cat .woocommerce-products-header::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;

  /* 1) image abstract  2) overlay sombre  3) dégradé de fondu */
  background:
    url("https://kiwaki.fr/wp-content/uploads/2026/03/abstract-1.png") left center / cover no-repeat,
    radial-gradient(900px 520px at 22% 30%, rgba(255,255,255,.10), rgba(255,255,255,0) 60%),
    linear-gradient(90deg, rgba(10,16,22,.88) 0%, rgba(10,16,22,.82) 45%, rgba(10,16,22,.45) 65%, rgba(10,16,22,0) 100%);

  /* le fondu vers la droite */
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 62%, rgba(0,0,0,.35) 78%, rgba(0,0,0,0) 100%);
          mask-image: linear-gradient(90deg, #000 0%, #000 62%, rgba(0,0,0,.35) 78%, rgba(0,0,0,0) 100%);
}

/* ✅ Image à droite (40–50%) avec fondu vers la gauche */
.tax-product_cat .woocommerce-products-header::before{
  content:"";
  position:absolute;
  top:0; bottom:0;
  right:0;
  width: 46vw;              /* ✅ ~45% écran, ajuste 40–50% */
  min-width: 520px;         /* évite trop petit */
  max-width: 900px;         /* évite trop énorme */
  background-image: var(--kpm-cat-bg, none);
  background-size: cover;
  background-position: center right;
  background-repeat:no-repeat;
  transform: scale(1.03);
  transition: transform .9s cubic-bezier(.2,.8,.2,1);
  z-index:-2;

  /* ✅ fondu progressif vers la gauche */
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.15) 8%, rgba(0,0,0,.55) 18%, rgba(0,0,0,.85) 30%, #000 45%, #000 100%);
              mask-image: linear-gradient(90deg, #00000000 0%, rgb(0 0 0 / 0%) 8%, rgb(0 0 0 / 0%) 18%, rgb(0 0 0 / 10%) 30%, #0000005e 45%, #000 100%);
}

.tax-product_cat .woocommerce-products-header:hover::before{
  transform: scale(1.08);
}

/* ✅ Titre */
.tax-product_cat .woocommerce-products-header__title.page-title{
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(34px, 4vw, 64px);
  font-weight: 900;
  letter-spacing: .02em;
  text-shadow: 0 12px 30px rgba(0,0,0,.35);
}

/* ✅ Option : aligner le contenu au centre du container (mais à gauche du hero)
   Si tu veux VRAIMENT centré horizontalement, décommente text-align:center
*/
.tax-product_cat .woocommerce-products-header > *{
  /* text-align: center; */
}

/* Responsive */
@media (max-width: 900px){
  .tax-product_cat .woocommerce-products-header{
    padding: 120px 0 70px;
  }

  .tax-product_cat .woocommerce-products-header::before{
    width: 70vw;            /* sur mobile, l’image prend plus */
    min-width: 0;
    max-width: none;
    opacity: .95;
  }

  .tax-product_cat .woocommerce-products-header::after{
    background:
      linear-gradient(180deg, rgba(10,16,22,.85) 0%, rgba(10,16,22,.55) 55%, rgba(10,16,22,.25) 100%);
  }
}

.tax-product_cat #primary {
  margin-top: 0 !important;
}
/* Masquer breadcrumb Woo natif quand hero actif */
.tax-product_cat .woocommerce-breadcrumb {
  display: none !important;
}

.kpm-delivery-date{
            margin-top:6px;
            font-weight:800;
            padding:6px 10px;
            display:inline-block;
            border-radius:10px;
            background:#f2f2f2;
        }

        .kpm-delivery-sep{
  margin:12px 0 8px;
  padding:10px 12px;
  border-radius:14px;
  background:#f3f4f6;
  display:flex;
  gap:10px;
  align-items:center;
  font-weight:800;
}
.kpm-delivery-sep__icon{font-size:16px;}
.kpm-delivery-sep__title{opacity:.75;font-weight:700;}
.kpm-delivery-sep__date{
  margin-left:auto;
  background:#fff;
  padding:6px 10px;
  border-radius:999px;
  box-shadow:0 1px 2px rgba(0,0,0,.06);
}
.kpm-delivery-badge{
  margin-top:6px;
  display:inline-block;
  padding:6px 10px;
  border-radius:999px;
  background:#eef2ff;
  font-weight:700;
}