/* =========================================================
   EDITORIAL — INJECTED FULL WIDTH FIX
========================================================= */

/* Les blocs injectés sortent de la grille produit */
.collectionlist_products > .editorial-block,
.collectionlist_products > .editorial-product-block,
.collectionlistwrapper_products .collectionlist_products > .editorial-block,
.collectionlistwrapper_products .collectionlist_products > .editorial-product-block,
.editorial-block.is-editorial-injected,
.editorial-product-block.is-editorial-product-injected {
  grid-column: 1 / -1 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  color: var(--black, #000);
  font-family: var(--_typographie-principale---font-family) !important;
}

/* Tous les enfants héritent bien de la typo */
.editorial-block.is-editorial-injected *,
.editorial-product-block.is-editorial-product-injected * {
  font-family: var(--_typographie-principale---font-family) !important;
}

.editorial-block img,
.editorial-product-block img,
.editorial-block video,
.editorial-product-block video {
  content-visibility: auto;
}

/* =========================================================
   EDITORIAL SOURCES
========================================================= */

.editorial-blocks-source,
.editorial-subcats-source,
.product-editorial-source {
  display: none !important;
}

.editorial-target-data,
.editorial-product-target-data,
.editorial-maincat-slug,
.editorial-univers-slug,
.editorial-subcat-slug,
.editorial-entry-type,
.editorial-product-maincat-slug,
.editorial-product-univers-slug,
.editorial-product-subcat-slug,
.editorial-product-order {
  display: none !important;
}

.is-editorial-injected,
.is-editorial-product-injected {
  display: block;
  width: 100%;
}

.product-card,
.editorial-block,
.editorial-product-block {
  content-visibility: auto;
  contain-intrinsic-size: 1200px;
}

/* =========================================================
   MEDIA COMMUN
========================================================= */

.editorial-media-ratio,
.editorial-product-media,
.editorial-image-story {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.editorial-media-ratio {
  aspect-ratio: 16 / 9;
}

.editorial-product-media {
  aspect-ratio: 4 / 5;
}

.editorial-media-ratio img,
.editorial-media-ratio video,
.editorial-media-ratio iframe,
.editorial-media-ratio picture,
.editorial-media-ratio .w-background-video,
.editorial-product-media img,
.editorial-product-media video,
.editorial-product-media iframe,
.editorial-product-media picture,
.editorial-product-media .w-background-video,
.editorial-image-story img,
.editorial-image-story video,
.editorial-image-story iframe,
.editorial-image-story picture,
.editorial-image-story .w-background-video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* =========================================================
   COLLECTIONS — EDITORIAL MEDIA STABILITY MOBILE
   Anti-sautillement images / vidéos
========================================================= */

.editorial-block,
.editorial-product-block,
.editorial-media,
.editorial-media-ratio,
.editorial-block img,
.editorial-block video,
.editorial-product-block img,
.editorial-product-block video {
  box-sizing: border-box;
}

.editorial-media,
.editorial-media-ratio {
  position: relative;
  width: 100%;
  overflow: hidden;
  contain: layout paint;
  transform: translateZ(0);
  backface-visibility: hidden;
}

.editorial-media-ratio {
  aspect-ratio: 4 / 5;
}

.editorial-block.is-presentation .editorial-media-ratio {
  aspect-ratio: 16 / 10;
}

.editorial-block.is-story .editorial-media-ratio {
  aspect-ratio: 4 / 5;
}

.editorial-block.is-focus-product .editorial-media-ratio,
.editorial-product-block .editorial-media-ratio {
  aspect-ratio: 4 / 5;
}

.editorial-block img,
.editorial-block video,
.editorial-product-block img,
.editorial-product-block video {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

.editorial-block video,
.editorial-product-block video {
  background: #f5f5f5;
}

/* Mobile : hauteur stable, pas de recalcul brutal */
@media screen and (max-width: 767px) {
  .editorial-media,
  .editorial-media-ratio {
    width: 100%;
    min-height: 1px;
  }

  .editorial-block.is-presentation .editorial-media-ratio,
  .editorial-block.is-story .editorial-media-ratio,
  .editorial-block.is-focus-product .editorial-media-ratio,
  .editorial-product-block .editorial-media-ratio {
    aspect-ratio: 4 / 5;
  }

  .editorial-block video,
  .editorial-product-block video {
    object-fit: cover;
    object-position: center;
  }
}

/* =========================================================
   COLLECTIONS — PRODUCT EDITORIAL MEDIA PATCH
   Anti-sautillement final
========================================================= */

.editorial-product-block,
.editorial-product-block * {
  box-sizing: border-box;
}

.editorial-product-block {
  width: 100%;
  min-width: 0;
  overflow: hidden;
  contain: layout paint;
}

.editorial-product-block .editorial-media,
.editorial-product-block .editorial-media-ratio,
.editorial-product-block .editorial-product-media,
.editorial-product-block .editorial-product-media-ratio {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  aspect-ratio: 4 / 5;
  min-height: 1px;
  contain: layout paint;
  transform: translateZ(0);
  backface-visibility: hidden;
}

.editorial-product-block img,
.editorial-product-block video,
.editorial-product-block .editorial-media img,
.editorial-product-block .editorial-media video,
.editorial-product-block .editorial-media-ratio img,
.editorial-product-block .editorial-media-ratio video,
.editorial-product-block .editorial-product-media img,
.editorial-product-block .editorial-product-media video,
.editorial-product-block .editorial-product-media-ratio img,
.editorial-product-block .editorial-product-media-ratio video {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

@media screen and (max-width: 767px) {
  .editorial-product-block {
    grid-column: 1 / -1;
  }

  .editorial-product-block .editorial-media,
  .editorial-product-block .editorial-media-ratio,
  .editorial-product-block .editorial-product-media,
  .editorial-product-block .editorial-product-media-ratio {
    aspect-ratio: 4 / 5;
    height: auto;
  }
}

/* =========================================================
   PRESENTATION
========================================================= */

.editorial-block.is-presentation {
  padding: 6rem 0 !important;
}

.editorial-block-info {
  display: flex;
  align-items: center;
  gap: clamp(2rem, 6vw, 8rem);
  width: 100%;
  max-width: 1680px;
  margin: 0 auto;
  padding: 0 clamp(1.25rem, 4vw, 5rem);
}

.editorial-info {
  flex: 0 0 32%;
  max-width: 34ch;
  text-align: left;
}

.editorial-block-info .editorial-media-ratio {
  flex: 1 1 auto;
  min-width: 0;
}

.editorial-block-info .editorial-exergue-text {
  margin: 0;
  max-width: 22ch;
  text-align: left;
  text-transform: uppercase;
  font-size: clamp(1.3rem, 1.7vw, 2rem);
  line-height: 1.18;
  letter-spacing: 0.08em;
  font-weight: 800;
}

/* =========================================================
   STORY
========================================================= */

.editorial-image-story {
  height: 82vh;
}

.editorial-image-story::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 45%;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.38),
    rgba(0, 0, 0, 0.14),
    rgba(0, 0, 0, 0)
  );
  z-index: 1;
  pointer-events: none;
}

.editorial-text-story {
  position: absolute;
  left: 50%;
  bottom: clamp(2rem, 5vw, 5rem);
  transform: translateX(-50%);
  z-index: 2;
  width: min(820px, calc(100% - 3rem));
  color: #fff;
  text-align: center;
  font-size: clamp(1.15rem, 1.5vw, 1.6rem);
  line-height: 1.45;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.25);
}

/* =========================================================
   PRODUCT EDITORIAL
========================================================= */

.editorial-product-block.is-editorial-product-injected {
  padding: 6rem 0 !important;
}

.editorial-product-focus {
  display: flex;
  align-items: center;
  gap: clamp(2rem, 6vw, 8rem);
  width: 100%;
  max-width: 1680px;
  margin: 0 auto;
  padding: 0 clamp(1.25rem, 4vw, 5rem);
}

.editorial-product-info {
  flex: 0 0 32%;
  max-width: 36ch;
  text-align: left;
}

.editorial-product-media {
  flex: 1 1 auto;
  min-width: 0;
}

.editorial-product-kicker {
  margin-bottom: 0.8rem;
  font-size: 0.82rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0.62;
}

.editorial-product-title {
  margin: 0;
  font-size: clamp(1.3rem, 1.7vw, 2rem);
  line-height: 1.18;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
}

.editorial-product-text {
  margin-top: 1rem;
  line-height: 1.55;
  opacity: 0.86;
}

/* =========================================================
   RESPONSIVE EDITORIAL
========================================================= */

@media screen and (max-width: 991px) {
  .editorial-block.is-editorial-injected,
  .editorial-product-block.is-editorial-product-injected {
    margin: 4rem 0 !important;
  }

  .editorial-block.is-presentation,
  .editorial-product-block.is-editorial-product-injected {
    padding: 4rem 0 !important;
  }

  .editorial-block-info,
  .editorial-product-focus {
    flex-direction: column;
    align-items: stretch;
    gap: 2rem;
    padding: 0 1rem;
  }

  .editorial-info,
  .editorial-product-info {
    flex: none;
    max-width: none;
    text-align: center;
  }

  .editorial-block-info .editorial-exergue-text {
    max-width: 24ch;
    margin: 0 auto;
    text-align: center;
  }

  .editorial-image-story {
    height: 64vh;
  }

  .editorial-text-story {
    width: calc(100% - (var(--mobile-gutter) * 2));
    bottom: 2rem;
  }
}

/* =========================================================
   PATCH VIDEO WEBFLOW — EDITORIAL
========================================================= */

.editorial-media-ratio {
  position: relative;
  display: block;
  width: 100%;
  min-height: 420px;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #f5f5f5;
}

.editorial-media-ratio .w-embed,
.editorial-media-ratio .w-background-video,
.editorial-media-ratio .w-background-video-atom {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

.editorial-media-ratio video,
.editorial-media-ratio .w-background-video video,
.editorial-media-ratio .w-background-video-atom video {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* =========================================================
   HIDE EMPTY WEBFLOW VIDEOS
========================================================= */

/* Cache les wrappers vidéo sans source réelle */
.w-background-video:has(video source:not([src])),
.w-background-video:has(video source[src=""]),
.w-background-video-atom:has(video source:not([src])),
.w-background-video-atom:has(video source[src=""]) {
  display: none !important;
}

/* Cache le media ratio si aucune vidéo/image */
.editorial-media-ratio:has(.w-background-video:only-child),
.editorial-media-ratio:has(.w-background-video-atom:only-child) {
  min-height: 0 !important;
  aspect-ratio: auto !important;
}

/* Si le wrapper contient uniquement une vidéo vide */
.editorial-media-ratio:has(
  .w-background-video video source[src=""]
),
.editorial-media-ratio:has(
  .w-background-video-atom video source[src=""]
) {
  display: none !important;
}

/* =========================================================
   PATCH GRID — SUPPRESSION DES ZONES VIDES
========================================================= */

.collectionlist_products,
.collectionlistwrapper_products .w-dyn-items {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-flow: row dense;
  align-items: start;
  width: 100%;
}

/* Chaque item Webflow devient un vrai item de grille */
.collectionlist_products > .w-dyn-item,
.collectionlistwrapper_products .w-dyn-items > .w-dyn-item {
  display: block;
  min-width: 0;
}

/* Cache réellement les wrappers Webflow vides / filtrés */
/*.collectionlist_products > .w-dyn-item:has(.product-card:not(.is-product-visible)),
.collectionlistwrapper_products .w-dyn-items > .w-dyn-item:has(.product-card:not(.is-product-visible)),
.collectionlist_products > .w-dyn-item:has(.product-card[hidden]),
.collectionlistwrapper_products .w-dyn-items > .w-dyn-item:has(.product-card[hidden]) {
  display: none !important;
}*/

/* Produits */
.product-card {
  grid-column: auto;
  min-width: 0;
}

/* Blocs injectés : item grille propre, sans transform */
.editorial-block.is-editorial-injected,
.editorial-product-block.is-editorial-product-injected {
  grid-column: 1 / -1 !important;
  position: relative !important;
  left: auto !important;
  transform: none !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  margin: clamp(3rem, 6vw, 6rem) 0 !important;
  padding: 0 !important;
}

/* Présentation / produit en exergue : contenu cadré */
.editorial-block.is-editorial-injected .editorial-block-info,
.editorial-product-block.is-editorial-product-injected .editorial-product-focus {
  width: 100%;
  max-width: 1680px;
  margin-left: auto;
  margin-right: auto;
}

/* Story : vrai full bleed propre */
.editorial-block.is-editorial-injected.is-story {
  width: 100vw !important;
  margin-left: 50% !important;
  transform: translateX(-50%) !important;
}

/* Media story pleine largeur */
.editorial-block.is-editorial-injected.is-story .editorial-image-story {
  width: 100%;
}

/* Présentation : media reste dans le layout, pas en 100vw */
.editorial-block.is-editorial-injected.is-presentation .editorial-media-ratio {
  width: 100%;
  margin-left: 0;
  transform: none;
}

/* Product editorial : jamais en 100vw */
.editorial-product-block.is-editorial-product-injected {
  width: 100% !important;
}

/* Responsive */
@media screen and (max-width: 991px) {
  .collectionlist_products,
  .collectionlistwrapper_products .w-dyn-items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media screen and (max-width: 767px) {
  .collectionlist_products,
  .collectionlistwrapper_products .w-dyn-items {
    grid-template-columns: 1fr;
  }

  .editorial-block.is-editorial-injected,
  .editorial-product-block.is-editorial-product-injected {
    grid-column: 1 / -1 !important;
  }
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 991px) {

  .image_category_panel_mobile {
    height: 65vh;
  }

  .editorial-block-injected {
    margin-top: 3.5rem;
    margin-bottom: 3.5rem;
  }

  .editorial-block-info,
  .editorial-product-focus {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1.75rem;
    padding: 0 !important;
  }

  .editorial-info,
  .editorial-product-info {
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
    align-items: center;
    text-align: center;
  }

  .editorial-block-info .editorial-exergue-text {
    max-width: 24ch;
    text-align: center;
  }

  .editorial-media-ratio,
  .editorial-product-media {
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
  }

  .editorial-image-story {
    height: 62vh;
  }

  .editorial-text-story {
    width: min(680px, calc(100% - 2rem));
    bottom: 2rem;
  }
}

@media screen and (min-width: 992px) {
  .see_all_category_mobile,
  .button_category_panel_mobile {
    display: none !important;
  }
}

/* =========================================================
   COLLECTIONS EDITORIAL — MOBILE TEXT REFINEMENT
========================================================= */

@media screen and (max-width: 767px) {
  .editorial-block.is-editorial-injected .editorial-block-info,
  .editorial-product-block.is-editorial-product-injected .editorial-block-info {
    width: 100% !important;
    padding-left: var(--mobile-gutter) !important;
    padding-right: var(--mobile-gutter) !important;
    box-sizing: border-box !important;
  }

  .editorial-block.is-editorial-injected .editorial-info,
  .editorial-product-block.is-editorial-product-injected .editorial-info {
    width: 100% !important;
    max-width: 32rem !important;
    margin: 0 auto !important;

    text-align: center !important;
  }

  .editorial-block.is-editorial-injected .editorial-exergue-text,
  .editorial-product-block.is-editorial-product-injected .editorial-exergue-text {
    margin-bottom: 1.25rem !important;

    font-size: clamp(1.35rem, 6vw, 1.85rem) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.015em !important;
  }

  .editorial-block.is-editorial-injected .editorial-exergue-text-presentation,
  .editorial-product-block.is-editorial-product-injected .editorial-exergue-text-presentation {
    max-width: 28rem !important;
    margin: 0 auto !important;

    font-size: 1rem !important;
    line-height: 1.55 !important;
    letter-spacing: 0.01em !important;

    color: rgba(0, 0, 0, 0.72) !important;
  }

  .editorial-block.is-editorial-injected .editorial-exergue-text-presentation p,
  .editorial-product-block.is-editorial-product-injected .editorial-exergue-text-presentation p {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}
