/**
 * Homepage.css — Styles des blocs clem (Homepage Roller Grill)
 * Uniquement des classes préfixées .clem-*
 * Ne pas modifier les blocs Elementor sans cette convention.
 */

/* ==========================================================================
   Variables (usage interne aux blocs clem)
   ========================================================================== */
   :root {
    --clem-color-white: #fff;
    --clem-color-black: #000;
    --clem-color-red: #c00;
    --clem-color-blue: #0066cc;
    --clem-color-yellow: #f5d020;
    --clem-color-beige: #f5f0e8;
    --clem-color-grey-dark: #333;
    --clem-font-title: inherit;
    --clem-font-body: inherit;
    --clem-radius-badge: 4px;
    --clem-radius-button: 2px;
  }
  
  /* ==========================================================================
     Background Homepage
     ========================================================================== */
  body.home {
    background: #FAF6F2 !important;
  }
  
  body.home .elementor,
  body.home .elementor-inner {
    background: #FAF6F2 !important;
  }
  
  /* ==========================================================================
     Bloc 1 — Hero Slider (clem-slider) — Styles génériques réutilisables
     ========================================================================== */
  /* 
     IMPORTANT: Pour utiliser ces styles sur un nouveau slider:
     1. Option A: Ajoutez l'ID #clem-slider au container du slider
     2. Option B: Ajoutez la classe CSS "clem-slider" au container du slider
     3. Les styles s'appliqueront automatiquement au titre, texte, bouton et navigation
     
     Dans Elementor:
     - Allez dans les paramètres avancés du container du slider
     - Dans "Attributs CSS" > "Classes CSS", ajoutez: clem-slider
  */
  
  /* Container principal du slider */
  #clem-slider,
  .clem-slider {
    position: relative !important;
    min-height: 60vh !important;
    background: #FAF6F2 !important;
  }
  
  /* Chaque slide du slider */
  #clem-slider .swiper-slide,
  #clem-slider .elementor-slide,
  .clem-slider .swiper-slide,
  .clem-slider .elementor-slide {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }
  
  /* Container du contenu de la slide (texte + bouton) */
  #clem-slider .elementor-slide-content,
  #clem-slider .swiper-slide-contents,
  .clem-slider .elementor-slide-content,
  .clem-slider .swiper-slide-contents {
    text-align: left !important;
    max-width: 650px !important;
    margin-left: 8% !important;
    margin-right: auto !important;
    padding-right: 5% !important;
  }
  
  /* Forcer tous les éléments du slider à ne pas avoir de largeur limitée */
  #clem-slider .swiper-slide .elementor-element,
  .clem-slider .swiper-slide .elementor-element {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  /* Forcer le positionnement des e-con-inner dans les slides */
  #clem-slider .swiper-slide .e-con-inner,
  .clem-slider .swiper-slide .e-con-inner {
    margin: 0 !important;
    margin-left: 15% !important;
    margin-right: auto !important;
    margin-top: 15% !important;
    width: auto !important;
    text-align: left !important;
  }
  
  /* Max-width en desktop uniquement */
  @media (min-width: 769px) {
    #clem-slider .swiper-slide .e-con-inner,
    .clem-slider .swiper-slide .e-con-inner {
      max-width: 75vw !important;
    }
  }
  
  /* Override des styles Elementor flex pour les e-con-inner du slider */
  #clem-slider .e-con.e-flex > .e-con-inner,
  .clem-slider .e-con.e-flex > .e-con-inner {
    align-content: unset !important;
    align-items: unset !important;
    align-self: unset !important;
  }
  
  #clem-slider .e-con > .e-con-inner,
  .clem-slider .e-con > .e-con-inner {
    height: auto !important;
    padding-inline-end: 0 !important;
    padding-inline-start: 0 !important;
    display: block !important;
    padding-block-end: 0 !important;
    padding-block-start: 0 !important;
  }
  
  /* Titre principal (h2) de la slide */
  #clem-slider .elementor-slide-heading,
  #clem-slider h2,
  .clem-slider .elementor-slide-heading,
  .clem-slider h2 {
    color: var(--clem-color-white) !important;
    font-size: clamp(2rem, 5vw, 3.5rem) !important;
    font-weight: 700 !important;
    margin: 0 0 1.5rem !important;
    text-align: left !important;
    line-height: 1.2 !important;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3) !important;
  }
  
  /* Description (h5 ou paragraphe) de la slide */
  #clem-slider .elementor-slide-description,
  #clem-slider h5,
  #clem-slider p,
  .clem-slider .elementor-slide-description,
  .clem-slider h5,
  .clem-slider p {
    color: var(--clem-color-white) !important;
    font-size: clamp(0.95rem, 1.8vw, 1.1rem) !important;
    font-weight: 400 !important;
    margin: 0 0 2rem !important;
    text-align: left !important;
    line-height: 1.6 !important;
    opacity: 0.95 !important;
    max-width: 500px !important;
    text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3) !important;
  }
  
  /* Bouton CTA "Voir Plus" */
  #clem-slider .elementor-button,
  #clem-slider a.elementor-button,
  .clem-slider .elementor-button,
  .clem-slider a.elementor-button {
    display: inline-block !important;
    padding: 0.85rem 2rem !important;
    border: none !important;
    color: #555758 !important;
    background: #FAF6F2 !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    transition: all 0.3s ease !important;
    text-transform: none !important;
    letter-spacing: 0.5px !important;
  }
  
  #clem-slider .elementor-button:hover,
  #clem-slider a.elementor-button:hover,
  .clem-slider .elementor-button:hover,
  .clem-slider a.elementor-button:hover {
    background: #F0EBE5 !important;
    color: #3d3e3f !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(85, 87, 88, 0.15) !important;
  }
  
  /* Navigation du slider (flèches) - Chevrons sans fond ni bordure */
  #clem-slider .elementor-swiper-button-prev,
  #clem-slider .elementor-swiper-button-next,
  #clem-slider .swiper-button-prev,
  #clem-slider .swiper-button-next,
  .clem-slider .elementor-swiper-button-prev,
  .clem-slider .elementor-swiper-button-next,
  .clem-slider .swiper-button-prev,
  .clem-slider .swiper-button-next {
    color: var(--clem-color-white) !important;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-width: 0 !important;
    border-style: none !important;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    padding: 0 !important;
    font-size: 50px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    transition: opacity 0.3s ease !important;
  }
  
  /* Positionnement aux extrémités */
  #clem-slider .elementor-swiper-button-prev,
  #clem-slider .swiper-button-prev,
  .clem-slider .elementor-swiper-button-prev,
  .clem-slider .swiper-button-prev {
    left: 30px !important;
  }
  
  #clem-slider .elementor-swiper-button-next,
  #clem-slider .swiper-button-next,
  .clem-slider .elementor-swiper-button-next,
  .clem-slider .swiper-button-next {
    right: 30px !important;
  }
  
  /* Hover - légère opacité sans décalage */
  #clem-slider .elementor-swiper-button-prev:hover,
  #clem-slider .elementor-swiper-button-next:hover,
  #clem-slider .swiper-button-prev:hover,
  #clem-slider .swiper-button-next:hover,
  .clem-slider .elementor-swiper-button-prev:hover,
  .clem-slider .elementor-swiper-button-next:hover,
  .clem-slider .swiper-button-prev:hover,
  .clem-slider .swiper-button-next:hover {
    opacity: 0.7 !important;
    background: transparent !important;
    background-color: transparent !important;
    transform: translateY(-50%) !important;
  }
  
  /* Icône SVG des chevrons */
  #clem-slider .elementor-swiper-button svg,
  #clem-slider .swiper-button-prev svg,
  #clem-slider .swiper-button-next svg,
  .clem-slider .elementor-swiper-button svg,
  .clem-slider .swiper-button-prev svg,
  .clem-slider .swiper-button-next svg {
    width: 50px !important;
    height: 50px !important;
    fill: var(--clem-color-white) !important;
  }
  
  /* Pagination (points) du slider */
  #clem-slider .swiper-pagination-bullet,
  .clem-slider .swiper-pagination-bullet {
    background: var(--clem-color-white) !important;
    opacity: 0.5 !important;
    width: 12px !important;
    height: 12px !important;
  }
  
  #clem-slider .swiper-pagination-bullet-active,
  .clem-slider .swiper-pagination-bullet-active {
    opacity: 1 !important;
    background: var(--clem-color-white) !important;
  }
  
  /* Overlay sombre pour améliorer la lisibilité */
  #clem-slider .elementor-background-overlay,
  .clem-slider .elementor-background-overlay {
    background: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.2)) !important;
  }
  
  /* Responsive - Mobile */
  @media (max-width: 768px) {
    #clem-slider,
    .clem-slider {
      min-height: 40vh !important;
    }
  
    #clem-slider .elementor-slide-content,
    #clem-slider .swiper-slide-contents,
    .clem-slider .elementor-slide-content,
    .clem-slider .swiper-slide-contents {
      margin-left: 0 !important;
      text-align: left !important;
      max-width: 100% !important;
      padding: 0 20px !important;
    }
  
    #clem-slider .elementor-slide-heading,
    #clem-slider h2,
    #clem-slider h1,
    .clem-slider .elementor-slide-heading,
    .clem-slider h2,
    .clem-slider h1 {
      text-align: left !important;
      font-size: clamp(1.3rem, 5.5vw, 2.2rem) !important;
    }
  
    #clem-slider .elementor-slide-description,
    #clem-slider h5,
    #clem-slider p,
    #clem-slider span,
    .clem-slider .elementor-slide-description,
    .clem-slider h5,
    .clem-slider p,
    .clem-slider span {
      text-align: left !important;
      max-width: 100% !important;
      font-size: clamp(0.8rem, 3.5vw, 0.95rem) !important;
    }
  
    #clem-slider .elementor-button,
    #clem-slider a.elementor-button,
    .clem-slider .elementor-button,
    .clem-slider a.elementor-button {
      font-size: 0.9rem !important;
      padding: 0.75rem 1.5rem !important;
    }
  
    #clem-slider .swiper-slide,
    #clem-slider .elementor-slide,
    .clem-slider .swiper-slide,
    .clem-slider .elementor-slide {
      justify-content: flex-start !important;
    }
  
    /* Chevrons aux extrémités en mobile */
    #clem-slider .elementor-swiper-button-prev,
    #clem-slider .swiper-button-prev,
    .clem-slider .elementor-swiper-button-prev,
    .clem-slider .swiper-button-prev {
      left: 0 !important;
    }
  
    #clem-slider .elementor-swiper-button-next,
    #clem-slider .swiper-button-next,
    .clem-slider .elementor-swiper-button-next,
    .clem-slider .swiper-button-next {
      right: 0 !important;
    }
  }
  
  /* ==========================================================================
     Bloc Logo Stats (#clem-logo) — Carte overlay à cheval sur slider/vidéo
     ========================================================================== */
  
  
  /* Container principal - Position relative avec margin négatif pour chevaucher */
  #clem-logo {
    position: relative !important;
    margin: -180px auto 0 !important; /* Margin-top négatif pour chevaucher slider et vidéo */
    z-index: 10 !important;
    width: 1024px !important;
    height: 140px !important;
    max-width: 95% !important;
    padding: 20px 30px !important;
    border-radius: 20px !important;
    background: #FFF !important;
    box-shadow: 0 4px 9.5px 0 rgba(165, 165, 165, 0.25) !important;
  }
  
  /* Inner container flex */
  #clem-logo .e-con-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    height: 100% !important;
  }
  
  /* Chaque sous-bloc (4 colonnes) */
  #clem-logo .e-con-full.e-flex.e-con.e-child {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 !important;
    gap: 8px !important;
    position: relative !important;
  }
  
  /* Séparation verticale entre les sous-blocs (sauf le dernier) */
  #clem-logo .e-con-full.e-flex.e-con.e-child:not(:last-child)::after {
    content: "" !important;
    position: absolute !important;
    right: 0 !important;
    top: 15% !important;
    bottom: 15% !important;
    width: 1px !important;
    background: rgba(134, 38, 16, 0.27) !important;
  }
  
  /* Images/logos */
  #clem-logo .elementor-widget-image img {
    width: 60px !important;
    height: 60px !important;
    object-fit: contain !important;
  }
  
  /* Titres (texte des stats) */
  #clem-logo .elementor-heading-title {
    color: #555758 !important;
    text-align: center !important;
    font-family: "Red Hat Display", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 130% !important;
    letter-spacing: 0.16px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
  }
  
  /* Responsive - Mobile */
  @media (max-width: 1100px) {
    #clem-logo {
      width: 90% !important;
      height: auto !important;
      padding: 20px 15px !important;
      position: relative !important;
      transform: none !important;
      left: auto !important;
      bottom: auto !important;
      margin: 0px auto 30px !important;
    }
  
    #clem-logo .e-con-inner {
      flex-wrap: wrap !important;
      gap: 20px !important;
    }
  
    #clem-logo .e-con-full.e-flex.e-con.e-child {
      flex: 0 0 calc(50% - 10px) !important;
      min-width: 45% !important;
    }
  
    #clem-logo .e-con-full.e-flex.e-con.e-child:not(:last-child)::after {
      display: none !important;
    }
  
    #clem-logo .e-con-full.e-flex.e-con.e-child:nth-child(odd)::after {
      content: "" !important;
      display: block !important;
    }
  
    #clem-logo .elementor-widget-image img {
      width: 50px !important;
      height: 50px !important;
    }
  
    #clem-logo .elementor-heading-title {
      font-size: 12px !important;
    }
  }
  
  /* ==========================================================================
     Boutons avec point décoratif (slider, vidéo, book)
     ========================================================================== */
  
  #clem-slider .elementor-button.elementor-button-link.elementor-size-sm,
  #clem-video .elementor-button.elementor-button-link.elementor-size-sm,
  #clem-book .elementor-button.elementor-button-link.elementor-size-sm,
  .clem-slider .elementor-button.elementor-button-link.elementor-size-sm {
    border: 1px solid currentColor !important;
    padding: 12px 24px !important;
    position: relative !important;
    padding-left: 36px !important;
  }
  
  /* Point décoratif avant le texte */
  #clem-slider .elementor-button.elementor-button-link.elementor-size-sm::before,
  #clem-video .elementor-button.elementor-button-link.elementor-size-sm::before,
  #clem-book .elementor-button.elementor-button-link.elementor-size-sm::before,
  .clem-slider .elementor-button.elementor-button-link.elementor-size-sm::before {
    content: "" !important;
    position: absolute !important;
    left: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background-color: currentColor !important;
  }
  
  /* ==========================================================================
     Bloc Vidéo (#clem-video) — 100% Fabrication Française
     ========================================================================== */
  
  /* Container principal */
  #clem-video {
    background: #FAF6F2 !important;
    background-image: url('/wp-content/uploads/2026/02/vector-1.png') !important;
    background-repeat: no-repeat !important;
    background-position: right center !important;
    background-size: contain !important;
    padding-top: 120px !important;
    padding-bottom: 80px !important;
  }
  
  /* Titre principal */
  #clem-video .elementor-heading-title {
    color: #555758 !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
    font-family: Poppins, sans-serif !important;
    font-size: 40px !important;
    font-style: normal !important;
    font-weight: 300 !important;
    line-height: 130% !important;
    letter-spacing: 0.4px !important;
    margin-bottom: 20px !important;
  }
  
  /* Paragraphe/Description */
  #clem-video .elementor-text-editor p,
  #clem-video .elementor-widget-text-editor {
    color: #555758 !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 140% !important;
    letter-spacing: 0.18px !important;
  }
  
  /* Widget vidéo */
  #clem-video .elementor-widget-video {
    width: 529px !important;
    max-width: 100% !important;
  }
  
  #clem-video .elementor-wrapper,
  #clem-video .elementor-video {
    width: 529px !important;
    height: 292px !important;
    max-width: 100% !important;
    aspect-ratio: 125/69 !important;
    overflow: hidden !important;
  }
  
  /* Responsive - Mobile */
  @media (max-width: 768px) {
    #clem-video {
      padding-top: 80px !important;
      padding-bottom: 60px !important;
      background-size: 50% !important;
    }
  
    #clem-video .elementor-heading-title {
      font-size: 28px !important;
    }
  
    #clem-video .elementor-text-editor p {
      font-size: 16px !important;
    }
  
    #clem-video .elementor-widget-video,
    #clem-video .elementor-wrapper,
    #clem-video .elementor-video {
      width: 100% !important;
      height: auto !important;
    }
  }
  
  /* ==========================================================================
     Bloc Catégories (#clem-categories)
     ========================================================================== */
  
  /* Container principal */
  #clem-categories {
    padding: 80px 40px !important;
    background: #FFF !important;
  }
  
  /* Supprimer le max-width et padding Elementor sur le parent du shortcode */
  .test-categories,
  .test-categories > .e-con-inner,
  #clem-categories.e-con > .e-con-inner {
    max-width: none !important;
    padding: 0 !important;
  }
  
  .clem-categories__container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    width: 100% !important;
  }
  
  /* Header avec titre et navigation */
  .clem-categories__header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 40px !important;
  }
  
  /* Titre */
  .clem-categories__title {
    color: #555758 !important;
    font-family: Poppins, sans-serif !important;
    font-size: 40px !important;
    font-weight: 400 !important;
    line-height: 130% !important;
    margin: 0 !important;
  }
  
  /* Navigation carousel (cachée par défaut, visible sur mobile) */
  .clem-categories__nav {
    display: none !important;
    gap: 10px !important;
  }
  
  .clem-categories__nav-btn {
    width: auto !important;
    height: auto !important;
    border: none !important;
    background: transparent !important;
    color: #555758 !important;
    font-size: 40px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 5px !important;
  }
  
  .clem-categories__nav-btn:hover:not([style*="pointer-events: none"]) {
    color: #000 !important;
    transform: scale(1.15) !important;
  }
  
  .clem-categories__nav-btn:active {
    transform: scale(0.9) !important;
  }
  
  /* Grille principale : 3 colonnes (gauche, centre large, droite) */
  .clem-categories__grid {
    display: grid !important;
    grid-template-columns: minmax(200px, 1fr) minmax(400px, 2fr) minmax(200px, 1fr) !important;
    grid-template-rows: auto auto !important;
    gap: 20px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  
  /* Colonne gauche : Le froid (occupe 2 lignes) */
  .clem-categories__left {
    grid-column: 1 !important;
    grid-row: 1 / 3 !important;
    min-width: 0 !important;
  }
  
  /* Container centre : occupe colonne 2, lignes 1-2 */
  .clem-categories__center {
    grid-column: 2 !important;
    grid-row: 1 / 3 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    min-width: 0 !important;
  }
  
  /* Ligne 1 du centre : Cuisson + Ligne Gourmet */
  .clem-categories__center-row-1 {
    display: flex !important;
    justify-content: space-between !important;
    gap: 20px !important;
    min-width: 0 !important;
  }
  
  /* Ligne 2 du centre : Hygiène + Friteuse + Fours */
  .clem-categories__center-row-2 {
    display: flex !important;
    justify-content: space-between !important;
    gap: 20px !important;
    min-width: 0 !important;
  }
  
  /* Éléments dans les lignes centrales */
  .clem-categories__center-row-1 .clem-categories__item,
  .clem-categories__center-row-2 .clem-categories__item {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }
  
  /* Colonne droite : Plancha (occupe 2 lignes) */
  .clem-categories__right {
    grid-column: 3 !important;
    grid-row: 1 / 3 !important;
    min-width: 0 !important;
  }
  
  /* Chaque carte catégorie - Structure simple en 3 parties */
  .clem-categories__item {
    position: relative !important;
    background: rgba(250, 246, 242, 0.78) !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    height: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
  }
  
  .clem-categories__item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1) !important;
  }
  
  .clem-categories__link {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    text-decoration: none !important;
    padding: 12px !important;
    height: 100% !important;
    gap: 0 !important;
  }
  
  /* Image catégorie - grande et centrée */
  .clem-categories__image {
    flex: 1 !important;
    min-height: 150px !important;
  }
  
  /* Images pour gauche et droite (grandes cartes) */
  .clem-categories__left .clem-categories__image,
  .clem-categories__right .clem-categories__image {
    min-height: 200px !important;
  }
  
  /* Images pour centre (petites cartes) */
  .clem-categories__center-row-1 .clem-categories__image,
  .clem-categories__center-row-2 .clem-categories__image {
    min-height: 100px !important;
    width: 80% !important;
    margin-left: auto !important;
  }
  
  
  /* Badge (Gamme Pro / Gamme Ménager) */
  .clem-categories__badge {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    padding: 6px 12px !important;
    background: #DFB122 !important;
    color: #FFF !important;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: "Plus Jakarta Sans";
    font-size: 14px !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    z-index: 2 !important;
  }
  
  /* Image */
  .clem-categories__image {
    width: 100% !important;
    height: 160px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 0 !important;
    background: transparent !important;
  }
  
  .clem-categories__image img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    transition: transform 0.3s ease !important;
  }
  
  .clem-categories__link:hover .clem-categories__image img {
    transform: scale(1.05) !important;
  }
  
  /* Nom de la catégorie */
  .clem-categories__name {
    color: #555758 !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
    font-family: Poppins, sans-serif !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    letter-spacing: 0.16px !important;
    text-align: left !important;
    margin: 0 !important;
    text-decoration: underline !important;
    padding: 0 !important;
  }
  
  /* Responsive - Tablette */
  @media (max-width: 1024px) {
    .clem-categories__grid {
      grid-template-columns: repeat(3, 1fr) !important;
    }
  }
  
  /* Responsive - Mobile - Carousel */
  @media (max-width: 768px) {
    #clem-categories {
      padding: 40px 0 !important;
    }
    
    .clem-categories__container {
      padding: 0 20px !important;
    }
  
    .clem-categories__header {
      margin-bottom: 20px !important;
    }
  
    .clem-categories__title {
      font-size: 26px !important;
    }
  
    .clem-categories__nav {
      display: flex !important;
    }
  
    .clem-categories__nav-btn {
      font-size: 36px !important;
    }
  
    /* Carousel horizontal */
    .clem-categories__grid {
      display: flex !important;
      flex-direction: row !important;
      flex-wrap: nowrap !important;
      gap: 15px !important;
      overflow-x: auto !important;
      scroll-snap-type: x mandatory !important;
      scroll-behavior: smooth !important;
      -webkit-overflow-scrolling: touch !important;
      padding: 0 !important;
    }
  
    /* Masquer la scrollbar */
    .clem-categories__grid::-webkit-scrollbar {
      display: none !important;
    }
  
    .clem-categories__grid {
      -ms-overflow-style: none !important;
      scrollbar-width: none !important;
    }
  
    .clem-categories__left,
    .clem-categories__right {
      grid-column: unset !important;
      grid-row: unset !important;
      flex: 0 0 280px !important;
      max-width: 280px !important;
      scroll-snap-align: center !important;
    }
  
    .clem-categories__center {
      grid-column: unset !important;
      grid-row: unset !important;
      display: flex !important;
      flex-direction: row !important;
      gap: 15px !important;
      flex: 0 0 auto !important;
    }
  
    .clem-categories__center-row-1,
    .clem-categories__center-row-2 {
      display: contents !important;
    }
  
    .clem-categories__center .clem-categories__item {
      flex: 0 0 280px !important;
      max-width: 280px !important;
      scroll-snap-align: center !important;
    }
  
    .clem-categories__grid {
      padding: 0 20px !important;
    }
  
    .clem-categories__item {
      min-height: 200px !important;
      height: 200px !important;
    }
  
    .clem-categories__image {
      height: 120px !important;
      min-height: 120px !important;
    }
  
    .clem-categories__left .clem-categories__image,
    .clem-categories__right .clem-categories__image {
      height: 120px !important;
      min-height: 120px !important;
    }
  
    .clem-categories__center-row-1 .clem-categories__image,
    .clem-categories__center-row-2 .clem-categories__image {
      height: 100px !important;
      min-height: 100px !important;
      width: 100% !important;
      margin-left: 0 !important;
    }
  
    .clem-categories__name {
      font-size: 16px !important;
      padding: 12px !important;
    }
  }
  
  /* ==========================================================================
     Bloc Nouveautés (#clem-nouveautes)
     ========================================================================== */
  
  /* Override Elementor container max-width et background */
  .e-con:has(#clem-nouveautes) {
    background: rgba(250, 246, 242, 0.30) !important;
  }
  
  .e-con:has(#clem-nouveautes),
  .e-con:has(#clem-nouveautes) > .e-con-inner {
    max-width: none !important;
    padding: 0 !important;
  }
  
  #clem-nouveautes {
    padding: 80px 40px !important;
    overflow: hidden !important;
    background: #FFF !important;
  }
  
  .clem-nouveautes__container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }
  
  /* Header avec titre et navigation */
  .clem-nouveautes__header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 40px !important;
  }
  
  .clem-nouveautes__section-title {
    color: #555758;
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: Poppins;
    font-size: 40px;
    font-style: normal;
    font-weight: 300;
    line-height: 130%; /* 52px */
    letter-spacing: 0.4px;
  }
  
  .clem-nouveautes__nav {
    display: flex !important;
    gap: 12px !important;
  }
  
  .clem-nouveautes__nav-btn {
    width: 40px !important;
    height: 40px !important;
    border: none !important;
    background: transparent !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 32px !important;
    color: #555758 !important;
    transition: color 0.3s ease !important;
  }
  
  .clem-nouveautes__nav-btn:hover {
    color: #000 !important;
  }
  
  /* Slider wrapper */
  .clem-nouveautes__slider-wrapper {
    overflow: hidden !important;
    width: 100% !important;
  }
  
  .clem-nouveautes__slider {
    display: flex !important;
    gap: 20px !important;
    overflow-x: auto !important;
    scroll-behavior: smooth !important;
    scroll-snap-type: x mandatory !important;
    scrollbar-width: none !important; /* Firefox */
    -ms-overflow-style: none !important; /* IE */
    padding-bottom: 20px !important;
  }
  
  .clem-nouveautes__slider::-webkit-scrollbar {
    display: none !important; /* Chrome, Safari, Opera */
  }
  
  /* Carte produit (carousel) — wrapper flex, style visuel = .clem-nouveautes__item--listing via shop.css */
  .clem-nouveautes__item {
    position: relative !important;
    flex: 0 0 260px !important;
    min-width: 260px !important;
    background: none !important;
    border: none !important;
    border-radius: 8px !important;
    overflow: visible !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    scroll-snap-align: center !important;
  }
  
  .clem-nouveautes__item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12) !important;
  }
  
  /* Inner card = même style que listing (sans bordure) */
  #clem-nouveautes .clem-nouveautes__item--listing {
    background: #fff !important;
    border-radius: 8px !important;
  }
  
  .clem-nouveautes__link {
    display: block !important;
    text-decoration: none !important;
    color: inherit !important;
    height: 100% !important;
    padding: 16px !important;
  }
  
  /* Badge gamme (haut gauche) */
  .clem-nouveautes__badge-gamme {
    position: absolute !important;
    top: 16px !important;
    left: 16px !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: #FBF7F4 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    z-index: 2 !important;
  }
  
  /* Container pour tags + wishlist (haut droite) */
  .clem-nouveautes__top-right {
    position: absolute !important;
    top: 16px !important;
    right: 16px !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
    z-index: 2 !important;
  }
  
  /* Badges tags */
  .clem-nouveautes__badges-tags {
    display: flex !important;
    gap: 6px !important;
  }
  
  .clem-nouveautes__tag-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
  }
  
  .clem-nouveautes__tag-icon svg {
    width: 100% !important;
    height: 100% !important;
  }
  
  /* Bouton Wishlist */
  .clem-nouveautes__wishlist-btn {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    transition: transform 0.2s ease !important;
  }
  
  .clem-nouveautes__wishlist-btn:hover {
    transform: scale(1.1) !important;
  }
  
  .clem-nouveautes__wishlist-btn:active {
    transform: scale(0.95) !important;
  }
  
  /* Cœurs (empty et full) */
  .clem-nouveautes__heart {
    width: 24px !important;
    height: 24px !important;
    display: block !important;
  }
  
  .clem-nouveautes__heart--full {
    display: none !important;
  }
  
  .clem-nouveautes__wishlist-btn.is-favorite .clem-nouveautes__heart--empty {
    display: none !important;
  }
  
  .clem-nouveautes__wishlist-btn.is-favorite .clem-nouveautes__heart--full {
    display: block !important;
  }
  
  /* Image du produit */
  .clem-nouveautes__image-wrapper {
    width: 100% !important;
    height: 220px !important;
    border-radius: 4px !important;
    background: #FBF7F4 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    margin-bottom: 16px !important;
  }
  
  .clem-nouveautes__image {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    padding: 20px !important;
  }
  
  /* Informations produit */
  .clem-nouveautes__info {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }
  
  /* Référence */
  .clem-nouveautes__reference {
    color: #999 !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
    font-family: Poppins, sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    margin: 0 !important;
    line-height: 1.4 !important;
  }
  
  /* Rating (étoiles + avis) */
  .clem-nouveautes__rating {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }
  
  .clem-nouveautes__stars {
    display: flex !important;
    gap: 2px !important;
  }
  
  .clem-nouveautes__star {
    font-size: 16px !important;
    line-height: 1 !important;
  }
  
  .clem-nouveautes__star--full {
    color: #F39C12 !important;
  }
  
  .clem-nouveautes__star--half {
    color: #F39C12 !important;
    opacity: 0.5 !important;
  }
  
  .clem-nouveautes__star--empty {
    color: #DDD !important;
  }
  
  .clem-nouveautes__review-count {
    color: #999 !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
    font-family: Poppins, sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
  }
  
  /* Titre du produit */
  .clem-nouveautes__title {
    color: #64181C !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
    font-family: Poppins, sans-serif !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    text-decoration: underline !important;
  }
  
  .clem-nouveautes__title:hover {
    color: #8B2428 !important;
  }
  
  /* Message si aucun produit */
  .clem-nouveautes__no-products {
    color: #999 !important;
    font-family: Poppins, sans-serif !important;
    font-size: 16px !important;
    text-align: center !important;
    padding: 40px 20px !important;
  }
  
  /* Responsive - Tablette */
  @media (max-width: 1024px) {
    #clem-nouveautes {
      padding: 60px 30px !important;
    }
    
    .clem-nouveautes__section-title {
      font-size: 28px !important;
    }
    
    .clem-nouveautes__item {
      flex: 0 0 240px !important;
      min-width: 240px !important;
    }
  }
  
  /* Responsive - Mobile */
  @media (max-width: 768px) {
    #clem-nouveautes {
      padding: 40px 20px !important;
    }
    
    .clem-nouveautes__header {
      margin-bottom: 24px !important;
    }
    
    .clem-nouveautes__section-title {
      font-size: 24px !important;
    }
    
    .clem-nouveautes__nav-btn {
      width: 36px !important;
      height: 36px !important;
      font-size: 28px !important;
    }
    
    .clem-nouveautes__item {
      flex: 0 0 220px !important;
      min-width: 220px !important;
    }
    
    .clem-nouveautes__image-wrapper {
      height: 180px !important;
    }
  }
  
  /* ==========================================================================
     Bloc Certifications (#clem-brand)
     ========================================================================== */
  
  #clem-brand {
    width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    background: #FAF6F2 !important;
    padding: 23px 0 !important;
    overflow: hidden !important;
  }
  
  #clem-brand .e-con-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-evenly !important;
    gap: 40px !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 40px !important;
  }
  
  /* Chaque logo : animation d'apparition staggerée */
  #clem-brand .e-con-full.e-flex.e-con.e-child {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    --width: auto !important;
    opacity: 0;
    animation: brandFadeIn 0.5s ease forwards;
  }
  
  #clem-brand .e-con-full.e-flex.e-con.e-child:nth-child(1)  { animation-delay: 0.05s; }
  #clem-brand .e-con-full.e-flex.e-con.e-child:nth-child(2)  { animation-delay: 0.15s; }
  #clem-brand .e-con-full.e-flex.e-con.e-child:nth-child(3)  { animation-delay: 0.25s; }
  #clem-brand .e-con-full.e-flex.e-con.e-child:nth-child(4)  { animation-delay: 0.35s; }
  #clem-brand .e-con-full.e-flex.e-con.e-child:nth-child(5)  { animation-delay: 0.45s; }
  #clem-brand .e-con-full.e-flex.e-con.e-child:nth-child(6)  { animation-delay: 0.55s; }
  #clem-brand .e-con-full.e-flex.e-con.e-child:nth-child(7)  { animation-delay: 0.65s; }
  #clem-brand .e-con-full.e-flex.e-con.e-child:nth-child(8)  { animation-delay: 0.75s; }
  #clem-brand .e-con-full.e-flex.e-con.e-child:nth-child(9)  { animation-delay: 0.85s; }
  #clem-brand .e-con-full.e-flex.e-con.e-child:nth-child(10) { animation-delay: 0.95s; }
  
  @keyframes brandFadeIn {
    from {
      opacity: 0;
      transform: translateY(12px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  #clem-brand .elementor-widget-image img {
    width: 104px !important;
    height: 89px !important;
    object-fit: contain !important;
    display: block !important;
    transition: transform 0.3s ease, opacity 0.3s ease;
  }
  
  #clem-brand .elementor-widget-image img:hover {
    transform: scale(1.08);
    opacity: 0.85;
  }
  
  @media (max-width: 768px) {
    #clem-brand {
      padding: 20px 40px !important;
    }
    #clem-brand .e-con-inner {
      gap: 30px !important;
    }
    #clem-brand .elementor-widget-image img {
      width: 80px !important;
      height: auto !important;
    }
  }
  
  /* ==========================================================================
     Bloc Catalogue (#clem-book)
     ========================================================================== */
  
  /* Container principal */
  #clem-book {
    padding: 0 !important;
    overflow: hidden !important;
    background: #FFF !important;
  }
  
  /* Inner container */
  #clem-book .e-con-inner {
    display: flex !important;
    align-items: center !important;
    gap: 60px !important;
    margin: 0 auto !important;
    width: 100vw !important;
    max-width: 100vw !important;
    padding: 100px 0 100px 0 !important;
  }
  
  /* Conteneur de l'image */
  #clem-book .e-con-full.e-flex.e-con.e-child:first-child {
    flex-shrink: 0 !important;
  }
  
  /* Image du livre - déplacée sur la gauche */
  #clem-book .elementor-widget-image img {
    max-width: 1015px !important;
    width: 125% !important;
    height: auto !important;
    /* aspect-ratio: 1 / 1 !important; */
    object-fit: cover !important;
    margin-left: -120px !important;
  }
  
  /* Conteneur du contenu texte */
  #clem-book .e-con-full.e-flex.e-con.e-child:last-child {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
    max-width: 500px !important;
  }
  
  /* Titre - styles de base */
  #clem-book .elementor-heading-title {
    color: #555758 !important;
    font-family: Poppins, sans-serif !important;
    font-size: 40px !important;
    font-style: normal !important;
    font-weight: 300 !important;
    line-height: 130% !important;
    letter-spacing: 1.2px !important;
    margin: 0 !important;
  }
  
  /* Pour "catalogue Roller Grill" en font-weight 400 */
  /* Utiliser un span ou strong dans Elementor pour cette partie */
  #clem-book .elementor-heading-title span,
  #clem-book .elementor-heading-title strong {
    font-weight: 400 !important;
  }
  
  /* Paragraphe */
  #clem-book .elementor-text-editor p {
    color: #555758 !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 140% !important;
    letter-spacing: 0.18px !important;
    margin: 0 !important;
  }
  
  /* Responsive - Mobile */
  @media (max-width: 768px) {
    #clem-book {
      padding: 0 !important;
    }
  
    #clem-book .e-con-inner {
      flex-direction: column !important;
      gap: 40px !important;
      padding: 60px 40px !important;
    }
  
    #clem-book .elementor-widget-image img {
      width: 100% !important;
      height: auto !important;
      max-width: 500px !important;
      margin-left: -50px !important;
    }
  
    #clem-book .elementor-heading-title {
      font-size: 28px !important;
    }
  
    #clem-book .elementor-text-editor p {
      font-size: 16px !important;
    }
  }
  
  /* ==========================================================================
     Bloc Avis Clients (#clem-review)
     ========================================================================== */
  
  /* Container principal - masquer l'overflow horizontal mais pas vertical */
  #clem-review {
    overflow: hidden !important;
    background: #FFF !important;
    margin: 30px auto !important;
  }
  
  /* Container swiper - permettre le débordement vertical pour la surélévation */
  #clem-review .elementor-main-swiper {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  
  /* Chaque slide */
  #clem-review .swiper-slide {
    border: none !important;
    opacity: 0.8 !important;
    transition: all 0.3s ease !important;
  }
  
  /* Slide du milieu visible - surélévée et opaque */
  #clem-review .swiper-slide-duplicate-next,
  #clem-review .swiper-slide-next:not(.swiper-slide-duplicate-next) {
    opacity: 1 !important;
    transform: translateY(-20px) !important;
  }
  
  /* Réorganisation de la structure : Étoiles → Texte → Nom */
  #clem-review .elementor-testimonial {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }
  
  #clem-review .elementor-testimonial__header {
    display: contents !important;
  }
  
  #clem-review .elementor-testimonial__cite {
    display: contents !important;
  }
  
  /* Étoiles - en haut et centrées */
  #clem-review .elementor-star-rating {
    order: 1 !important;
    display: flex !important;
    justify-content: center !important;
    gap: 4px !important;
    margin-bottom: 16px !important;
  }
  
  /* Masquer le contenu par défaut des étoiles */
  #clem-review .elementor-star-rating i {
    font-size: 0 !important;
    width: 26px !important;
    height: 24px !important;
    display: inline-block !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
  }
  
  /* Étoiles pour les cartes actives (non floues) - couleur pleine #D28132 */
  #clem-review .swiper-slide-duplicate-next .elementor-star-rating i,
  #clem-review .swiper-slide-next:not(.swiper-slide-duplicate-next) .elementor-star-rating i {
    background-image: url("data:image/svg+xml,%3Csvg width='26' height='24' viewBox='0 0 26 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.6165 0L16.515 7.89938L25.2345 9.1662L18.9255 15.3178L20.4151 24L12.6165 19.9011L4.81787 24L6.30748 15.3178L0 9.1662L8.71794 7.89938L12.6165 0Z' fill='%23D28132'/%3E%3C/svg%3E") !important;
  }
  
  /* Étoiles pour les cartes inactives (floues) - avec opacité 55% */
  #clem-review .swiper-slide:not(.swiper-slide-duplicate-next):not(.swiper-slide-next) .elementor-star-rating i {
    background-image: url("data:image/svg+xml,%3Csvg width='26' height='24' viewBox='0 0 26 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.6165 0L16.515 7.89938L25.2345 9.1662L18.9255 15.3178L20.4151 24L12.6165 19.9011L4.81787 24L6.30748 15.3178L0 9.1662L8.71794 7.89938L12.6165 0Z' fill='%23D28132' fill-opacity='0.55'/%3E%3C/svg%3E") !important;
  }
  
  /* Texte de l'avis - au milieu */
  #clem-review .elementor-testimonial__content {
    order: 2 !important;
    margin-bottom: 12px !important;
  }
  
  #clem-review .elementor-testimonial__text {
    color: #64181C !important;
    text-align: center !important;
    font-family: Gotham, sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    letter-spacing: 0.053px !important;
  }
  
  /* Nom du client - en bas et en italique */
  #clem-review .elementor-testimonial__name {
    order: 3 !important;
    color: #64181C !important;
    text-align: center !important;
    font-family: Gotham, sans-serif !important;
    font-size: 16px !important;
    font-style: italic !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    letter-spacing: 0.053px !important;
  }
  
  /* Icône à masquer */
  #clem-review .elementor-testimonial__icon {
    display: none !important;
  }
  
  /* Responsive - Mobile */
  @media (max-width: 768px) {
    /* Toutes les cartes nettes en mobile */
    #clem-review .swiper-slide {
      opacity: 1 !important;
    }
  
    /* Forcer les étoiles oranges sur TOUTES les cartes en mobile */
    #clem-review .swiper-slide .elementor-star-rating i,
    #clem-review .swiper-slide:not(.swiper-slide-duplicate-next):not(.swiper-slide-next) .elementor-star-rating i,
    #clem-review .swiper-slide-duplicate-next .elementor-star-rating i,
    #clem-review .swiper-slide-next:not(.swiper-slide-duplicate-next) .elementor-star-rating i {
      background-image: url("data:image/svg+xml,%3Csvg width='26' height='24' viewBox='0 0 26 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.6165 0L16.515 7.89938L25.2345 9.1662L18.9255 15.3178L20.4151 24L12.6165 19.9011L4.81787 24L6.30748 15.3178L0 9.1662L8.71794 7.89938L12.6165 0Z' fill='%23D28132'/%3E%3C/svg%3E") !important;
    }
  
    /* Boutons de navigation aux extrémités */
    #clem-review .elementor-swiper-button-prev {
      left: 0 !important;
    }
  
    #clem-review .elementor-swiper-button-next {
      right: 0 !important;
    }
  }
  
  /* ==========================================================================
     Bloc Blog (#clem-blog)
     ========================================================================== */
  
  /* Container principal - 100vw */
  #clem-blog {
    width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    background: #FAF6F2 !important;
    background-image: url('/wp-content/uploads/2026/02/vector2.png') !important;
    background-repeat: no-repeat !important;
    background-position: left bottom -180px !important;
    background-size: 550px auto !important;
    padding: 80px 120px !important;
    position: relative !important;
    overflow: visible !important;
  }
  
  /* Container flex principal */
  .clem-blog__container {
    display: flex !important;
    gap: 60px !important;
    align-items: stretch !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
  }
  
  /* Article Nouveauté (GAUCHE) */
  .clem-blog__featured {
    flex: 0 0 45% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    order: 1 !important;
  }
  
  .clem-blog__title {
    color: #555758 !important;
    font-family: Poppins, sans-serif !important;
    font-size: 32px !important;
    font-weight: 400 !important;
    line-height: 130% !important;
    margin: 0 0 24px !important;
    padding-top: 24px !important;
    border-bottom: 1px solid rgba(85, 87, 88, 0.50) !important;
  }
  
  .clem-blog__featured-content {
    display: flex !important;
    gap: 20px !important;
    align-items: flex-start !important;
    flex-direction: row-reverse !important;
  }
  
  .clem-blog__featured-image {
    flex: 0 0 180px !important;
    width: 180px !important;
    height: 260px !important;
    overflow: hidden !important;
  }
  
  .clem-blog__featured-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.3s ease !important;
  }
  
  .clem-blog__featured-image:hover img {
    transform: scale(1.05) !important;
  }
  
  .clem-blog__featured-text {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
  }
  
  .clem-blog__featured-title {
    margin: 0 !important;
  }
  
  .clem-blog__featured-title a {
    color: #555758 !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
    font-family: Poppins, sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 130% !important;
    letter-spacing: 0.18px !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
  }
  
  .clem-blog__featured-title a:hover {
    color: #64181C !important;
  }
  
  /* Liste Recettes (DROITE) */
  .clem-blog__list {
    flex: 0 0 50% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
    order: 2 !important;
  }
  
  /* Chaque petit article */
  .clem-blog__item {
    display: flex !important;
    flex-direction: row-reverse !important;
    gap: 16px !important;
    padding-bottom: 24px !important;
    border-bottom: 1px solid rgba(85, 87, 88, 0.50) !important;
  }
  
  .clem-blog__item:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
  }
  
  .clem-blog__item-image {
    flex: 0 0 120px !important;
    width: 120px !important;
    height: 150px !important;
    overflow: hidden !important;
  }
  
  .clem-blog__item-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.3s ease !important;
  }
  
  .clem-blog__item-image:hover img {
    transform: scale(1.05) !important;
  }
  
  .clem-blog__item-content {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }
  
  .clem-blog__item-title a {
    color: #555758 !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
    font-family: Poppins, sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 130% !important;
    letter-spacing: 0.16px !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
  }
  
  .clem-blog__item-title a:hover {
    color: #64181C !important;
  }
  
  /* Tags (Nouveauté / Recettes) */
  .clem-blog__tag {
    display: inline-block !important;
    color: #555758 !important;
    font-feature-settings: 'liga' off, 'clig' off !important;
    font-family: Poppins, sans-serif !important;
    font-size: 11px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    line-height: 140% !important;
    letter-spacing: 0.12px !important;
    text-transform: uppercase !important;
    margin-bottom: 8px !important;
  }
  
  /* Responsive - Mobile */
  @media (max-width: 768px) {
    #clem-blog {
      padding: 60px 40px !important;
      background-size: 100% !important;
      background-position: left !important;
    }
  
    .clem-blog__container {
      flex-direction: column !important;
      gap: 40px !important;
    }
  
    .clem-blog__featured,
    .clem-blog__list {
      flex: 1 !important;
    }
  
    .clem-blog__item-image {
      flex: 0 0 100px !important;
      width: 100px !important;
      height: 100px !important;
    }
  }
  
  /* ==========================================================================
     Stats Hero (carte overlay en bas du slider)
     ========================================================================== */
  .clem-hero__stats {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 1.5rem !important;
    margin-top: 2rem !important;
    padding: 2rem 1rem !important;
    background: var(--clem-color-white) !important;
  }
  
  .clem-hero__stat-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 1rem !important;
    min-width: 200px !important;
  }
  
  .clem-hero__stat-item h2 {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: var(--clem-color-black) !important;
    margin: 0.5rem 0 0 !important;
  }
  
  /* ==========================================================================
     Bloc 2 — 100% Fabrication Française (clem-fabrication)
     ========================================================================== */
  .clem-fabrication {
    background-color: var(--clem-color-beige);
    padding: 3rem 0;
  }
  
  .clem-fabrication__title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--clem-color-black);
    margin: 0 0 1rem;
  }
  
  .clem-fabrication__text {
    color: var(--clem-color-black);
    margin: 0 0 1.5rem;
    line-height: 1.6;
  }
  
  .clem-fabrication__btn {
    display: inline-block;
    padding: 0.6rem 1.25rem;
    border: 1px solid var(--clem-color-black);
    color: var(--clem-color-black);
    background: transparent;
    border-radius: var(--clem-radius-button);
    text-decoration: none;
    font-weight: 500;
  }
  
  .clem-fabrication__image-wrap {
    max-width: 100%;
    border-radius: 4px;
    overflow: hidden;
  }
  
  .clem-fabrication__image-wrap img {
    width: 100%;
    height: auto;
    display: block;
  }
  
  /* ==========================================================================
     Bloc 3 — Vidéo (clem-video)
     ========================================================================== */
  .clem-video {
    padding: 2rem 0;
  }
  
  .clem-video__wrapper {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 900px;
    margin: 0 auto;
  }
  
  .clem-video__wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  
  /* ==========================================================================
     Bloc 4 — Catégories (clem-categories)
     ========================================================================== */
  .clem-categories {
    padding: 3rem 0;
  }
  
  .clem-categories__title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--clem-color-black);
    margin: 0 0 2rem;
    text-align: left;
  }
  
  .clem-categories__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 1.5rem;
  }
  
  .clem-categories__item {
    background: var(--clem-color-white);
    border-radius: 4px;
    overflow: hidden;
    text-align: center;
  }
  
  .clem-categories__image {
    position: relative;
    aspect-ratio: 1;
    background: var(--clem-color-white);
  }
  
  .clem-categories__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  /* ==========================================================================
     Bloc 5 — Certifications / Marques (clem-brand)
     ========================================================================== */
  .clem-brand {
    padding: 2rem 0;
    background: var(--clem-color-white);
  }
  
  .clem-brand__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2rem;
  }
  
  .clem-brand__logo {
    display: block;
    height: 48px;
    width: auto;
    object-fit: contain;
    filter: grayscale(0);
  }
  
  /* ==========================================================================
     Bloc 6 — Catalogue (clem-book)
     ========================================================================== */
  .clem-book {
    padding: 3rem 0;
  }
  
  .clem-book__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: center;
  }
  
  @media (max-width: 768px) {
    .clem-book__row {
      grid-template-columns: 1fr;
    }
  }
  
  .clem-book__image {
    max-width: 100%;
    height: auto;
  }
  
  .clem-book__title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--clem-color-grey-dark);
    margin: 0 0 1rem;
  }
  
  .clem-book__text {
    color: var(--clem-color-black);
    margin: 0 0 1.5rem;
    line-height: 1.6;
  }
  
  .clem-book__btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.25rem;
    border: 1px solid var(--clem-color-grey-dark);
    color: var(--clem-color-grey-dark);
    background: transparent;
    border-radius: var(--clem-radius-button);
    text-decoration: none;
    font-weight: 500;
  }
  
  /* ==========================================================================
     Bloc 7 — Blog (clem-blog)
     ========================================================================== */
  .clem-blog {
    padding: 3rem 0;
    background: var(--clem-color-beige);
  }
  
  .clem-blog__title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--clem-color-grey-dark);
    margin: 0 0 2rem;
  }
  
  .clem-blog__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
  
  @media (max-width: 768px) {
    .clem-blog__row {
      grid-template-columns: 1fr;
    }
  }
  
  .clem-blog__subtitle {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--clem-color-grey-dark);
    margin: 0 0 0.5rem;
  }
  
  .clem-blog__nouveaute-desc {
    margin: 0 0 1rem;
    line-height: 1.5;
  }
  
  .clem-blog__recettes-list {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  
  .clem-blog__recette-item {
    margin-bottom: 1rem;
  }
  
  .clem-blog__recette-link {
    display: flex;
    gap: 1rem;
    align-items: center;
    text-decoration: none;
    color: var(--clem-color-black);
    font-weight: 600;
  }
  
  .clem-blog__recette-thumb {
    width: 80px;
    height: 60px;
    object-fit: cover;
    border-radius: 4px;
  }
  
  /* ==========================================================================
     Bloc 8 — Nouveautés (clem-nouveautes)
     ========================================================================== */
  .clem-nouveautes {
    padding: 3rem 0;
  }
  
  .clem-nouveautes__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2rem;
  }
  
  .clem-nouveautes__title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--clem-color-black);
    margin: 0;
  }
  
  .clem-nouveautes__nav {
    display: flex;
    gap: 0.5rem;
  }
  
  .clem-nouveautes__nav-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid var(--clem-color-grey-dark);
    background: var(--clem-color-white);
    color: var(--clem-color-grey-dark);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .clem-nouveautes__product {
    background: var(--clem-color-white);
    border-radius: 4px;
    overflow: hidden;
    text-align: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  }
  
  .clem-nouveautes__product-image {
    position: relative;
    aspect-ratio: 1;
    background: var(--clem-color-white);
  }
  
  .clem-nouveautes__product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .clem-nouveautes__product-ref {
    font-size: 0.8rem;
    color: var(--clem-color-grey-dark);
    margin: 0.5rem 0 0;
  }
  
  .clem-nouveautes__product-stars {
    margin: 0.25rem 0;
    color: var(--clem-color-yellow);
  }
  
  .clem-nouveautes__product-name {
    font-weight: 700;
    color: var(--clem-color-black);
    margin: 0 0 0.5rem;
    padding: 0 0.5rem;
    font-size: 0.95rem;
  }
  
  /* ==========================================================================
     Bloc 9 — Avis / Témoignages (clem-review)
     ========================================================================== */
  .clem-review {
    padding: 3rem 0;
  }
  
  .clem-review__title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--clem-color-black);
    margin: 0 0 2rem;
    text-align: center;
  }
  
  .clem-review__list {
    display: flex;
    gap: 1.5rem;
    overflow-x: auto;
    padding-bottom: 1rem;
    scroll-snap-type: x mandatory;
  }
  
  .clem-review__card {
    flex: 0 0 min(300px, 90vw);
    scroll-snap-align: start;
    background: var(--clem-color-white);
    border-radius: 8px;
    padding: 1.5rem;
    text-align: center;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  }
  
  .clem-review__stars {
    margin-bottom: 1rem;
    color: var(--clem-color-yellow);
  }
  
  .clem-review__avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    margin: 0 auto 1rem;
    display: block;
  }
  
  .clem-review__quote {
    font-style: italic;
    color: var(--clem-color-black);
    margin: 0 0 1rem;
    line-height: 1.5;
    font-size: 0.95rem;
  }
  
  .clem-review__author {
    font-weight: 600;
    color: var(--clem-color-grey-dark);
    margin: 0;
    font-size: 0.9rem;
  }
  
  /* ==========================================================================
     Utilitaires clem (optionnel)
     ========================================================================== */
  .clem-wave-bg {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320'%3E%3Cpath fill='%23f5f0e8' fill-opacity='0.3' d='M0,160L48,176C96,192,192,224,288,213.3C384,203,480,149,576,138.7C672,128,768,160,864,165.3C960,171,1056,149,1152,138.7C1248,128,1344,128,1392,128L1440,128L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
  }
  
  /* ==========================================================================
     RESPONSIVE - Catégories
     ========================================================================== */
  
  /* Tablette : 2 colonnes */
  @media (min-width: 769px) and (max-width: 1024px) {
    #clem-categories {
      padding: 60px 30px !important;
    }
    
    .clem-categories__grid {
      grid-template-columns: repeat(2, 1fr) !important;
      gap: 20px !important;
    }
    
    .clem-categories__left,
    .clem-categories__right {
      grid-column: span 1 !important;
      grid-row: span 1 !important;
    }
    
    .clem-categories__center {
      grid-column: span 2 !important;
      grid-row: span 1 !important;
    }
  }