/* Ajout isolé : ne modifie ni le menu, ni le hero, ni les couleurs existantes du site. */
.site-engagements{background:#ffa800;color:#10223e;border-bottom:1px solid rgba(13,35,66,.18);overflow:hidden}
.site-engagements .container{display:block!important;overflow:hidden;padding:0!important}
.site-engagements-track{display:flex;width:max-content;animation:its-engagements-scroll 22s linear infinite}
.site-engagements-track>div{min-width:295px;min-height:48px;display:flex;align-items:center;justify-content:center;gap:7px;padding:6px 14px;border-right:1px solid rgba(13,35,66,.18)}
.site-engagements:hover .site-engagements-track{animation-play-state:paused}.site-engagements i{display:inline-flex;align-items:center;justify-content:center;flex:0 0 25px;width:25px;height:25px;border-radius:50%;background:#10223e;color:#ffa800;font-size:11px}.site-engagements span{display:block;line-height:1.12}.site-engagements b{display:block;font-size:11px;font-weight:800}.site-engagements small{display:block;margin-top:2px;color:rgba(16,34,62,.8);font-size:8px;font-weight:600}
@keyframes its-engagements-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* L'ancien bloc des mêmes avantages reste masqué, sans modifier index.php. */
.its-assurances{display:none!important}
@media(max-width:991px){.site-engagements-track>div{min-width:245px;justify-content:flex-start;padding:6px 10px;gap:6px}.site-engagements b{font-size:10px}.site-engagements small{font-size:8px}.site-engagements i{flex-basis:23px;width:23px;height:23px;font-size:10px}}
@media(max-width:767px){.site-engagements-track>div{min-width:100vw;min-height:36px;justify-content:center;padding:5px 12px}.site-engagements small{display:none}.site-engagements b{font-size:10px}.site-engagements i{flex-basis:19px;width:19px;height:19px;font-size:8px}.site-engagements-track{animation-duration:18s}}
@media(prefers-reduced-motion:reduce){.site-engagements-track{animation:none}}

/* Boutique : les catégories restent dans l'en-tête et le tiroir mobile.
   Cette colonne latérale est retirée afin de réserver toute la largeur aux produits. */
.page-categories .container > .row > .col-lg-3.col-sm-12{display:none!important}
.page-categories #prodsCols{flex:0 0 100%!important;max-width:100%!important;width:100%!important}

/* Le fil d'Ariane "Boutique" vide est retiré de la page Boutique. */
.page-categories nav:has(> .breadcrumb){display:none!important}

/* Finition visuelle : les extrémités du défilement sont fondues dans le
   bandeau pour éviter l'apparition de textes ou d'icônes coupés. */
.site-engagements{position:relative}
.site-engagements::before,.site-engagements::after{content:"";position:absolute;z-index:3;top:0;bottom:0;width:28px;pointer-events:none}
.site-engagements::before{left:0;background:linear-gradient(90deg,#ffa800 45%,rgba(255,168,0,0))}
.site-engagements::after{right:0;background:linear-gradient(270deg,#ffa800 45%,rgba(255,168,0,0))}

/* Hero compact et arrondi, compatible avec le navigateur et tous les écrans. */
@media (min-width:768px){
  .its-hero{
    width:calc(100% - 64px)!important;
    max-width:1320px!important;
    height:calc(56.25vw - 36px)!important;
    max-height:742px!important;
    margin:18px auto!important;
    border-radius:20px!important;
    overflow:hidden!important;
    box-shadow:0 12px 30px rgba(16,34,62,.12)!important;
  }
  .its-hero-slides,.its-hero-slide{border-radius:inherit!important;overflow:hidden!important}
}
@media (max-width:767px){
  .its-hero{
    width:calc(100% - 24px)!important;
    height:42vw!important;
    min-height:0!important;
    margin:12px auto!important;
    border-radius:14px!important;
    overflow:hidden!important;
    box-shadow:0 8px 20px rgba(16,34,62,.10)!important;
  }
  .its-hero-slides,.its-hero-slide{min-height:0!important;border-radius:inherit!important;overflow:hidden!important}
}
/* Mobile : affiche toute la bannière sans recadrage. */
@media (max-width:767px){
  .its-hero{
    width:calc(100% - 24px)!important;
    height:auto!important;
    aspect-ratio:16 / 9!important;
    min-height:0!important;
    margin:12px auto!important;
    border-radius:14px!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  .its-hero-slides,
  .its-hero-slide{
    min-height:0!important;
    border-radius:inherit!important;
    overflow:hidden!important;
  }

  .its-hero-slide > img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#fff!important;
  }
}
/* Mobile : réactive la deuxième image du hero. */
@media (max-width:767px){
  .its-hero-slide-security{
    display:block!important;
  }
}