/**
 * Folies Secrètes — Heroes photo sous-catégories « Offres »
 * Scope strict : body#category.category-id-46 … #52 uniquement
 * GO intégration préprod direct offres FINAL 2026-05-29
 * GO correction texte clair fond sombre 2026-05-29 (#46–#52)
 * Ne pas modifier #38 ni fs-category-hero-premium.css (LOCKED)
 */

/* ==========================================================================
   1. BASE COMMUNE — #46–#52 (compact, hiérarchie sous #38)
   ========================================================================== */

:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2 {
  --fs-subcat-title: #f4eadc;
  --fs-subcat-intro: rgba(255, 247, 234, 0.86);
  --fs-subcat-fallback-bg: #2a2523;
  --fs-chp-font-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --fs-chp-font-sans: "Manrope", system-ui, sans-serif;
  --fs-chp-gold: #c4a066;

  position: relative !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: clamp(0.35rem, 1vw, 0.65rem) 0 clamp(0.75rem, 1.5vw, 1.15rem) !important;
  padding: 0 !important;
  border-radius: clamp(1rem, 1.8vw, 1.35rem) !important;
  border: 1px solid rgba(184, 149, 107, 0.14) !important;
  outline: none !important;
  box-shadow: 0 10px 28px rgba(26, 23, 22, 0.05) !important;

  /* Fallback sombre (photos studio — franges bordeaux/noir) */
  background-color: var(--fs-subcat-fallback-bg) !important;
  background-image: var(--fs-chp-bg-jpg-d) !important;
  background-image: image-set(
    var(--fs-chp-bg-webp-d) type("image/webp"),
    var(--fs-chp-bg-jpg-d) type("image/jpeg")
  ) !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: var(--fs-chp-bg-pos-d, 58% center) !important;
  background-clip: border-box !important;

  /* Hauteur sous-catégorie : plus basse que #38 (~459 px desktop) */
  aspect-ratio: auto !important;
  height: clamp(260px, 22vw, 320px) !important;
  min-height: 260px !important;
  max-height: 320px !important;
}

/* Neutralise les pseudo-éléments Panda / customer-s1 (source des traits latéraux) */
:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2::after {
  display: none !important;
  content: none !important;
  background: none !important;
  width: 0 !important;
  height: 0 !important;
}

:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  /* Voile sombre gauche — lisibilité texte ivoire sans assombrir toute l’image */
  background: linear-gradient(
    90deg,
    rgba(26, 23, 22, 0.56) 0%,
    rgba(26, 23, 22, 0.36) 26%,
    rgba(26, 23, 22, 0.14) 44%,
    rgba(26, 23, 22, 0.04) 56%,
    transparent 68%
  ) !important;
  background-image: none !important;
  opacity: 1 !important;
}

:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__content {
  position: relative !important;
  z-index: 2 !important;
  flex: 0 1 min(44%, 34rem) !important;
  max-width: min(44%, 34rem) !important;
  margin: 0 !important;
  padding: clamp(1.15rem, 2.2vw, 1.65rem) clamp(1.25rem, 2.4vw, 1.85rem) !important;
  background: none !important;
  box-shadow: none !important;
}

/* Pas de panneau / cartouche — voile porté par le hero ::before uniquement */
:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__content::before {
  display: none !important;
  content: none !important;
  background: none !important;
  box-shadow: none !important;
}

:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__kicker {
  margin: 0 0 0.55rem !important;
  font-family: var(--fs-chp-font-sans) !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #c4a066 !important;
  text-shadow: 0 1px 14px rgba(0, 0, 0, 0.48) !important;
}

:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__kicker::after {
  display: inline-block !important;
  content: "" !important;
  vertical-align: middle !important;
  width: 2rem !important;
  height: 1px !important;
  margin-left: 0.65rem !important;
  background: linear-gradient(90deg, var(--fs-chp-gold), transparent) !important;
}

:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__title {
  margin: 0 0 0.45rem !important;
  font-family: var(--fs-chp-font-serif) !important;
  font-size: clamp(1.65rem, 2.8vw, 2.15rem) !important;
  font-weight: 500 !important;
  line-height: 1.14 !important;
  letter-spacing: 0.02em !important;
  color: var(--fs-subcat-title) !important;
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.52) !important;
}

:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__intro {
  margin: 0 !important;
  font-family: var(--fs-chp-font-sans) !important;
  font-size: clamp(0.84rem, 1.15vw, 0.94rem) !important;
  line-height: 1.62 !important;
  color: var(--fs-subcat-intro) !important;
  text-shadow: 0 1px 18px rgba(0, 0, 0, 0.46) !important;
}

:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__decor {
  display: none !important;
}

@media (max-width: 767px) {
  :is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2 {
    align-items: flex-end !important;
    background-image: var(--fs-chp-bg-jpg-m) !important;
    background-image: image-set(
      var(--fs-chp-bg-webp-m) type("image/webp"),
      var(--fs-chp-bg-jpg-m) type("image/jpeg")
    ) !important;
    background-position: var(--fs-chp-bg-pos-m, center 38%) !important;
    background-size: cover !important;
    height: clamp(320px, 78vw, 400px) !important;
    min-height: 320px !important;
    max-height: 400px !important;
    aspect-ratio: auto !important;
  }

  :is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2::before {
    background: linear-gradient(
      180deg,
      rgba(26, 23, 22, 0.06) 0%,
      rgba(26, 23, 22, 0.02) 38%,
      rgba(26, 23, 22, 0.22) 72%,
      rgba(26, 23, 22, 0.5) 100%
    ) !important;
  }

  :is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__kicker {
    color: #c4a066 !important;
  }

  :is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__title {
    color: #f4eadc !important;
  }

  :is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__intro {
    color: rgba(255, 247, 234, 0.86) !important;
  }

  :is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__content {
    flex: 0 1 auto !important;
    max-width: 100% !important;
    width: 100% !important;
    padding: 1.1rem 1.05rem 1.15rem !important;
  }

  :is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__content::before {
    display: none !important;
    content: none !important;
  }

  :is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2__title {
    font-size: clamp(1.55rem, 7.5vw, 1.85rem) !important;
  }
}



/* ==========================================================================
   2. IMAGES PAR SOUS-CATÉGORIE (desktop JPG, mobile WebP)
   ========================================================================== */

body#category.category-id-52 .fs-cat-hero-v2 {
  --fs-chp-bg-jpg-d: url("../img/category/subcategories/offres/fs-subcat-offres-du-moment-desktop-final.jpg");
  --fs-chp-bg-webp-d: url("../img/category/subcategories/offres/fs-subcat-offres-du-moment-desktop-final.jpg");
  --fs-chp-bg-webp-m: url("../img/category/subcategories/offres/fs-subcat-offres-du-moment-mobile-final.webp");
  --fs-chp-bg-jpg-m: url("../img/category/subcategories/offres/fs-subcat-offres-du-moment-mobile-final.webp");
}

body#category.category-id-51 .fs-cat-hero-v2 {
  --fs-chp-bg-jpg-d: url("../img/category/subcategories/offres/fs-subcat-promos-pour-elle-desktop-final.jpg");
  --fs-chp-bg-webp-d: url("../img/category/subcategories/offres/fs-subcat-promos-pour-elle-desktop-final.jpg");
  --fs-chp-bg-webp-m: url("../img/category/subcategories/offres/fs-subcat-promos-pour-elle-mobile-final.webp");
  --fs-chp-bg-jpg-m: url("../img/category/subcategories/offres/fs-subcat-promos-pour-elle-mobile-final.webp");
}

body#category.category-id-50 .fs-cat-hero-v2 {
  --fs-chp-bg-jpg-d: url("../img/category/subcategories/offres/fs-subcat-promos-pour-lui-desktop-final.jpg");
  --fs-chp-bg-webp-d: url("../img/category/subcategories/offres/fs-subcat-promos-pour-lui-desktop-final.jpg");
  --fs-chp-bg-webp-m: url("../img/category/subcategories/offres/fs-subcat-promos-pour-lui-mobile-final.webp");
  --fs-chp-bg-jpg-m: url("../img/category/subcategories/offres/fs-subcat-promos-pour-lui-mobile-final.webp");
}

body#category.category-id-49 .fs-cat-hero-v2 {
  --fs-chp-bg-jpg-d: url("../img/category/subcategories/offres/fs-subcat-promos-couples-desktop-final.jpg");
  --fs-chp-bg-webp-d: url("../img/category/subcategories/offres/fs-subcat-promos-couples-desktop-final.jpg");
  --fs-chp-bg-webp-m: url("../img/category/subcategories/offres/fs-subcat-promos-couples-mobile-final.webp");
  --fs-chp-bg-jpg-m: url("../img/category/subcategories/offres/fs-subcat-promos-couples-mobile-final.webp");
}

body#category.category-id-48 .fs-cat-hero-v2 {
  --fs-chp-bg-jpg-d: url("../img/category/subcategories/offres/fs-subcat-promos-lubrifiants-desktop-final.jpg");
  --fs-chp-bg-webp-d: url("../img/category/subcategories/offres/fs-subcat-promos-lubrifiants-desktop-final.jpg");
  --fs-chp-bg-webp-m: url("../img/category/subcategories/offres/fs-subcat-promos-lubrifiants-mobile-final.webp");
  --fs-chp-bg-jpg-m: url("../img/category/subcategories/offres/fs-subcat-promos-lubrifiants-mobile-final.webp");
}

body#category.category-id-47 .fs-cat-hero-v2 {
  --fs-chp-bg-jpg-d: url("../img/category/subcategories/offres/fs-subcat-petits-prix-desktop-final.jpg");
  --fs-chp-bg-webp-d: url("../img/category/subcategories/offres/fs-subcat-petits-prix-desktop-final.jpg");
  --fs-chp-bg-webp-m: url("../img/category/subcategories/offres/fs-subcat-petits-prix-mobile-final.webp");
  --fs-chp-bg-jpg-m: url("../img/category/subcategories/offres/fs-subcat-petits-prix-mobile-final.webp");
}

body#category.category-id-46 .fs-cat-hero-v2 {
  --fs-chp-bg-jpg-d: url("../img/category/subcategories/offres/fs-subcat-dernieres-chances-desktop-final.jpg");
  --fs-chp-bg-webp-d: url("../img/category/subcategories/offres/fs-subcat-dernieres-chances-desktop-final.jpg");
  --fs-chp-bg-webp-m: url("../img/category/subcategories/offres/fs-subcat-dernieres-chances-mobile-final.webp");
  --fs-chp-bg-jpg-m: url("../img/category/subcategories/offres/fs-subcat-dernieres-chances-mobile-final.webp");
}

:is(
  body#category.category-id-46,
  body#category.category-id-47,
  body#category.category-id-48,
  body#category.category-id-49,
  body#category.category-id-50,
  body#category.category-id-51,
  body#category.category-id-52
) .fs-cat-hero-v2 {
  --fs-chp-bg-pos-d: 58% center;
  --fs-chp-bg-pos-m: center 32%;
}