/* Sani Express custom CSS - applied site-wide */
:root{--sx-teal:#3a9bb8;--sx-teal-d:#2d7a93;--sx-dark:#1d2327;--sx-text-l:#5b6770;--sx-bg:#f8f9fa;--sx-border:#e4e7ea}

/* Page de recherche WP brandée */
body.search article,body.search-results .post,body.search .post{background:#fff!important;border:1px solid var(--sx-border)!important;border-radius:12px!important;padding:18px 22px!important;margin-bottom:14px!important;transition:all .25s!important;box-shadow:0 1px 3px rgba(0,0,0,.04)}
body.search article:hover,body.search .post:hover{border-color:var(--sx-teal)!important;box-shadow:0 8px 24px -10px rgba(58,155,184,.25)!important;transform:translateY(-2px)}
body.search h2 a,body.search article h2 a{color:var(--sx-dark)!important;text-decoration:none!important;font-weight:700}
body.search h2 a:hover{color:var(--sx-teal)!important}
body.search .entry-meta,body.search .entry-date,body.search time,body.search .post-date,body.search .updated,body.search .published{display:none!important}

/* Couvercle archive WC pour produits */
.woocommerce ul.products li.product .price{color:var(--sx-teal)!important;font-weight:700}
.woocommerce ul.products li.product img{border-radius:8px;transition:transform .3s}
.woocommerce ul.products li.product:hover img{transform:scale(1.04)}

/* Améliorer les boutons WooCommerce */
.woocommerce .button,.woocommerce a.button,.woocommerce input.button{background:var(--sx-teal)!important;color:#fff!important;border-radius:8px!important;padding:12px 24px!important;font-weight:600!important;transition:all .2s!important}
.woocommerce .button:hover,.woocommerce a.button:hover{background:var(--sx-teal-d)!important;transform:translateY(-2px)}

/* Page produits liste */
body.archive .product-loop-wrap,body.tax-product_cat .product-loop-wrap{padding:24px 0}

/* Liens partout en teal */
a{transition:color .2s}

/* Smoother scroll */
html{scroll-behavior:smooth}

/* Cacher dates Bricks search - cache div.dynamic, garde h3.dynamic */
body.search .bricks-layout-item div.dynamic{display:none!important}

/* === Page 404 brandée Sani Express === */
body.error404{background:linear-gradient(135deg,#1d2327 0%,#0f1419 100%);min-height:100vh}
body.error404 main,body.error404 #content,body.error404 .site-content{max-width:900px;margin:0 auto;padding:80px 24px;text-align:center;color:#fff}
body.error404 h1{color:#fff!important;font-size:clamp(2rem,5vw,3.4rem)!important;margin:24px 0 16px!important;font-weight:800;letter-spacing:-.02em}
body.error404 h1::before{content:'404';display:block;font-size:clamp(5rem,12vw,9rem);color:var(--sx-teal);font-weight:900;line-height:1;margin-bottom:16px;background:linear-gradient(135deg,#3a9bb8 0%,#2d7a93 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body.error404 h1::after{content:'— cette page a été nettoyée par erreur';display:block;font-size:1.05rem;color:#9ca8b3;margin-top:14px;font-weight:400;letter-spacing:0}
body.error404::before{content:'';position:fixed;top:50%;left:50%;width:200px;height:200px;transform:translate(-50%,-30%);background:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%233a9bb8'%3E%3Crect x='45' y='15' width='10' height='40' rx='2'/%3E%3Cpath d='M30 55 L70 55 L65 75 L35 75 Z'/%3E%3Cpath d='M32 75 L68 75 L65 90 L35 90 Z' opacity='.6'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;animation:sx404Sweep 3s ease-in-out infinite;pointer-events:none;opacity:.15;z-index:0}
@keyframes sx404Sweep{0%,100%{transform:translate(-50%,-30%) rotate(-15deg)}50%{transform:translate(-50%,-30%) rotate(15deg)}}
body.error404 #content > *{position:relative;z-index:1}
body.error404 .search-form,body.error404 form[role=search]{max-width:520px;margin:32px auto 0;display:flex;background:#fff;border-radius:10px;padding:6px;box-shadow:0 16px 40px -12px rgba(0,0,0,.4)}
body.error404 .search-form input,body.error404 form[role=search] input{flex:1;border:0;padding:14px 18px;font-size:1rem;background:transparent;outline:none}
body.error404 .search-form button,body.error404 form[role=search] button{background:var(--sx-teal);color:#fff;border:0;padding:14px 28px;border-radius:8px;font-weight:700;cursor:pointer;font-size:.95rem}
body.error404 .search-form button:hover{background:var(--sx-teal-d)}
/* CTA links sur 404 */
body.error404::after{content:'';display:block;height:48px}



/* sx-hero-h1-style */
#brxe-rscbkw {
  font-size: clamp(1.5rem, 3.4vw, 2.6rem) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.025em !important;
  text-align: center !important;
  background: linear-gradient(135deg, #ffffff 0%, #b3e8f1 38%, #3a9bb8 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  filter: drop-shadow(0 4px 28px rgba(58,155,184,0.25));
  padding: 0 1.5rem !important;
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* sx-hero-h1-style-end */


/* sx-hero-h1-anim */
@keyframes sxHeroFadeIn {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
#brxe-rscbkw {
  animation: sxHeroFadeIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
}
/* sx-hero-h1-anim-end */


/* sx-services-h1 */
#brx-content > h1 {
  font-size: clamp(2rem, 4.4vw, 3.4rem) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.025em !important;
  text-align: center !important;
  background: linear-gradient(135deg, #1d2327 0%, #2a7a8e 50%, #3a9bb8 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  filter: drop-shadow(0 4px 20px rgba(58,155,184,0.18));
  padding: 2rem 1.5rem 1rem !important;
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  animation: sxHeroFadeIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.sx-svc-page > h1 {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* sx-services-h1-end */


/* sx-hero-glow */
#brxe-gjalcd {
  position: relative;
  isolation: isolate;
}
#brxe-gjalcd::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(900px, 90%);
  height: 120%;
  background: radial-gradient(ellipse at center, rgba(58,155,184,0.28) 0%, rgba(58,155,184,0.10) 35%, rgba(58,155,184,0) 70%);
  pointer-events: none;
  z-index: -1;
  animation: sxHeroGlow 14s ease-in-out infinite alternate;
  filter: blur(24px);
}
@keyframes sxHeroGlow {
  0% { opacity: 0.55; transform: translate(-50%, -50%) scale(0.92) rotate(0deg); }
  50% { opacity: 0.85; transform: translate(-48%, -52%) scale(1.05) rotate(8deg); }
  100% { opacity: 0.7; transform: translate(-52%, -48%) scale(1.0) rotate(-6deg); }
}
/* sx-hero-glow-end */





















/* sx-hero-image */
.sx-hero-bar {
  background-image: linear-gradient(180deg, rgba(15,18,20,0.0) 0%, rgba(15,18,20,0.15) 100%) !important;
  background-color: transparent !important;
}
/* sx-hero-image-end */

/* sx-hero-image-extend */
#brxe-gjalcd::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: clamp(640px, 88vh, 820px);
  background-image:
    linear-gradient(180deg, rgba(15,18,20,0.40) 0%, rgba(15,18,20,0.55) 55%, rgba(15,18,20,0.88) 88%, rgba(15,18,20,1) 100%),
    url('https://www.saniexpress.ca/wp-content/uploads/2025/09/saniexpresshero.webp');
  background-size: cover;
  background-position: center 35%;
  background-repeat: no-repeat;
  z-index: -2;
  pointer-events: none;
}
@media (max-width: 768px) {
  #brxe-gjalcd::after {
    height: clamp(520px, 75vh, 680px);
    background-position: center 40%;
  }
}
/* sx-hero-image-extend-end */


/* sx-hero-polish */
/* Sous-titre stylise sous H1 home */
#brxe-rscbkw::after {
  content: 'Produits + Services d’entretien pro · Depuis 1985 · Livraison partout au Québec';
  display: block;
  margin-top: 1.5rem;
  font-size: clamp(0.78rem, 1.05vw, 0.95rem);
  font-weight: 600;
  letter-spacing: 0.18em;
  color: rgba(255,255,255,0.78);
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: rgba(255,255,255,0.78) !important;
  text-transform: uppercase;
  text-shadow: 0 1px 4px rgba(0,0,0,0.6);
  filter: none !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  animation: sxHeroFadeIn 1.1s cubic-bezier(0.16,1,0.3,1) 0.3s both;
}

/* Search bar premium glassmorphism */
.sx-search-form {
  border-radius: 14px !important;
  background: rgba(255,255,255,0.97) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  box-shadow:
    0 12px 36px rgba(58,155,184,0.18),
    0 4px 12px rgba(0,0,0,0.10),
    inset 0 1px 0 rgba(255,255,255,0.55) !important;
  border: 1px solid rgba(58,155,184,0.18) !important;
  transition: box-shadow 0.35s cubic-bezier(0.16,1,0.3,1), border-color 0.35s, transform 0.35s !important;
}
.sx-search-form:focus-within {
  box-shadow:
    0 18px 56px rgba(58,155,184,0.34),
    0 6px 18px rgba(0,0,0,0.14),
    0 0 0 4px rgba(58,155,184,0.20) !important;
  border-color: rgba(58,155,184,0.55) !important;
  transform: translateY(-2px) !important;
}
.sx-search-form button {
  transition: box-shadow 0.25s, transform 0.25s !important;
}
.sx-search-form button:hover {
  box-shadow: 0 8px 24px rgba(58,155,184,0.50) !important;
  transform: translateY(-1px) !important;
}

/* Tags rapides hero - hover lift */
.sx-hero-quicks a {
  transition: background 0.25s, border-color 0.25s, transform 0.25s, box-shadow 0.25s !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
}
.sx-hero-quicks a:hover {
  background: rgba(58,155,184,0.20) !important;
  border-color: rgba(58,155,184,0.55) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 22px rgba(58,155,184,0.28) !important;
}

/* Status indicator pulse anime */
.sx-status-live .dot,
.sx-status-live .dot.pulse {
  box-shadow: 0 0 0 0 rgba(58,155,184,0.70);
  animation: sxStatusPulse 2.2s ease-in-out infinite;
}
@keyframes sxStatusPulse {
  0%   { box-shadow: 0 0 0 0   rgba(58,155,184,0.70); }
  70%  { box-shadow: 0 0 0 14px rgba(58,155,184,0); }
  100% { box-shadow: 0 0 0 0   rgba(58,155,184,0); }
}

/* Cards categories hover lift */
.sx-tile, .sx-tile-large {
  transition: transform 0.35s cubic-bezier(0.16,1,0.3,1), box-shadow 0.35s, border-color 0.35s !important;
  border: 1px solid rgba(58,155,184,0.08);
}
.sx-tile:hover, .sx-tile-large:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(58,155,184,0.40) !important;
  box-shadow:
    0 16px 40px rgba(58,155,184,0.20),
    0 4px 12px rgba(0,0,0,0.08) !important;
}
/* sx-hero-polish-end */








/* sx-delivery-wow */
.sx-section.sx-cat {
  position: relative;
  padding-top: 6rem !important;
}
.sx-section.sx-cat::before {
  content: '1F69A   LIVRAISON PARTOUT AU QUÉBEC  ·  418-862-2292';
  position: absolute;
  top: -2px;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  background: linear-gradient(135deg, #3a9bb8 0%, #2a7a8e 100%);
  color: white;
  padding: 0.95rem 1.75rem;
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: 0.04em;
  white-space: nowrap;
  font-size: clamp(0.78rem, 1vw, 0.95rem);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  text-shadow: 0 1px 2px rgba(0,0,0,0.25);
  box-shadow:
    0 16px 40px rgba(58,155,184,0.40),
    0 6px 14px rgba(0,0,0,0.12),
    inset 0 1px 0 rgba(255,255,255,0.25);
  z-index: 5;
  animation: sxDeliveryFloat 3.5s ease-in-out infinite alternate, sxDeliveryGlow 2.8s ease-in-out infinite alternate;
}
@keyframes sxDeliveryFloat {
  0%   { transform: translateX(-50%) translateY(-50%); }
  100% { transform: translateX(-50%) translateY(calc(-50% - 6px)); }
}
@keyframes sxDeliveryGlow {
  0%   { box-shadow: 0 16px 40px rgba(58,155,184,0.40), 0 6px 14px rgba(0,0,0,0.12), inset 0 1px 0 rgba(255,255,255,0.25); }
  100% { box-shadow: 0 22px 56px rgba(58,155,184,0.62), 0 8px 18px rgba(0,0,0,0.16), inset 0 1px 0 rgba(255,255,255,0.32); }
}
@media (max-width: 768px) {
  .sx-section.sx-cat { padding-top: 5.5rem !important; }
  .sx-section.sx-cat::before {
    white-space: normal;
    max-width: 90vw;
    text-align: center;
    line-height: 1.35;
    padding: 0.85rem 1.25rem;
  }
}
/* sx-delivery-wow-end */


/* sx-pro-2028 */
/* ============ TRUST: Numbers XL micro-typo labels ============ */
.sx-trust {
  padding: clamp(4rem, 7vw, 7rem) 0 !important;
  background: linear-gradient(180deg, #f7f9fa 0%, #ffffff 100%) !important;
  position: relative;
}
.sx-trust::before {
  content: '';
  position: absolute;
  top: 0; left: 50%;
  width: clamp(80px, 12vw, 140px);
  height: 1px;
  background: linear-gradient(90deg, transparent, #3a9bb8, transparent);
  transform: translateX(-50%);
}
.sx-trust-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 0 !important;
  align-items: end;
}
.sx-trust-grid .sx-stat {
  position: relative;
  padding: 1.5rem 1.25rem !important;
  text-align: center;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.sx-trust-grid .sx-stat:not(:last-child)::after {
  content: '';
  position: absolute;
  right: 0; top: 25%;
  width: 1px;
  height: 50%;
  background: linear-gradient(180deg, transparent, rgba(29,35,39,0.18), transparent);
}
.sx-stat .num {
  display: block !important;
  font-size: clamp(3.2rem, 7vw, 5.6rem) !important;
  font-weight: 200 !important;
  letter-spacing: -0.04em !important;
  line-height: 0.95 !important;
  color: #1d2327 !important;
  font-feature-settings: 'tnum' on, 'lnum' on;
  font-variation-settings: 'wght' 200;
  transition: font-variation-settings 0.4s cubic-bezier(0.16,1,0.3,1) !important;
}
.sx-stat:hover .num {
  font-variation-settings: 'wght' 700;
  font-weight: 700 !important;
  color: #3a9bb8 !important;
}
.sx-stat .lbl {
  display: block !important;
  margin-top: 0.85rem !important;
  font-size: clamp(0.65rem, 0.85vw, 0.78rem) !important;
  font-weight: 600 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: rgba(29,35,39,0.55) !important;
  line-height: 1.4 !important;
}
@media (max-width: 768px) {
  .sx-trust-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 1.5rem 0 !important; }
  .sx-trust-grid .sx-stat:nth-child(2n)::after { display: none; }
  .sx-trust-grid .sx-stat:nth-child(-n+2) { border-bottom: 1px solid rgba(29,35,39,0.10); padding-bottom: 2rem; }
}

/* ============ WHY: Numerotation outline 01/02/03/04 ============ */
.sx-why {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
  background: #0f1214 !important;
  color: #f7f9fa;
  position: relative;
  overflow: hidden;
}
.sx-why::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(58,155,184,0.5), transparent);
}
.sx-why h2 {
  color: #ffffff !important;
  font-size: clamp(2.2rem, 4.5vw, 3.6rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.05 !important;
  margin-bottom: 0.5rem !important;
  max-width: 16ch;
}
.sx-why .sx-sub {
  color: rgba(255,255,255,0.55) !important;
  font-size: clamp(0.85rem, 1.1vw, 1rem) !important;
  letter-spacing: 0.04em !important;
  margin-bottom: clamp(2.5rem, 5vw, 4.5rem) !important;
}
.sx-why-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: clamp(1.5rem, 2.5vw, 2.5rem) !important;
}
.sx-why-grid .sx-feat {
  position: relative;
  padding: 2rem 1.5rem 1.5rem !important;
  background: transparent !important;
  border: none !important;
  border-top: 1px solid rgba(255,255,255,0.18);
  transition: border-color 0.5s cubic-bezier(0.16,1,0.3,1);
  counter-increment: sxWhy;
}
.sx-why-grid { counter-reset: sxWhy; }
.sx-why-grid .sx-feat::before {
  content: counter(sxWhy, decimal-leading-zero);
  display: block;
  font-size: clamp(0.7rem, 0.9vw, 0.82rem);
  font-weight: 600;
  letter-spacing: 0.22em;
  color: #3a9bb8;
  margin-bottom: 1.25rem;
  font-feature-settings: 'tnum' on;
}
.sx-why-grid .sx-feat:hover {
  border-top-color: #3a9bb8;
}
.sx-why-grid .sx-feat h3 {
  color: #ffffff !important;
  font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important;
  font-weight: 600 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.2 !important;
  margin-bottom: 0.65rem !important;
}
.sx-why-grid .sx-feat p {
  color: rgba(255,255,255,0.62) !important;
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  line-height: 1.55 !important;
}
.sx-why-grid .sx-feat svg { display: none !important; }
@media (max-width: 880px) {
  .sx-why-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 540px) {
  .sx-why-grid { grid-template-columns: 1fr !important; }
}

/* ============ SERVICES: Liste avec hover precise ============ */
.sx-services {
  padding: clamp(5rem, 9vw, 9rem) 0 !important;
}
.sx-services h2 {
  font-size: clamp(2.2rem, 4.5vw, 3.6rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  margin-bottom: clamp(2.5rem, 4vw, 3.5rem) !important;
  max-width: 18ch;
}
.sx-services-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 0 !important;
  border-top: 1px solid rgba(29,35,39,0.10);
}
.sx-services-grid > * {
  position: relative;
  padding: clamp(1.5rem, 2.5vw, 2rem) clamp(1rem, 2vw, 1.5rem) !important;
  border-bottom: 1px solid rgba(29,35,39,0.10);
  transition: background 0.4s cubic-bezier(0.16,1,0.3,1), padding-left 0.4s cubic-bezier(0.16,1,0.3,1) !important;
  background: transparent !important;
  display: flex;
  align-items: center;
  gap: 1.25rem;
  cursor: pointer;
}
.sx-services-grid > *:nth-child(odd) { border-right: 1px solid rgba(29,35,39,0.10); }
.sx-services-grid > *::after {
  content: '2192';
  position: absolute;
  right: clamp(1rem, 2vw, 1.5rem);
  top: 50%;
  transform: translateY(-50%) translateX(0);
  font-size: 1.4rem;
  color: rgba(29,35,39,0.25);
  transition: transform 0.4s cubic-bezier(0.16,1,0.3,1), color 0.4s !important;
  font-weight: 300;
}
.sx-services-grid > *:hover {
  background: rgba(58,155,184,0.04) !important;
  padding-left: clamp(1.75rem, 2.75vw, 2.25rem) !important;
}
.sx-services-grid > *:hover::after {
  transform: translateY(-50%) translateX(6px);
  color: #3a9bb8;
}
@media (max-width: 768px) {
  .sx-services-grid { grid-template-columns: 1fr !important; }
  .sx-services-grid > *:nth-child(odd) { border-right: none; }
}

/* ============ BRANDS: Marquee infinite horizontal ============ */
.sx-brands {
  padding: clamp(3rem, 5vw, 5rem) 0 !important;
  border-top: 1px solid rgba(29,35,39,0.08);
  border-bottom: 1px solid rgba(29,35,39,0.08);
  overflow: hidden;
  position: relative;
}
.sx-brands::before {
  content: 'PARTENAIRES DE CONFIANCE';
  display: block;
  text-align: center;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  color: rgba(29,35,39,0.45);
  margin-bottom: 2rem;
  text-transform: uppercase;
}
.sx-brands .sx-container {
  position: relative;
  mask-image: linear-gradient(90deg, transparent, black 8%, black 92%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, black 8%, black 92%, transparent);
}
.sx-brands h2,
.sx-brands h3 { display: none !important; }

/* ============ CTA BAND: contraste fort ============ */
.sx-cta-band {
  padding: clamp(4rem, 7vw, 7rem) 0 !important;
  background: #0f1214 !important;
  color: #ffffff;
  position: relative;
  overflow: hidden;
}
.sx-cta-band::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 30% 50%, rgba(58,155,184,0.15) 0%, transparent 60%);
  pointer-events: none;
}
.sx-cta-band h2 {
  color: #ffffff !important;
  font-size: clamp(2rem, 4vw, 3.2rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.1 !important;
}
.sx-cta-band a[href^="tel:"] {
  font-size: clamp(1.3rem, 2.2vw, 1.8rem) !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  font-feature-settings: 'tnum' on;
  border-bottom: 1px solid rgba(58,155,184,0.4);
  transition: border-color 0.3s, color 0.3s;
}
.sx-cta-band a[href^="tel:"]:hover {
  border-color: #3a9bb8;
  color: #5cc4d6;
}

/* ============ GLOBAL TYPO & SPACING ============ */
.sx-section h2 {
  font-feature-settings: 'kern' on, 'liga' on;
  text-rendering: optimizeLegibility;
}
.sx-section .sx-sub {
  font-size: clamp(0.85rem, 1.1vw, 1rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  color: rgba(29,35,39,0.62);
  max-width: 60ch;
}

/* ============ Micro-interactions globales ============ */
* { -webkit-tap-highlight-color: rgba(58,155,184,0.15); }
:focus-visible {
  outline: 2px solid #3a9bb8;
  outline-offset: 3px;
  border-radius: 4px;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
/* sx-pro-2028-end */


/* sx-elite */
/* ============ HERO POLISH PRO/FLUIDE ============ */
/* Cascade animation orchestree */
@keyframes sxRise {
  from { opacity: 0; transform: translateY(20px); filter: blur(6px); }
  to   { opacity: 1; transform: translateY(0);    filter: blur(0); }
}
#brxe-rscbkw {
  animation: sxRise 1.1s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both !important;
}
#brxe-rscbkw::after {
  animation: sxRise 1.1s cubic-bezier(0.16, 1, 0.3, 1) 0.45s both !important;
}
.sx-status-live {
  animation: sxRise 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.65s both !important;
}
.sx-search-form {
  animation: sxRise 0.95s cubic-bezier(0.16, 1, 0.3, 1) 0.8s both !important;
}
.sx-hero-quicks {
  animation: sxRise 0.85s cubic-bezier(0.16, 1, 0.3, 1) 1.0s both !important;
}

/* Espacement plus aere du hero */
.sx-hero-bar > .sx-container,
.sx-hero-flex {
  padding-block: clamp(2rem, 4vw, 3.5rem) !important;
}

/* Search bar plus elegante */
.sx-search-form input[type="text"],
.sx-search-form input[type="search"],
.sx-search-form input:not([type="submit"]) {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: clamp(0.95rem, 1.1vw, 1.05rem) !important;
  letter-spacing: -0.005em !important;
  color: #1d2327 !important;
  caret-color: #3a9bb8 !important;
}
.sx-search-form input::placeholder {
  color: rgba(29,35,39,0.45) !important;
  font-weight: 400 !important;
}

/* Status indicator typo soignee */
.sx-status-live {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: clamp(0.75rem, 0.95vw, 0.85rem) !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase;
  color: rgba(255,255,255,0.78) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.4);
}

/* Tags rapides typo unifiee */
.sx-hero-quicks span {
  font-size: clamp(0.65rem, 0.85vw, 0.75rem) !important;
  font-weight: 600 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.5) !important;
  margin-right: 0.85rem !important;
}
.sx-hero-quicks a {
  font-size: clamp(0.78rem, 0.95vw, 0.88rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  padding: 0.55rem 1.1rem !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,0.06) !important;
  color: rgba(255,255,255,0.85) !important;
}

/* Sous-titre H1 separateurs eleves */
#brxe-rscbkw::after {
  margin-top: 1.75rem !important;
}

/* ============ HEADER POLISH STICKY BACKDROP-BLUR ============ */
#brx-header {
  position: sticky !important;
  top: 0;
  z-index: 100;
  background: rgba(255,255,255,0.85) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border-bottom: 1px solid rgba(29,35,39,0.06);
  transition: background 0.3s ease, border-bottom-color 0.3s ease, box-shadow 0.3s ease;
}
#brx-header:hover {
  background: rgba(255,255,255,0.96) !important;
  border-bottom-color: rgba(58,155,184,0.15);
  box-shadow: 0 8px 24px rgba(15,18,20,0.04);
}

/* Header nav links */
#brx-header nav a,
#brx-header .brxe-text-link a,
#brx-header a:not(.brxe-button):not([href^="tel:"]) {
  font-size: clamp(0.85rem, 0.95vw, 0.95rem) !important;
  font-weight: 500 !important;
  letter-spacing: -0.005em !important;
  color: #1d2327 !important;
  position: relative;
  transition: color 0.25s ease !important;
}
#brx-header nav a::after,
#brx-header .brxe-text-link a::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  right: 0;
  height: 1.5px;
  background: #3a9bb8;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
#brx-header nav a:hover,
#brx-header .brxe-text-link a:hover {
  color: #3a9bb8 !important;
}
#brx-header nav a:hover::after,
#brx-header .brxe-text-link a:hover::after {
  transform: scaleX(1);
  transform-origin: left;
}

/* Header logo subtle zoom */
#brx-header .brxe-image,
#brx-header img {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
#brx-header .brxe-image:hover img,
#brx-header img:hover {
  transform: scale(1.04);
}

/* Cart icon badge */
#brx-header .brxe-woocommerce-mini-cart .count,
#brx-header [class*="cart"] [class*="count"] {
  background: #3a9bb8 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 0.65rem !important;
  font-feature-settings: 'tnum' on;
  letter-spacing: 0;
  border: 2px solid #ffffff;
  box-shadow: 0 2px 6px rgba(58,155,184,0.4);
}

/* ============ FOOTER POLISH DARK COHERENT ============ */
#brx-footer {
  background: #0a0c0d !important;
  color: rgba(255,255,255,0.72);
  padding: clamp(4rem, 7vw, 7rem) 0 clamp(2rem, 3vw, 3rem) !important;
  border-top: 1px solid rgba(58,155,184,0.12);
  position: relative;
}
#brx-footer::before {
  content: '';
  position: absolute;
  top: 0; left: 50%;
  width: clamp(120px, 16vw, 200px);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(58,155,184,0.6), transparent);
  transform: translateX(-50%);
}

/* Footer headings */
#brx-footer h2,
#brx-footer h3,
#brx-footer h4,
#brx-footer .brxe-heading {
  color: #ffffff !important;
  font-size: clamp(0.78rem, 0.9vw, 0.85rem) !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  margin-bottom: 1.25rem !important;
}

/* Footer text */
#brx-footer p,
#brx-footer .brxe-text {
  color: rgba(255,255,255,0.62) !important;
  font-size: clamp(0.85rem, 0.95vw, 0.92rem) !important;
  line-height: 1.65 !important;
  letter-spacing: -0.005em !important;
}

/* Footer links - underline animation reverse */
#brx-footer a:not(.brxe-button):not([href^="tel:"]):not(.brxe-image):not([class*="image"]) {
  color: rgba(255,255,255,0.78) !important;
  text-decoration: none !important;
  position: relative;
  font-size: clamp(0.85rem, 0.95vw, 0.92rem) !important;
  font-weight: 500 !important;
  letter-spacing: -0.005em !important;
  transition: color 0.25s ease !important;
}
#brx-footer a:not(.brxe-button):not([href^="tel:"]):not(.brxe-image):not([class*="image"])::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  right: 0;
  height: 1px;
  background: #3a9bb8;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s cubic-bezier(0.16,1,0.3,1);
}
#brx-footer a:not(.brxe-button):not([href^="tel:"]):not(.brxe-image):not([class*="image"]):hover {
  color: #ffffff !important;
}
#brx-footer a:not(.brxe-button):not([href^="tel:"]):not(.brxe-image):not([class*="image"]):hover::after {
  transform: scaleX(1);
}

/* Footer telephone XL */
#brx-footer a[href^="tel:"] {
  display: inline-block;
  color: #ffffff !important;
  font-size: clamp(1.15rem, 1.6vw, 1.4rem) !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  font-feature-settings: 'tnum' on;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(58,155,184,0.4);
  padding-bottom: 0.15rem;
  transition: color 0.3s, border-color 0.3s;
}
#brx-footer a[href^="tel:"]:hover {
  color: #5cc4d6 !important;
  border-color: #3a9bb8;
}

/* Footer copyright bottom */
#brx-footer .bc-footer-008__bottom,
#brx-footer [class*="copyright"],
#brx-footer [class*="bottom-bar"] {
  margin-top: clamp(2.5rem, 4vw, 4rem) !important;
  padding-top: clamp(1.5rem, 2vw, 2rem) !important;
  border-top: 1px solid rgba(255,255,255,0.08);
  font-size: clamp(0.72rem, 0.85vw, 0.8rem) !important;
  color: rgba(255,255,255,0.42) !important;
  letter-spacing: 0.04em !important;
}

/* Footer logo subtle */
#brx-footer img {
  filter: brightness(1.2) saturate(0.9);
  transition: filter 0.4s ease, transform 0.5s cubic-bezier(0.16,1,0.3,1);
}
#brx-footer img:hover {
  filter: brightness(1.5) saturate(1);
  transform: scale(1.03);
}

/* ============ SCROLLBAR ELITE ============ */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f0f3f5; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(58,155,184,0.3), rgba(58,155,184,0.5));
  border-radius: 999px;
  border: 2px solid #f0f3f5;
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(58,155,184,0.5), rgba(58,155,184,0.7));
}
::selection {
  background: rgba(58,155,184,0.25);
  color: #1d2327;
}
/* sx-elite-end */





/* sx-mobile-header-fix */
/* Force hamburger toggle visible et acessible sur mobile */
@media (max-width: 1024px) {
  #brx-header .brxe-toggle {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 102 !important;
    width: 44px !important;
    height: 44px !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    color: #1d2327 !important;
    cursor: pointer !important;
    pointer-events: auto !important;
  }
  #brx-header .brxe-toggle i,
  #brx-header .brxe-toggle svg,
  #brx-header .brxe-toggle .fa,
  #brx-header .brxe-toggle .fas {
    display: inline-block !important;
    font-size: 1.5rem !important;
    color: #1d2327 !important;
  }
  /* Header layout horizontal compact mobile */
  #brx-header > section.brxe-section {
    padding: 0.75rem 1rem !important;
  }
  #brx-header > section > .brxe-container {
    max-width: 100% !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
  }
  #brx-header > section > .brxe-container > .brxe-div {
    flex-direction: row !important;
    align-items: center !important;
    gap: 0.5rem !important;
  }
  /* Search bar compacte (ASP) */
  #brx-header .brxe-shortcode,
  #brx-header div[id="ajaxsearchpro1_1"],
  #brx-header .asp_w_container {
    max-width: 200px !important;
    flex: 1 1 auto !important;
  }
  /* Logo proportionne */
  #brx-header .brxe-image,
  #brx-header figure {
    flex: 0 0 auto !important;
    max-width: 120px !important;
  }
  #brx-header .brxe-image img,
  #brx-header figure img {
    max-height: 40px !important;
    width: auto !important;
  }
}
@media (max-width: 600px) {
  #brx-header .brxe-shortcode,
  #brx-header div[id="ajaxsearchpro1_1"],
  #brx-header .asp_w_container {
    max-width: 140px !important;
  }
  #brx-header .brxe-image,
  #brx-header figure { max-width: 90px !important; }
  #brx-header > section.brxe-section { padding: 0.5rem 0.75rem !important; }
}
/* Le sticky header doit pas masquer le hamburger panel offcanvas */
.brxe-offcanvas { z-index: 999 !important; }
.brxe-offcanvas.brx-open { display: flex !important; }
/* sx-mobile-header-fix-end */


/* sx-tout-tout */
/* ============ PAGES SERVICES INDIVIDUELLES ============ */
.sx-svc-page {
  max-width: 880px !important;
  margin: 0 auto !important;
  padding: clamp(2rem, 5vw, 4rem) clamp(1.5rem, 4vw, 3rem) clamp(4rem, 7vw, 6rem) !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  counter-reset: sxSvcSection;
}
.sx-svc-page > p.lead {
  font-size: clamp(1.05rem, 1.4vw, 1.3rem) !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  letter-spacing: -0.01em !important;
  color: rgba(29,35,39,0.72) !important;
  margin: 0 auto clamp(2.5rem, 4vw, 4rem) !important;
  max-width: 620px !important;
  text-align: center;
  text-wrap: pretty;
}
.sx-svc-page > h2 {
  position: relative;
  font-size: clamp(1.5rem, 2.2vw, 2rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
  color: #1d2327 !important;
  margin: clamp(2.5rem, 4.5vw, 4rem) 0 1rem !important;
  padding-top: clamp(1.5rem, 3vw, 2.25rem) !important;
  border-top: 1px solid rgba(29,35,39,0.10);
  text-wrap: balance;
  counter-increment: sxSvcSection;
}
.sx-svc-page > h2::before {
  content: counter(sxSvcSection, decimal-leading-zero);
  display: block;
  font-size: clamp(0.7rem, 0.85vw, 0.78rem);
  font-weight: 600;
  letter-spacing: 0.22em;
  color: #3a9bb8;
  margin-bottom: 0.85rem;
  font-feature-settings: 'tnum' on;
  text-transform: uppercase;
}
.sx-svc-page > p:not(.lead) {
  font-size: clamp(0.95rem, 1.1vw, 1.05rem) !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  letter-spacing: -0.005em !important;
  color: rgba(29,35,39,0.78) !important;
  margin-bottom: 1.25rem !important;
  text-wrap: pretty;
  max-width: 65ch;
}
.sx-svc-cta {
  margin-top: clamp(3rem, 5vw, 5rem) !important;
  padding: clamp(2rem, 4vw, 3rem) !important;
  background: linear-gradient(135deg, #0f1214 0%, #1d2730 100%) !important;
  color: #ffffff !important;
  border-radius: 4px;
  position: relative;
  overflow: hidden;
}
.sx-svc-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 30% 50%, rgba(58,155,184,0.18) 0%, transparent 60%);
  pointer-events: none;
}
.sx-svc-cta h2,
.sx-svc-cta h3 {
  color: #ffffff !important;
  font-size: clamp(1.4rem, 2vw, 1.8rem) !important;
  font-weight: 700 !important;
  margin-bottom: 0.85rem !important;
  border: none !important;
  padding-top: 0 !important;
  position: relative;
}
.sx-svc-cta h2::before, .sx-svc-cta h3::before { display: none !important; }
.sx-svc-cta p { color: rgba(255,255,255,0.78) !important; margin-bottom: 1.5rem !important; position: relative; }
.sx-svc-cta a[href^="tel:"] {
  display: inline-block;
  color: #ffffff !important;
  font-size: clamp(1.2rem, 1.8vw, 1.5rem) !important;
  font-weight: 600 !important;
  font-feature-settings: 'tnum' on;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(58,155,184,0.5);
  padding-bottom: 0.15rem;
  position: relative;
}
.sx-svc-cta a[href^="tel:"]:hover { color: #5cc4d6 !important; border-color: #3a9bb8; }
.sx-svc-cta a[href*="contact"], .sx-svc-cta a:not([href^="tel:"]) {
  display: inline-block; background: #3a9bb8 !important; color: #ffffff !important;
  padding: 0.85rem 1.75rem !important; border-radius: 999px !important;
  font-weight: 600 !important; font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  letter-spacing: 0.01em; text-decoration: none !important;
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1), box-shadow 0.3s, background 0.3s !important;
  position: relative; margin-right: 0.75rem;
}
.sx-svc-cta a[href*="contact"]:hover, .sx-svc-cta a:not([href^="tel:"]):hover {
  background: #2a7a8e !important; transform: translateY(-2px) !important;
  box-shadow: 0 12px 28px rgba(58,155,184,0.4) !important;
}

/* ============ SCROLL-DRIVEN ANIMATIONS NATIVES ============ */
@supports (animation-timeline: view()) {
  @keyframes sxSectionReveal {
    from { opacity: 0; transform: translateY(36px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  .sx-section,
  .sx-svc-page > h2,
  .sx-svc-page > p:not(.lead),
  .sx-svc-cta,
  .sx-trust-grid > .sx-stat,
  .sx-why-grid > .sx-feat,
  .sx-services-grid > * {
    animation: sxSectionReveal linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 22%;
  }
  .sx-trust-grid > .sx-stat:nth-child(2) { animation-range: entry 5% cover 27%; }
  .sx-trust-grid > .sx-stat:nth-child(3) { animation-range: entry 10% cover 32%; }
  .sx-trust-grid > .sx-stat:nth-child(4) { animation-range: entry 15% cover 37%; }
  .sx-why-grid > .sx-feat:nth-child(2) { animation-range: entry 5% cover 27%; }
  .sx-why-grid > .sx-feat:nth-child(3) { animation-range: entry 10% cover 32%; }
  .sx-why-grid > .sx-feat:nth-child(4) { animation-range: entry 15% cover 37%; }
}

/* ============ TEXT-WRAP BALANCE / PRETTY ============ */
h1, h2, h3, .sx-stat .num, .sx-status-live { text-wrap: balance; }
p, .sx-feat p, .sx-tile p, .sx-svc-page > p { text-wrap: pretty; }

/* ============ :HAS() conditional ============ */
.sx-tile:has(img), .sx-tile-large:has(img) { padding-top: 0 !important; }
.sx-search-form:has(input:invalid) button[type="submit"] { opacity: 0.55; pointer-events: none; }
.sx-section:has(:focus-visible) { background-color: rgba(58,155,184,0.015); }

/* ============ GRAIN TEXTURE (sans casser ::after du hero!) ============ */
.sx-why { position: relative; }
.sx-why > * { position: relative; z-index: 1; }
@keyframes sxGrainShift {
  0% { transform: translate(0,0); }
  25% { transform: translate(-2%,1%); }
  50% { transform: translate(1%,-1%); }
  75% { transform: translate(-1%,2%); }
  100% { transform: translate(2%,0); }
}
.sx-why::after {
  content: '';
  position: absolute;
  inset: -10%;
  background-image: radial-gradient(circle at 25% 30%, rgba(255,255,255,0.04) 0%, transparent 1px),
                    radial-gradient(circle at 75% 70%, rgba(255,255,255,0.03) 0%, transparent 1px),
                    radial-gradient(circle at 50% 50%, rgba(255,255,255,0.02) 0%, transparent 1px);
  background-size: 3px 3px, 5px 5px, 7px 7px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.6;
  mix-blend-mode: overlay;
  animation: sxGrainShift 6s steps(4) infinite;
}

/* ============ CTA BAND avec IMAGE ENTREPOT integree ============ */
.sx-cta-band {
  background-image:
    linear-gradient(135deg, rgba(15,18,20,0.82) 0%, rgba(15,18,20,0.92) 60%, rgba(15,18,20,0.96) 100%),
    url('https://www.saniexpress.ca/wp-content/uploads/2025/09/saniexpresshero.webp') !important;
  background-size: cover !important;
  background-position: center 60% !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
}
@media (max-width: 768px) {
  .sx-cta-band {
    background-attachment: scroll !important;
    background-position: center 50% !important;
  }
}

/* ============ IMPERFECTIONS VOLONTAIRES ============ */
.sx-trust-grid .sx-stat:nth-child(2) { transform: translateY(2px); }
.sx-trust-grid .sx-stat:nth-child(3) { transform: translateY(-1px); }
.sx-why-grid .sx-feat:nth-child(odd) { margin-top: 0.5rem; }
.sx-tile:nth-child(7) { transform: rotate(0.15deg); }
.sx-tile:nth-child(11) { transform: rotate(-0.12deg); }

/* ============ SIGNATURE GRAPHIQUE (point teal pulse) ============ */
.sx-section h2:not(.sx-cta-band h2):not(.sx-cta-band h3),
.sx-svc-page > h2 {
  position: relative;
}
.sx-section h2:not(.sx-cta-band h2):not(.sx-cta-band h3)::after {
  content: '';
  display: inline-block;
  width: 8px; height: 8px;
  background: #3a9bb8;
  border-radius: 50%;
  margin-left: 0.45rem;
  vertical-align: middle;
  transform: translateY(-2px);
  box-shadow: 0 0 0 0 rgba(58,155,184,0.5);
  animation: sxSignaturePulse 3.5s ease-in-out infinite;
}
@keyframes sxSignaturePulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(58,155,184,0.5); }
  50%      { box-shadow: 0 0 0 6px rgba(58,155,184,0); }
}

/* ============ EXTRAS ============ */
html { scroll-behavior: smooth; }
:target { scroll-margin-top: 100px; }
.sx-section, .sx-svc-page > * { will-change: opacity, transform; }
/* sx-tout-tout-end */


/* sx-extra-polish */
/* ============ SCROLL PROGRESS INDICATOR (CSS native) ============ */
@supports (animation-timeline: scroll()) {
  body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 100%;
    background: linear-gradient(90deg, #3a9bb8 0%, #5cc4d6 50%, #3a9bb8 100%);
    transform-origin: left;
    transform: scaleX(0);
    z-index: 9999;
    pointer-events: none;
    animation: sxScrollProgress linear;
    animation-timeline: scroll(root);
    box-shadow: 0 0 12px rgba(58,155,184,0.5);
  }
  @keyframes sxScrollProgress {
    from { transform: scaleX(0); }
    to   { transform: scaleX(1); }
  }
}

/* ============ TILE CARDS LIGHT REFLECTION HOVER ============ */
.sx-tile, .sx-tile-large {
  position: relative;
  overflow: hidden;
}
.sx-tile::before, .sx-tile-large::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(105deg, transparent 0%, rgba(255,255,255,0.18) 50%, transparent 100%);
  transition: left 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  pointer-events: none;
  z-index: 2;
}
.sx-tile:hover::before, .sx-tile-large:hover::before {
  left: 110%;
}

/* ============ DECORATIVE DIVIDERS ENTRE SECTIONS ============ */
.sx-section + .sx-section,
.sx-section + .sx-cta-band,
.sx-cta-band + #brx-footer {
  position: relative;
}

/* ============ NUMBERS COUNT-UP STYLE (variable font interpolation hover) ============ */
.sx-stat .num {
  display: inline-block;
  position: relative;
}
.sx-stat .num::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 2px;
  background: #3a9bb8;
  transition: width 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.sx-stat:hover .num::after { width: 60%; }

/* ============ FEATURE HOVER FILLED CIRCLE ============ */
.sx-why-grid .sx-feat::before {
  display: inline-block;
  transition: color 0.4s, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.sx-why-grid .sx-feat:hover::before {
  color: #5cc4d6;
  transform: translateX(4px);
}

/* ============ HEADER ON SCROLL : compact ============ */
@supports (animation-timeline: scroll()) {
  #brx-header {
    animation: sxHeaderCompact linear;
    animation-timeline: scroll(root);
    animation-range: 0 200px;
  }
  @keyframes sxHeaderCompact {
    to {
      background: rgba(255,255,255,0.96);
      box-shadow: 0 4px 24px rgba(15,18,20,0.08);
      border-bottom-color: rgba(58,155,184,0.18);
    }
  }
}

/* ============ SX-CAT SECTION : grand titre editorial ============ */
.sx-cat h2 {
  font-size: clamp(2.4rem, 5vw, 3.8rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.05 !important;
  text-align: center;
  max-width: 18ch;
  margin: 0 auto clamp(2rem, 3vw, 3rem) !important;
  text-wrap: balance;
}
.sx-cat .sx-sub {
  text-align: center;
  font-size: clamp(0.85rem, 1.1vw, 1rem) !important;
  color: rgba(29,35,39,0.55) !important;
  letter-spacing: 0.04em;
  margin-bottom: clamp(2.5rem, 4vw, 4rem) !important;
}

/* ============ TILES TYPOGRAPHIE EDITORIALE ============ */
.sx-tile h3, .sx-tile-large h3 {
  font-size: clamp(1.05rem, 1.4vw, 1.25rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.2 !important;
  margin-bottom: 0.5rem !important;
  text-wrap: balance;
}
.sx-tile p, .sx-tile-large p {
  font-size: clamp(0.85rem, 1vw, 0.92rem) !important;
  line-height: 1.5 !important;
  color: rgba(29,35,39,0.62) !important;
  text-wrap: pretty;
}
.sx-tile .sx-cta, .sx-tile-large .sx-cta {
  font-size: clamp(0.78rem, 0.95vw, 0.88rem) !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  color: #3a9bb8 !important;
  text-transform: uppercase;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

/* ============ STATUS LIVE DOT improved ============ */
.sx-status-live .dot {
  width: 8px !important;
  height: 8px !important;
  background: #3a9bb8 !important;
  border-radius: 50% !important;
  display: inline-block;
  vertical-align: middle;
  margin-right: 0.55rem;
  position: relative;
}
.sx-status-live.open .dot {
  background: #4ade80 !important;
}
.sx-status-live.open .dot,
.sx-status-live .dot.pulse {
  box-shadow: 0 0 0 0 rgba(74,222,128,0.75);
  animation: sxStatusPulseGreen 2.2s ease-in-out infinite;
}
@keyframes sxStatusPulseGreen {
  0%   { box-shadow: 0 0 0 0   rgba(74,222,128,0.65); }
  70%  { box-shadow: 0 0 0 12px rgba(74,222,128,0); }
  100% { box-shadow: 0 0 0 0   rgba(74,222,128,0); }
}

/* ============ BUTTONS GLOBAUX premium ============ */
.brxe-button.brx-btn,
button.brx-btn,
a.brxe-button {
  position: relative;
  overflow: hidden;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s !important;
}
.brxe-button.brx-btn::before,
button.brx-btn::before,
a.brxe-button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(105deg, transparent 0%, rgba(255,255,255,0.20) 50%, transparent 100%);
  transition: left 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  pointer-events: none;
}
.brxe-button.brx-btn:hover::before,
button.brx-btn:hover::before,
a.brxe-button:hover::before {
  left: 100%;
}
.brxe-button.brx-btn:hover,
button.brx-btn:hover,
a.brxe-button:hover {
  transform: translateY(-2px);
}

/* ============ Quote / pull-quote dans sx-trust ============ */
.sx-trust::after {
  content: '« 40 ans à servir le Québec »';
  display: block;
  text-align: center;
  font-size: clamp(0.78rem, 0.95vw, 0.88rem);
  font-weight: 500;
  letter-spacing: 0.04em;
  color: rgba(29,35,39,0.45);
  font-style: italic;
  margin-top: clamp(2rem, 3vw, 3rem);
  position: relative;
  z-index: 1;
}
/* sx-extra-polish-end */


/* sx-hero-fullpage */
/* Hero plein page - le H1 et la sx-hero-bar occupent ensemble 100vh */
#brxe-rscbkw {
  padding-top: clamp(1rem, 3vh, 2rem) !important;
  padding-bottom: clamp(2rem, 4vh, 4rem) !important;
}
.sx-hero-bar {
  padding-block: clamp(2rem, 4vh, 4rem) !important;
  padding-bottom: clamp(1rem, 2vh, 2rem) !important;
  min-height: auto !important;
}
/* Le bg image entrepot couvre 100vh */
#brxe-gjalcd::after {
  height: 100vh !important;
  min-height: 640px !important;
}
/* Effet de fade-out smooth en bas du hero */
#brxe-gjalcd::after {
  background-image:
    linear-gradient(180deg,
      rgba(15,18,20,0.40) 0%,
      rgba(15,18,20,0.55) 55%,
      rgba(15,18,20,0.85) 88%,
      rgba(15,18,20,1) 100%),
    url('https://www.saniexpress.ca/wp-content/uploads/2025/09/saniexpresshero.webp') !important;
}
@media (max-width: 768px) {
  #brxe-rscbkw {
    padding-top: clamp(4rem, 12vh, 7rem) !important;
  }
  .sx-hero-bar {
    padding-bottom: clamp(5rem, 12vh, 9rem) !important;
  }
  #brxe-gjalcd::after {
    height: 100vh !important;
    min-height: 560px !important;
    background-position: center 40% !important;
  }
}
/* Indicateur scroll down (subtle) */
.sx-hero-bar::after {
  content: '';
  position: absolute;
  bottom: clamp(1.5rem, 3vh, 2.5rem);
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 40px;
  background: linear-gradient(180deg, transparent, rgba(255,255,255,0.5));
  animation: sxScrollDown 2s ease-in-out infinite;
}
@keyframes sxScrollDown {
  0%, 100% { transform: translateX(-50%) translateY(0); opacity: 0.4; }
  50%      { transform: translateX(-50%) translateY(8px); opacity: 1; }
}
/* sx-hero-fullpage-end */


/* sx-fix-erreurs */
/* Fix labels stats casses (texte original cache, version propre via ::after) */
.sx-trust-grid .sx-stat .lbl {
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  display: block !important;
  height: auto !important;
}
.sx-trust-grid .sx-stat .lbl::after {
  display: block !important;
  font-size: clamp(0.65rem, 0.85vw, 0.78rem) !important;
  font-weight: 600 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: rgba(29,35,39,0.55) !important;
  line-height: 1.4 !important;
  margin-top: 0.85rem !important;
}
.sx-trust-grid .sx-stat:nth-child(1) .lbl::after { content: 'Ans d’expérience familiale'; }
.sx-trust-grid .sx-stat:nth-child(2) .lbl::after { content: 'Produits en stock'; }
.sx-trust-grid .sx-stat:nth-child(3) .lbl::after { content: 'Magasin + entrepôt'; }
.sx-trust-grid .sx-stat:nth-child(4) .lbl::after { content: 'Lévis → Gaspésie'; }
/* sx-fix-erreurs-end */


/* sx-agence-grade */
:root {
  --sx-teal: #3a9bb8;
  --sx-teal-dark: #2a7a8e;
  --sx-teal-light: #5cc4d6;
  --sx-ink: #1d2327;
  --sx-paper: #ffffff;
  --sx-paper-soft: #f7f9fa;
  --sx-night: #0f1214;
  --sx-night-deep: #0a0c0d;
  --sx-ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --sx-ease-spring: cubic-bezier(0.5, 1.6, 0.4, 0.95);
  --sx-shadow-sm: 0 1px 2px rgba(15,18,20,0.04), 0 2px 4px rgba(15,18,20,0.04);
  --sx-shadow-md: 0 2px 4px rgba(15,18,20,0.04), 0 4px 8px rgba(15,18,20,0.06), 0 8px 16px rgba(15,18,20,0.04);
  --sx-shadow-lg: 0 4px 8px rgba(15,18,20,0.04), 0 8px 16px rgba(15,18,20,0.06), 0 16px 32px rgba(15,18,20,0.08);
  --sx-shadow-xl: 0 8px 16px rgba(15,18,20,0.06), 0 16px 32px rgba(15,18,20,0.08), 0 24px 48px rgba(15,18,20,0.10);
  --sx-shadow-teal: 0 4px 16px rgba(58,155,184,0.20), 0 8px 32px rgba(58,155,184,0.12);
}

.sx-skip-link {
  position: absolute; top: 0; left: 0;
  background: var(--sx-teal); color: #fff;
  padding: 0.75rem 1rem; font-weight: 600; font-size: 0.9rem;
  text-decoration: none; z-index: 9999;
  transform: translateY(-100%);
  transition: transform 0.3s var(--sx-ease-out-expo);
  border-radius: 0 0 8px 0;
}
.sx-skip-link:focus { transform: translateY(0); }

*:focus-visible {
  outline: 2px solid var(--sx-teal) !important;
  outline-offset: 3px !important;
  border-radius: 4px;
}
input:focus-visible, textarea:focus-visible {
  outline-offset: 0 !important;
  box-shadow: 0 0 0 3px rgba(58,155,184,0.15) !important;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-optical-sizing: auto;
}
body {
  font-feature-settings: 'kern' on, 'liga' on, 'calt' on;
  text-rendering: optimizeLegibility;
}
.sx-stat .num, [href^="tel:"], .num, .price {
  font-feature-settings: 'tnum' on, 'lnum' on, 'kern' on;
  font-variant-numeric: tabular-nums lining-nums;
}

.sx-tile, .sx-tile-large {
  box-shadow: var(--sx-shadow-sm) !important;
  transition: box-shadow 0.4s var(--sx-ease-out-expo), transform 0.4s var(--sx-ease-out-expo), border-color 0.3s ease !important;
}
.sx-tile:hover, .sx-tile-large:hover {
  box-shadow: var(--sx-shadow-xl), var(--sx-shadow-teal) !important;
  transform: translateY(-6px) !important;
}

a.brxe-button, button.brx-btn, .brxe-button.brx-btn {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  gap: 0.5rem;
  padding: 0.85rem 1.75rem !important;
  font-weight: 600 !important;
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  letter-spacing: 0.01em !important;
  border-radius: 999px;
  background: var(--sx-teal) !important;
  color: #fff !important;
  border: none;
  cursor: pointer;
  box-shadow: var(--sx-shadow-md), 0 4px 14px rgba(58,155,184,0.20) !important;
  transition: transform 0.3s var(--sx-ease-out-expo), box-shadow 0.3s var(--sx-ease-out-expo), background 0.3s ease !important;
  overflow: hidden;
  isolation: isolate;
}
a.brxe-button:hover, button.brx-btn:hover, .brxe-button.brx-btn:hover {
  background: var(--sx-teal-dark) !important;
  transform: translateY(-2px) !important;
  box-shadow: var(--sx-shadow-lg), 0 8px 24px rgba(58,155,184,0.40) !important;
}
a.brxe-button:active, button.brx-btn:active {
  transform: translateY(0) !important;
  transition-duration: 0.1s !important;
}

.sx-svc-page p a, .sx-section p a, article p a {
  color: var(--sx-teal-dark);
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0% 1.5px;
  background-position: left bottom;
  background-repeat: no-repeat;
  transition: background-size 0.4s var(--sx-ease-out-expo), color 0.3s ease;
}
.sx-svc-page p a:hover, .sx-section p a:hover, article p a:hover {
  background-size: 100% 1.5px;
  color: var(--sx-teal);
}

img { max-width: 100%; height: auto; vertical-align: middle; font-style: italic; }

@media print {
  body { font-size: 11pt; line-height: 1.5; color: #000; background: #fff; }
  #brx-header, #brx-footer, .sx-cta-band, .sx-brands, body::before { display: none !important; }
  .sx-section { padding: 1cm 0 !important; page-break-inside: avoid; }
  .sx-section h2 { font-size: 18pt; color: #000 !important; -webkit-text-fill-color: #000 !important; background: none !important; }
  .sx-stat .num { font-size: 24pt !important; -webkit-text-fill-color: #000 !important; color: #000 !important; }
  a { color: #000 !important; text-decoration: underline; }
  a[href^="tel:"]::after { content: ' (' attr(href) ')'; }
}

.sx-why p, .sx-cta-band p, #brx-footer p {
  color: rgba(255,255,255,0.78) !important;
}

.sx-visually-hidden, .visually-hidden, .screen-reader-text, .sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) {
  animation-duration: 0.25s;
  animation-timing-function: var(--sx-ease-out-expo);
}
/* sx-agence-grade-end */





/* sx-mobile-menu-elite */
/* ============ MENU MOBILE FULL-SCREEN CINEMATIQUE ============ */

/* Wrapper offcanvas full-screen */
.brxe-offcanvas {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100vh !important;
  background: #0a0c0d !important;
  z-index: 9998 !important;
  border: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
}

/* Decor gradient radial premium */
.brxe-offcanvas::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 50% at 100% 0%, rgba(58,155,184,0.18) 0%, transparent 65%),
    radial-gradient(ellipse 60% 40% at 0% 100%, rgba(58,155,184,0.10) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

/* Wrapper interne avec padding */
.brxe-offcanvas > .brxe-block,
.brxe-offcanvas > .brxe-div,
.brxe-offcanvas > .brxe-section,
.brxe-offcanvas > .brxe-container {
  background: transparent !important;
  padding: clamp(2.5rem, 6vw, 4rem) clamp(1.5rem, 5vw, 2.5rem) clamp(6rem, 10vh, 8rem) !important;
  position: relative;
  z-index: 1;
  min-height: 100vh;
  display: flex !important;
  flex-direction: column !important;
  gap: clamp(1.5rem, 3vh, 2.5rem);
}
.brxe-offcanvas .brxe-div,
.brxe-offcanvas .brxe-block,
.brxe-offcanvas .brxe-section,
.brxe-offcanvas .brxe-container,
.brxe-offcanvas form,
.brxe-offcanvas nav {
  background: transparent !important;
}

/* Animation entrée du offcanvas (parents class) */
.brxe-offcanvas.brx-open,
.brx-open .brxe-offcanvas,
[class*="brx-open"] .brxe-offcanvas {
  animation: sxOffcanvasFadeIn 0.45s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes sxOffcanvasFadeIn {
  from { opacity: 0; transform: scale(0.98); }
  to   { opacity: 1; transform: scale(1); }
}

/* SEARCH BAR top - prominente */
.brxe-offcanvas input[type="search"],
.brxe-offcanvas input[type="text"],
.brxe-offcanvas .asp_w_container input,
.brxe-offcanvas form input {
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  color: #ffffff !important;
  padding: 1.1rem 1.25rem !important;
  border-radius: 12px !important;
  font-size: 1.05rem !important;
  font-weight: 500 !important;
  width: 100% !important;
  transition: border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease !important;
}
.brxe-offcanvas input::placeholder { color: rgba(255,255,255,0.45) !important; }
.brxe-offcanvas input:focus {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(58,155,184,0.6) !important;
  box-shadow: 0 0 0 4px rgba(58,155,184,0.15) !important;
  outline: none !important;
}

/* LIENS NAV - Typo XL agence */
.brxe-offcanvas nav,
.brxe-offcanvas .brxe-nav-nested {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  counter-reset: sxMenu;
}
.brxe-offcanvas nav a,
.brxe-offcanvas .brxe-text-link a,
.brxe-offcanvas .brxe-nav-nested a,
.brxe-offcanvas a:not(.brxe-button):not([href^="tel:"]):not(.asp_input):not([class*="cart"]) {
  display: flex !important;
  align-items: center !important;
  font-size: clamp(1.4rem, 5vw, 2rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.15 !important;
  color: #ffffff !important;
  padding: 1.1rem 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  text-decoration: none !important;
  position: relative;
  transition: color 0.3s ease, padding-left 0.4s var(--sx-ease-out-expo) !important;
  background: transparent !important;
  font-feature-settings: 'kern' on, 'liga' on, 'ss01' on;
  counter-increment: sxMenu;
  opacity: 0;
  animation: sxMenuLinkIn 0.55s cubic-bezier(0.16,1,0.3,1) forwards;
}
.brxe-offcanvas nav a::after,
.brxe-offcanvas .brxe-text-link a::after { display: none !important; }

/* Numerotation 01, 02, 03... avant chaque lien */
.brxe-offcanvas nav a::before,
.brxe-offcanvas .brxe-text-link a::before {
  content: counter(sxMenu, decimal-leading-zero);
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  color: rgba(58,155,184,0.6);
  margin-right: 1.25rem;
  vertical-align: middle;
  font-feature-settings: 'tnum' on, 'lnum' on;
  font-variant-numeric: tabular-nums lining-nums;
  min-width: 2.5rem;
  transition: color 0.3s ease;
}

/* Stagger animation des liens (delays decroissants) */
.brxe-offcanvas nav a:nth-child(1),
.brxe-offcanvas a:nth-of-type(1) { animation-delay: 0.18s; }
.brxe-offcanvas nav a:nth-child(2),
.brxe-offcanvas a:nth-of-type(2) { animation-delay: 0.24s; }
.brxe-offcanvas nav a:nth-child(3),
.brxe-offcanvas a:nth-of-type(3) { animation-delay: 0.30s; }
.brxe-offcanvas nav a:nth-child(4),
.brxe-offcanvas a:nth-of-type(4) { animation-delay: 0.36s; }
.brxe-offcanvas nav a:nth-child(5),
.brxe-offcanvas a:nth-of-type(5) { animation-delay: 0.42s; }
.brxe-offcanvas nav a:nth-child(6),
.brxe-offcanvas a:nth-of-type(6) { animation-delay: 0.48s; }
.brxe-offcanvas nav a:nth-child(7),
.brxe-offcanvas a:nth-of-type(7) { animation-delay: 0.54s; }
.brxe-offcanvas nav a:nth-child(8),
.brxe-offcanvas a:nth-of-type(8) { animation-delay: 0.60s; }
@keyframes sxMenuLinkIn {
  from { opacity: 0; transform: translateX(-24px); filter: blur(4px); }
  to   { opacity: 1; transform: translateX(0);     filter: blur(0); }
}

/* Hover/active liens */
.brxe-offcanvas nav a:hover,
.brxe-offcanvas .brxe-text-link a:hover,
.brxe-offcanvas a:not(.brxe-button):not([href^="tel:"]):hover {
  color: #5cc4d6 !important;
  padding-left: 0.75rem !important;
}
.brxe-offcanvas nav a:hover::before,
.brxe-offcanvas .brxe-text-link a:hover::before {
  color: #5cc4d6;
}

/* CTA TÉLÉPHONE bottom premium */
.brxe-offcanvas a[href^="tel:"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.75rem !important;
  background: linear-gradient(135deg, #3a9bb8 0%, #2a7a8e 100%) !important;
  color: #ffffff !important;
  padding: 1.2rem 1.5rem !important;
  border-radius: 999px !important;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
  font-feature-settings: 'tnum' on, 'lnum' on;
  margin-top: auto !important;
  border: none !important;
  text-decoration: none !important;
  box-shadow: 0 8px 24px rgba(58,155,184,0.35), 0 4px 8px rgba(0,0,0,0.2);
  transition: transform 0.3s var(--sx-ease-out-expo), box-shadow 0.3s ease !important;
  opacity: 0;
  animation: sxMenuLinkIn 0.55s cubic-bezier(0.16,1,0.3,1) 0.7s forwards;
}
.brxe-offcanvas a[href^="tel:"]:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 32px rgba(58,155,184,0.50), 0 6px 12px rgba(0,0,0,0.25) !important;
}

/* HEADINGS dans offcanvas (sections du menu) */
.brxe-offcanvas .brxe-heading,
.brxe-offcanvas h2,
.brxe-offcanvas h3,
.brxe-offcanvas h4 {
  color: rgba(255,255,255,0.45) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
  margin: 1.5rem 0 0.5rem !important;
  padding: 0 !important;
  border: none !important;
}
.brxe-offcanvas .brxe-heading::after,
.brxe-offcanvas h2::after, .brxe-offcanvas h3::after { display: none !important; }
.brxe-offcanvas .brxe-heading::before,
.brxe-offcanvas h2::before, .brxe-offcanvas h3::before { display: none !important; }

/* BOUTON FERMER X premium (sans interferer JS Bricks) */
.brxe-offcanvas .brxe-toggle,
.brxe-offcanvas button.brxe-toggle {
  width: 48px !important;
  height: 48px !important;
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  cursor: pointer !important;
  padding: 0 !important;
  align-self: flex-end;
  transition: background 0.25s ease, border-color 0.25s ease !important;
}
.brxe-offcanvas .brxe-toggle:hover {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(58,155,184,0.5) !important;
}
.brxe-offcanvas .brxe-toggle i,
.brxe-offcanvas .brxe-toggle svg,
.brxe-offcanvas .brxe-toggle .fa,
.brxe-offcanvas .brxe-toggle .fas {
  color: #ffffff !important;
  fill: #ffffff !important;
  font-size: 1.25rem !important;
}

/* Cart icon dans offcanvas */
.brxe-offcanvas .brxe-woocommerce-mini-cart,
.brxe-offcanvas [class*="cart"] {
  color: #ffffff !important;
}
.brxe-offcanvas .brxe-woocommerce-mini-cart .count,
.brxe-offcanvas [class*="count"] {
  background: var(--sx-teal) !important;
  color: #ffffff !important;
  border: 2px solid #0a0c0d !important;
  font-weight: 700 !important;
  font-feature-settings: 'tnum' on;
}

/* SIGNATURE BOTTOM */
.brxe-offcanvas .brxe-block:last-child::after,
.brxe-offcanvas > .brxe-block::before {
  content: '';
}
.brxe-offcanvas::after {
  content: 'SANI EXPRESS · DEPUIS 1985';
  position: fixed;
  bottom: 1.25rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  color: rgba(255,255,255,0.32);
  text-align: center;
  pointer-events: none;
  z-index: 5;
  opacity: 0;
  animation: sxSigFadeIn 0.6s ease 0.9s forwards;
  white-space: nowrap;
}
@keyframes sxSigFadeIn {
  to { opacity: 1; }
}

/* SCROLL bar custom dans offcanvas */
.brxe-offcanvas::-webkit-scrollbar { width: 4px; }
.brxe-offcanvas::-webkit-scrollbar-track { background: transparent; }
.brxe-offcanvas::-webkit-scrollbar-thumb {
  background: rgba(58,155,184,0.4);
  border-radius: 999px;
}

/* sx-mobile-menu-elite-end */


/* sx-suggest-fix */
.sx-suggest {
  z-index: 200 !important;
  max-height: min(60vh, 480px) !important;
  overflow-y: auto !important;
  background: #ffffff !important;
  box-shadow: 0 16px 48px rgba(15,18,20,0.18), 0 4px 12px rgba(15,18,20,0.08) !important;
  border-radius: 12px !important;
  border: 1px solid rgba(58,155,184,0.10) !important;
  margin-top: 0.5rem !important;
}
.sx-suggest::-webkit-scrollbar { width: 6px; }
.sx-suggest::-webkit-scrollbar-thumb { background: rgba(58,155,184,0.4); border-radius: 999px; }
/* Suggest doit apparaitre par-dessus le scroll-down indicator */
.sx-search-wrap { z-index: 5; position: relative; }
/* sx-suggest-fix-end */


/* sx-hero-fit */
#brxe-gjalcd { padding-top: 0 !important; padding-bottom: 0 !important; }
#brxe-rscbkw { margin-top: 0 !important; margin-bottom: 0 !important; }
.sx-hero-bar { margin-top: 0 !important; }
.sx-hero-bar .sx-container.sx-hero-flex { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
/* sx-hero-fit-end */


/* sx-final-polish */
/* ============ SERVICES NUMERATION 01-08 ============ */
.sx-services-grid {
  counter-reset: sxSvc;
}
.sx-services-grid > * {
  counter-increment: sxSvc;
  position: relative;
}
.sx-services-grid > *::before {
  content: counter(sxSvc, decimal-leading-zero);
  display: inline-block;
  font-size: clamp(0.65rem, 0.85vw, 0.78rem);
  font-weight: 600;
  letter-spacing: 0.22em;
  color: rgba(58,155,184,0.6);
  font-feature-settings: 'tnum' on, 'lnum' on;
  font-variant-numeric: tabular-nums lining-nums;
  margin-right: 1rem;
  vertical-align: middle;
  min-width: 2.5rem;
  flex-shrink: 0;
  transition: color 0.3s ease;
}
.sx-services-grid > *:hover::before {
  color: var(--sx-teal);
}
.sx-services-grid > *::after {
  content: '2192';
  position: absolute;
  right: clamp(1rem, 2vw, 1.5rem);
  top: 50%;
  transform: translateY(-50%) translateX(0);
  font-size: 1.4rem;
  color: rgba(29,35,39,0.25);
  transition: transform 0.4s var(--sx-ease-out-expo), color 0.3s !important;
  font-weight: 300;
}
.sx-services-grid > *:hover::after {
  transform: translateY(-50%) translateX(8px);
  color: var(--sx-teal);
}

/* ============ TILE CARDS 3D TILT SUBTLE (perspective hover) ============ */
.sx-cat-grid {
  perspective: 1000px;
}
.sx-tile, .sx-tile-large {
  transform-style: preserve-3d;
  will-change: transform;
}
@media (hover: hover) {
  .sx-tile:hover, .sx-tile-large:hover {
    transform: perspective(1000px) translateY(-6px) rotateX(2deg) rotateY(-1deg) !important;
  }
}

/* ============ LOADING SHIMMER pour suggest et autres ============ */
.sx-suggest-loading,
[class*="loading"],
[class*="spinner"]:not(.no-shimmer) {
  background: linear-gradient(90deg, transparent 0%, rgba(58,155,184,0.10) 50%, transparent 100%);
  background-size: 200% 100%;
  animation: sxShimmer 1.4s ease-in-out infinite;
}
@keyframes sxShimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============ CATEGORY ICONS via masque (anti-AI mais sobre) ============ */
.sx-tile h3, .sx-tile-large h3 {
  position: relative;
  padding-top: 0.75rem !important;
  margin-top: 0 !important;
}
.sx-tile h3::before, .sx-tile-large h3::before {
  content: '';
  display: block;
  width: 32px;
  height: 2px;
  background: var(--sx-teal);
  border-radius: 999px;
  margin-bottom: 0.85rem;
  transition: width 0.4s var(--sx-ease-out-expo), background 0.3s ease;
}
.sx-tile:hover h3::before,
.sx-tile-large:hover h3::before {
  width: 56px;
  background: var(--sx-teal-light);
}

/* ============ HEADER LOGO ZOOM SUBTLE ============ */
#brx-header .brxe-image:hover img,
#brx-header figure:hover img,
#brx-header a:hover img {
  transform: scale(1.05);
}

/* ============ SECTION TRANSITIONS smooth (no abrupt edges) ============ */
.sx-section + .sx-section,
.sx-cta-band + .sx-section,
.sx-section + .sx-cta-band {
  position: relative;
}

/* ============ FOCUS ON SEARCH puis SCROLL TO IT ============ */
.sx-search-form input:focus {
  scroll-margin-top: 100px;
}

/* ============ CTA BAND TYPO ELITE ============ */
.sx-cta-band h2 {
  text-wrap: balance;
  max-width: 22ch;
  margin: 0 auto 1rem !important;
}
.sx-cta-band p {
  font-size: clamp(0.95rem, 1.15vw, 1.1rem) !important;
  letter-spacing: 0.02em !important;
}

/* ============ FOOTER UPGRADE FINAL ============ */
#brx-footer img {
  max-height: 60px !important;
  width: auto !important;
}
#brx-footer .bc-footer-008__bottom {
  font-size: clamp(0.7rem, 0.85vw, 0.78rem) !important;
  letter-spacing: 0.04em !important;
  text-align: center;
}

/* ============ EMPTY STATE PRODUITS / CART ============ */
.empty-cart-message, .no-products, [class*="empty"] {
  text-align: center;
  padding: clamp(3rem, 5vw, 5rem) 1.5rem;
  color: rgba(29,35,39,0.55);
  font-size: clamp(0.95rem, 1.1vw, 1.05rem);
  letter-spacing: -0.005em;
}

/* ============ LIENS COULEUR DEFAUT (tous les body links) ============ */
.sx-section a:not(.brxe-button):not([href^="tel:"]):not(.sx-cta):not([class*="brxe"]),
article a:not(.brxe-button):not([href^="tel:"]) {
  color: var(--sx-teal-dark);
  transition: color 0.25s ease;
}
.sx-section a:not(.brxe-button):not([href^="tel:"]):not(.sx-cta):hover {
  color: var(--sx-teal);
}

/* ============ PERFORMANCE: containment hints ============ */
.sx-section, .sx-svc-page > section, footer, header {
  contain: layout style;
}

/* ============ FALLBACK pour navigateurs sans :has() ============ */
@supports not selector(:has(*)) {
  .sx-search-form input:invalid + button { opacity: 0.55; }
}

/* ============ STATUS LIVE INDICATOR ENHANCEMENT ============ */
.sx-status-live {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.4rem 0.85rem !important;
  background: rgba(255,255,255,0.06);
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.10);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: background 0.3s ease, border-color 0.3s ease;
}
.sx-status-live.open { border-color: rgba(74,222,128,0.30); }
.sx-status-live:not(.open) { border-color: rgba(255,150,100,0.25); }
/* sx-final-polish-end */


/* sx-no-repeat */
/* Eviter repetition '4 000+ produits' partout - remplacer via CSS override */

/* 1. Sub-titre sx-cat (sous "Magasinez par categorie") */
.sx-cat .sx-sub {
  font-size: 0 !important;
  line-height: 0 !important;
}
.sx-cat .sx-sub::after {
  content: 'Conseil pro inclus · Soumission gratuite sous 24 h · Compte B2B sur facture';
  display: block;
  font-size: clamp(0.85rem, 1.1vw, 1rem);
  line-height: 1.6;
  letter-spacing: 0.02em;
  color: rgba(29,35,39,0.55);
  font-weight: 500;
  text-align: center;
  max-width: 60ch;
  margin: 0 auto;
}

/* 2. Texte intro hero brxe-xkpuak (si visible) */
#brxe-xkpuak {
  font-size: 0 !important;
  line-height: 0 !important;
}
#brxe-xkpuak::after {
  content: 'Distribution et services d’entretien pour les commerces du Québec. Conseil pro au téléphone, soumission gratuite sous 24 heures.';
  display: block;
  font-size: clamp(0.95rem, 1.15vw, 1.1rem);
  line-height: 1.6;
  letter-spacing: -0.005em;
  color: rgba(29,35,39,0.72);
  font-weight: 400;
}
/* sx-no-repeat-end */


/* sx-wow-factor */
.sx-cta-band { position: relative; isolation: isolate; }
.sx-cta-band::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(at 20% 30%, rgba(58,155,184,0.18) 0px, transparent 50%),
    radial-gradient(at 80% 70%, rgba(92,196,214,0.12) 0px, transparent 50%),
    radial-gradient(at 50% 100%, rgba(43,125,143,0.14) 0px, transparent 50%);
  pointer-events: none;
  z-index: -1;
  opacity: 0.8;
}
.sx-cta-band h2,
.sx-why h2 {
  background: linear-gradient(110deg, #ffffff 0%, #b3e8f1 35%, #5cc4d6 50%, #b3e8f1 65%, #ffffff 100%) !important;
  background-size: 200% auto !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  animation: sxTextShimmer 8s ease-in-out infinite;
}
@keyframes sxTextShimmer {
  0%, 100% { background-position: 0% center; }
  50% { background-position: 100% center; }
}
.sx-tile, .sx-tile-large { position: relative; }
.sx-tile::after, .sx-tile-large::after {
  content: '';
  position: absolute;
  inset: -1.5px;
  background: conic-gradient(from 0deg,
    transparent 0deg, transparent 60deg,
    rgba(58,155,184,0.5) 90deg,
    rgba(92,196,214,0.7) 110deg,
    rgba(58,155,184,0.5) 130deg,
    transparent 160deg, transparent 360deg);
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.5s ease;
  pointer-events: none;
}
.sx-tile:hover::after, .sx-tile-large:hover::after {
  opacity: 1;
  animation: sxConicSpin 4s linear infinite;
}
@keyframes sxConicSpin {
  to { transform: rotate(360deg); }
}
.sx-stat .num {
  background: linear-gradient(180deg, #1d2327 0%, #1d2327 50%, rgba(29,35,39,0.65) 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.sx-stat:hover .num {
  background: linear-gradient(135deg, #3a9bb8 0%, #5cc4d6 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.sx-status-live {
  background: rgba(255,255,255,0.08) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  padding: 0.5rem 1rem !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.sx-cta-band::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: clamp(80px, 12vw, 140px);
  height: 1px;
  background: linear-gradient(90deg, transparent, #3a9bb8, transparent);
  z-index: 1;
}
/* sx-wow-factor-end */


/* sx-why-content-fix */
.sx-why-grid .sx-feat:nth-child(1) p {
  font-size: 0 !important;
  line-height: 0 !important;
}
.sx-why-grid .sx-feat:nth-child(1) p::after {
  content: 'Quarante ans à équiper restos, écoles, manufactures et CHSLD. On connaît chaque produit. Demande-nous nos recommandations avant de commander.';
  display: block;
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  line-height: 1.55 !important;
  letter-spacing: -0.005em !important;
  color: rgba(255,255,255,0.62) !important;
  text-wrap: pretty;
}
.sx-why-grid .sx-feat:nth-child(2) p {
  font-size: 0 !important;
  line-height: 0 !important;
}
.sx-why-grid .sx-feat:nth-child(2) p::after {
  content: 'Camions Sani Express en direct sur Lévis–Gaspésie. Pour le reste du Québec, transporteurs partenaires fiables. Délais 1 à 5 jours selon zone.';
  display: block;
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  line-height: 1.55 !important;
  letter-spacing: -0.005em !important;
  color: rgba(255,255,255,0.62) !important;
  text-wrap: pretty;
}
.sx-why-grid .sx-feat:nth-child(3) p {
  font-size: 0 !important;
  line-height: 0 !important;
}
.sx-why-grid .sx-feat:nth-child(3) p::after {
  content: 'Tu parles directement à quelqu’un qui te répond depuis Rivière-du-Loup. Pas de chatbot, pas de script. Lundi au vendredi, 8 h à 16 h.';
  display: block;
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  line-height: 1.55 !important;
  letter-spacing: -0.005em !important;
  color: rgba(255,255,255,0.62) !important;
  text-wrap: pretty;
}
.sx-why-grid .sx-feat:nth-child(4) p {
  font-size: 0 !important;
  line-height: 0 !important;
}
.sx-why-grid .sx-feat:nth-child(4) p::after {
  content: 'Réponse à ta soumission sous 24 heures ouvrables. Compte B2B sur facture disponible. Pas de minimum de commande, petite ou grosse.';
  display: block;
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  line-height: 1.55 !important;
  letter-spacing: -0.005em !important;
  color: rgba(255,255,255,0.62) !important;
  text-wrap: pretty;
}
.sx-why-grid .sx-feat:nth-child(4) h3 {
  font-size: 0 !important;
  line-height: 0 !important;
}
.sx-why-grid .sx-feat:nth-child(4) h3::after {
  content: 'Soumission rapide & compte B2B';
  display: block;
  color: #ffffff !important;
  font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important;
  font-weight: 600 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.2 !important;
  margin-bottom: 0.65rem !important;
  text-wrap: balance;
}
/* sx-why-content-fix-end */


/* sx-offcanvas-deep */
/* Offcanvas peut contenir bcp d'items (52 categories + services + pages) */
/* Reduire taille des liens si beaucoup */
.brxe-offcanvas nav,
.brxe-offcanvas .brxe-nav-nested,
.brxe-offcanvas ul.menu,
.brxe-offcanvas ul[class*="menu"] {
  display: flex !important;
  flex-direction: column !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100%;
}
/* Items niveau 0 = principaux (catégories) */
.brxe-offcanvas nav > ul > li,
.brxe-offcanvas .menu-item-depth-0,
.brxe-offcanvas li.menu-item:not([class*="depth-1"]):not([class*="depth-2"]) {
  position: relative;
}
.brxe-offcanvas nav > ul > li > a,
.brxe-offcanvas .menu-item-depth-0 > a,
.brxe-offcanvas li.menu-item > a {
  font-size: clamp(1rem, 3.5vw, 1.3rem) !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  padding: 0.85rem 0 !important;
  display: flex !important;
  align-items: center !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  color: #ffffff !important;
}

/* Sub-items (niveau 1+) plus petits, indented */
.brxe-offcanvas .menu-item-depth-1 > a,
.brxe-offcanvas li.menu-item li > a,
.brxe-offcanvas ul ul li > a {
  font-size: clamp(0.85rem, 2.5vw, 0.95rem) !important;
  font-weight: 400 !important;
  padding: 0.55rem 0 0.55rem 1rem !important;
  color: rgba(255,255,255,0.7) !important;
  border-bottom: none !important;
  letter-spacing: 0 !important;
}
.brxe-offcanvas .menu-item-depth-1 > a:hover,
.brxe-offcanvas li.menu-item li > a:hover {
  color: #5cc4d6 !important;
  padding-left: 1.5rem !important;
}

/* Sub-menu auto-expand sur mobile (pas de hover) */
.brxe-offcanvas ul ul.sub-menu,
.brxe-offcanvas .sub-menu,
.brxe-offcanvas ul ul {
  display: block !important;
  position: static !important;
  background: transparent !important;
  padding: 0 0 0.5rem 0 !important;
  margin: 0 !important;
  list-style: none;
  border: none !important;
  box-shadow: none !important;
}

/* Numerotation supprimee si trop d'items (desactive override num) */
.brxe-offcanvas nav > ul > li > a::before {
  content: none !important;
}

/* Wrapper interne scrollable */
.brxe-offcanvas {
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

/* Dropdown caret indicator si sub-menu present */
.brxe-offcanvas li.menu-item-has-children > a::after,
.brxe-offcanvas li:has(ul) > a::after {
  content: '+';
  margin-left: auto;
  color: rgba(58,155,184,0.6);
  font-weight: 300;
  font-size: 1.4rem;
  transition: transform 0.3s ease, color 0.3s ease;
}
.brxe-offcanvas li.menu-item-has-children:hover > a::after {
  transform: rotate(45deg);
  color: var(--sx-teal-light);
}

/* Sticky search top dans offcanvas */
.brxe-offcanvas .asp_w_container,
.brxe-offcanvas form[role="search"] {
  position: sticky;
  top: 0;
  background: #0a0c0d;
  padding: 1rem 0 !important;
  z-index: 10;
  border-bottom: 1px solid rgba(255,255,255,0.10);
  margin-bottom: 1rem;
}

/* Section headings dans offcanvas (Categories, Services, Aide) */
.brxe-offcanvas h2,
.brxe-offcanvas h3,
.brxe-offcanvas h4,
.brxe-offcanvas .brxe-heading {
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.28em !important;
  text-transform: uppercase !important;
  color: rgba(58,155,184,0.6) !important;
  margin: 1.5rem 0 0.5rem !important;
  padding: 0 !important;
  border: none !important;
}

/* CTA téléphone toujours en bas (déjà fait, renforcer position) */
.brxe-offcanvas a[href^="tel:"] {
  position: sticky;
  bottom: 0;
  margin-top: 1.5rem !important;
}
/* sx-offcanvas-deep-end */


/* sx-featured-products */
/* Sections vedettes / specials / liquidation - style pret pour ajout Bricks */
.sx-section.sx-featured,
.sx-section.sx-deals,
.sx-section.sx-liquidation {
  padding-block: clamp(4rem, 7vw, 7rem) !important;
  position: relative;
}
.sx-featured h2,
.sx-deals h2,
.sx-liquidation h2 {
  font-size: clamp(2rem, 4vw, 3.2rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.1 !important;
  margin-bottom: 0.5rem !important;
  text-wrap: balance;
  max-width: 18ch;
}
.sx-featured .sx-sub,
.sx-deals .sx-sub,
.sx-liquidation .sx-sub {
  font-size: clamp(0.85rem, 1.1vw, 1rem) !important;
  color: rgba(29,35,39,0.55) !important;
  letter-spacing: 0.04em !important;
  margin-bottom: clamp(2rem, 3vw, 3rem) !important;
}

/* Badge "VEDETTE" / "SPECIAL" / "LIQUIDATION" */
.sx-featured h2::before {
  content: 'VEDETTES';
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.32em;
  color: var(--sx-teal);
  margin-bottom: 0.85rem;
  text-transform: uppercase;
  font-feature-settings: 'tnum' on;
}
.sx-deals h2::before {
  content: 'SPÉCIAUX';
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.32em;
  color: #ff6b35;
  margin-bottom: 0.85rem;
  text-transform: uppercase;
}
.sx-liquidation {
  background: linear-gradient(135deg, #1d2327 0%, #0f1214 100%);
  color: #ffffff;
}
.sx-liquidation h2::before {
  content: 'LIQUIDATION';
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.32em;
  color: #ff3b30;
  margin-bottom: 0.85rem;
  text-transform: uppercase;
}
.sx-liquidation h2,
.sx-liquidation .sx-sub { color: #ffffff !important; }
.sx-liquidation .sx-sub { color: rgba(255,255,255,0.7) !important; }

/* Grid produits */
.sx-featured-grid,
.sx-deals-grid,
.sx-liquidation-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: clamp(1rem, 2vw, 1.5rem) !important;
}
@media (max-width: 1024px) {
  .sx-featured-grid, .sx-deals-grid, .sx-liquidation-grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 768px) {
  .sx-featured-grid, .sx-deals-grid, .sx-liquidation-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 0.75rem !important; }
}
@media (max-width: 480px) {
  .sx-featured-grid, .sx-deals-grid, .sx-liquidation-grid { grid-template-columns: 1fr !important; }
}

/* WC product cards in featured section */
.sx-featured-grid .product,
.sx-deals-grid .product,
.sx-liquidation-grid .product,
.sx-featured ul.products li.product,
.sx-deals ul.products li.product {
  background: #ffffff;
  border-radius: 12px;
  padding: 1rem !important;
  border: 1px solid rgba(58,155,184,0.10);
  transition: transform 0.4s var(--sx-ease-out-expo), box-shadow 0.4s, border-color 0.3s !important;
  position: relative;
  overflow: hidden;
}
.sx-featured-grid .product:hover,
.sx-deals-grid .product:hover {
  transform: translateY(-4px);
  border-color: rgba(58,155,184,0.40);
  box-shadow: var(--sx-shadow-lg), 0 8px 24px rgba(58,155,184,0.15);
}

/* Sale badge */
.sx-deals .product .onsale,
.sx-liquidation .product .onsale,
.sx-featured .product .onsale {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  background: #ff3b30;
  color: #ffffff;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  padding: 0.35rem 0.65rem;
  border-radius: 4px;
  text-transform: uppercase;
  box-shadow: 0 4px 12px rgba(255,59,48,0.35);
  z-index: 5;
}

/* Product title in cards */
.sx-featured-grid h3,
.sx-deals-grid h3,
.sx-liquidation-grid h3,
.sx-featured-grid .woocommerce-loop-product__title,
.sx-deals-grid .woocommerce-loop-product__title {
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em !important;
  color: #1d2327 !important;
  text-wrap: balance;
  margin-top: 0.85rem !important;
  margin-bottom: 0.5rem !important;
}

/* Price in cards */
.sx-featured-grid .price,
.sx-deals-grid .price,
.sx-liquidation-grid .price {
  font-size: clamp(0.95rem, 1.1vw, 1.05rem) !important;
  font-weight: 700 !important;
  font-feature-settings: 'tnum' on, 'lnum' on;
  font-variant-numeric: tabular-nums lining-nums;
  color: var(--sx-teal-dark) !important;
}
.sx-deals-grid .price del,
.sx-liquidation-grid .price del {
  color: rgba(29,35,39,0.42) !important;
  font-weight: 400;
  margin-right: 0.5rem;
}
.sx-deals-grid .price ins,
.sx-liquidation-grid .price ins {
  color: #ff3b30 !important;
  text-decoration: none;
  font-weight: 700;
}

/* Sx-featured row scroll horizontal mobile */
@media (max-width: 480px) {
  .sx-featured-grid { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 0.75rem !important; padding: 0 1rem; }
  .sx-featured-grid .product { flex: 0 0 80%; scroll-snap-align: start; }
}
/* sx-featured-products-end */


/* sx-cat-synth */
/* Synthese des cards categories - moins de texte, plus de visuel + count en avant */

.sx-cat-grid {
  gap: clamp(0.85rem, 1.5vw, 1.25rem) !important;
}

/* Card layout compact */
.sx-tile, .sx-tile-large {
  padding: clamp(1.25rem, 2.5vw, 1.75rem) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important;
  min-height: clamp(140px, 18vw, 180px);
  justify-content: space-between;
}

/* Cacher description longue */
.sx-tile p:not(.sx-count):not(.sx-cta),
.sx-tile-large p:not(.sx-count):not(.sx-cta) {
  display: none !important;
}

/* Titre catégorie - typo XL impact */
.sx-tile h3, .sx-tile-large h3 {
  font-size: clamp(1.05rem, 1.5vw, 1.4rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
  text-wrap: balance;
  margin: 0 !important;
}

/* sx-count = nombre de produits (sxisting) - mis en avant */
.sx-tile .sx-count, .sx-tile-large .sx-count {
  display: inline-block !important;
  font-size: clamp(0.7rem, 0.85vw, 0.78rem) !important;
  font-weight: 600 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: rgba(58,155,184,0.75) !important;
  font-feature-settings: 'tnum' on, 'lnum' on;
  font-variant-numeric: tabular-nums lining-nums;
  padding: 0.25rem 0.6rem !important;
  background: rgba(58,155,184,0.08);
  border-radius: 999px;
  margin: 0 !important;
  align-self: flex-start;
  border: 1px solid rgba(58,155,184,0.18);
}
.sx-tile:hover .sx-count, .sx-tile-large:hover .sx-count {
  background: rgba(58,155,184,0.15);
  color: var(--sx-teal) !important;
  border-color: rgba(58,155,184,0.4);
}

/* sx-cta = "Voir les X produits" - simplifie */
.sx-tile .sx-cta, .sx-tile-large .sx-cta {
  font-size: clamp(0.75rem, 0.9vw, 0.85rem) !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--sx-teal-dark) !important;
  display: inline-flex !important;
  align-items: center;
  gap: 0.35rem;
  margin: 0 !important;
}
.sx-tile .sx-cta::after, .sx-tile-large .sx-cta::after {
  content: '2192';
  font-size: 1.1em;
  transition: transform 0.3s var(--sx-ease-out-expo);
}
.sx-tile:hover .sx-cta::after, .sx-tile-large:hover .sx-cta::after {
  transform: translateX(4px);
}

/* Hover plus impact */
.sx-tile:hover, .sx-tile-large:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(58,155,184,0.50) !important;
}

/* Title H3 - garder le mark teal du polish */
.sx-tile h3::before, .sx-tile-large h3::before {
  content: '';
  display: block;
  width: 24px;
  height: 2px;
  background: var(--sx-teal);
  border-radius: 999px;
  margin-bottom: 0.65rem;
  transition: width 0.3s var(--sx-ease-out-expo);
}
.sx-tile:hover h3::before, .sx-tile-large:hover h3::before {
  width: 48px;
}

/* Mobile : grille 2 cols */
@media (max-width: 768px) {
  .sx-cat-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.75rem !important;
  }
  .sx-tile, .sx-tile-large {
    min-height: 120px;
    padding: 1rem !important;
  }
  .sx-tile h3, .sx-tile-large h3 {
    font-size: 0.95rem !important;
  }
}
@media (max-width: 480px) {
  .sx-cat-grid {
    grid-template-columns: 1fr !important;
  }
}
/* sx-cat-synth-end */


/* sx-elite-final */
/* ============ FORMS — inputs/selects/textareas/checkboxes premium ============ */
input[type="text"], input[type="email"], input[type="tel"], input[type="search"],
input[type="password"], input[type="number"], input[type="url"], textarea, select {
  font-family: inherit;
  font-size: clamp(0.95rem, 1.05vw, 1.05rem);
  font-weight: 500;
  letter-spacing: -0.005em;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(29,35,39,0.14);
  border-radius: 8px;
  background: #ffffff;
  color: var(--sx-ink);
  transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease !important;
  caret-color: var(--sx-teal);
}
input:hover, textarea:hover, select:hover {
  border-color: rgba(58,155,184,0.35);
}
input:focus, textarea:focus, select:focus {
  outline: none !important;
  border-color: var(--sx-teal) !important;
  box-shadow: 0 0 0 4px rgba(58,155,184,0.12) !important;
  background: #ffffff;
}
input::placeholder, textarea::placeholder {
  color: rgba(29,35,39,0.42);
  font-weight: 400;
}

/* Form labels */
label {
  font-size: clamp(0.78rem, 0.9vw, 0.85rem);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(29,35,39,0.72);
  margin-bottom: 0.5rem;
  display: inline-block;
}

/* Checkboxes & radios custom */
input[type="checkbox"], input[type="radio"] {
  accent-color: var(--sx-teal);
  cursor: pointer;
}

/* Select dropdown chevron custom */
select {
  appearance: none;
  -webkit-appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, #3a9bb8 50%), linear-gradient(135deg, #3a9bb8 50%, transparent 50%);
  background-position: calc(100% - 16px) center, calc(100% - 11px) center;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 2.5rem;
}

/* ============ CART CTA ANIMATIONS ============ */
.added_to_cart, .button.alt, button[name="add-to-cart"], .single_add_to_cart_button {
  position: relative;
  overflow: hidden;
}
.added_to_cart::before, .button.alt::before, button[name="add-to-cart"]::before, .single_add_to_cart_button::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, rgba(255,255,255,0.4) 0%, transparent 70%);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
.added_to_cart:active::before, .button.alt:active::before, button[name="add-to-cart"]:active::before {
  opacity: 1;
  transition: opacity 0s;
}

/* Cart count badge animation when item added */
.brxe-woocommerce-mini-cart .count.updating,
[class*="cart-count"].updating {
  animation: sxCartBump 0.5s var(--sx-ease-spring);
}
@keyframes sxCartBump {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.3); }
  60%  { transform: scale(0.95); }
  100% { transform: scale(1); }
}

/* ============ BACK TO TOP — bouton flottant ============ */
.sx-back-to-top, [class*="back-to-top"] {
  position: fixed;
  bottom: clamp(1.5rem, 3vw, 2.5rem);
  right: clamp(1.5rem, 3vw, 2.5rem);
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--sx-teal);
  color: #ffffff;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  box-shadow: var(--sx-shadow-lg), 0 8px 24px rgba(58,155,184,0.35);
  opacity: 0;
  transform: translateY(20px) scale(0.85);
  transition: opacity 0.4s var(--sx-ease-out-expo), transform 0.4s var(--sx-ease-out-expo), box-shadow 0.3s ease;
  z-index: 90;
  pointer-events: none;
}
@supports (animation-timeline: scroll()) {
  .sx-back-to-top, [class*="back-to-top"] {
    animation: sxBackToTopReveal linear both;
    animation-timeline: scroll(root);
    animation-range: 600px 1200px;
    pointer-events: auto;
  }
  @keyframes sxBackToTopReveal {
    to { opacity: 1; transform: translateY(0) scale(1); }
  }
}
.sx-back-to-top:hover, [class*="back-to-top"]:hover {
  background: var(--sx-teal-dark);
  box-shadow: var(--sx-shadow-xl), 0 12px 32px rgba(58,155,184,0.5);
  transform: translateY(-2px) scale(1.05) !important;
}

/* ============ TOOLTIPS CSS ONLY ============ */
[data-tooltip] {
  position: relative;
}
[data-tooltip]::before {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  background: var(--sx-night);
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  padding: 0.45rem 0.75rem;
  border-radius: 6px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.25s ease, transform 0.25s var(--sx-ease-out-expo);
  z-index: 100;
  box-shadow: var(--sx-shadow-md);
}
[data-tooltip]:hover::before, [data-tooltip]:focus-visible::before {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ============ TOAST NOTIFICATIONS ============ */
.woocommerce-message, .woocommerce-info, .woocommerce-error,
.woocommerce-notices-wrapper > div, [class*="toast"] {
  background: #ffffff !important;
  border-left: 4px solid var(--sx-teal);
  padding: 1rem 1.25rem !important;
  border-radius: 8px !important;
  box-shadow: var(--sx-shadow-lg);
  font-size: clamp(0.9rem, 1vw, 1rem) !important;
  letter-spacing: -0.005em;
  animation: sxToastSlideIn 0.4s var(--sx-ease-out-expo) both;
}
.woocommerce-error {
  border-left-color: #ff3b30;
}
@keyframes sxToastSlideIn {
  from { opacity: 0; transform: translateX(20px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ============ EMPTY STATES (panier vide, search no results) ============ */
.cart-empty, .woocommerce-info, .no-products-found, [class*="empty-state"] {
  text-align: center;
  padding: clamp(3rem, 5vw, 5rem) 1.5rem;
  color: rgba(29,35,39,0.55);
  font-size: clamp(0.95rem, 1.1vw, 1.05rem);
  letter-spacing: -0.005em;
  line-height: 1.6;
}

/* ============ TABLES (cart, checkout, account) ============ */
table.shop_table, table.cart, table.woocommerce-table {
  border: none !important;
  border-collapse: separate !important;
  border-spacing: 0 8px !important;
}
table.shop_table th, table.cart th {
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: rgba(29,35,39,0.55) !important;
  border: none !important;
  padding: 0.85rem 1rem !important;
}
table.shop_table td, table.cart td {
  background: #ffffff;
  padding: 1rem !important;
  border: 1px solid rgba(29,35,39,0.06) !important;
  border-left: none !important;
  border-right: none !important;
  font-size: 0.95rem !important;
}

/* ============ BREADCRUMBS clean ============ */
.woocommerce-breadcrumb, [class*="breadcrumb"] {
  font-size: clamp(0.78rem, 0.9vw, 0.85rem) !important;
  letter-spacing: 0.04em !important;
  color: rgba(29,35,39,0.55) !important;
  padding: clamp(1rem, 2vw, 1.5rem) 0 !important;
  margin-bottom: clamp(1rem, 2vw, 1.5rem) !important;
  border-bottom: 1px solid rgba(29,35,39,0.06);
}
.woocommerce-breadcrumb a, [class*="breadcrumb"] a {
  color: rgba(29,35,39,0.72) !important;
  transition: color 0.25s ease;
}
.woocommerce-breadcrumb a:hover, [class*="breadcrumb"] a:hover {
  color: var(--sx-teal) !important;
}

/* ============ PAGINATION ============ */
.woocommerce-pagination, .page-numbers {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  margin: clamp(2rem, 4vw, 4rem) 0;
}
.page-numbers li, .woocommerce-pagination li { list-style: none; }
.page-numbers a, .page-numbers span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 0.85rem;
  font-size: 0.92rem;
  font-weight: 600;
  font-feature-settings: 'tnum' on;
  border: 1px solid rgba(29,35,39,0.14);
  border-radius: 8px;
  color: var(--sx-ink);
  text-decoration: none !important;
  transition: all 0.25s var(--sx-ease-out-expo);
}
.page-numbers a:hover {
  background: var(--sx-teal);
  border-color: var(--sx-teal);
  color: #ffffff;
  transform: translateY(-2px);
}
.page-numbers span.current {
  background: var(--sx-teal);
  border-color: var(--sx-teal);
  color: #ffffff;
}

/* ============ COOKIE BANNER PREMIUM (si plugin used) ============ */
#cookie-notice, .cookie-notice, [class*="cookie-consent"] {
  background: #0a0c0d !important;
  border-radius: 12px !important;
  padding: 1.25rem 1.5rem !important;
  box-shadow: var(--sx-shadow-xl) !important;
  border: 1px solid rgba(58,155,184,0.18);
  max-width: 480px !important;
  margin: 1rem !important;
}
#cookie-notice .cn-text-container {
  color: rgba(255,255,255,0.78) !important;
  font-size: 0.9rem !important;
  line-height: 1.55;
}

/* ============ LOADING SKELETONS (placeholders) ============ */
.sx-skeleton, [class*="skeleton"] {
  background: linear-gradient(90deg, #f0f3f5 0%, #e5eaef 50%, #f0f3f5 100%);
  background-size: 200% 100%;
  border-radius: 6px;
  animation: sxSkeletonShimmer 1.5s ease-in-out infinite;
}
@keyframes sxSkeletonShimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============ PRINT OPTIMIZE pour devis/facture ============ */
@media print {
  .sx-back-to-top, .cookie-notice, #cookie-notice,
  .brxe-offcanvas, [class*="popup"], [class*="modal"] {
    display: none !important;
  }
  body { background: white !important; color: black !important; }
}

/* ============ MOTION-SAFE pour animations subtiles ============ */
@media (prefers-reduced-motion: no-preference) {
  .sx-section, .sx-tile, .sx-feat {
    will-change: transform, opacity;
  }
}

/* ============ DARK MODE FAVOR (futur) ============ */
@media (prefers-color-scheme: dark) {
  /* Reserved pour future dark mode */
}
/* sx-elite-final-end */


/* sx-services-content */
/* Descriptions enrichies des 8 services (preuve expertise) */
.sx-services-grid > *:nth-child(1) p,
.sx-services-grid > *:nth-child(2) p,
.sx-services-grid > *:nth-child(3) p,
.sx-services-grid > *:nth-child(4) p,
.sx-services-grid > *:nth-child(5) p,
.sx-services-grid > *:nth-child(6) p,
.sx-services-grid > *:nth-child(7) p,
.sx-services-grid > *:nth-child(8) p {
  font-size: 0 !important;
  line-height: 0 !important;
}
.sx-services-grid > *:nth-child(1) p::after {
  content: 'Bureaux, manufactures, entrepôts, ateliers. Équipe formée pour milieux industriels. Contrats récurrents (hebdo/mensuel) ou one-shot. Évaluation gratuite sur place.';
}
.sx-services-grid > *:nth-child(2) p::after {
  content: 'Dégraissage profond friteuses, hottes, planchers gras. Désinfection surfaces alimentaires. Récurrent ou trimestriel intensif. On connaît les exigences MAPAQ.';
}
.sx-services-grid > *:nth-child(3) p::after {
  content: 'Conformité NFPA 96 et code prévention incendie Québec. Certificat émis avec photos avant/après pour ton assureur. Trimestriel à annuel selon volume.';
}
.sx-services-grid > *:nth-child(4) p::after {
  content: 'Système osmose inverse, perches télescopiques jusqu’à 3 étages. Sans nacelle, sans produits chimiques, zéro résidu calcaire. Plus rapide et plus sécuritaire.';
}
.sx-services-grid > *:nth-child(5) p::after {
  content: 'Post-rénovation : poussière de gypse, résidus peinture. Après-incendie : suie, fumée. Dégât d’eau : assèchement, anti-moisissure. Coordination avec ton assureur si besoin.';
}
.sx-services-grid > *:nth-child(6) p::after {
  content: 'Écoles, CPE, CHSLD, cliniques, bureaux municipaux. Personnel formé pour milieux sensibles. Protocoles désinfection adaptés. Rapport de service après chaque visite.';
}
.sx-services-grid > *:nth-child(7) p::after {
  content: 'Nettoyage vapeur extraction, détachage spot, traitement Scotchgard sur demande. Bureaux, halls d’entrée, salles communautaires, hôtels. Séchage rapide.';
}
.sx-services-grid > *:nth-child(8) p::after {
  content: 'Filtres, ventilateurs, échangeurs, ailettes thermopompe. Préventif annuel ou approfondi. On détecte les problèmes mécaniques avant qu’ils coûtent cher.';
}
.sx-services-grid > * p::after {
  display: block;
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  line-height: 1.55 !important;
  letter-spacing: -0.005em !important;
  color: rgba(29,35,39,0.62) !important;
  text-wrap: pretty;
  margin-top: 0.4rem;
}
/* sx-services-content-end */


/* sx-shop-elite */
/* ============ SHOP / PAGE PRODUITS NIVEAU AGENCE ============ */

/* Page wrapper */
.woocommerce-page #brx-content,
.post-type-archive-product #brx-content,
.tax-product_cat #brx-content {
  padding-top: clamp(2rem, 4vw, 3rem) !important;
  padding-bottom: clamp(4rem, 7vw, 7rem) !important;
}

/* Page header H1 */
.woocommerce-page h1.woocommerce-products-header__title,
.woocommerce-page h1.page-title,
.post-type-archive-product h1,
.tax-product_cat h1 {
  font-size: clamp(2.4rem, 5vw, 4rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.05 !important;
  margin-bottom: 0.5rem !important;
  text-wrap: balance;
  background: linear-gradient(135deg, #1d2327 0%, #2a7a8e 60%, #3a9bb8 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* Result count + ordering toolbar */
.woocommerce-result-count, .woocommerce-ordering {
  font-size: 0.85rem !important;
  letter-spacing: 0.04em !important;
  color: rgba(29,35,39,0.55) !important;
}
.woocommerce-ordering select {
  padding: 0.65rem 1rem !important;
  border-radius: 8px !important;
  border: 1px solid rgba(29,35,39,0.14) !important;
  font-size: 0.92rem !important;
  font-weight: 500;
  cursor: pointer;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.woocommerce-ordering select:focus {
  border-color: var(--sx-teal) !important;
  box-shadow: 0 0 0 4px rgba(58,155,184,0.12) !important;
}

/* GRID PRODUITS - layout pro */
ul.products, .products, .woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  gap: clamp(1rem, 2vw, 1.5rem) !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* CARDS PRODUITS - signature agence */
ul.products li.product, ul.products > li, .woocommerce ul.products li.product {
  position: relative;
  background: #ffffff !important;
  border: 1px solid rgba(58,155,184,0.08) !important;
  border-radius: 14px !important;
  padding: 1rem !important;
  margin: 0 !important;
  width: auto !important;
  transition: transform 0.5s var(--sx-ease-out-expo), box-shadow 0.4s, border-color 0.3s !important;
  isolation: isolate;
  overflow: hidden;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem;
}

/* Hover : 3D tilt subtle + shadow + border teal */
@media (hover: hover) and (pointer: fine) {
  ul.products li.product:hover, ul.products > li:hover {
    transform: translateY(-6px) perspective(900px) rotateX(2deg) !important;
    border-color: rgba(58,155,184,0.45) !important;
    box-shadow:
      0 16px 40px rgba(58,155,184,0.18),
      0 4px 12px rgba(15,18,20,0.08) !important;
  }
}

/* Light reflection au hover */
ul.products li.product::before, ul.products > li::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(105deg, transparent 0%, rgba(58,155,184,0.10) 50%, transparent 100%);
  transition: left 0.7s var(--sx-ease-out-expo);
  pointer-events: none;
  z-index: 1;
}
ul.products li.product:hover::before, ul.products > li:hover::before {
  left: 110%;
}

/* Image produit */
ul.products li.product img, ul.products > li img,
ul.products li.product .woocommerce-loop-product__link img {
  border-radius: 8px;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: #f7f9fa;
  padding: 0.5rem;
  transition: transform 0.5s var(--sx-ease-out-expo);
}
ul.products li.product:hover img {
  transform: scale(1.05);
}

/* Title */
ul.products li.product h2, ul.products li.product h3,
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h5 {
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em !important;
  color: var(--sx-ink) !important;
  text-wrap: balance;
  margin: 0.5rem 0 0.25rem !important;
  padding: 0 !important;
  transition: color 0.25s ease;
}
ul.products li.product:hover .woocommerce-loop-product__title,
ul.products li.product:hover h5 {
  color: var(--sx-teal-dark) !important;
}

/* Price */
ul.products li.product .price {
  font-size: clamp(0.95rem, 1.1vw, 1.05rem) !important;
  font-weight: 700 !important;
  color: var(--sx-teal-dark) !important;
  font-feature-settings: 'tnum' on, 'lnum' on;
  font-variant-numeric: tabular-nums lining-nums;
  margin: 0 !important;
}
ul.products li.product .price del {
  color: rgba(29,35,39,0.42) !important;
  font-weight: 400;
  font-size: 0.85em;
  margin-right: 0.4rem;
}
ul.products li.product .price ins {
  color: #ff3b30 !important;
  text-decoration: none;
  font-weight: 700;
}

/* Stock indicator */
ul.products li.product .stock {
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  padding: 0.25rem 0.55rem !important;
  border-radius: 999px !important;
  display: inline-block !important;
  margin: 0 !important;
  width: fit-content;
}
ul.products li.product .stock.in-stock,
ul.products li.product .se-stock-in {
  background: rgba(74,222,128,0.10);
  color: rgb(34, 197, 94) !important;
  border: 1px solid rgba(74,222,128,0.30);
}
ul.products li.product .stock.out-of-stock,
ul.products li.product .se-stock-out {
  background: rgba(255,59,48,0.10);
  color: rgb(239, 68, 68) !important;
  border: 1px solid rgba(255,59,48,0.30);
}

/* Sale badge "Solde !" / "-X%" */
ul.products li.product .onsale {
  position: absolute;
  top: 0.85rem;
  left: 0.85rem;
  background: linear-gradient(135deg, #ff3b30 0%, #ff6b35 100%);
  color: #ffffff;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  text-transform: uppercase;
  box-shadow: 0 4px 12px rgba(255,59,48,0.35);
  z-index: 5;
  margin: 0 !important;
}

/* "Add to cart" button - hover effect */
ul.products li.product a.button, ul.products li.product .button {
  display: inline-flex !important;
  align-items: center;
  gap: 0.4rem;
  padding: 0.65rem 1rem !important;
  background: var(--sx-teal) !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
  text-decoration: none !important;
  transition: background 0.3s ease, transform 0.3s, box-shadow 0.3s !important;
  margin-top: auto;
  align-self: flex-start;
}
ul.products li.product a.button:hover, ul.products li.product .button:hover {
  background: var(--sx-teal-dark) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(58,155,184,0.4) !important;
}

/* SIDEBAR FILTRES (si presente) */
.woocommerce-sidebar, aside.sidebar, .widget-area {
  background: rgba(255,255,255,0.6);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 14px;
  padding: 1.5rem !important;
  border: 1px solid rgba(58,155,184,0.10);
  position: sticky;
  top: 100px;
  align-self: flex-start;
}
.widget h2, .widget .widget-title {
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--sx-ink) !important;
  margin-bottom: 1rem !important;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(58,155,184,0.15);
}

/* Filter list (catégories, marques, etc.) */
.widget ul, .wc-block-product-categories-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.widget ul li, .wc-block-product-categories-list li {
  padding: 0.4rem 0;
  font-size: 0.92rem !important;
  border-bottom: 1px solid rgba(29,35,39,0.05);
}
.widget ul li a {
  color: rgba(29,35,39,0.78) !important;
  transition: color 0.25s ease, padding-left 0.3s var(--sx-ease-out-expo);
  display: inline-block;
}
.widget ul li a:hover {
  color: var(--sx-teal) !important;
  padding-left: 4px;
}

/* Count badge à droite */
.widget ul li .count {
  float: right;
  font-size: 0.72rem;
  font-weight: 600;
  color: rgba(58,155,184,0.7);
  background: rgba(58,155,184,0.08);
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-feature-settings: 'tnum' on;
}

/* Layered nav (filtres avec checkboxes) */
.widget_layered_nav input[type="checkbox"], .widget_layered_nav input[type="radio"] {
  accent-color: var(--sx-teal);
  margin-right: 0.5rem;
}

/* Price slider WC */
.price_slider_wrapper {
  padding: 0.5rem 0;
}
.ui-slider {
  background: rgba(29,35,39,0.10) !important;
  height: 4px !important;
  border-radius: 999px !important;
}
.ui-slider .ui-slider-range {
  background: var(--sx-teal) !important;
  height: 4px !important;
}
.ui-slider .ui-slider-handle {
  width: 16px !important;
  height: 16px !important;
  background: var(--sx-teal) !important;
  border-radius: 50% !important;
  border: 2px solid #ffffff !important;
  box-shadow: 0 2px 8px rgba(58,155,184,0.4) !important;
  margin-left: -8px !important;
  top: -6px !important;
  cursor: grab;
}
.ui-slider .ui-slider-handle:active {
  cursor: grabbing;
  transform: scale(1.15);
}
.price_label {
  font-size: 0.85rem;
  color: var(--sx-ink);
  font-weight: 600;
  font-feature-settings: 'tnum' on;
}

/* Hide messages WC inutiles */
.woocommerce-no-products-found {
  text-align: center;
  padding: clamp(3rem, 6vw, 6rem) 1.5rem;
  font-size: clamp(0.95rem, 1.1vw, 1.05rem);
  color: rgba(29,35,39,0.55);
}

/* Categories visuelles en haut (si Bricks Loop products with category type) */
.wc-block-product-categories ul.wc-block-product-categories-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.85rem;
}
.wc-block-product-categories ul li {
  border: 1px solid rgba(58,155,184,0.15);
  border-radius: 10px;
  padding: 1rem !important;
  text-align: center;
  transition: transform 0.4s var(--sx-ease-out-expo), border-color 0.3s, background 0.3s !important;
  background: rgba(255,255,255,0.6);
}
.wc-block-product-categories ul li:hover {
  transform: translateY(-3px);
  border-color: var(--sx-teal);
  background: rgba(58,155,184,0.04);
}

/* Mobile : grid 2 cols */
@media (max-width: 768px) {
  ul.products, .products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.75rem !important;
  }
  ul.products li.product {
    padding: 0.85rem !important;
  }
  ul.products li.product h2, ul.products li.product h5 {
    font-size: 0.85rem !important;
  }
}
@media (max-width: 480px) {
  ul.products, .products {
    grid-template-columns: 1fr !important;
  }
}

/* RELATED / UPSELLS / CROSS-SELLS sur page produit */
.related.products h2, .upsells.products h2, .cross-sells h2 {
  font-size: clamp(1.4rem, 2vw, 1.8rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  margin: clamp(2rem, 4vw, 4rem) 0 clamp(1rem, 2vw, 2rem) !important;
  text-wrap: balance;
}

/* Single product page polish */
body.single-product .product .summary {
  padding: clamp(1.5rem, 3vw, 2rem) !important;
}
body.single-product .product .summary h1, body.single-product .product .summary .product_title {
  font-size: clamp(1.6rem, 3vw, 2.4rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
  text-wrap: balance;
  margin-bottom: 0.85rem !important;
}
body.single-product .price {
  font-size: clamp(1.4rem, 2.2vw, 1.8rem) !important;
  font-weight: 700 !important;
  color: var(--sx-teal-dark) !important;
  font-feature-settings: 'tnum' on, 'lnum' on;
}
body.single-product .quantity input.qty {
  width: 80px !important;
  text-align: center;
  font-size: 1.05rem;
  font-weight: 600;
  font-feature-settings: 'tnum' on;
}
body.single-product .single_add_to_cart_button {
  background: var(--sx-teal) !important;
  color: #ffffff !important;
  padding: 1rem 2rem !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
  border-radius: 999px !important;
  border: none !important;
  cursor: pointer;
  transition: transform 0.3s, box-shadow 0.3s, background 0.3s !important;
  box-shadow: 0 8px 24px rgba(58,155,184,0.3);
}
body.single-product .single_add_to_cart_button:hover {
  background: var(--sx-teal-dark) !important;
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(58,155,184,0.45) !important;
}

/* Tabs single product */
body.single-product .woocommerce-tabs ul.tabs {
  display: flex !important;
  gap: 0;
  border-bottom: 1px solid rgba(29,35,39,0.10) !important;
  padding: 0 !important;
  margin-bottom: 1.5rem !important;
}
body.single-product .woocommerce-tabs ul.tabs li {
  background: transparent !important;
  border: none !important;
  padding: 0.85rem 1.25rem !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  position: relative;
  transition: color 0.25s ease;
}
body.single-product .woocommerce-tabs ul.tabs li.active {
  color: var(--sx-teal) !important;
}
body.single-product .woocommerce-tabs ul.tabs li.active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--sx-teal);
  border-radius: 999px 999px 0 0;
}

/* sx-shop-elite-end */


/* sx-search-pro */
/* ============ ASP DANS LE HEADER : style premium ============ */
.asp_w_container, [id^="ajaxsearchpro"] {
  --asp-radius: 12px;
}
.asp_w {
  border-radius: var(--asp-radius) !important;
  background: rgba(255,255,255,0.97) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(58,155,184,0.18) !important;
  box-shadow: 0 4px 16px rgba(15,18,20,0.08) !important;
  transition: box-shadow 0.3s ease, border-color 0.3s ease, transform 0.3s var(--sx-ease-out-expo) !important;
  overflow: hidden;
}
.asp_w:hover, .asp_w:focus-within {
  border-color: rgba(58,155,184,0.45) !important;
  box-shadow: 0 8px 24px rgba(58,155,184,0.18), 0 4px 12px rgba(15,18,20,0.10) !important;
}
.probox, .asp_main_box {
  background: transparent !important;
  border: none !important;
}
.proinput input, .asp_main_box input.orig {
  background: transparent !important;
  border: none !important;
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  letter-spacing: -0.005em !important;
  color: var(--sx-ink) !important;
  padding: 0.85rem 1rem !important;
  caret-color: var(--sx-teal) !important;
}
.proinput input::placeholder {
  color: rgba(29,35,39,0.45) !important;
  font-weight: 400 !important;
}
.proloading, .promagnifier {
  background: var(--sx-teal) !important;
  border-radius: 8px !important;
  padding: 0.5rem !important;
  margin: 0.25rem !important;
  transition: background 0.25s ease !important;
}
.proloading:hover, .promagnifier:hover {
  background: var(--sx-teal-dark) !important;
  transform: scale(1.05);
}

/* ASP results dropdown - style agence */
.asp_res_loaded, .asp_res, .asp_results {
  background: #ffffff !important;
  border: 1px solid rgba(58,155,184,0.10) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 48px rgba(15,18,20,0.18), 0 4px 12px rgba(15,18,20,0.08) !important;
  margin-top: 0.5rem !important;
  overflow: hidden;
}
.asp_res_loaded .item, .asp_results .item {
  padding: 0.85rem 1rem !important;
  border-bottom: 1px solid rgba(29,35,39,0.06) !important;
  transition: background 0.25s ease, padding-left 0.3s var(--sx-ease-out-expo) !important;
}
.asp_res_loaded .item:hover, .asp_results .item:hover {
  background: rgba(58,155,184,0.04) !important;
  padding-left: 1.5rem !important;
}
.asp_res_loaded .item .asp_image {
  border-radius: 6px !important;
  background: #f7f9fa !important;
}
.asp_res_loaded .item .asp_content {
  font-size: 0.92rem !important;
  font-weight: 500 !important;
  color: var(--sx-ink) !important;
  line-height: 1.4 !important;
}
.asp_res_loaded .item .asp_content em, .asp_results .item em {
  background: rgba(58,155,184,0.15) !important;
  color: var(--sx-teal-dark) !important;
  padding: 0 2px;
  border-radius: 3px;
  font-style: normal;
  font-weight: 600;
}

/* ASP price */
.asp_res .item .price, .asp_res_loaded .item .price {
  color: var(--sx-teal-dark) !important;
  font-weight: 700 !important;
  font-feature-settings: 'tnum' on, 'lnum' on;
}

/* ASP "see all" footer */
.asp_res_footer {
  background: #f7f9fa !important;
  padding: 0.85rem 1rem !important;
  border-top: 1px solid rgba(58,155,184,0.10) !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  color: var(--sx-teal-dark) !important;
}

/* ============ HERO CUSTOM SEARCH BOOSTÉ AVEC FILTRES PILLS ============ */
.sx-hero-search { position: relative; z-index: 5; }

/* Améliorer encore la sx-search-form */
.sx-search-form input {
  font-weight: 500 !important;
  font-size: clamp(0.95rem, 1.1vw, 1.05rem) !important;
}

/* Quicks tags amélioration */
.sx-hero-quicks {
  margin-top: 1.25rem !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.5rem !important;
  justify-content: center;
}
.sx-hero-quicks span {
  font-size: clamp(0.65rem, 0.85vw, 0.72rem) !important;
  letter-spacing: 0.18em !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,0.55) !important;
  text-transform: uppercase !important;
  margin-right: 0.5rem;
}
.sx-hero-quicks a {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  padding: 0.5rem 0.95rem !important;
  border-radius: 999px !important;
  font-size: clamp(0.78rem, 0.95vw, 0.88rem) !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,0.85) !important;
  transition: all 0.3s var(--sx-ease-out-expo) !important;
}
.sx-hero-quicks a:hover {
  background: rgba(58,155,184,0.20) !important;
  border-color: rgba(58,155,184,0.55) !important;
  color: #ffffff !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(58,155,184,0.30);
}

/* Suggest empty state */
.sx-suggest-empty {
  text-align: center;
  padding: 2rem 1rem !important;
  color: rgba(29,35,39,0.55) !important;
  font-size: 0.92rem;
  font-style: italic;
}
.sx-suggest-empty::before {
  content: '🔍';
  display: block;
  font-size: 2rem;
  margin-bottom: 0.5rem;
  opacity: 0.4;
}

/* Suggest header grid (catégories filtres) */
.sx-suggest-header {
  background: #f7f9fa;
  padding: 0.85rem 1rem !important;
  border-bottom: 1px solid rgba(29,35,39,0.06);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(29,35,39,0.55);
}

/* sx-search-pro-end */


/* sx-injected-nav */
/* ============ MENU MOBILE INJECTE (offcanvas) ============ */
.sx-mobile-menu {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1rem 0;
  margin-top: 1.5rem;
  border-top: 1px solid rgba(255,255,255,0.10);
}
.sx-mobile-menu h4 {
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.28em !important;
  text-transform: uppercase !important;
  color: rgba(58,155,184,0.7) !important;
  margin: 0 0 0.5rem !important;
  padding: 0 !important;
}
.sx-mm-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
}
.sx-mm-list li { margin: 0; }
.sx-mm-list a {
  display: block;
  padding: 0.85rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  color: #ffffff !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  letter-spacing: -0.005em !important;
  text-decoration: none !important;
  transition: color 0.25s ease, padding-left 0.3s var(--sx-ease-out-expo);
}
.sx-mm-list a:hover {
  color: #5cc4d6 !important;
  padding-left: 0.5rem !important;
}
.sx-mm-tel {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  background: linear-gradient(135deg, #3a9bb8 0%, #2a7a8e 100%) !important;
  color: #ffffff !important;
  padding: 1rem 1.25rem !important;
  border-radius: 999px !important;
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
  text-decoration: none !important;
  margin-top: 1rem;
  box-shadow: 0 8px 24px rgba(58,155,184,0.35);
  font-feature-settings: 'tnum' on;
}
.sx-mm-tel:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(58,155,184,0.50);
}

/* ============ HEADER SUBNAV INJECTE (desktop) ============ */
.sx-header-subnav {
  background: linear-gradient(180deg, #0f1214 0%, #1a2024 100%);
  border-top: 1px solid rgba(58,155,184,0.18);
  border-bottom: 1px solid rgba(58,155,184,0.10);
  padding: 0.6rem 0;
  position: relative;
  z-index: 50;
}
.sx-subnav-inner {
  max-width: 1380px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 3vw, 2rem);
  display: flex;
  align-items: center;
  gap: clamp(0.75rem, 1.5vw, 1.5rem);
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
}
.sx-subnav-inner::-webkit-scrollbar { display: none; }
.sx-subnav-inner > ul {
  list-style: none;
  display: flex;
  align-items: center;
  gap: clamp(0.5rem, 1.2vw, 1.25rem);
  margin: 0;
  padding: 0;
  flex-wrap: nowrap;
}
.sx-subnav-inner > ul > li { white-space: nowrap; position: relative; }
.sx-subnav-inner a {
  color: rgba(255,255,255,0.78) !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  padding: 0.4rem 0.6rem !important;
  border-radius: 6px;
  transition: color 0.2s ease, background 0.2s ease;
  display: inline-block;
}
.sx-subnav-inner a:hover {
  color: #ffffff !important;
  background: rgba(58,155,184,0.18) !important;
}
.sx-subnav-all {
  background: rgba(58,155,184,0.20) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  border: 1px solid rgba(58,155,184,0.40);
}
.sx-subnav-all:hover {
  background: rgba(58,155,184,0.35) !important;
}

/* Dropdown "Plus" sur hover */
.sx-subnav-more { position: relative; }
.sx-subnav-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  background: #0f1214;
  border: 1px solid rgba(58,155,184,0.25);
  border-radius: 8px;
  padding: 0.5rem;
  min-width: 280px;
  list-style: none;
  margin: 0.25rem 0 0;
  box-shadow: 0 16px 32px rgba(0,0,0,0.4);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-8px);
  transition: opacity 0.25s, transform 0.25s var(--sx-ease-out-expo);
  z-index: 100;
  max-height: 60vh;
  overflow-y: auto;
}
.sx-subnav-more:hover .sx-subnav-dropdown,
.sx-subnav-more:focus-within .sx-subnav-dropdown {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.sx-subnav-dropdown li { display: block; }
.sx-subnav-dropdown a {
  display: block;
  padding: 0.55rem 0.75rem !important;
  font-size: 0.85rem !important;
  border-radius: 4px;
}

/* Mobile : cacher le subnav header (on a le offcanvas) */
@media (max-width: 768px) {
  .sx-header-subnav { display: none; }
}
/* sx-injected-nav-end */


/* sx-rdl-elite */
/* ============ PAGE LOADING BAR (top) ============ */
@supports (animation-timeline: scroll()) {
  html::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    height: 2px;
    width: 100%;
    background: linear-gradient(90deg, #3a9bb8, #5cc4d6, #b3e8f1);
    transform-origin: left;
    transform: scaleX(0);
    z-index: 99999;
    animation: sxScrollBar linear;
    animation-timeline: scroll(root);
  }
  @keyframes sxScrollBar { to { transform: scaleX(1); } }
}

/* ============ HOVER MAGNETIQUE PRECIS sur tous les CTAs ============ */
@media (hover: hover) and (pointer: fine) {
  a.brxe-button, button.brx-btn, .brxe-button.brx-btn,
  .single_add_to_cart_button, .sx-svc-cta a:not([href^="tel:"]) {
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
  }
  a.brxe-button:hover, button.brx-btn:hover {
    transform: translateY(-3px) scale(1.02) !important;
  }
}

/* ============ HERO TILT 3D au mousemove (CSS-only via :hover) ============ */
.sx-hero-bar {
  perspective: 1000px;
  transform-style: preserve-3d;
}

/* ============ STAGGER LIST ITEMS au load ============ */
.sx-cat-grid .sx-tile,
.sx-cat-grid .sx-tile-large,
.sx-trust-grid .sx-stat,
.sx-services-grid > * {
  animation: sxItemReveal 0.7s cubic-bezier(0.16, 1, 0.3, 1) backwards;
}
.sx-cat-grid .sx-tile:nth-child(1) { animation-delay: 0.05s; }
.sx-cat-grid .sx-tile:nth-child(2) { animation-delay: 0.10s; }
.sx-cat-grid .sx-tile:nth-child(3) { animation-delay: 0.15s; }
.sx-cat-grid .sx-tile:nth-child(4) { animation-delay: 0.20s; }
.sx-cat-grid .sx-tile:nth-child(5) { animation-delay: 0.25s; }
.sx-cat-grid .sx-tile:nth-child(6) { animation-delay: 0.30s; }
@keyframes sxItemReveal {
  from { opacity: 0; transform: translateY(30px) scale(0.96); filter: blur(4px); }
  to   { opacity: 1; transform: translateY(0) scale(1);     filter: blur(0); }
}

/* ============ CTA RIPPLE EFFECT au click ============ */
a.brxe-button, button.brx-btn, .single_add_to_cart_button {
  position: relative;
  overflow: hidden !important;
}
a.brxe-button::after, button.brx-btn::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle, rgba(255,255,255,0.5) 0%, transparent 60%);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0s;
}
a.brxe-button:active::after, button.brx-btn:active::after {
  opacity: 1;
  animation: sxRipple 0.6s ease-out;
}
@keyframes sxRipple {
  from { opacity: 1; transform: scale(0.5); }
  to   { opacity: 0; transform: scale(2); }
}

/* ============ NUMBERS COUNT-UP visuel au scroll ============ */
@supports (animation-timeline: view()) {
  .sx-stat .num {
    animation: sxNumPulse linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 30%;
  }
  @keyframes sxNumPulse {
    from { opacity: 0; transform: translateY(20px) scale(0.9); filter: blur(6px); }
    to   { opacity: 1; transform: translateY(0) scale(1);      filter: blur(0); }
  }
}

/* ============ HEADINGS REVEAL au scroll plus dramatique ============ */
@supports (animation-timeline: view()) {
  .sx-section h2, .sx-svc-page > h2 {
    animation: sxHeadingReveal linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 40%;
  }
  @keyframes sxHeadingReveal {
    from { opacity: 0; clip-path: inset(0 100% 0 0); transform: translateX(-20px); }
    to   { opacity: 1; clip-path: inset(0 0 0 0);    transform: translateX(0); }
  }
}

/* ============ IMAGES fade-in au load ============ */
img:not(.css-filter):not([class*="logo"]) {
  animation: sxImgReveal 0.8s ease-out backwards;
}
@keyframes sxImgReveal {
  from { opacity: 0; transform: scale(1.05); filter: blur(8px); }
  to   { opacity: 1; transform: scale(1);    filter: blur(0); }
}

/* ============ GLOW PULSE on focus inputs ============ */
input:focus, textarea:focus, select:focus {
  animation: sxFocusGlow 2s ease-in-out infinite;
}
@keyframes sxFocusGlow {
  0%, 100% { box-shadow: 0 0 0 4px rgba(58,155,184,0.12) !important; }
  50%      { box-shadow: 0 0 0 8px rgba(58,155,184,0.18) !important; }
}

/* ============ CARDS BORDER GLOW au hover ============ */
.sx-tile, .sx-tile-large, ul.products li.product, .sx-feat {
  position: relative;
}
.sx-tile::before, .sx-tile-large::before, ul.products li.product::before, .sx-feat::before {
  content: '';
  position: absolute;
  inset: -1px;
  background: linear-gradient(135deg, transparent 0%, rgba(58,155,184,0.4) 50%, transparent 100%);
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
}
.sx-tile:hover::before, ul.products li.product:hover::before {
  opacity: 1;
}

/* ============ CURSOR GROW sur cards interactive ============ */
@media (hover: hover) and (pointer: fine) {
  .sx-tile, .sx-tile-large, ul.products li.product, .sx-services-grid > * {
    cursor: pointer;
  }
}

/* ============ TEXT SELECTION luxe ============ */
::selection { background: var(--sx-teal); color: #ffffff; text-shadow: 0 0 8px rgba(58,155,184,0.5); }

/* ============ SMOOTH SCROLL EVERYWHERE ============ */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ============ PERFORMANCE: content-visibility lazy ============ */
.sx-section, .sx-svc-page > section, footer, .sx-footer {
  content-visibility: auto;
  contain-intrinsic-size: 0 800px;
}

/* ============ FOCUS RING DYNAMIC ============ */
:focus-visible {
  animation: sxFocusRing 0.3s var(--sx-ease-out-expo);
}
@keyframes sxFocusRing {
  from { outline-offset: 0; }
  to   { outline-offset: 3px; }
}
/* sx-rdl-elite-end */


/* sx-cta-final */
/* Section CTA finale (Magasiner maintenant + Ouvrir un compte) - Remplir le vide */
#brxe-ulwurh {
  position: relative;
  padding: clamp(3rem, 6vw, 5rem) clamp(1.5rem, 3vw, 2.5rem) !important;
  text-align: center;
  background: linear-gradient(135deg, #0f1214 0%, #1a2024 50%, #0f1214 100%) !important;
  border-radius: 16px;
  margin: clamp(2rem, 4vw, 4rem) auto !important;
  max-width: 1200px;
  overflow: hidden;
  isolation: isolate;
}
#brxe-ulwurh::before {
  content: 'Prêt à passer une commande ?';
  display: block;
  font-size: clamp(1.8rem, 3.5vw, 2.8rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.15 !important;
  background: linear-gradient(135deg, #ffffff 0%, #b3e8f1 50%, #5cc4d6 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  margin-bottom: 0.85rem;
  text-wrap: balance;
  max-width: 18ch;
  margin-left: auto;
  margin-right: auto;
}
#brxe-ulwurh::after {
  content: 'Plus de 2 000 produits en stock et 20 000 SKU disponibles. Compte B2B ouvert en 24 h, livraison partout au Québec, pas de minimum.';
  display: block;
  font-size: clamp(0.95rem, 1.15vw, 1.1rem) !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  letter-spacing: -0.005em !important;
  color: rgba(255,255,255,0.72) !important;
  margin: 0 auto clamp(1.5rem, 3vw, 2.5rem) !important;
  max-width: 56ch;
  text-wrap: pretty;
  position: relative;
  z-index: 2;
}

/* Mesh gradient decoratif derriere */
#brxe-ulwurh > * { position: relative; z-index: 2; }
#brxe-ulwurh > div:first-of-type::before {
  content: '';
  position: absolute;
  inset: -20%;
  background:
    radial-gradient(ellipse at 20% 30%, rgba(58,155,184,0.20) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 70%, rgba(92,196,214,0.15) 0%, transparent 50%);
  z-index: -1;
  pointer-events: none;
}

/* Boutons row */
#brxe-ulwurh > div:has(a),
#brxe-ulwurh > div:last-child {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 1rem !important;
  margin-top: 1.5rem !important;
  position: relative;
  z-index: 3;
}

/* Boutons styles agence */
#brxe-ulwurh a, #brxe-ulwurh button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  padding: 1rem 1.75rem !important;
  border-radius: 999px !important;
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  text-decoration: none !important;
  transition: transform 0.4s var(--sx-ease-out-expo), box-shadow 0.3s, background 0.3s !important;
  white-space: nowrap;
}

/* Bouton primaire (Magasiner maintenant) */
#brxe-ulwurh a:nth-of-type(1) {
  background: linear-gradient(135deg, #3a9bb8 0%, #2a7a8e 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 32px rgba(58,155,184,0.40), 0 4px 8px rgba(0,0,0,0.2);
  border: none !important;
}
#brxe-ulwurh a:nth-of-type(1):hover {
  background: linear-gradient(135deg, #5cc4d6 0%, #3a9bb8 100%) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 16px 40px rgba(58,155,184,0.55), 0 6px 12px rgba(0,0,0,0.25) !important;
}
#brxe-ulwurh a:nth-of-type(1)::after {
  content: '2192';
  font-size: 1.2em;
  transition: transform 0.3s var(--sx-ease-out-expo);
}
#brxe-ulwurh a:nth-of-type(1):hover::after {
  transform: translateX(4px);
}

/* Bouton secondaire (Ouvrir un compte) */
#brxe-ulwurh a:nth-of-type(2) {
  background: rgba(255,255,255,0.08) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.20) !important;
  backdrop-filter: blur(10px);
}
#brxe-ulwurh a:nth-of-type(2):hover {
  background: rgba(255,255,255,0.14) !important;
  border-color: rgba(58,155,184,0.55) !important;
  transform: translateY(-3px) !important;
}

/* Cacher les sub-textes parasites "Produits d'entretien" qui apparaissent dans les boutons */
#brxe-ulwurh a > *:not(.button-text), 
#brxe-ulwurh a span:not(.button-text) {
  display: none !important;
}

/* Tel CTA additionnel sous les boutons */
#brxe-ulwurh > div:last-child::after {
  content: 'Ou appelle-nous au 418-862-2292 — lundi au vendredi, 8 h à 16 h';
  display: block !important;
  flex-basis: 100%;
  margin-top: 1.25rem !important;
  font-size: clamp(0.8rem, 0.95vw, 0.9rem) !important;
  color: rgba(255,255,255,0.55) !important;
  letter-spacing: 0.04em;
  font-feature-settings: 'tnum' on;
}

@media (max-width: 600px) {
  #brxe-ulwurh a, #brxe-ulwurh button {
    width: 100% !important;
    max-width: 320px;
  }
}
/* sx-cta-final-end */


/* sx-banner-fix */
.sx-section.sx-cat::before {
  white-space: normal !important;
  max-width: min(620px, 90vw) !important;
  text-align: center !important;
  line-height: 1.4 !important;
  padding: 0.85rem 1.5rem !important;
  font-size: clamp(0.75rem, 0.95vw, 0.92rem) !important;
}
@media (max-width: 768px) {
  .sx-section.sx-cat::before {
    max-width: 88vw !important;
    padding: 0.75rem 1.25rem !important;
    font-size: clamp(0.7rem, 2.5vw, 0.85rem) !important;
    letter-spacing: 0.02em !important;
  }
}
@media (max-width: 480px) {
  .sx-section.sx-cat::before {
    max-width: 90vw !important;
    padding: 0.7rem 1rem !important;
    font-size: 0.72rem !important;
  }
}
/* sx-banner-fix-end */


/* sx-fill-empty */
/* ============ SX-TRUST : ajouter heading + intro avant les stats ============ */
.sx-trust {
  padding-top: clamp(4rem, 7vw, 6rem) !important;
}
.sx-trust .sx-container {
  position: relative;
}
.sx-trust .sx-container::before {
  content: 'Quarante ans à servir le Québec';
  display: block;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.15;
  text-align: center;
  color: #1d2327;
  margin-bottom: 0.85rem;
  text-wrap: balance;
  max-width: 22ch;
  margin-left: auto;
  margin-right: auto;
}
.sx-trust .sx-container::after {
  content: 'Une famille de Rivière-du-Loup qui distribue produits sanitaires, entretien et emballages depuis 1985. Et qui offre aussi les services d’entretien — du grand nettoyage industriel à la cuisine de restaurant, des hottes certifiées aux échangeurs d’air.';
  display: block;
  font-size: clamp(0.9rem, 1.1vw, 1rem);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -0.005em;
  color: rgba(29,35,39,0.62);
  text-align: center;
  max-width: 60ch;
  margin: 0 auto clamp(2.5rem, 4vw, 3.5rem);
  text-wrap: pretty;
}

/* ============ SX-BRANDS : intro + decor ============ */
.sx-brands::before {
  /* override le label PARTENAIRES DE CONFIANCE existant */
  content: 'NOS MARQUES PARTENAIRES';
}
.sx-brands .sx-container {
  position: relative;
}
.sx-brands .sx-container::before {
  content: 'Les marques que les pros choisissent';
  display: block;
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  text-align: center;
  color: #1d2327;
  margin-bottom: 0.5rem;
  text-wrap: balance;
}
.sx-brands .sx-container::after {
  content: 'Cascades · Tork · Tandem · Purell · BOD Groupe · Silverwax · Duracore · NaceCare · Unica · Kruger · Diversey · Ettore · Unger. On distribue ce que les pros utilisent vraiment.';
  display: block;
  font-size: clamp(0.85rem, 1.05vw, 0.95rem);
  font-weight: 500;
  line-height: 1.55;
  text-align: center;
  color: rgba(29,35,39,0.55);
  max-width: 56ch;
  margin: 0 auto clamp(1.5rem, 3vw, 2.5rem);
  text-wrap: pretty;
}

/* ============ SX-CTA-BAND : enrichissement texte ============ */
.sx-cta-band .sx-container {
  position: relative;
}
.sx-cta-band p::before {
  content: 'Soumission gratuite sous 24 heures · Compte B2B sur facture · Pas de minimum · Livraison partout au Québec';
  display: block;
  font-size: clamp(0.78rem, 0.95vw, 0.88rem);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(58,155,184,0.9);
  margin-bottom: 0.85rem;
  font-feature-settings: 'tnum' on;
}

/* ============ FAUX BANDEAU SPECIAUX (entre sections via decoration) ============ */
.sx-section.sx-services::before {
  content: '✦ NOUVEAU CETTE SEMAINE ✦  Spéciaux sur les produits Tork, Cascades et Diversey — appelle pour les prix';
  display: block;
  background: linear-gradient(135deg, rgba(255,107,53,0.08) 0%, rgba(255,59,48,0.05) 100%);
  border: 1px solid rgba(255,107,53,0.25);
  border-radius: 12px;
  padding: 1rem 1.5rem;
  margin: 0 auto clamp(2rem, 3vw, 3rem);
  font-size: clamp(0.85rem, 1.05vw, 0.95rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #c0461a;
  text-align: center;
  max-width: 720px;
  text-wrap: pretty;
  position: relative;
  animation: sxSpecialPulse 3s ease-in-out infinite;
}
@keyframes sxSpecialPulse {
  0%, 100% { box-shadow: 0 4px 14px rgba(255,107,53,0.12); }
  50%      { box-shadow: 0 8px 28px rgba(255,107,53,0.25); }
}

/* ============ ENRICHIR SX-SERVICES heading + sub ============ */
.sx-services .sx-container > h2:first-of-type::after {
  content: '';
}
.sx-services .sx-container::before {
  /* Sub-titre additionnel sous le H2 services */
}
/* On utilise pas ici le ::before du container car header services a deja contenu */

/* sx-fill-empty-end */


/* sx-suggest-bug-fix */
/* FIX BUG: .sx-suggest avait opacity:0 quand ouvert -> invisible */
.sx-suggest {
  opacity: 1 !important;
  visibility: visible !important;
}
.sx-suggest:not(.open) {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.sx-suggest.open {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* HEADER LOGO PLUS GROS */
#brx-header img,
#brx-header .brxe-image img,
#brx-header figure img,
#brx-header a img {
  max-height: 70px !important;
  width: auto !important;
  height: auto !important;
  transition: transform 0.4s var(--sx-ease-out-expo) !important;
}
@media (max-width: 1024px) {
  #brx-header img,
  #brx-header .brxe-image img,
  #brx-header figure img {
    max-height: 56px !important;
  }
}
@media (max-width: 600px) {
  #brx-header img,
  #brx-header .brxe-image img,
  #brx-header figure img {
    max-height: 48px !important;
  }
}
#brx-header .brxe-image,
#brx-header figure {
  max-width: 200px !important;
}
@media (max-width: 1024px) {
  #brx-header .brxe-image,
  #brx-header figure { max-width: 160px !important; }
}
@media (max-width: 600px) {
  #brx-header .brxe-image,
  #brx-header figure { max-width: 130px !important; }
}
/* sx-suggest-bug-fix-end */


/* sx-single-product-polish */
/* SINGLE PRODUCT PAGE polish agence niveau Stripe */

/* Hide redundant "Plage de prix" label */
body.single-product .price > .price-range-text,
body.single-product .price small.from,
body.single-product .from {
  display: none !important;
}

/* H1 produit - typo magazine */
body.single-product h1.product_title,
body.single-product .product .summary h1 {
  font-size: clamp(1.6rem, 3vw, 2.4rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
  text-wrap: balance;
  margin-bottom: 1rem !important;
  color: var(--sx-ink) !important;
}

/* Prix XL */
body.single-product .price,
body.single-product .product .summary .price {
  font-size: clamp(1.6rem, 2.5vw, 2.2rem) !important;
  font-weight: 800 !important;
  color: var(--sx-teal-dark) !important;
  font-feature-settings: 'tnum' on, 'lnum' on !important;
  font-variant-numeric: tabular-nums lining-nums;
  margin-bottom: 1.5rem !important;
}

/* Description courte intro */
body.single-product .woocommerce-product-details__short-description {
  font-size: clamp(1rem, 1.2vw, 1.1rem) !important;
  line-height: 1.6 !important;
  color: rgba(29,35,39,0.78) !important;
  letter-spacing: -0.005em !important;
  margin-bottom: 1.5rem !important;
  text-wrap: pretty;
}

/* Variations table polish */
body.single-product .variations {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100%;
  margin-bottom: 1.5rem !important;
}
body.single-product .variations th, 
body.single-product .variations td {
  padding: 0.85rem 0 !important;
  border: none !important;
  font-size: 0.95rem !important;
}
body.single-product .variations th label {
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: rgba(29,35,39,0.55) !important;
}

/* Quantity input premium */
body.single-product .quantity {
  display: inline-flex !important;
  align-items: center;
  background: #ffffff;
  border: 1px solid rgba(29,35,39,0.14);
  border-radius: 999px;
  overflow: hidden;
  margin-right: 1rem !important;
}
body.single-product .quantity input.qty {
  width: 80px !important;
  text-align: center !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  font-feature-settings: 'tnum' on !important;
  border: none !important;
  padding: 0.85rem 0 !important;
  background: transparent !important;
}

/* Add to cart - mega CTA */
body.single-product .single_add_to_cart_button {
  background: linear-gradient(135deg, #3a9bb8 0%, #2a7a8e 100%) !important;
  color: #ffffff !important;
  padding: 1rem 2rem !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  border-radius: 999px !important;
  border: none !important;
  cursor: pointer !important;
  transition: transform 0.3s var(--sx-ease-out-expo), box-shadow 0.3s, background 0.3s !important;
  box-shadow: 0 12px 32px rgba(58,155,184,0.35), 0 4px 8px rgba(0,0,0,0.1);
  min-height: 56px;
}
body.single-product .single_add_to_cart_button:hover {
  background: linear-gradient(135deg, #5cc4d6 0%, #3a9bb8 100%) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 16px 40px rgba(58,155,184,0.50), 0 6px 12px rgba(0,0,0,0.15) !important;
}

/* Stock status pill */
body.single-product .stock {
  display: inline-block;
  padding: 0.4rem 1rem !important;
  border-radius: 999px !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  margin-bottom: 1rem !important;
}
body.single-product .stock.in-stock,
body.single-product .se-stock-in {
  background: rgba(74,222,128,0.10);
  color: rgb(34, 197, 94) !important;
  border: 1px solid rgba(74,222,128,0.30);
}

/* SKU + meta info */
body.single-product .product_meta {
  margin-top: 1.5rem !important;
  padding-top: 1.5rem !important;
  border-top: 1px solid rgba(29,35,39,0.08);
  font-size: 0.85rem !important;
  color: rgba(29,35,39,0.55) !important;
  letter-spacing: 0.02em !important;
}
body.single-product .sku_wrapper, body.single-product .posted_in {
  display: block;
  margin-bottom: 0.5rem;
}

/* Tabs polish */
body.single-product .woocommerce-tabs {
  margin-top: clamp(2rem, 4vw, 4rem) !important;
}
body.single-product .woocommerce-tabs ul.tabs {
  display: flex;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 2rem !important;
  gap: 0;
  border-bottom: 1px solid rgba(29,35,39,0.10);
}
body.single-product .woocommerce-tabs ul.tabs li {
  background: transparent !important;
  border: none !important;
  padding: 1rem 1.5rem !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: rgba(29,35,39,0.55) !important;
  position: relative;
  transition: color 0.25s ease !important;
  cursor: pointer;
}
body.single-product .woocommerce-tabs ul.tabs li.active,
body.single-product .woocommerce-tabs ul.tabs li.active a {
  color: var(--sx-teal) !important;
}
body.single-product .woocommerce-tabs ul.tabs li.active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0; right: 0;
  height: 2px;
  background: var(--sx-teal);
  border-radius: 999px 999px 0 0;
}

/* Tab panels content */
body.single-product .woocommerce-Tabs-panel {
  font-size: clamp(0.95rem, 1.1vw, 1.05rem) !important;
  line-height: 1.7 !important;
  color: rgba(29,35,39,0.78) !important;
}

/* Image gallery */
body.single-product .woocommerce-product-gallery img {
  border-radius: 12px !important;
  background: #f7f9fa !important;
  padding: 1rem !important;
}
body.single-product .woocommerce-product-gallery__trigger {
  background: rgba(255,255,255,0.9) !important;
  border-radius: 999px !important;
  padding: 0.5rem !important;
  box-shadow: var(--sx-shadow-md) !important;
  transition: transform 0.3s var(--sx-ease-out-expo) !important;
}
body.single-product .woocommerce-product-gallery__trigger:hover {
  transform: scale(1.1) !important;
}

/* Related products header */
body.single-product .related.products h2,
body.single-product .upsells.products h2 {
  font-size: clamp(1.4rem, 2.2vw, 2rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  margin: clamp(2.5rem, 5vw, 5rem) 0 clamp(1rem, 2vw, 2rem) !important;
  text-wrap: balance;
}

/* Reviews */
body.single-product .commentlist {
  list-style: none !important;
  padding: 0 !important;
}
body.single-product .commentlist li {
  background: #f7f9fa;
  border-radius: 12px;
  padding: 1.25rem 1.5rem !important;
  margin-bottom: 1rem !important;
  border: 1px solid rgba(29,35,39,0.06);
}
body.single-product .commentlist .star-rating {
  color: #f5a623 !important;
}

/* Breadcrumb adjusted single */
body.single-product .woocommerce-breadcrumb {
  margin-bottom: clamp(1rem, 2vw, 2rem) !important;
}
/* sx-single-product-polish-end */


/* sx-pill-fix */
.sx-section.sx-cat {
  padding-top: clamp(7rem, 12vw, 10rem) !important;
  overflow: visible !important;
}
.sx-section.sx-cat::before {
  top: clamp(2rem, 4vw, 3rem) !important;
  transform: translateX(-50%) !important;
  position: absolute !important;
  z-index: 10 !important;
  max-width: calc(100vw - 2rem) !important;
  background: linear-gradient(135deg, #3a9bb8 0%, #2a7a8e 100%) !important;
}
@media (max-width: 768px) {
  .sx-section.sx-cat::before {
    white-space: normal !important;
    max-width: calc(100vw - 1.5rem) !important;
    line-height: 1.4 !important;
    padding: 0.85rem 1.5rem !important;
    font-size: clamp(0.7rem, 2.4vw, 0.85rem) !important;
    text-align: center !important;
  }
  .sx-section.sx-cat {
    padding-top: clamp(8rem, 18vw, 11rem) !important;
  }
}
@media (max-width: 480px) {
  .sx-section.sx-cat::before {
    max-width: calc(100vw - 1rem) !important;
    padding: 0.75rem 1.1rem !important;
    font-size: 0.7rem !important;
    letter-spacing: 0.04em !important;
  }
  .sx-section.sx-cat {
    padding-top: 9rem !important;
  }
}
/* sx-pill-fix-end */


/* sx-asp-hero-style */
/* ASP clone dans le hero - style premium grand format */
.sx-asp-hero {
  width: 100% !important;
  max-width: 620px !important;
  margin: 0 auto !important;
  display: block !important;
}
.sx-asp-hero .asp_w {
  background: rgba(255,255,255,0.97) !important;
  border-radius: 14px !important;
  border: 1px solid rgba(58,155,184,0.20) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.20), 0 4px 14px rgba(58,155,184,0.18) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  overflow: visible !important;
}
.sx-asp-hero .asp_w:focus-within {
  border-color: rgba(58,155,184,0.55) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.28), 0 8px 24px rgba(58,155,184,0.35) !important;
  transform: translateY(-2px);
}
.sx-asp-hero .proinput input,
.sx-asp-hero .asp_main_box input.orig {
  font-size: 1.05rem !important;
  font-weight: 500 !important;
  padding: 1rem 1.25rem !important;
  background: transparent !important;
  border: none !important;
  color: var(--sx-ink) !important;
  caret-color: var(--sx-teal) !important;
}
.sx-asp-hero .proinput input::placeholder {
  color: rgba(29,35,39,0.45) !important;
}
.sx-asp-hero .promagnifier, .sx-asp-hero .proloading {
  background: var(--sx-teal) !important;
  border-radius: 10px !important;
  margin: 0.35rem !important;
  padding: 0.6rem 0.9rem !important;
  transition: background 0.25s ease, transform 0.25s !important;
  cursor: pointer;
}
.sx-asp-hero .promagnifier:hover {
  background: var(--sx-teal-dark) !important;
  transform: scale(1.05);
}
.sx-asp-hero .asp_res, .sx-asp-hero .asp_res_loaded {
  background: #ffffff !important;
  border-radius: 12px !important;
  margin-top: 0.5rem !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.25) !important;
  border: 1px solid rgba(58,155,184,0.10) !important;
}
/* sx-asp-hero-style-end */


/* sx-search-icon-fix */
/* Reduire icone loupe partout (ASP + custom search) */
.proloading, .promagnifier {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  padding: 0.4rem !important;
  margin: 0.4rem !important;
  background-size: 16px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.promagnifier svg, .proloading svg, .asp_woo_search svg {
  width: 16px !important;
  height: 16px !important;
}
.promagnifier i, .proloading i {
  font-size: 14px !important;
}
.sx-search-form button svg {
  width: 18px !important;
  height: 18px !important;
}
.sx-search-form button .icon, .sx-search-form button [class*="icon"] {
  font-size: 16px !important;
}

/* sx-search-icon-fix-end */

/* sx-injected-sections */
/* Engagements grid */
.sx-section.sx-engage {
  padding: clamp(4rem, 7vw, 7rem) 0 !important;
  background: linear-gradient(180deg, #ffffff 0%, #f7f9fa 100%);
  position: relative;
}
.sx-section.sx-engage h2 {
  text-align: center;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  margin-bottom: 0.5rem !important;
  text-wrap: balance;
}
.sx-section.sx-engage .sx-sub {
  text-align: center;
  color: rgba(29,35,39,0.55) !important;
  font-size: clamp(0.9rem, 1.1vw, 1rem) !important;
  margin-bottom: clamp(2.5rem, 4vw, 4rem) !important;
}
.sx-engage-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.25rem, 2vw, 1.75rem);
  max-width: 1100px;
  margin: 0 auto;
}
@media (max-width: 768px) { .sx-engage-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .sx-engage-grid { grid-template-columns: 1fr; } }
.sx-engage-item {
  background: #ffffff;
  border: 1px solid rgba(58,155,184,0.10);
  border-radius: 14px;
  padding: 1.5rem;
  transition: transform 0.4s var(--sx-ease-out-expo), border-color 0.3s, box-shadow 0.3s;
}
.sx-engage-item:hover {
  transform: translateY(-4px);
  border-color: rgba(58,155,184,0.4);
  box-shadow: 0 12px 28px rgba(58,155,184,0.15);
}
.sx-engage-item .sx-num {
  display: block;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: var(--sx-teal);
  margin-bottom: 0.85rem;
  font-feature-settings: 'tnum' on;
}
.sx-engage-item h3 {
  font-size: clamp(1rem, 1.2vw, 1.15rem) !important;
  font-weight: 700 !important;
  margin: 0 0 0.5rem !important;
  color: var(--sx-ink);
  line-height: 1.2;
  text-wrap: balance;
}
.sx-engage-item p {
  font-size: clamp(0.85rem, 1vw, 0.95rem) !important;
  color: rgba(29,35,39,0.62) !important;
  line-height: 1.55;
  margin: 0 !important;
  text-wrap: pretty;
}

/* Pour qui grid */
.sx-section.sx-pourqui {
  padding: clamp(4rem, 7vw, 7rem) 0 !important;
  background: #0f1214;
  color: #ffffff;
}
.sx-section.sx-pourqui h2 {
  color: #ffffff !important;
  text-align: center;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  font-weight: 700 !important;
  text-wrap: balance;
  margin-bottom: 0.5rem !important;
}
.sx-section.sx-pourqui .sx-sub {
  color: rgba(255,255,255,0.65) !important;
  text-align: center;
  margin-bottom: clamp(2.5rem, 4vw, 4rem) !important;
  font-size: clamp(0.9rem, 1.1vw, 1rem) !important;
}
.sx-pourqui-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1rem, 1.5vw, 1.5rem);
  max-width: 1100px;
  margin: 0 auto;
}
@media (max-width: 768px) { .sx-pourqui-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .sx-pourqui-grid { grid-template-columns: 1fr; } }
.sx-pourqui-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 12px;
  padding: 1.5rem;
  transition: transform 0.4s var(--sx-ease-out-expo), border-color 0.3s, background 0.3s;
}
.sx-pourqui-card:hover {
  transform: translateY(-4px);
  border-color: rgba(58,155,184,0.5);
  background: rgba(58,155,184,0.06);
}
.sx-pourqui-card h3 {
  color: #ffffff !important;
  font-size: clamp(1rem, 1.2vw, 1.15rem) !important;
  font-weight: 700 !important;
  margin: 0 0 0.5rem !important;
  letter-spacing: -0.01em;
}
.sx-pourqui-card p {
  color: rgba(255,255,255,0.62) !important;
  font-size: clamp(0.85rem, 1vw, 0.92rem) !important;
  line-height: 1.5;
  margin: 0 !important;
  text-wrap: pretty;
}

/* FAQ accordion */
.sx-section.sx-faq {
  padding: clamp(4rem, 7vw, 7rem) 0 !important;
  background: #ffffff;
}
.sx-section.sx-faq h2 {
  text-align: center;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  font-weight: 700 !important;
  margin-bottom: 0.5rem !important;
  text-wrap: balance;
}
.sx-section.sx-faq .sx-sub {
  text-align: center;
  color: rgba(29,35,39,0.55) !important;
  margin-bottom: clamp(2rem, 4vw, 3.5rem) !important;
}
.sx-faq-list {
  max-width: 760px;
  margin: 0 auto;
}
.sx-faq-list details {
  border-bottom: 1px solid rgba(29,35,39,0.10);
  padding: 1.25rem 0.5rem;
  transition: background 0.25s ease;
}
.sx-faq-list details[open] {
  background: rgba(58,155,184,0.03);
}
.sx-faq-list summary {
  font-weight: 600;
  font-size: clamp(1rem, 1.15vw, 1.1rem);
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  color: var(--sx-ink);
  letter-spacing: -0.01em;
}
.sx-faq-list summary::-webkit-details-marker { display: none; }
.sx-faq-list summary::after {
  content: '+';
  font-size: 1.5rem;
  color: var(--sx-teal);
  transition: transform 0.3s var(--sx-ease-out-expo);
  font-weight: 300;
  line-height: 1;
}
.sx-faq-list details[open] summary::after {
  transform: rotate(45deg);
}
.sx-faq-list details p {
  margin: 0.85rem 0 0 !important;
  color: rgba(29,35,39,0.72) !important;
  line-height: 1.6;
  font-size: clamp(0.9rem, 1.05vw, 1rem) !important;
  text-wrap: pretty;
}
/* sx-injected-sections-end */


/* sx-search-icon-smaller */
/* Icone search ENCORE plus petite */
.proloading, .promagnifier, .promagnifier_widget {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  padding: 0.3rem !important;
  margin: 0.3rem !important;
}
.promagnifier svg, .proloading svg, .asp_woo_search svg {
  width: 12px !important;
  height: 12px !important;
}
.promagnifier i, .proloading i {
  font-size: 11px !important;
}
.promagnifier:before, .proloading:before {
  font-size: 11px !important;
}
.sx-search-form button, .sx-search-form .button {
  padding: 0.5rem 0.85rem !important;
  font-size: 0.78rem !important;
}
.sx-search-form button svg, .sx-search-form .button svg {
  width: 14px !important;
  height: 14px !important;
}
/* sx-search-icon-smaller-end */


/* sx-icon-final-tiny */
.proloading, .promagnifier, .promagnifier_widget {
  box-sizing: border-box !important;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  max-width: 26px !important;
  max-height: 26px !important;
  padding: 5px !important;
  margin: 2px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.promagnifier svg, .proloading svg, .asp_woo_search svg, .promagnifier_widget svg {
  width: 14px !important;
  height: 14px !important;
  max-width: 14px !important;
  max-height: 14px !important;
}
.promagnifier i, .proloading i { font-size: 12px !important; line-height: 1 !important; }
.promagnifier:before, .proloading:before { font-size: 12px !important; line-height: 1 !important; }
.probox { display: inline-flex !important; align-items: center !important; }
/* sx-icon-final-tiny-end */


/* sx-viande-home */
.sx-savoir-faire { padding: 5rem 1.5rem; background: linear-gradient(180deg, #fafafa 0%, #fff 100%); }
.sx-savoir-faire .container { max-width: 1280px; margin: 0 auto; }
.sx-savoir-faire h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: 1rem; text-wrap: balance; background: linear-gradient(120deg, #1a1a1a 30%, #00838f 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sx-savoir-faire .sub { font-size: 1.1rem; color: #555; max-width: 740px; margin-bottom: 3rem; text-wrap: pretty; }
.sx-savoir-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.5rem; }
.sx-savoir-card { background: #fff; padding: 2rem 1.5rem; border-radius: 14px; border: 1px solid #ececec; box-shadow: 0 4px 18px rgba(0,0,0,0.04); transition: transform 0.3s, box-shadow 0.3s; position: relative; overflow: hidden; }
.sx-savoir-card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(0,131,143,0.12); border-color: rgba(0,131,143,0.3); }
.sx-savoir-card .num { font-size: 0.85rem; font-weight: 700; color: #00838f; letter-spacing: 0.1em; }
.sx-savoir-card h3 { font-size: 1.25rem; font-weight: 700; margin: 0.6rem 0 0.8rem; color: #1a1a1a; }
.sx-savoir-card p { color: #555; line-height: 1.65; font-size: 0.96rem; }
.sx-savoir-card::after { content: ""; position: absolute; bottom: -50%; right: -50%; width: 100%; height: 100%; background: radial-gradient(circle, rgba(0,131,143,0.08) 0%, transparent 70%); transition: transform 0.5s; }
.sx-savoir-card:hover::after { transform: scale(1.5); }
.sx-pourqui { padding: 5rem 1.5rem; background: #0f1115; color: #fff; position: relative; overflow: hidden; }
.sx-pourqui::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 20% 30%, rgba(0,131,143,0.15) 0%, transparent 50%), radial-gradient(ellipse at 80% 70%, rgba(0,131,143,0.1) 0%, transparent 50%); pointer-events: none; }
.sx-pourqui .container { max-width: 1280px; margin: 0 auto; position: relative; z-index: 1; }
.sx-pourqui h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: 1rem; text-wrap: balance; }
.sx-pourqui .sub { color: #aab; max-width: 740px; margin-bottom: 3rem; font-size: 1.05rem; }
.sx-pq-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.2rem; }
.sx-pq-item { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); padding: 1.6rem 1.4rem; border-radius: 12px; transition: all 0.3s; backdrop-filter: blur(10px); }
.sx-pq-item:hover { background: rgba(0,131,143,0.1); border-color: rgba(0,131,143,0.4); transform: translateY(-4px); }
.sx-pq-item .ic { font-size: 1.6rem; display: block; margin-bottom: 0.5rem; opacity: 0.9; }
.sx-pq-item h4 { font-size: 1.05rem; font-weight: 700; margin-bottom: 0.4rem; color: #fff; }
.sx-pq-item p { font-size: 0.88rem; color: #aab; line-height: 1.55; }
.sx-engagements { padding: 5rem 1.5rem; background: #fff; }
.sx-engagements .container { max-width: 1280px; margin: 0 auto; }
.sx-engagements h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: 1rem; text-wrap: balance; }
.sx-engagements .sub { color: #666; max-width: 740px; margin-bottom: 3rem; font-size: 1.05rem; }
.sx-eng-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.3rem; }
.sx-eng-card { padding: 2rem 1.6rem; border-radius: 14px; background: linear-gradient(135deg, #fff 0%, #fafafa 100%); border: 1px solid #ececec; transition: all 0.35s; position: relative; }
.sx-eng-card:hover { border-color: #00838f; transform: translateY(-4px); box-shadow: 0 14px 36px rgba(0,131,143,0.1); }
.sx-eng-card .badge { display: inline-block; font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; color: #00838f; margin-bottom: 0.6rem; }
.sx-eng-card h3 { font-size: 1.2rem; font-weight: 700; margin-bottom: 0.7rem; color: #1a1a1a; }
.sx-eng-card p { color: #555; line-height: 1.65; font-size: 0.95rem; }
.sx-faq { padding: 5rem 1.5rem; background: #fafafa; }
.sx-faq .container { max-width: 920px; margin: 0 auto; }
.sx-faq h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: 1rem; text-wrap: balance; text-align: center; }
.sx-faq .sub { color: #666; text-align: center; margin-bottom: 3rem; max-width: 600px; margin-left: auto; margin-right: auto; }
.sx-faq details { background: #fff; border: 1px solid #ececec; border-radius: 12px; margin-bottom: 0.8rem; transition: all 0.3s; overflow: hidden; }
.sx-faq details[open] { border-color: #00838f; box-shadow: 0 8px 24px rgba(0,131,143,0.08); }
.sx-faq summary { padding: 1.3rem 1.5rem; cursor: pointer; font-weight: 700; font-size: 1.02rem; color: #1a1a1a; list-style: none; position: relative; padding-right: 3rem; }
.sx-faq summary::-webkit-details-marker { display: none; }
.sx-faq summary::after { content: "+"; position: absolute; right: 1.5rem; top: 50%; transform: translateY(-50%); font-size: 1.5rem; color: #00838f; transition: transform 0.3s; font-weight: 300; }
.sx-faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.sx-faq details p { padding: 0 1.5rem 1.3rem; color: #555; line-height: 1.7; font-size: 0.96rem; }
/* sx-viande-home-end */


/* sx-commander-test */
.sx-commander { padding: 5rem 1.5rem; background: linear-gradient(180deg, #fff 0%, #fafafa 100%); }
.sx-commander .container { max-width: 1280px; margin: 0 auto; }
.sx-commander h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: 1rem; text-wrap: balance; background: linear-gradient(120deg, #1a1a1a 30%, #00838f 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sx-commander .sub { color: #555; max-width: 740px; margin-bottom: 3rem; font-size: 1.05rem; text-wrap: pretty; }
.sx-cmd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.4rem; }
.sx-cmd-card { display: flex; flex-direction: column; padding: 2.2rem 1.7rem; background: #fff; border: 1px solid #ececec; border-radius: 16px; text-decoration: none; color: inherit; transition: all 0.35s; position: relative; overflow: hidden; }
.sx-cmd-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, #00838f, #4dd0e1); transform: scaleX(0); transform-origin: left; transition: transform 0.4s; }
.sx-cmd-card:hover { transform: translateY(-6px); border-color: #00838f; box-shadow: 0 18px 44px rgba(0,131,143,0.14); }
.sx-cmd-card:hover::before { transform: scaleX(1); }
.sx-cmd-card .num { font-size: 0.85rem; font-weight: 700; color: #00838f; letter-spacing: 0.12em; }
.sx-cmd-card h3 { font-size: 1.3rem; font-weight: 700; margin: 0.6rem 0 0.7rem; color: #1a1a1a; }
.sx-cmd-card p { color: #555; line-height: 1.6; font-size: 0.95rem; flex-grow: 1; margin-bottom: 1.2rem; }
.sx-cmd-card .cta { font-size: 0.9rem; font-weight: 700; color: #00838f; letter-spacing: 0.02em; transition: transform 0.3s; align-self: flex-start; }
.sx-cmd-card:hover .cta { transform: translateX(4px); }
.sx-testimonials { padding: 5rem 1.5rem; background: #f4f6f8; position: relative; overflow: hidden; }
.sx-testimonials::before { content: ""; position: absolute; top: 0; right: -100px; width: 400px; height: 400px; background: radial-gradient(circle, rgba(0,131,143,0.1) 0%, transparent 70%); pointer-events: none; }
.sx-testimonials .container { max-width: 1280px; margin: 0 auto; position: relative; }
.sx-testimonials h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: 1rem; text-wrap: balance; }
.sx-testimonials .sub { color: #555; max-width: 640px; margin-bottom: 3rem; font-size: 1.05rem; }
.sx-test-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }
.sx-test-card { background: #fff; padding: 2rem 1.7rem; border-radius: 16px; box-shadow: 0 4px 18px rgba(0,0,0,0.04); border: 1px solid #ececec; transition: all 0.35s; position: relative; }
.sx-test-card::before { content: "201C"; position: absolute; top: 0.5rem; right: 1.4rem; font-size: 4.5rem; color: rgba(0,131,143,0.18); font-family: Georgia, serif; line-height: 1; pointer-events: none; }
.sx-test-card:hover { transform: translateY(-4px); border-color: rgba(0,131,143,0.4); box-shadow: 0 16px 36px rgba(0,131,143,0.12); }
.sx-test-card .sec { display: block; font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; color: #00838f; font-weight: 700; margin-bottom: 1rem; }
.sx-test-card blockquote { color: #1a1a1a; font-size: 1.02rem; line-height: 1.7; font-style: italic; margin: 0 0 1.2rem; padding: 0; border: 0; text-wrap: pretty; }
.sx-test-card .sig { display: block; font-size: 0.88rem; color: #555; font-weight: 600; }
@media (max-width: 768px) {
  .sx-savoir-faire, .sx-pourqui, .sx-engagements, .sx-faq, .sx-commander, .sx-testimonials { padding: 3.5rem 1rem; }
  .sx-savoir-card, .sx-eng-card, .sx-cmd-card, .sx-test-card { padding: 1.7rem 1.3rem; }
  .sx-faq summary { padding: 1.1rem 1.2rem; padding-right: 2.6rem; font-size: 0.96rem; }
  .sx-faq summary::after { right: 1.2rem; }
  .sx-faq details p { padding: 0 1.2rem 1.1rem; }
}
/* sx-commander-test-end */


/* sx-header-search-fix */
/* Header ASP search bar : forcer largeur + cacher proloading + flex layout */
#brx-header .asp_main_container,
#brx-header .asp_w_container .asp_main_container,
header .asp_main_container {
  width: 100% !important;
  min-width: 320px !important;
  max-width: 480px !important;
  box-sizing: border-box !important;
}
#brx-header .asp_w_container,
header .asp_w_container {
  width: 100% !important;
  min-width: 320px !important;
  max-width: 480px !important;
  flex: 1 1 auto !important;
}
#brx-header .probox,
header .probox {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  gap: 0 !important;
  position: relative !important;
}
#brx-header .asp_main_container .proloading,
header .asp_main_container .proloading {
  display: none !important;
}
#brx-header .probox form,
header .probox form {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  margin: 0 !important;
  display: block !important;
}
#brx-header .probox input.orig,
#brx-header .probox input.autocomplete,
header .probox input.orig,
header .probox input.autocomplete {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0.55rem 0.95rem !important;
  font-size: 0.92rem !important;
  box-sizing: border-box !important;
  border: 0 !important;
  background: transparent !important;
}
/* Promagnifier reste a droite (order 2) */
#brx-header .probox .promagnifier,
header .probox .promagnifier {
  order: 2 !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
}
#brx-header .probox form,
header .probox form {
  order: 1 !important;
}
/* Container global du search dans header */
.brxe-shortcode .asp_w_container,
#brx-header .brxe-shortcode {
  width: 100% !important;
  max-width: 480px !important;
  flex: 1 1 auto !important;
}
@media (max-width: 991px) {
  #brx-header .asp_main_container,
  header .asp_main_container { min-width: 0 !important; max-width: 100% !important; }
}
/* sx-header-search-fix-end */


/* sx-header-align-polish */
#brx-header, #brx-header section, #brx-header .brxe-section, #brx-header .brxe-block, #brx-header .brxe-container { align-items: center !important; }
#brx-header section .brxe-block, #brx-header .brxe-section > div { display: flex !important; align-items: center !important; }
#brx-header > section { display: flex !important; align-items: center !important; }
#brx-header .brxe-svg, #brx-header .brxe-icon, #brx-header a[href*='mon-compte'], #brx-header .brxe-woocommerce-mini-cart, #brx-header .asp_w_container, #brx-header .brxe-shortcode { display: inline-flex !important; align-items: center !important; align-self: center !important; line-height: 1 !important; }
#brx-header .brxe-svg svg, #brx-header .brxe-icon svg { width: 24px !important; height: 24px !important; display: block !important; vertical-align: middle !important; }
#brx-header .brxe-icon i { font-size: 22px !important; line-height: 1 !important; vertical-align: middle !important; }
#brx-header .brxe-woocommerce-mini-cart, #brx-header .wd-tools-cart { display: inline-flex !important; align-items: center !important; align-self: center !important; line-height: 1 !important; }
#brx-header .brxe-woocommerce-mini-cart svg, #brx-header [class*='cart'] svg { width: 26px !important; height: 26px !important; }
#brx-header .asp_main_container, header .asp_main_container { border: 1px solid rgba(0,131,143,0.25) !important; border-radius: 14px !important; background: #fff !important; box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important; overflow: hidden !important; padding: 0 !important; align-self: center !important; }
#brx-header .asp_main_container::before, #brx-header .asp_main_container::after, header .asp_main_container::before, header .asp_main_container::after { display: none !important; content: none !important; }
#brx-header .probox, header .probox { padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; margin: 0 !important; }
#brx-header .probox::before, #brx-header .probox::after, header .probox::before, header .probox::after { display: none !important; content: none !important; }
#brx-header .probox input.orig, #brx-header .probox input.autocomplete, header .probox input.orig, header .probox input.autocomplete { padding: 0.55rem 1rem !important; line-height: 1.4 !important; height: auto !important; vertical-align: middle !important; color: #1a202c !important; }
#brx-header .probox input.orig::placeholder, header .probox input.orig::placeholder { color: #94a3b8 !important; opacity: 1 !important; }
#brx-header .promagnifier, header .promagnifier { background: #00838f !important; margin: 4px !important; box-sizing: border-box !important; width: 30px !important; height: 30px !important; min-width: 30px !important; min-height: 30px !important; max-width: 30px !important; max-height: 30px !important; border-radius: 8px !important; }
#brx-header .promagnifier svg { width: 14px !important; height: 14px !important; fill: #fff !important; }
.brxe-offcanvas .brx-nav-nested-items > li > a, .brxe-offcanvas ul.menu > li > a, .sx-offcanvas-deep ul.menu > li > a, .brxe-offcanvas .sx-mm-list > li > a { color: #2d3748 !important; font-weight: 500 !important; padding: 0.95rem 1.4rem !important; display: flex !important; align-items: center !important; letter-spacing: 0 !important; font-size: 1rem !important; border-bottom: 1px solid rgba(0,0,0,0.04) !important; }
.brxe-offcanvas li ul li a, .brxe-offcanvas ul ul li a, .sx-offcanvas-deep ul ul li a, .brxe-offcanvas .sx-mm-sublist li a { color: #4a5568 !important; font-weight: 400 !important; font-size: 0.92rem !important; padding: 0.65rem 1.4rem 0.65rem 2.6rem !important; border-bottom: 1px solid rgba(0,0,0,0.03) !important; background: rgba(0,0,0,0.015) !important; }
.brxe-offcanvas .sx-mm-section, .sx-offcanvas-deep .sx-mm-section { font-size: 0.72rem !important; font-weight: 700 !important; color: #00838f !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; padding: 1.5rem 1.4rem 0.6rem !important; display: block !important; }
.brxe-offcanvas a:hover, .sx-offcanvas-deep a:hover, .brxe-offcanvas .sx-mm-list a:hover { color: #00838f !important; background: rgba(0,131,143,0.06) !important; padding-left: 1.7rem !important; transition: all 0.2s !important; }
.brxe-offcanvas li ul li a:hover, .brxe-offcanvas ul ul li a:hover { padding-left: 2.9rem !important; }
.brxe-offcanvas a, .brxe-offcanvas a:visited { text-decoration: none !important; }
/* sx-header-align-polish-end */


/* sx-scroll-anim */
@supports (animation-timeline: view()) {
  @keyframes sxFadeUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes sxFadeIn { from { opacity: 0; } to { opacity: 1; } }
  @keyframes sxScaleIn { from { opacity: 0; transform: scale(0.94); } to { opacity: 1; transform: scale(1); } }
  .sx-savoir-card, .sx-pq-item, .sx-eng-card, .sx-cmd-card, .sx-test-card {
    animation: sxFadeUp linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 30%;
  }
  .sx-savoir-faire h2, .sx-pourqui h2, .sx-engagements h2, .sx-faq h2, .sx-commander h2, .sx-testimonials h2 {
    animation: sxFadeIn linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 25%;
  }
  .sx-faq details { animation: sxFadeUp linear both; animation-timeline: view(); animation-range: entry 0% cover 35%; }
  .sx-vedettes-grid > * { animation: sxScaleIn linear both; animation-timeline: view(); animation-range: entry 0% cover 30%; }
}
@media (prefers-reduced-motion: reduce) {
  .sx-savoir-card, .sx-pq-item, .sx-eng-card, .sx-cmd-card, .sx-test-card, .sx-faq details, .sx-vedettes-grid > * { animation: none !important; }
}
/* sx-scroll-anim-end */

/* sx-vedettes */
.sx-vedettes { padding: 5rem 1.5rem; background: linear-gradient(180deg, #fff 0%, #fafafa 100%); }
.sx-vedettes .container { max-width: 1280px; margin: 0 auto; }
.sx-vedettes h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: 1rem; text-wrap: balance; background: linear-gradient(120deg, #1a1a1a 30%, #00838f 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sx-vedettes .sub { color: #555; max-width: 740px; margin-bottom: 3rem; font-size: 1.05rem; }
.sx-vedettes-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.4rem; }
.sx-ved-card { background: #fff; border: 1px solid #ececec; border-radius: 14px; overflow: hidden; transition: all 0.35s; text-decoration: none; color: inherit; display: flex; flex-direction: column; isolation: isolate; }
.sx-ved-card:hover { transform: translateY(-6px); border-color: rgba(0,131,143,0.4); box-shadow: 0 18px 40px rgba(0,131,143,0.15); }
.sx-ved-card .img-wrap { aspect-ratio: 1/1; background: #f8f9fa; display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative; }
.sx-ved-card .img-wrap img { width: 100%; height: 100%; object-fit: contain; padding: 1rem; transition: transform 0.4s; }
.sx-ved-card:hover .img-wrap img { transform: scale(1.05); }
.sx-ved-card .img-wrap.no-img { background: linear-gradient(135deg, #f0f9fa 0%, #e0f2f4 100%); }
.sx-ved-card .img-wrap.no-img::after { content: 'SX'; font-weight: 800; font-size: 2.5rem; color: rgba(0,131,143,0.3); letter-spacing: 0.05em; }
.sx-ved-card .info { padding: 1rem 1.1rem 1.2rem; flex-grow: 1; display: flex; flex-direction: column; }
.sx-ved-card .name { font-size: 0.95rem; font-weight: 600; color: #1a202c; line-height: 1.4; margin: 0 0 0.5rem; flex-grow: 1; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sx-ved-card .price { font-size: 0.95rem; font-weight: 700; color: #00838f; margin: 0; }
.sx-ved-card .price del { color: #999; font-weight: 400; margin-right: 0.5rem; font-size: 0.85rem; }
.sx-ved-card .badge-sale { position: absolute; top: 0.6rem; right: 0.6rem; background: linear-gradient(135deg, #ff3b30, #ff6b35); color: #fff; padding: 0.2rem 0.55rem; border-radius: 6px; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.05em; z-index: 2; }
.sx-vedettes .ved-cta { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: 2.5rem; padding: 0.9rem 1.6rem; background: #00838f; color: #fff; text-decoration: none; border-radius: 12px; font-weight: 700; transition: all 0.3s; }
.sx-vedettes .ved-cta:hover { background: #006d76; transform: translateX(4px); }
.sx-vedettes-loading { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.4rem; }
.sx-vedettes-loading .skel { background: linear-gradient(90deg, #f0f0f0 25%, #fafafa 50%, #f0f0f0 75%); background-size: 200% 100%; height: 280px; border-radius: 14px; animation: sxSkel 1.2s ease infinite; }
@keyframes sxSkel { from { background-position: 200% 0; } to { background-position: -200% 0; } }
/* sx-vedettes-end */


/* sx-asp-results-zindex */
/* IMPORTANT: ASP container in header NO MORE overflow:hidden (clipping dropdown) */
#brx-header .asp_main_container, header .asp_main_container { overflow: visible !important; }
#brx-header .probox, header .probox { overflow: visible !important; }
#brx-header .asp_w_container, header .asp_w_container { overflow: visible !important; }
#brx-header .brxe-shortcode { overflow: visible !important; }
/* ASP results dropdown : z-index extreme + position fixed alternative */
.asp_r, .asp_r_1, .asp_r_1_1, .asp_r_1_2, .asp_r_2, .asp_r_2_1, .asp_r_2_2 { z-index: 9999999 !important; position: absolute !important; }
/* All sticky elements (header, mobile nav) need lower z than results */
#brx-header { z-index: 100 !important; }
#brx-header.sticky, header.sticky { z-index: 100 !important; }
/* Body / html overflow visible */
html, body { overflow-x: hidden; overflow-y: auto; }
/* sx-asp-results-zindex-end */


/* sx-search-zindex-all */
/* Hero search suggest dropdown - escape ALL parent stacking */
.sx-suggest { z-index: 999999 !important; position: absolute !important; }
.sx-search-wrap, .sx-hero-search { z-index: 100 !important; position: relative !important; }
.sx-hero-search:focus-within, .sx-search-wrap:focus-within { z-index: 999998 !important; }
/* When dropdown opens, parent gets isolation: isolate */
.sx-hero-search:has(.sx-suggest.open), .sx-search-wrap:has(.sx-suggest.open) { z-index: 999998 !important; }
/* ASP results dropdowns - max z + escape any clipping */
.asp_r, .asp_r_1, .asp_r_1_1, .asp_r_1_2 { z-index: 9999999 !important; }
/* Hero wrapper to ensure dropdown shown above next sections */
.sx-hero-bar, [id='brxe-gjalcd'], [id='brxe-ejehwy'], [id='brxe-olywij'] { z-index: 50 !important; position: relative !important; }
/* Ensure no parent section after hero clips with overflow:hidden */
body > * { overflow-x: clip; }
section.brxe-section:not(:first-of-type) { overflow: visible !important; }
/* sx-search-zindex-all-end */


/* sx-asp-result-enrich */
.asp_r .item, .asp_r .asp_r_item { padding: 0.85rem 1rem !important; border-bottom: 1px solid rgba(0,0,0,0.05) !important; transition: background 0.2s; }
.asp_r .item:hover, .asp_r .asp_r_item:hover { background: rgba(0,131,143,0.04) !important; }
.asp_r .item .asp_image, .asp_r .item img { border-radius: 8px; flex-shrink: 0; }

.sx-asp-ext { display: flex !important; align-items: center !important; gap: 0.85rem !important; margin-top: 0.45rem !important; flex-wrap: wrap !important; }

.sx-asp-price { font-size: 1.02rem !important; font-weight: 700 !important; color: #00838f !important; line-height: 1 !important; }
.sx-asp-price del { color: #999 !important; font-weight: 400 !important; font-size: 0.85em !important; margin-right: 0.3rem !important; }
.sx-asp-price ins { text-decoration: none !important; }

.sx-asp-cart-btn { background: #00838f !important; color: #fff !important; border: 0 !important; padding: 0.5rem 0.9rem !important; border-radius: 8px !important; font-size: 0.82rem !important; font-weight: 700 !important; letter-spacing: 0.02em !important; cursor: pointer !important; transition: all 0.25s !important; line-height: 1 !important; display: inline-flex !important; align-items: center !important; gap: 0.4rem !important; }
.sx-asp-cart-btn::before { content: '+'; font-size: 1.1em; line-height: 0; font-weight: 400; }
.sx-asp-cart-btn:hover { background: #006d76 !important; transform: translateY(-1px) !important; box-shadow: 0 4px 12px rgba(0,131,143,0.3) !important; }
.sx-asp-cart-btn:disabled { opacity: 0.7 !important; cursor: wait !important; transform: none !important; }
.sx-asp-cart-btn.done { background: #16a34a !important; }
.sx-asp-cart-btn.done::before { content: '✓'; }

.sx-asp-oos { font-size: 0.78rem !important; color: #94a3b8 !important; font-style: italic !important; }

.asp_res_url, a.asp_res_url { color: #1a202c !important; font-weight: 600 !important; text-decoration: none !important; }
.asp_r .asp_res_url:hover { color: #00838f !important; }
.asp_r .item h3, .asp_r .item .asp_res_title { font-size: 0.95rem !important; line-height: 1.4 !important; margin: 0 0 0.2rem !important; }
.asp_content, .asp_excerpt { font-size: 0.82rem !important; color: #555 !important; line-height: 1.45 !important; margin-bottom: 0.4rem !important; }

@media (max-width: 600px) {
  .sx-asp-ext { gap: 0.6rem !important; }
  .sx-asp-cart-btn { padding: 0.4rem 0.75rem !important; font-size: 0.75rem !important; }
  .sx-asp-price { font-size: 0.95rem !important; }
}
/* sx-asp-result-enrich-end */


/* sx-cats-section */
.sx-cats { padding: 5rem 1.5rem; background: linear-gradient(180deg, #fafafa 0%, #fff 100%); }
.sx-cats .container { max-width: 1280px; margin: 0 auto; }
.sx-cats h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: 1rem; text-wrap: balance; background: linear-gradient(120deg, #1a1a1a 30%, #00838f 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sx-cats .sub { color: #555; max-width: 740px; margin-bottom: 3rem; font-size: 1.05rem; }

.sx-cats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1.4rem; }

.sx-cat-card { display: block; position: relative; aspect-ratio: 4/5; border-radius: 16px; overflow: hidden; text-decoration: none; color: inherit; isolation: isolate; transition: transform 0.4s cubic-bezier(0.16,1,0.3,1), box-shadow 0.4s; box-shadow: 0 4px 14px rgba(0,0,0,0.05); }
.sx-cat-card:hover { transform: translateY(-6px) scale(1.01); box-shadow: 0 24px 50px rgba(0,131,143,0.25); }

.sx-cat-card .img-wrap { position: absolute; inset: 0; z-index: 1; }
.sx-cat-card .img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.16,1,0.3,1); }
.sx-cat-card:hover .img-wrap img { transform: scale(1.08); }
.sx-cat-card .img-wrap.no-img { background: linear-gradient(135deg, #006d76 0%, #00838f 50%, #4dd0e1 100%); }
.sx-cat-card .img-wrap.no-img::after { content: 'SX'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 4rem; font-weight: 800; color: rgba(255,255,255,0.25); letter-spacing: 0.05em; }

.sx-cat-card::before { content: ''; position: absolute; inset: 0; z-index: 2; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0.85) 100%); transition: opacity 0.4s; }
.sx-cat-card:hover::before { background: linear-gradient(180deg, rgba(0,131,143,0.1) 0%, rgba(0,131,143,0.4) 50%, rgba(0,109,118,0.92) 100%); }

.sx-cat-card .info { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; padding: 1.4rem 1.3rem 1.5rem; color: #fff; }
.sx-cat-card .cat-name { font-size: 1.15rem; font-weight: 700; line-height: 1.3; margin: 0 0 0.3rem; color: #fff !important; text-wrap: balance; }
.sx-cat-card .cat-count { font-size: 0.78rem; opacity: 0.85; letter-spacing: 0.05em; font-weight: 500; display: block; }
.sx-cat-card .cat-arrow { position: absolute; right: 1.3rem; top: 1.3rem; width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,0.18); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,0.25); display: flex; align-items: center; justify-content: center; font-size: 1.2rem; font-weight: 600; color: #fff; transition: all 0.3s; }
.sx-cat-card:hover .cat-arrow { background: #fff; color: #00838f; transform: rotate(-45deg); }

/* Skeleton loading state */
.sx-cats-loading { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1.4rem; }
.sx-cats-loading .skel { aspect-ratio: 4/5; border-radius: 16px; background: linear-gradient(90deg, #f0f0f0 25%, #fafafa 50%, #f0f0f0 75%); background-size: 200% 100%; animation: sxSkel 1.2s ease infinite; }

/* Scroll animations */
@supports (animation-timeline: view()) {
  .sx-cats-grid > * { animation: sxFadeUp linear both; animation-timeline: view(); animation-range: entry 0% cover 30%; }
}

@media (max-width: 600px) {
  .sx-cats { padding: 3.5rem 1rem; }
  .sx-cat-card { aspect-ratio: 3/4; }
  .sx-cat-card .info { padding: 1.1rem 1rem 1.2rem; }
  .sx-cat-card .cat-name { font-size: 1rem; }
  .sx-cats-grid { grid-template-columns: repeat(2, 1fr); gap: 0.85rem; }
}
/* sx-cats-section-end */


/* sx-mini-cart-elite */
.widget_shopping_cart_content { font-family: inherit; padding: 0 !important; max-width: 420px; }
.widget_shopping_cart_content::before { content: 'Votre panier'; display: block; padding: 1.4rem 1.5rem 0.8rem; font-size: 1.25rem; font-weight: 800; color: #1a202c; letter-spacing: -0.01em; border-bottom: 1px solid rgba(0,0,0,0.06); margin-bottom: 0; }
ul.cart_list.product_list_widget, ul.woocommerce-mini-cart { padding: 0.5rem 0 0 !important; margin: 0 !important; list-style: none !important; max-height: 60vh; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #00838f transparent; }
ul.cart_list.product_list_widget::-webkit-scrollbar, ul.woocommerce-mini-cart::-webkit-scrollbar { width: 4px; }
ul.cart_list.product_list_widget::-webkit-scrollbar-thumb, ul.woocommerce-mini-cart::-webkit-scrollbar-thumb { background: #00838f; border-radius: 2px; }
li.mini_cart_item, li.woocommerce-mini-cart-item { display: grid !important; grid-template-columns: 56px 1fr auto !important; gap: 0.85rem !important; align-items: center !important; padding: 0.85rem 1.5rem !important; border-bottom: 1px solid rgba(0,0,0,0.04) !important; position: relative; transition: background 0.2s; margin: 0 !important; }
li.mini_cart_item:hover { background: rgba(0,131,143,0.03) !important; }
li.mini_cart_item img { width: 56px !important; height: 56px !important; object-fit: cover; border-radius: 8px; background: #f8f9fa; padding: 4px; box-sizing: border-box; border: 1px solid rgba(0,0,0,0.04); float: none !important; margin: 0 !important; grid-column: 1; grid-row: 1 / 3; }
li.mini_cart_item > a:not(.remove) { grid-column: 2; font-size: 0.92rem !important; font-weight: 600 !important; color: #1a202c !important; text-decoration: none !important; line-height: 1.35 !important; display: block; padding: 0 !important; max-width: 100% !important; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
li.mini_cart_item > a:not(.remove):hover { color: #00838f !important; }
li.mini_cart_item .quantity { grid-column: 2; font-size: 0.85rem !important; color: #64748b !important; font-weight: 500 !important; margin-top: 0.2rem !important; }
li.mini_cart_item .quantity .amount { font-weight: 700 !important; color: #00838f !important; }
a.remove.remove_from_cart_button, .mini_cart_item a.remove { position: absolute !important; top: 0.55rem !important; right: 0.6rem !important; width: 22px !important; height: 22px !important; border-radius: 50% !important; background: rgba(255,59,48,0.08) !important; color: #ef4444 !important; font-size: 0.95rem !important; line-height: 22px !important; text-align: center !important; padding: 0 !important; margin: 0 !important; text-decoration: none !important; transition: all 0.2s !important; font-weight: 600 !important; opacity: 0.55 !important; }
a.remove.remove_from_cart_button:hover, .mini_cart_item a.remove:hover { background: #ef4444 !important; color: #fff !important; opacity: 1 !important; transform: scale(1.1) !important; }
p.woocommerce-mini-cart__total, p.total { display: flex !important; justify-content: space-between !important; align-items: baseline !important; padding: 1.2rem 1.5rem !important; margin: 0 !important; background: linear-gradient(180deg, #fafafa 0%, #f5f7fa 100%); border-top: 1px solid rgba(0,0,0,0.06); }
p.woocommerce-mini-cart__total strong, p.total strong { font-size: 0.85rem !important; font-weight: 600 !important; color: #64748b !important; text-transform: uppercase; letter-spacing: 0.08em; }
p.woocommerce-mini-cart__total .amount, p.total .amount { font-size: 1.55rem !important; font-weight: 800 !important; color: #00838f !important; letter-spacing: -0.02em !important; }
p.woocommerce-mini-cart__buttons, p.buttons { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 0.6rem !important; padding: 0 1.5rem 1.5rem !important; margin: 0 !important; background: #fff; }
p.woocommerce-mini-cart__buttons a.button, p.buttons a.button { padding: 0.85rem 1rem !important; border-radius: 12px !important; font-weight: 700 !important; font-size: 0.88rem !important; letter-spacing: 0.01em !important; text-align: center !important; text-decoration: none !important; transition: all 0.25s !important; line-height: 1 !important; }
p.buttons a.button.wc-forward:not(.checkout) { background: rgba(0,131,143,0.08) !important; color: #00838f !important; border: 1px solid rgba(0,131,143,0.2) !important; }
p.buttons a.button.wc-forward:not(.checkout):hover { background: rgba(0,131,143,0.15) !important; border-color: #00838f !important; transform: translateY(-1px) !important; }
p.buttons a.button.checkout, p.buttons a.checkout { background: linear-gradient(135deg, #00838f 0%, #00bcd4 100%) !important; color: #fff !important; border: 0 !important; box-shadow: 0 4px 14px rgba(0,131,143,0.3) !important; }
p.buttons a.button.checkout:hover { transform: translateY(-2px) !important; box-shadow: 0 8px 24px rgba(0,131,143,0.45) !important; }
.woocommerce-mini-cart__empty-message, .cart_list.empty li, p.cart_list.empty { padding: 3rem 1.5rem !important; text-align: center !important; color: #94a3b8 !important; font-size: 0.95rem !important; font-style: italic !important; background: #fafafa; border-radius: 12px; margin: 1rem 1.5rem; }
.cart_list.empty::before { content: '🛒'; display: block; font-size: 2.5rem; margin-bottom: 0.5rem; opacity: 0.4; }
@media (max-width: 600px) {
  .widget_shopping_cart_content { max-width: 100%; }
  li.mini_cart_item { padding: 0.75rem 1rem !important; }
  p.woocommerce-mini-cart__total { padding: 1rem 1rem !important; }
  p.woocommerce-mini-cart__buttons { padding: 0 1rem 1rem !important; }
}
/* sx-mini-cart-elite-end */


/* sx-installations-tech */
/* Section installations - 2 cards adresses physiques */
.sx-installations { padding: 5rem 1.5rem; background: #fff; position: relative; overflow: hidden; }
.sx-installations::before { content: ''; position: absolute; top: -100px; left: -100px; width: 380px; height: 380px; background: radial-gradient(circle, rgba(0,131,143,0.06) 0%, transparent 70%); pointer-events: none; }
.sx-installations .container { max-width: 1280px; margin: 0 auto; position: relative; }
.sx-installations h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: 1rem; text-wrap: balance; }
.sx-installations .sub { color: #555; max-width: 740px; margin-bottom: 3rem; font-size: 1.05rem; }

.sx-instal-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 1.6rem; }

.sx-instal-card { padding: 2.4rem 2rem; border-radius: 18px; background: linear-gradient(180deg, #fff 0%, #fafbfc 100%); border: 1px solid #ececec; transition: all 0.4s cubic-bezier(0.16,1,0.3,1); position: relative; overflow: hidden; }
.sx-instal-card::before { content: ''; position: absolute; top: 0; left: 0; height: 4px; width: 100%; background: linear-gradient(90deg, #00838f, #4dd0e1); transform: scaleX(0); transform-origin: left; transition: transform 0.45s; }
.sx-instal-card:hover { transform: translateY(-6px); border-color: rgba(0,131,143,0.4); box-shadow: 0 18px 44px rgba(0,131,143,0.12); }
.sx-instal-card:hover::before { transform: scaleX(1); }
.sx-instal-card .badge { display: inline-block; font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; color: #00838f; margin-bottom: 0.8rem; padding: 0.3rem 0.7rem; background: rgba(0,131,143,0.08); border-radius: 6px; }
.sx-instal-card h3 { font-size: 1.35rem; font-weight: 800; margin: 0 0 1.1rem; color: #1a202c; line-height: 1.3; }
.sx-instal-card .addr { font-style: normal; display: block; margin-bottom: 1.3rem; }
.sx-instal-card .addr .line { display: block; color: #1a202c; font-size: 1rem; line-height: 1.55; font-weight: 500; }
.sx-instal-card .addr .line:nth-child(2) { color: #555; font-weight: 400; font-size: 0.95rem; }
.sx-instal-card .meta { display: flex; gap: 1.4rem; flex-wrap: wrap; padding-top: 1rem; border-top: 1px solid rgba(0,0,0,0.06); margin-bottom: 1rem; }
.sx-instal-card .hours { display: flex; flex-direction: column; gap: 0.15rem; }
.sx-instal-card .hours .lbl { font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; color: #94a3b8; font-weight: 700; }
.sx-instal-card .hours .val { font-size: 0.92rem; color: #1a202c; font-weight: 600; }
.sx-instal-card .tel { font-size: 0.92rem; color: #00838f; font-weight: 700; text-decoration: none; align-self: flex-end; transition: all 0.25s; }
.sx-instal-card .tel:hover { color: #006d76; }
.sx-instal-card .tel::before { content: '☎ '; font-size: 0.85em; opacity: 0.7; margin-right: 0.2rem; }
.sx-instal-card .map-link { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.7rem 1.1rem; background: rgba(0,131,143,0.06); color: #00838f; border: 1px solid rgba(0,131,143,0.2); border-radius: 10px; font-size: 0.88rem; font-weight: 700; text-decoration: none; transition: all 0.25s; }
.sx-instal-card .map-link:hover { background: #00838f; color: #fff; border-color: #00838f; transform: translateX(3px); }

/* Section services techniques */
.sx-svc-tech { padding: 5rem 1.5rem; background: #f4f6f8; position: relative; }
.sx-svc-tech .container { max-width: 1280px; margin: 0 auto; }
.sx-svc-tech h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; margin-bottom: 1rem; text-wrap: balance; background: linear-gradient(120deg, #1a1a1a 30%, #00838f 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sx-svc-tech .sub { color: #555; max-width: 740px; margin-bottom: 3rem; font-size: 1.05rem; text-wrap: pretty; }

.sx-svctech-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.4rem; }

.sx-svctech-card { padding: 2.2rem 1.8rem; background: #fff; border-radius: 16px; border: 1px solid #ececec; display: flex; flex-direction: column; transition: all 0.4s; position: relative; overflow: hidden; }
.sx-svctech-card::after { content: ''; position: absolute; bottom: -60%; right: -60%; width: 100%; height: 100%; background: radial-gradient(circle, rgba(0,131,143,0.1) 0%, transparent 70%); transition: transform 0.6s; pointer-events: none; }
.sx-svctech-card:hover { transform: translateY(-5px); border-color: rgba(0,131,143,0.4); box-shadow: 0 16px 40px rgba(0,131,143,0.12); }
.sx-svctech-card:hover::after { transform: scale(1.6); }
.sx-svctech-card .tag { display: inline-block; font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; color: #00838f; padding: 0.3rem 0.7rem; background: rgba(0,131,143,0.08); border-radius: 6px; margin-bottom: 1rem; align-self: flex-start; }
.sx-svctech-card h3 { font-size: 1.25rem; font-weight: 700; margin: 0 0 0.8rem; color: #1a202c; line-height: 1.3; }
.sx-svctech-card p { color: #555; line-height: 1.65; font-size: 0.95rem; flex-grow: 1; margin-bottom: 1.4rem; }
.sx-svctech-card .more { font-size: 0.9rem; font-weight: 700; color: #00838f; text-decoration: none; align-self: flex-start; transition: transform 0.25s; }
.sx-svctech-card .more:hover { transform: translateX(4px); color: #006d76; }

/* Scroll animations */
@supports (animation-timeline: view()) {
  .sx-instal-card, .sx-svctech-card { animation: sxFadeUp linear both; animation-timeline: view(); animation-range: entry 0% cover 30%; }
}

@media (max-width: 600px) {
  .sx-installations, .sx-svc-tech { padding: 3.5rem 1rem; }
  .sx-instal-card, .sx-svctech-card { padding: 1.8rem 1.4rem; }
  .sx-instal-card .meta { gap: 1rem; }
}
/* sx-installations-tech-end */


/* sx-contrast-fix-100 */
/* Engagements et Commander : MORE CONTRAST + SOLIDE */
.sx-engagements { background: linear-gradient(180deg, #f8fafb 0%, #eef4f6 100%) !important; padding: 5rem 1.5rem; position: relative; overflow: hidden; }
.sx-engagements::before { content: ''; position: absolute; top: -100px; right: -100px; width: 500px; height: 500px; background: radial-gradient(circle, rgba(0,131,143,0.08) 0%, transparent 65%); pointer-events: none; }
.sx-engagements::after { content: ''; position: absolute; bottom: -100px; left: -100px; width: 400px; height: 400px; background: radial-gradient(circle, rgba(77,208,225,0.06) 0%, transparent 65%); pointer-events: none; }
.sx-engagements .container { position: relative; }
.sx-engagements h2 { color: #0a0a0a !important; font-weight: 800; -webkit-text-fill-color: initial !important; background: linear-gradient(120deg, #1a1a1a 30%, #00838f 100%) !important; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent !important; }
.sx-eng-card { background: #fff !important; border: 1.5px solid #e2e8f0 !important; box-shadow: 0 4px 18px rgba(0,131,143,0.06) !important; }
.sx-eng-card:hover { border-color: #00838f !important; box-shadow: 0 18px 44px rgba(0,131,143,0.18) !important; transform: translateY(-6px) !important; }
.sx-eng-card .badge { background: rgba(0,131,143,0.12) !important; color: #006d76 !important; padding: 0.35rem 0.8rem; border-radius: 6px; font-weight: 800 !important; font-size: 0.72rem !important; letter-spacing: 0.14em; }
.sx-eng-card h3 { color: #0a0a0a !important; font-weight: 800 !important; }
.sx-eng-card p { color: #334155 !important; font-weight: 500 !important; }

.sx-commander { background: linear-gradient(135deg, #f4f8fa 0%, #e8f1f3 100%) !important; padding: 5rem 1.5rem; position: relative; overflow: hidden; }
.sx-commander::before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 70%; height: 1px; background: linear-gradient(90deg, transparent, rgba(0,131,143,0.3), transparent); }
.sx-commander .sub { color: #475569 !important; }
.sx-cmd-card { background: #fff !important; border: 1.5px solid #e2e8f0 !important; box-shadow: 0 4px 16px rgba(0,131,143,0.08) !important; }
.sx-cmd-card:hover { border-color: #00838f !important; box-shadow: 0 18px 44px rgba(0,131,143,0.2) !important; }
.sx-cmd-card .num { color: #006d76 !important; font-weight: 800 !important; padding: 0.3rem 0.7rem; background: rgba(0,131,143,0.1); border-radius: 6px; display: inline-block; }
.sx-cmd-card h3 { color: #0a0a0a !important; font-weight: 800 !important; }
.sx-cmd-card p { color: #334155 !important; font-weight: 500 !important; }
.sx-cmd-card .cta { color: #006d76 !important; font-weight: 800 !important; }

/* SCROLL ANIMATION reveal FAST so cards visible quick */
@supports (animation-timeline: view()) {
  .sx-savoir-card, .sx-pq-item, .sx-eng-card, .sx-cmd-card, .sx-svctech-card, .sx-instal-card { animation-range: entry 0% cover 12% !important; }
  .sx-vedettes-grid > *, .sx-cats-grid > * { animation-range: entry 0% cover 15% !important; }
}

/* Pour qui : labels harder contrast */
.sx-pq-item h4 { color: #fff !important; font-weight: 800 !important; }
.sx-pq-item p { color: #cbd5e1 !important; }

/* Section Particuliers (NEW) - bandeau distinctif */
.sx-particuliers { padding: 5rem 1.5rem; background: linear-gradient(120deg, #00838f 0%, #006d76 50%, #1a1a1a 100%); color: #fff; position: relative; overflow: hidden; }
.sx-particuliers::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 80% 50%, rgba(77,208,225,0.18) 0%, transparent 60%), radial-gradient(ellipse at 20% 80%, rgba(0,131,143,0.25) 0%, transparent 50%); pointer-events: none; }
.sx-particuliers .container { max-width: 1280px; margin: 0 auto; position: relative; z-index: 1; }

.sx-part-inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 4rem; align-items: center; }
.sx-part-left .sx-part-tag { display: inline-block; padding: 0.45rem 0.95rem; background: rgba(255,255,255,0.15); backdrop-filter: blur(10px); border-radius: 8px; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.18em; margin-bottom: 1.2rem; border: 1px solid rgba(255,255,255,0.2); }
.sx-part-left h2 { font-size: clamp(2.2rem, 4.5vw, 3.4rem); font-weight: 800; line-height: 1.1; margin: 0 0 1.4rem; color: #fff; text-wrap: balance; letter-spacing: -0.02em; }
.sx-part-lead { color: rgba(255,255,255,0.92); font-size: 1.1rem; line-height: 1.65; text-wrap: pretty; }

.sx-part-right { display: flex; flex-direction: column; gap: 1rem; }
.sx-part-row { display: grid; grid-template-columns: 44px 1fr; gap: 1.1rem; align-items: start; padding: 1.4rem 1.5rem; background: rgba(255,255,255,0.06); backdrop-filter: blur(10px); border-radius: 14px; border: 1px solid rgba(255,255,255,0.1); transition: all 0.3s; }
.sx-part-row:hover { background: rgba(255,255,255,0.1); border-color: rgba(77,208,225,0.4); transform: translateX(4px); }
.sx-part-ic { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(77,208,225,0.25); color: #4dd0e1; font-size: 1.4rem; font-weight: 800; flex-shrink: 0; }
.sx-part-ic.no { background: rgba(255,107,107,0.2); color: #ff8a8a; }
.sx-part-col h4 { font-size: 1.15rem; font-weight: 800; margin: 0 0 0.4rem; color: #fff; line-height: 1.3; }
.sx-part-col p { color: rgba(255,255,255,0.85); font-size: 0.95rem; line-height: 1.55; margin: 0; }

@media (max-width: 900px) {
  .sx-part-inner { grid-template-columns: 1fr; gap: 2.4rem; }
}
@media (max-width: 600px) {
  .sx-particuliers { padding: 3.5rem 1rem; }
  .sx-part-row { padding: 1.1rem 1.2rem; gap: 0.85rem; grid-template-columns: 38px 1fr; }
  .sx-part-ic { width: 38px; height: 38px; font-size: 1.2rem; }
}
/* sx-contrast-fix-100-end */


/* sx-hero-fullpage-100 */
/* HERO PLEINE PAGE - entrepot bien visible mobile + desktop */
#brxe-olywij { min-height: 100vh !important; min-height: 100svh !important; display: flex !important; flex-direction: column !important; justify-content: center !important; padding: 8rem 1.5rem 5rem !important; box-sizing: border-box !important; position: relative !important; isolation: isolate !important; }

#brxe-ejehwy { width: 100%; max-width: 1280px; margin: 0 auto; position: relative; z-index: 2; }

/* Image entrepot ::after BACKGROUND DU HERO ENTIER (pas juste 560px) */
#brxe-gjalcd::after { content: '' !important; position: absolute !important; inset: 0 !important; top: -100vh !important; left: -50vw !important; right: -50vw !important; bottom: -2rem !important; width: 200vw !important; height: auto !important; background-image: linear-gradient(180deg, rgba(15,18,20,0.5) 0%, rgba(15,18,20,0.4) 30%, rgba(15,18,20,0.55) 70%, rgba(15,18,20,0.85) 100%), url('/wp-content/uploads/2025/09/saniexpresshero.webp') !important; background-size: cover !important; background-position: center 40% !important; background-repeat: no-repeat !important; z-index: -1 !important; pointer-events: none !important; }

/* Better approach : SET BG ON HERO SECTION ITSELF */
#brxe-olywij { background-image: linear-gradient(180deg, rgba(15,18,20,0.55) 0%, rgba(15,18,20,0.45) 35%, rgba(15,18,20,0.65) 75%, rgba(15,18,20,0.92) 100%), url('/wp-content/uploads/2025/09/saniexpresshero.webp') !important; background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; background-attachment: scroll !important; }

/* Reset old ::after to avoid conflict */
#brxe-gjalcd::after { display: none !important; }

/* Hero text full white, large + impact */
#brxe-olywij h1, #brxe-rscbkw, #brxe-ejehwy h1 { color: #fff !important; -webkit-text-fill-color: initial !important; background: none !important; -webkit-background-clip: initial !important; font-size: clamp(2.4rem, 5.5vw, 4.6rem) !important; font-weight: 800 !important; line-height: 1.05 !important; letter-spacing: -0.025em !important; text-shadow: 0 2px 24px rgba(0,0,0,0.4) !important; max-width: 18ch !important; text-wrap: balance !important; margin: 0 auto !important; text-align: center !important; }

/* Hero subtitle (the 'Produits + Services...' line) */
#brxe-olywij p, #brxe-ejehwy p, .sx-hero-bar p, #brxe-bdkdhk { color: rgba(255,255,255,0.95) !important; font-size: clamp(0.92rem, 1.4vw, 1.05rem) !important; font-weight: 500 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; text-align: center !important; margin: 1.4rem auto 0 !important; max-width: 760px !important; }

/* Hero search bar - elite glass */
.sx-hero-search, .sx-search-wrap { max-width: 720px !important; margin: 2.4rem auto 1rem !important; }
.sx-hero-search-input, .sx-search-form input, .sx-search-form button { font-size: 1rem !important; }

/* Hero pill 'FERME OUVRE JEUDI A 8H' - position relative dans le flow */
.sx-hero-pill, .sx-hero-status { display: inline-flex !important; margin: 1.5rem auto 0 !important; }

/* MOBILE — entrepot center, image visible bien */
@media (max-width: 768px) {
  #brxe-olywij { min-height: 100vh !important; padding: 6rem 1rem 3rem !important; background-position: center 40% !important; }
  #brxe-olywij h1 { font-size: clamp(1.9rem, 7vw, 2.6rem) !important; max-width: 100% !important; }
  #brxe-olywij p { font-size: 0.78rem !important; letter-spacing: 0.14em !important; }
}

/* Petit ecran ultra mobile */
@media (max-width: 480px) {
  #brxe-olywij { padding: 5rem 0.75rem 2.5rem !important; min-height: 100vh !important; background-position: center 45% !important; }
  #brxe-olywij h1 { font-size: clamp(1.6rem, 8vw, 2.2rem) !important; line-height: 1.1 !important; }
}

/* Decorative scroll-down hint at hero bottom */
#brxe-olywij::after { content: ''; position: absolute; bottom: 1.8rem; left: 50%; transform: translateX(-50%); width: 24px; height: 38px; border: 2px solid rgba(255,255,255,0.5); border-radius: 14px; pointer-events: none; }
#brxe-olywij::before { content: ''; position: absolute; bottom: 2.5rem; left: 50%; transform: translateX(-50%); width: 4px; height: 8px; background: rgba(255,255,255,0.7); border-radius: 2px; pointer-events: none; animation: sxScrollHint 2s ease-in-out infinite; z-index: 3; }
@keyframes sxScrollHint { 0%,100% { transform: translateX(-50%) translateY(0); opacity: 0.7; } 50% { transform: translateX(-50%) translateY(8px); opacity: 0.3; } }
@media (max-width: 600px) { #brxe-olywij::after, #brxe-olywij::before { display: none; } }
/* sx-hero-fullpage-100-end */



/* sx-audit-fixes-100 */
/* ============================================
   AUDIT VISUEL ELITE — Fix logo + text overlap + entrepot + mobile
   ============================================ */

/* LOGO HEADER — grossir (Jeremy : trop petit) */
#brx-header .brxe-image img,
#brx-header [class*="logo"] img,
#brx-header img[alt*="SANI"],
#brx-header img[alt*="logo"],
#brx-header img[src*="logo-blanc"],
#brx-header img[src*="logo-sani"] {
  max-width: none !important;
  width: auto !important;
  height: 56px !important;
  min-height: 56px !important;
  object-fit: contain !important;
}
@media (min-width: 769px) {
  #brx-header .brxe-image img,
  #brx-header img[src*="logo"] { height: 68px !important; min-height: 68px !important; }
}
@media (min-width: 1200px) {
  #brx-header .brxe-image img,
  #brx-header img[src*="logo"] { height: 76px !important; min-height: 76px !important; }
}
@media (max-width: 480px) {
  #brx-header .brxe-image img,
  #brx-header img[src*="logo"] { height: 48px !important; min-height: 48px !important; }
}

/* TEXT OVERLAP FIX — bien rare mais possible : sticky + transform */
#brx-header > section { padding: 0.7rem 1.5rem !important; }
@media (max-width: 768px) {
  #brx-header > section { padding: 0.5rem 0.85rem !important; }
}

/* HERO ENTREPOT VISIBLE — Force inline bg via CSS aussi (en plus du JS) */
#brxe-olywij,
body.home #brxe-olywij {
  min-height: 100vh !important;
  min-height: 100svh !important;
  background-image:
    linear-gradient(180deg, rgba(15,18,20,0.32) 0%, rgba(15,18,20,0.22) 30%, rgba(15,18,20,0.42) 70%, rgba(15,18,20,0.78) 100%),
    url('/wp-content/uploads/2025/09/entrepot.webp') !important;
  background-size: cover !important;
  background-position: center 40% !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: 7rem 1.5rem 5rem !important;
  isolation: isolate !important;
}
@media (max-width: 768px) {
  #brxe-olywij,
  body.home #brxe-olywij {
    background-position: center 45% !important;
    padding: 6rem 1rem 3rem !important;
  }
}
@media (max-width: 480px) {
  #brxe-olywij,
  body.home #brxe-olywij {
    background-position: center 50% !important;
    padding: 5rem 0.85rem 2.5rem !important;
  }
}

/* TEXT BODY (paragraphs, descriptions) — augmenter contraste */
.sx-engagements .sx-eng-card p,
.sx-commander .sx-cmd-card p,
.sx-savoir-faire .sx-savoir-card p,
.sx-svc-tech .sx-svctech-card p,
.sx-installations .sx-instal-card p {
  color: #2d3748 !important;
  line-height: 1.7 !important;
  font-weight: 500 !important;
}
.sx-engagements .sx-eng-card h3,
.sx-commander .sx-cmd-card h3,
.sx-savoir-faire .sx-savoir-card h3,
.sx-svc-tech .sx-svctech-card h3,
.sx-installations .sx-instal-card h3 {
  color: #0a0a0a !important;
  font-weight: 800 !important;
}

/* FAQ contraste body texts */
.sx-faq details p,
.sx-faq summary { color: #1a202c !important; }
.sx-faq details p { color: #334155 !important; font-weight: 500 !important; line-height: 1.7 !important; }

/* SECTIONS sub-titles plus visibles */
.sx-engagements .sub,
.sx-commander .sub,
.sx-savoir-faire .sub,
.sx-svc-tech .sub,
.sx-installations .sub,
.sx-cats .sub,
.sx-vedettes .sub {
  color: #334155 !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
}

/* MOBILE MENU offcanvas - more visibility */
.brxe-offcanvas .brx-offcanvas-inn ul.menu li a,
.brxe-offcanvas ul.menu > li > a {
  color: #2d3748 !important;
  font-weight: 600 !important;
  font-size: 1.02rem !important;
  padding: 1rem 1.4rem !important;
  border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}

/* Hero text contrast amelioration */
#brxe-olywij h1,
body.home #brxe-olywij h1 {
  color: #fff !important;
  text-shadow: 0 4px 32px rgba(0,0,0,0.6) !important;
  font-weight: 800 !important;
  font-size: clamp(2.4rem, 5.5vw, 4.8rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.025em !important;
  max-width: 20ch !important;
  text-wrap: balance !important;
  margin: 0 auto !important;
  text-align: center !important;
}

#brxe-olywij p,
body.home #brxe-olywij p {
  color: rgba(255,255,255,0.96) !important;
  text-shadow: 0 2px 16px rgba(0,0,0,0.5) !important;
}

/* CART + ACCOUNT icons header - alignment + size */
#brx-header .brxe-svg svg,
#brx-header .brxe-icon svg {
  width: 26px !important;
  height: 26px !important;
}

/* ANCHOR SCROLL - margins for sticky header */
section[id^="brxe-"], div[id^="brxe-"] { scroll-margin-top: 100px; }

/* Pas de horizontal scroll surprise */
html, body { overflow-x: clip !important; max-width: 100vw !important; }

/* sx-audit-fixes-100-end */



/* sx-overlap-fix-100 */
/* ============================================
   CRITICAL FIX — Text overlap mobile + desktop
   Jeremy : "ECRITURE PAR DESSU DAUTRE" + "SUR DESKTOP AUSSI"
   ============================================ */

/* Reset stacking context for all sections */
section[class*="sx-"], div[class*="sx-"] {
  position: relative !important;
  isolation: auto !important;
}

/* All injected sections : block layout, no overflow into next */
.sx-cats, .sx-vedettes, .sx-installations, .sx-svc-tech,
.sx-savoir-faire, .sx-pourqui, .sx-engagements, .sx-commander,
.sx-faq, .sx-particuliers {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 1 !important;
  margin: 0 !important;
  contain: layout !important;
  clear: both !important;
}

/* Containers : strict width + no overflow */
.sx-cats .container, .sx-vedettes .container, .sx-installations .container,
.sx-svc-tech .container, .sx-savoir-faire .container, .sx-pourqui .container,
.sx-engagements .container, .sx-commander .container, .sx-faq .container,
.sx-particuliers .container {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Remove any rogue absolute children that bleed into next section */
.sx-engagements::before, .sx-engagements::after,
.sx-pourqui::before, .sx-pourqui::after,
.sx-particuliers::before, .sx-particuliers::after,
.sx-installations::before, .sx-installations::after,
.sx-testimonials::before, .sx-testimonials::after,
.sx-cats::before, .sx-cats::after,
.sx-svc-tech::before, .sx-svc-tech::after {
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Particuliers : flex 1fr 1.2fr breaks at 900 - now stack at 768 */
@media (max-width: 900px) {
  .sx-part-inner {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }
}

/* MOBILE OVERLAP FIX (≤768px) */
@media (max-width: 768px) {
  /* Sections : padding consistent + clear */
  section[class*="sx-"], div[class*="sx-"] {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    clear: both !important;
  }

  /* Inner containers full width */
  .sx-cats .container, .sx-vedettes .container, .sx-installations .container,
  .sx-svc-tech .container, .sx-savoir-faire .container, .sx-pourqui .container,
  .sx-engagements .container, .sx-commander .container, .sx-faq .container,
  .sx-particuliers .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* All grids : single column on mobile (clean, no overlap) */
  .sx-cats-grid, .sx-vedettes-grid, .sx-instal-grid,
  .sx-svctech-grid, .sx-savoir-grid, .sx-pq-grid,
  .sx-eng-grid, .sx-cmd-grid {
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
  }

  /* Categories : 2 cols on phone (visually denser) */
  .sx-cats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.75rem !important;
  }

  /* Cards : full width contained */
  .sx-savoir-card, .sx-pq-item, .sx-eng-card, .sx-cmd-card,
  .sx-svctech-card, .sx-instal-card, .sx-ved-card, .sx-cat-card,
  .sx-test-card {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* H2 mobile : smaller */
  .sx-cats h2, .sx-vedettes h2, .sx-installations h2,
  .sx-svc-tech h2, .sx-savoir-faire h2, .sx-pourqui h2,
  .sx-engagements h2, .sx-commander h2, .sx-faq h2,
  .sx-particuliers h2 {
    font-size: clamp(1.7rem, 6vw, 2.2rem) !important;
    line-height: 1.15 !important;
    margin-bottom: 0.7rem !important;
  }

  /* Sub */
  .sx-cats .sub, .sx-vedettes .sub, .sx-installations .sub,
  .sx-svc-tech .sub, .sx-savoir-faire .sub, .sx-pourqui .sub,
  .sx-engagements .sub, .sx-commander .sub, .sx-faq .sub,
  .sx-particuliers .sub {
    font-size: 0.96rem !important;
    margin-bottom: 1.6rem !important;
  }

  /* Hero specifically */
  #brxe-olywij {
    padding: 5rem 1rem 3rem !important;
  }
  #brxe-olywij h1 {
    font-size: clamp(1.7rem, 7vw, 2.4rem) !important;
    line-height: 1.1 !important;
    max-width: 100% !important;
    padding: 0 !important;
  }

  /* Particuliers : icon + col single column */
  .sx-part-row {
    grid-template-columns: 36px 1fr !important;
    gap: 0.85rem !important;
    padding: 1rem 1rem !important;
  }
  .sx-part-ic { width: 36px !important; height: 36px !important; font-size: 1.1rem !important; }
  .sx-part-col h4 { font-size: 1.02rem !important; }
  .sx-part-col p { font-size: 0.88rem !important; }
}

/* DESKTOP overlap : engagements card too long pile */
@media (min-width: 769px) {
  /* Force grid items same height (avoid pile-on) */
  .sx-eng-grid, .sx-cmd-grid, .sx-savoir-grid, .sx-svctech-grid {
    align-items: stretch !important;
  }
  .sx-eng-card, .sx-cmd-card, .sx-savoir-card, .sx-svctech-card {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
  }

  /* Ensure no rogue floats */
  body { overflow-x: hidden !important; }
}

/* SECTIONS gap consistent */
.sx-cats + .sx-vedettes,
.sx-vedettes + .sx-installations,
.sx-installations + .sx-svc-tech,
.sx-svc-tech + .sx-savoir-faire,
.sx-savoir-faire + .sx-pourqui,
.sx-pourqui + .sx-particuliers,
.sx-particuliers + .sx-engagements,
.sx-engagements + .sx-commander,
.sx-commander + .sx-faq {
  margin-top: 0 !important;
  border-top: 0 !important;
}

/* Footer separator after FAQ */
.sx-faq + footer, .sx-faq + .brxe-footer { margin-top: 0 !important; }

/* HERO entrepot : also CSS fallback (in case JS fails) */
body.home #brxe-olywij {
  background-image:
    linear-gradient(180deg, rgba(15,18,20,0.32) 0%, rgba(15,18,20,0.22) 30%, rgba(15,18,20,0.42) 70%, rgba(15,18,20,0.78) 100%),
    url('/wp-content/uploads/2025/09/entrepot.webp') !important;
  background-size: cover !important;
  background-position: center 40% !important;
  background-repeat: no-repeat !important;
}

/* Mobile : entrepot positioned for visibility */
@media (max-width: 768px) {
  body.home #brxe-olywij {
    background-position: center 50% !important;
  }
}

/* Pour qui mobile : grid 1 col items vertical */
@media (max-width: 600px) {
  .sx-pq-grid {
    grid-template-columns: 1fr !important;
    gap: 0.7rem !important;
  }
  .sx-pq-item {
    padding: 1.1rem 1.2rem !important;
  }

  .sx-instal-grid {
    grid-template-columns: 1fr !important;
  }
  .sx-instal-card {
    padding: 1.6rem 1.3rem !important;
  }
  .sx-instal-card .meta {
    flex-direction: column !important;
    gap: 0.85rem !important;
  }

  .sx-svctech-grid {
    grid-template-columns: 1fr !important;
  }

  .sx-eng-grid, .sx-cmd-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Header consistency mobile */
@media (max-width: 768px) {
  #brx-header {
    padding: 0.5rem 0.85rem !important;
  }
  #brx-header > section {
    padding: 0 !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
  }
  /* Compact ASP search header on mobile */
  #brx-header .asp_main_container {
    min-width: 0 !important;
    max-width: 220px !important;
    border-radius: 10px !important;
  }
  #brx-header .probox input.orig {
    font-size: 0.85rem !important;
    padding: 0.4rem 0.7rem !important;
  }
  #brx-header .promagnifier {
    width: 26px !important;
    height: 26px !important;
    margin: 3px !important;
  }
  #brx-header .promagnifier svg {
    width: 12px !important;
    height: 12px !important;
  }
}

/* Logo mobile size */
@media (max-width: 600px) {
  #brx-header img[src*="logo"] {
    height: 44px !important;
    min-height: 44px !important;
  }
}

/* sx-overlap-fix-100-end */



/* sx-kill-doubled-text-100 */
/* ============================================
   FIX CRITIQUE — Retirer les ::after content: qui doublent le texte
   Cause : ancien CSS hack avait fait font-size:0 + ::after content="..."
   pour overrider le texte WP. Maintenant ils s'affichent SUPER-IMPOSES.
   ============================================ */

/* RESET font-size: 0 — restaure le texte original */
.sx-why-grid .sx-feat p,
.sx-why-grid .sx-feat:nth-child(1) p,
.sx-why-grid .sx-feat:nth-child(2) p,
.sx-why-grid .sx-feat:nth-child(3) p,
.sx-why-grid .sx-feat:nth-child(4) p,
.sx-trust .sx-stat .label,
.sx-cat-grid .sx-cat .label,
.sx-services-grid .sx-cat .label {
  font-size: clamp(0.88rem, 1vw, 1rem) !important;
  line-height: 1.6 !important;
  letter-spacing: -0.005em !important;
  color: rgba(255,255,255,0.85) !important;
}

/* HIDE all pseudo-element content overrides on these sections */
.sx-why-grid .sx-feat p::after,
.sx-why-grid .sx-feat p::before,
.sx-why-grid .sx-feat:nth-child(1) p::after,
.sx-why-grid .sx-feat:nth-child(2) p::after,
.sx-why-grid .sx-feat:nth-child(3) p::after,
.sx-why-grid .sx-feat:nth-child(4) p::after,
.sx-trust::after,
.sx-trust::before,
.sx-trust .sx-container::before,
.sx-trust .sx-container::after,
.sx-trust .sx-stat .label::after,
.sx-trust .sx-stat .label::before,
.sx-cat-grid .sx-cat .label::after,
.sx-services-grid .sx-cat .label::after,
.sx-services-grid .sx-cat::after,
.sx-cat-grid .sx-cat::after {
  content: none !important;
  display: none !important;
}

/* Pour le sx-trust : faire un sub-title via class real */
.sx-trust { padding-top: 5rem !important; }
.sx-trust .sx-container { position: relative; }

/* Couleur contrast améliorée sur sx-why (dark bg) */
.sx-why { background: #0f1115 !important; color: #fff !important; }
.sx-why h2 { color: #fff !important; }
.sx-why .sx-sub { color: rgba(255,255,255,0.85) !important; }
.sx-why .sx-feat h3 { color: #fff !important; font-weight: 700 !important; font-size: 1.15rem !important; margin-bottom: 0.6rem !important; }
.sx-why .sx-feat p {
  color: rgba(255,255,255,0.78) !important;
  font-size: clamp(0.88rem, 1vw, 1rem) !important;
  line-height: 1.65 !important;
  font-weight: 400 !important;
}
.sx-why .sx-feat .icon, .sx-why .sx-feat svg { color: #4dd0e1 !important; stroke: #4dd0e1 !important; }

/* Section "Magasinez par catégorie" - update SKU count */
.sx-cat .sx-sub::after {
  content: none !important;
  display: none !important;
}
.sx-cat .sx-sub {
  font-size: clamp(0.95rem, 1.1vw, 1.05rem) !important;
  color: rgba(29,35,39,0.7) !important;
  margin-bottom: 2rem !important;
}

/* Section "Pourquoi Sani Express" : sub clean */
.sx-why .sx-sub::after, .sx-why .sx-sub::before {
  content: none !important;
  display: none !important;
}
.sx-why .sx-sub {
  font-size: clamp(0.95rem, 1.2vw, 1.1rem) !important;
  margin-bottom: 2rem !important;
}

/* Spacing entre sections (Jeremy : "trop coller") */
.sx-section { padding: clamp(3.5rem, 6vw, 5rem) 1.5rem !important; }
.sx-cat + .sx-trust, .sx-trust + .sx-why, .sx-why + .sx-services,
.sx-services + .sx-brands, .sx-brands + .sx-cta-band,
.sx-cta-band + .sx-cats, .sx-cats + .sx-vedettes,
.sx-vedettes + .sx-installations, .sx-installations + .sx-svc-tech,
.sx-svc-tech + .sx-savoir-faire, .sx-savoir-faire + .sx-pourqui,
.sx-pourqui + .sx-particuliers, .sx-particuliers + .sx-engagements,
.sx-engagements + .sx-commander, .sx-commander + .sx-faq {
  margin-top: 0 !important;
  border-top: 0 !important;
}

/* CONTRAST FIX critical */
.sx-trust .sx-stat .num { color: #1d2327 !important; font-weight: 800 !important; }
.sx-trust .sx-stat .label { color: rgba(29,35,39,0.7) !important; font-weight: 500 !important; font-size: 0.85rem !important; letter-spacing: 0.05em !important; }

/* Hero contraste : forcer */
#brxe-olywij h1 {
  color: #fff !important;
  text-shadow: 0 4px 28px rgba(0,0,0,0.5), 0 2px 12px rgba(0,0,0,0.4) !important;
}

/* sx-cta-band contrast */
.sx-cta-band { background: #0a0e15 !important; color: #fff !important; }
.sx-cta-band h2, .sx-cta-band h3 { color: #fff !important; }
.sx-cta-band p { color: rgba(255,255,255,0.85) !important; }

/* SKU count update : 2000 → 4000 (Jeremy audit prompt note) */
/* Cette règle est purement visuelle pour les sections qui mentionnent 2000+ */
.sx-cat .sx-sub:has-content("4 000+"),
.sx-cat .sx-sub:has-content("2000+") { display: block; }
/* Note : pas de :has-content native, fix sera fait via JS Bricks Custom Code */

/* Mobile padding plus généreux pour éviter "trop coller" */
@media (max-width: 768px) {
  .sx-section, section[class*="sx-"] {
    padding: 2.8rem 1rem !important;
  }
  .sx-section + .sx-section { margin-top: 0 !important; }
}

/* Ensure no absolute pseudo bleeds into adjacent sections */
.sx-why::before, .sx-why::after,
.sx-services::before, .sx-services::after,
.sx-cta-band::before, .sx-cta-band::after,
.sx-brands::before, .sx-brands::after {
  z-index: 0 !important;
  pointer-events: none !important;
}

/* sx-kill-doubled-text-100-end */



/* sx-mm-v3-style */
/* ============================================
   Menu Mobile PARFAIT v3 — categories + services + tech + apropos + B2B + contact
   ============================================ */
.sx-mm-v3 {
  --sx-mm-bg: #fff;
  --sx-mm-fg: #1a202c;
  --sx-mm-muted: #4a5568;
  --sx-mm-teal: #00838f;
  --sx-mm-teal-dark: #006d76;
  --sx-mm-accent: #4dd0e1;
  --sx-mm-border: rgba(0,0,0,0.06);
  background: var(--sx-mm-bg);
  font-family: inherit;
  padding: 0 0 2rem;
  display: block;
  width: 100%;
  box-sizing: border-box;
}

/* CTA bar (tel + soumission) */
.sx-mm-cta {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem;
  padding: 0.85rem 1rem; background: linear-gradient(135deg, #fafafa 0%, #f4f8fa 100%);
  border-bottom: 1px solid var(--sx-mm-border); position: sticky; top: 0; z-index: 5;
}
.sx-mm-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.45rem;
  padding: 0.85rem 0.9rem; border-radius: 12px; font-size: 0.92rem; font-weight: 700;
  text-decoration: none; transition: all 0.25s; line-height: 1; letter-spacing: 0.01em;
}
.sx-mm-btn .ic { font-size: 1.1em; opacity: 0.95; }
.sx-mm-btn-primary { background: var(--sx-mm-teal); color: #fff; box-shadow: 0 4px 12px rgba(0,131,143,0.25); }
.sx-mm-btn-primary:hover, .sx-mm-btn-primary:active { background: var(--sx-mm-teal-dark); transform: translateY(-1px); }
.sx-mm-btn-outline { background: transparent; color: var(--sx-mm-teal); border: 1.5px solid rgba(0,131,143,0.4); }
.sx-mm-btn-outline:hover, .sx-mm-btn-outline:active { background: rgba(0,131,143,0.08); border-color: var(--sx-mm-teal); }

/* ALL products link */
.sx-mm-all {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.2rem; margin: 0.85rem 1rem; background: linear-gradient(135deg, var(--sx-mm-teal) 0%, var(--sx-mm-accent) 100%);
  color: #fff; border-radius: 14px; text-decoration: none; font-weight: 700; font-size: 0.96rem;
  box-shadow: 0 6px 18px rgba(0,131,143,0.25);
}
.sx-mm-all .ar { font-size: 1.2em; transition: transform 0.25s; }
.sx-mm-all:hover .ar, .sx-mm-all:active .ar { transform: translateX(4px); }

/* Sections */
.sx-mm-section { margin: 0.5rem 0; padding: 0 1rem; }
.sx-mm-title {
  font-size: 0.7rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--sx-mm-teal); margin: 1.4rem 0 0.7rem; padding: 0; line-height: 1; opacity: 0.95;
}

/* Lists */
.sx-mm-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1px; }
.sx-mm-list li { display: block; }
.sx-mm-list li a {
  display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 0.6rem;
  padding: 0.95rem 0.9rem; background: #f8fafb; border-radius: 10px; color: var(--sx-mm-fg);
  font-weight: 600; font-size: 0.96rem; text-decoration: none; transition: all 0.2s;
  border: 1px solid transparent;
}
.sx-mm-list li a:hover, .sx-mm-list li a:active {
  background: rgba(0,131,143,0.06); color: var(--sx-mm-teal); border-color: rgba(0,131,143,0.18);
}
.sx-mm-link-text { line-height: 1.3; }
.sx-mm-count {
  font-size: 0.72rem; color: var(--sx-mm-muted); font-weight: 600; padding: 0.18rem 0.5rem;
  background: rgba(0,0,0,0.04); border-radius: 6px; letter-spacing: 0.02em;
}
.sx-mm-arrow { color: var(--sx-mm-muted); font-size: 1em; opacity: 0.6; transition: transform 0.2s, opacity 0.2s; }
.sx-mm-list li a:hover .sx-mm-arrow, .sx-mm-list li a:active .sx-mm-arrow { transform: translateX(3px); opacity: 1; color: var(--sx-mm-teal); }

/* Contact bloc */
.sx-mm-contact {
  margin: 1.6rem 1rem 0; padding: 1.4rem 1.3rem;
  background: linear-gradient(135deg, #0f1115 0%, #1a2030 100%); color: #fff; border-radius: 16px;
  position: relative; overflow: hidden;
}
.sx-mm-contact::before {
  content: ''; position: absolute; top: -50%; right: -50%; width: 100%; height: 100%;
  background: radial-gradient(circle, rgba(0,131,143,0.2) 0%, transparent 70%); pointer-events: none;
}
.sx-mm-contact .sx-mm-title { color: var(--sx-mm-accent); margin: 0 0 0.85rem; }
.sx-mm-addr { margin-bottom: 1rem; position: relative; z-index: 1; }
.sx-mm-addr-line { font-size: 0.92rem; color: rgba(255,255,255,0.92); line-height: 1.4; font-weight: 500; }
.sx-mm-addr-sub { font-size: 0.84rem; color: rgba(255,255,255,0.65); margin-top: 0.2rem; }
.sx-mm-tels { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 0.85rem; position: relative; z-index: 1; }
.sx-mm-tel {
  display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.6rem 0.9rem;
  background: rgba(255,255,255,0.08); border-radius: 8px; color: #fff; font-weight: 700;
  text-decoration: none; font-size: 0.92rem; backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.1); transition: all 0.25s;
}
.sx-mm-tel:hover, .sx-mm-tel:active { background: var(--sx-mm-teal); border-color: var(--sx-mm-teal); transform: translateY(-1px); }
.sx-mm-tel .ic { opacity: 0.85; }
.sx-mm-hours { font-size: 0.82rem; color: rgba(255,255,255,0.7); line-height: 1.5; padding-top: 0.85rem; border-top: 1px solid rgba(255,255,255,0.12); position: relative; z-index: 1; }

/* Footer */
.sx-mm-footer {
  margin: 1.4rem 1rem 0; padding: 1rem; text-align: center;
  font-size: 0.78rem; color: var(--sx-mm-muted); letter-spacing: 0.04em;
  border-top: 1px solid var(--sx-mm-border);
}
.sx-mm-footer p { margin: 0; }

/* Hide old offcanvas content if present */
.brxe-offcanvas .brxe-nav-nested,
.brxe-offcanvas nav.brxe-nav,
.brxe-offcanvas .brx-nav-nested-items {
  display: none !important;
}

/* Offcanvas container itself */
.brxe-offcanvas .brx-offcanvas-inn,
.brxe-offcanvas .offcanvas-content {
  background: #fff !important;
  padding: 0 !important;
  overflow-y: auto !important;
  height: 100vh !important;
  max-height: 100vh !important;
}

/* Animations */
.sx-mm-v3 .sx-mm-section, .sx-mm-v3 .sx-mm-contact, .sx-mm-v3 .sx-mm-cta, .sx-mm-v3 .sx-mm-all {
  opacity: 0; animation: sxMmFade 0.4s ease forwards;
}
.sx-mm-v3 .sx-mm-cta { animation-delay: 0s; }
.sx-mm-v3 .sx-mm-all { animation-delay: 0.05s; }
.sx-mm-v3 .sx-mm-section:nth-child(3) { animation-delay: 0.1s; }
.sx-mm-v3 .sx-mm-section:nth-child(4) { animation-delay: 0.15s; }
.sx-mm-v3 .sx-mm-section:nth-child(5) { animation-delay: 0.2s; }
.sx-mm-v3 .sx-mm-section:nth-child(6) { animation-delay: 0.25s; }
.sx-mm-v3 .sx-mm-section:nth-child(7) { animation-delay: 0.3s; }
.sx-mm-v3 .sx-mm-contact { animation-delay: 0.35s; }
.sx-mm-v3 .sx-mm-footer { animation-delay: 0.4s; }
@keyframes sxMmFade { to { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  .sx-mm-v3 .sx-mm-section, .sx-mm-v3 .sx-mm-contact, .sx-mm-v3 .sx-mm-cta, .sx-mm-v3 .sx-mm-all { animation: none; opacity: 1; }
}

/* sx-mm-v3-style-end */



/* sx-stats-fix-100 */
/* Fix centering stats sx-trust */
.sx-trust { padding: clamp(3rem, 5vw, 4.5rem) 1rem !important; background: linear-gradient(180deg, #fff 0%, #fafafa 100%) !important; }
.sx-trust .sx-container { max-width: 1100px !important; margin: 0 auto !important; }
.sx-trust-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
  align-items: stretch !important;
}
.sx-trust .sx-stat {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 1.4rem 1rem !important;
  background: #fff !important;
  border-radius: 14px !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  box-shadow: 0 4px 14px rgba(0,131,143,0.04) !important;
  transition: all 0.3s !important;
  min-height: 130px !important;
}
.sx-trust .sx-stat:hover { border-color: rgba(0,131,143,0.3) !important; box-shadow: 0 12px 30px rgba(0,131,143,0.12) !important; transform: translateY(-3px) !important; }

.sx-trust .sx-stat .num {
  font-size: clamp(1.8rem, 4.2vw, 2.6rem) !important;
  font-weight: 800 !important;
  background: linear-gradient(120deg, #1d2327 30%, #00838f 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  letter-spacing: -0.02em !important;
  line-height: 1 !important;
  margin-bottom: 0.4rem !important;
  display: block !important;
  text-align: center !important;
  width: 100% !important;
}

.sx-trust .sx-stat .lbl {
  font-size: clamp(0.78rem, 1vw, 0.86rem) !important;
  color: rgba(29,35,39,0.7) !important;
  line-height: 1.4 !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  text-align: center !important;
  width: 100% !important;
  display: block !important;
}

/* Mobile : 2 colonnes */
@media (max-width: 768px) {
  .sx-trust-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.75rem !important;
  }
  .sx-trust .sx-stat {
    padding: 1.1rem 0.6rem !important;
    min-height: 110px !important;
  }
  .sx-trust .sx-stat .num { font-size: clamp(1.6rem, 8vw, 2rem) !important; }
  .sx-trust .sx-stat .lbl { font-size: 0.78rem !important; }
}

/* Ultra mobile : keep 2 cols mais compact */
@media (max-width: 480px) {
  .sx-trust { padding: 2.5rem 0.85rem !important; }
  .sx-trust-grid { gap: 0.6rem !important; }
}
/* sx-stats-fix-100-end */



/* sx-mm-v3-final-fix */
/* ============================================
   Menu Mobile v3 — fix width + scroll + double display
   ============================================ */

/* OFFCANVAS container : full width + scroll */
.brxe-offcanvas {
  width: 100% !important;
  max-width: 100% !important;
}
.brxe-offcanvas .brx-offcanvas-inn,
.brxe-offcanvas .offcanvas-content,
.brxe-offcanvas .offcanvas-inner,
.brxe-offcanvas > div:first-child {
  width: 100% !important;
  max-width: 100% !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100vh !important;
  max-height: 100dvh !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  box-sizing: border-box !important;
}

/* sx-mm-v3 wrapper full width */
.sx-mm-v3 {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  display: block !important;
  padding-bottom: 4rem !important;
}

/* HIDE the original Bricks nav menu COMPLETELY (double display fix) */
.brxe-offcanvas .brxe-nav-nested,
.brxe-offcanvas nav.brxe-nav,
.brxe-offcanvas .brx-nav-nested-items,
.brxe-offcanvas .brxe-shortcode:not(.sx-mm-v3 *),
.brxe-offcanvas > div > .brxe-nav-nested,
.brxe-offcanvas > div > nav,
.brxe-offcanvas .bricks-nav-menu,
.brxe-offcanvas ul.menu:not(.sx-mm-list),
.brxe-offcanvas .sx-offcanvas-deep,
.brxe-offcanvas .brx-offcanvas-inn > *:not([data-sx-mm-v3]):not(.brx-offcanvas-toggle):not([class*="close"]):not(svg) {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* But keep the close button visible */
.brxe-offcanvas .brx-offcanvas-toggle,
.brxe-offcanvas [class*="close"],
.brxe-offcanvas .brxe-offcanvas-toggle {
  display: flex !important;
  visibility: visible !important;
  height: auto !important;
  max-height: none !important;
}

/* Sections content boxes don't overflow */
.sx-mm-section,
.sx-mm-cta,
.sx-mm-all,
.sx-mm-contact,
.sx-mm-footer {
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

.sx-mm-list { width: 100% !important; box-sizing: border-box !important; }
.sx-mm-list li { width: 100% !important; box-sizing: border-box !important; }
.sx-mm-list li a {
  width: 100% !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
}

/* Mobile breakpoint specific */
@media (max-width: 768px) {
  .brxe-offcanvas {
    width: 100vw !important;
    max-width: 100vw !important;
  }
  .sx-mm-v3 {
    padding: 0 0 4rem !important;
  }
  .sx-mm-section { padding: 0 0.85rem !important; }
  .sx-mm-cta { padding: 0.7rem 0.85rem !important; }
  .sx-mm-all { margin: 0.7rem 0.85rem !important; }
  .sx-mm-contact { margin: 1.2rem 0.85rem 0 !important; padding: 1.2rem 1.1rem !important; }
  .sx-mm-footer { margin: 1.2rem 0.85rem 0 !important; }
  .sx-mm-list li a {
    padding: 0.85rem 0.8rem !important;
    font-size: 0.92rem !important;
  }
  .sx-mm-link-text {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-width: 0 !important;
  }
  .sx-mm-count {
    font-size: 0.68rem !important;
    padding: 0.15rem 0.4rem !important;
  }
  .sx-mm-title {
    font-size: 0.66rem !important;
    margin: 1.2rem 0 0.5rem !important;
  }
}

/* Mobile small screen */
@media (max-width: 480px) {
  .sx-mm-cta { grid-template-columns: 1fr 1fr !important; gap: 0.4rem !important; }
  .sx-mm-btn { padding: 0.75rem 0.6rem !important; font-size: 0.85rem !important; }
  .sx-mm-all { padding: 0.85rem 1rem !important; font-size: 0.9rem !important; }
}

/* sx-mm-v3-final-fix-end */



/* sx-mm-v3-correct-class */
/* Correct class is brx-offcanvas-inner (avec "er") */

.brxe-offcanvas .brx-offcanvas-inner,
.brx-offcanvas-inner {
  width: 100% !important;
  max-width: 100% !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100vh !important;
  max-height: 100dvh !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  box-sizing: border-box !important;
}

/* Hide all non-sx-mm-v3 direct children of offcanvas-inner */
.brx-offcanvas-inner > *:not([data-sx-mm-v3]):not(.brxe-icon):not(button):not([class*="close"]):not([class*="toggle"]) {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
}

/* Cart widget hidden in mobile menu */
.brx-offcanvas-inner .widget_shopping_cart_content,
.brx-offcanvas-inner .cart-detail {
  display: none !important;
}

/* Force the offcanvas itself full width */
.brxe-offcanvas {
  width: 100vw !important;
  max-width: 100vw !important;
  left: 0 !important;
  right: 0 !important;
}

/* Body scroll lock when offcanvas open */
body.brx-offcanvas-open {
  overflow: hidden !important;
}

/* sx-mm-v3 perfect width inside */
.sx-mm-v3 {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  display: block !important;
  padding: 0 0 4rem !important;
}

/* Items inside */
.sx-mm-v3 .sx-mm-list,
.sx-mm-v3 .sx-mm-list li,
.sx-mm-v3 .sx-mm-list li a {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* sx-mm-v3-correct-class-end */



/* sx-nuclear-anti-overlap */
/* ============================================
   NUCLEAR OPTION — disable TOUS les ::after content qui dupliquent
   sauf ceux qu'on a explicitement design (mes propres rules)
   ============================================ */

/* DISABLE all pseudo-element content on Bricks sections */
.sx-section .sx-feat p::before,
.sx-section .sx-feat p::after,
.sx-section .sx-stat .num::before,
.sx-section .sx-stat .num::after,
.sx-section .sx-stat .lbl::before,
.sx-section .sx-stat .lbl::after,
.sx-section .sx-tile::before,
.sx-section .sx-tile::after,
.sx-section .sx-tile h3::before,
.sx-section .sx-tile h3::after,
.sx-section .sx-tile p::before,
.sx-section .sx-tile p::after,
.sx-section .sx-tile .sx-cta::before,
.sx-section .sx-tile .sx-cta::after,
.sx-section h2::before,
.sx-section h2::after,
.sx-section h3::before,
.sx-section h3::after,
.sx-section .sx-sub::before,
.sx-section .sx-sub::after,
.sx-section .sx-container::before,
.sx-section .sx-container::after,
.sx-section::before,
.sx-section::after {
  content: none !important;
  display: none !important;
}

/* RESTORE only safe decorative pseudo (the dot after H2) */
.sx-section h2 + .pseudo-decorative-dot { display: inline-block; }

/* RESTORE original p font-size everywhere (kill the font-size: 0 hack) */
.sx-feat p, .sx-tile p, .sx-stat .lbl, .sx-section p {
  font-size: clamp(0.88rem, 1vw, 0.96rem) !important;
  line-height: 1.55 !important;
  font-size: revert !important;
}

/* sx-trust stats numbers : RESTORE visibility */
.sx-trust .sx-stat .num {
  font-size: clamp(1.8rem, 4.2vw, 2.6rem) !important;
  -webkit-text-fill-color: initial !important;
  background: linear-gradient(120deg, #1d2327 30%, #00838f 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  display: block !important;
  text-align: center !important;
}

/* sx-why feat p : restore */
.sx-why-grid .sx-feat p,
.sx-why-grid .sx-feat:nth-child(1) p,
.sx-why-grid .sx-feat:nth-child(2) p,
.sx-why-grid .sx-feat:nth-child(3) p,
.sx-why-grid .sx-feat:nth-child(4) p {
  font-size: clamp(0.88rem, 1vw, 1rem) !important;
  line-height: 1.65 !important;
  color: rgba(255,255,255,0.78) !important;
  text-align: left !important;
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  opacity: 1 !important;
  margin: 0 !important;
}

/* sx-cta-band : keep dark + visible */
.sx-cta-band p, .sx-cta-band h2, .sx-cta-band h3 {
  font-size: revert !important;
  visibility: visible !important;
}

/* TITLES position : center, balance */
.sx-section h2,
section[class*="sx-"] h2,
.sx-cat h2, .sx-trust h2, .sx-why h2, .sx-services h2, .sx-cta-band h2 {
  text-align: center !important;
  text-wrap: balance !important;
  max-width: 100% !important;
  margin: 0 auto 0.85rem !important;
  font-size: clamp(2rem, 4.2vw, 3rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.1 !important;
  position: relative !important;
  z-index: 2 !important;
}

.sx-section .sx-sub,
section[class*="sx-"] .sx-sub {
  text-align: center !important;
  max-width: 740px !important;
  margin: 0 auto 2.5rem !important;
  font-size: clamp(0.95rem, 1.1vw, 1.05rem) !important;
  line-height: 1.55 !important;
  position: relative !important;
  z-index: 2 !important;
}

/* RESET sx-trust : container max-width + padding */
.sx-trust { padding: clamp(3rem, 5vw, 4.5rem) 1rem !important; }
.sx-trust .sx-container { max-width: 1100px !important; margin: 0 auto !important; padding: 0 !important; }
.sx-trust-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: clamp(0.85rem, 2vw, 2rem) !important;
  align-items: stretch !important;
}

/* sx-cat grid : aligned */
.sx-cat-grid { display: grid !important; gap: 1rem !important; }
.sx-cat .sx-cat-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
}

/* sx-tile : box-sizing + clean */
.sx-tile {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 1.4rem 1.3rem !important;
  background: #fff !important;
  border-radius: 14px !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  transition: all 0.3s !important;
  text-decoration: none !important;
  color: inherit !important;
  position: relative !important;
}
.sx-tile:hover { border-color: rgba(0,131,143,0.4) !important; transform: translateY(-3px) !important; box-shadow: 0 14px 32px rgba(0,131,143,0.12) !important; }

/* sx-tile-large = 1 col span 2 */
@media (min-width: 768px) {
  .sx-tile-large { grid-column: span 2 !important; }
}

.sx-tile h3 {
  margin: 0 0 0.6rem !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #1a202c !important;
  line-height: 1.3 !important;
  text-wrap: balance !important;
}
.sx-tile p {
  margin: 0 0 1rem !important;
  flex-grow: 1 !important;
  font-size: 0.92rem !important;
  color: #4a5568 !important;
  line-height: 1.55 !important;
  font-weight: 500 !important;
}
.sx-tile .sx-cta {
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  color: #00838f !important;
  letter-spacing: 0.02em !important;
  margin-top: auto !important;
  text-transform: uppercase !important;
}

/* sx-cat .sx-tile-small / large : reset to consistent */
.sx-tile-large, .sx-tile-small { aspect-ratio: auto !important; min-height: auto !important; }

/* Mobile single column */
@media (max-width: 768px) {
  .sx-cat-grid { grid-template-columns: 1fr !important; gap: 0.85rem !important; }
  .sx-cat-grid .sx-tile-large, .sx-cat-grid .sx-tile { grid-column: span 1 !important; }
  .sx-trust-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* sx-services-grid : 4 cols → 2 cols mobile */
.sx-services-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap: 1rem !important;
}
@media (max-width: 768px) {
  .sx-services-grid { grid-template-columns: 1fr !important; }
}

/* Pourquoi sx-why grid : 4 cols → 2 mobile */
.sx-why-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
  gap: 1.5rem !important;
}
@media (max-width: 768px) {
  .sx-why-grid { grid-template-columns: 1fr !important; gap: 1rem !important; }
}

/* sx-feat */
.sx-feat {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.6rem !important;
  text-align: left !important;
  padding: 0 !important;
}
.sx-feat .icon { width: 32px !important; height: 32px !important; flex-shrink: 0 !important; }
.sx-feat h3 { margin: 0 !important; font-size: 1.1rem !important; font-weight: 700 !important; }
.sx-feat p { margin: 0 !important; }

/* sx-nuclear-anti-overlap-end */

/* sx-mm-kill-old-menu */
/* Force-hide old Bricks offcanvas menu items */
.brxe-offcanvas .brx-offcanvas-inner > .brxe-shortcode,
.brxe-offcanvas .brx-offcanvas-inner > .brxe-nav-nested,
.brxe-offcanvas .brx-offcanvas-inner > nav,
.brxe-offcanvas .brx-offcanvas-inner > ul,
.brxe-offcanvas .brx-offcanvas-inner > div:not([data-sx-mm-v3]),
.brxe-offcanvas .brx-offcanvas-inner > .brxe-block,
.brxe-offcanvas .brx-offcanvas-inner > .brxe-div,
.brxe-offcanvas .brx-offcanvas-inner > .brxe-container,
.brxe-offcanvas .brx-offcanvas-inner > .brxe-section,
.brxe-offcanvas .brx-offcanvas-inner > .brxe-image,
.brxe-offcanvas .brx-offcanvas-inner > .brxe-heading,
.brxe-offcanvas .brx-offcanvas-inner > .brxe-text,
.brxe-offcanvas .brx-offcanvas-inner > .brxe-button {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  position: absolute !important;
  left: -9999px !important;
}

/* Same for offcanvas direct content NOT in sx-mm-v3 wrapper */
.brxe-offcanvas > div:not(.brx-offcanvas-toggle):not([data-sx-mm-v3]) > *:not([data-sx-mm-v3]):not(.brxe-icon):not([class*="close"]):not([class*="toggle"]) {
  display: none !important;
}

/* sx-mm-kill-old-menu-end */



/* sx-final-kill-ghost-text */
/* Kill the ::before content sur cta-band qui dupliquait le texte */
.sx-cta-band p::before,
.sx-cta-band p::after {
  content: none !important;
  display: none !important;
}

/* Aussi disable le ::before "NOUVEAU CETTE SEMAINE" qui se duplique parfois */
.sx-section.sx-services::before {
  content: none !important;
  display: none !important;
}

/* Restore p natural visibility */
.sx-cta-band p {
  font-size: clamp(0.95rem, 1.15vw, 1.1rem) !important;
  color: rgba(255,255,255,0.92) !important;
  font-weight: 500 !important;
  text-align: center !important;
  max-width: 720px !important;
  margin: 0 auto !important;
  line-height: 1.55 !important;
}

/* Imperfections volontaires removed (causaient du décalage visuel) */
.sx-trust-grid .sx-stat:nth-child(2) { transform: none !important; }
.sx-trust-grid .sx-stat:nth-child(3) { transform: none !important; }
.sx-why-grid .sx-feat:nth-child(odd) { margin-top: 0 !important; }
.sx-tile:nth-child(7) { transform: none !important; }
.sx-tile:nth-child(11) { transform: none !important; }

/* sx-final-kill-ghost-text-end */


/* sx-form-labels-lighter */
/* Jeremy: dans contacter nous les texte dans les label de formulaire son trop foncer */
.wpcf7 label,
.wpcf7-form label,
form .label,
form label,
.brxe-form label,
.contact-form label,
.cf7-cf7mls-elements label {
  color: #4a5568 !important;
  font-weight: 500 !important;
  font-size: 0.92rem !important;
  letter-spacing: 0.01em !important;
}

/* Inputs themselves : lighter color but still readable */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 textarea,
.wpcf7 select,
.brxe-form input,
.brxe-form textarea,
.brxe-form select {
  color: #1a202c !important;
  font-size: 0.96rem !important;
}

/* Placeholder lighter */
.wpcf7 ::placeholder,
.brxe-form ::placeholder,
form ::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}

/* Form heading clarity */
.wpcf7-form h2, .wpcf7-form h3, .brxe-form h2, .brxe-form h3 {
  color: #1a202c !important;
}

/* Form sub-text */
.wpcf7-form p, .brxe-form p {
  color: #4a5568 !important;
}

/* Required asterisk */
.wpcf7-form .required, .wpcf7-form .wpcf7-validates-as-required + .required {
  color: #ef4444 !important;
}

/* sx-form-labels-lighter-end */



/* ============================================
   sx-NUCLEAR-FINAL — Tue TOUT le texte fantôme + force spacing massif
   GOAL : pas un seul texte qui se superpose, pas un texte trop collé
   ============================================ */

/* === TUE TOUT LES ::before/::after avec content TEXTE === */
/* Garde seulement les pseudo decorative (pulsing dot, gradients) */

.sx-section *::before,
.sx-section *::after,
section[class*="sx-"] *::before,
section[class*="sx-"] *::after,
.sx-tile::before,
.sx-tile::after,
.sx-feat::before,
.sx-feat::after,
.sx-stat::before,
.sx-stat::after,
.sx-cat-band::before,
.sx-cat-band::after,
.sx-trust::before,
.sx-trust::after,
.sx-trust-grid::before,
.sx-trust-grid::after,
.sx-trust-grid > div::before,
.sx-trust-grid > div::after,
.sx-trust .sx-container::before,
.sx-trust .sx-container::after,
.sx-cta-band::before,
.sx-cta-band::after,
.sx-cta-band > *::before,
.sx-cta-band > *::after,
.sx-cta-band p::before,
.sx-cta-band p::after,
.sx-cta-band h2::before,
.sx-cta-band h2::after,
.sx-cta-band h3::before,
.sx-cta-band h3::after,
.sx-cta-band .sx-container::before,
.sx-cta-band .sx-container::after,
.sx-services::before,
.sx-services::after,
.sx-services > *::before,
.sx-services > *::after,
.sx-why::before,
.sx-why::after,
.sx-why > *::before,
.sx-why > *::after,
.sx-why-grid::before,
.sx-why-grid::after,
.sx-why-grid > *::before,
.sx-why-grid > *::after,
.sx-why-grid .sx-feat::before,
.sx-why-grid .sx-feat::after,
.sx-why-grid .sx-feat p::before,
.sx-why-grid .sx-feat p::after,
.sx-why-grid .sx-feat h3::before,
.sx-why-grid .sx-feat h3::after,
.sx-cat::before,
.sx-cat::after,
.sx-cat > *::before,
.sx-cat > *::after,
.sx-cat-grid::before,
.sx-cat-grid::after,
.sx-cat-grid > *::before,
.sx-cat-grid > *::after,
.sx-tile h3::before,
.sx-tile h3::after,
.sx-tile p::before,
.sx-tile p::after,
.sx-tile .sx-cta::before,
.sx-tile .sx-cta::after,
.sx-stat .num::before,
.sx-stat .num::after,
.sx-stat .lbl::before,
.sx-stat .lbl::after,
.sx-feat h3::before,
.sx-feat h3::after,
.sx-feat p::before,
.sx-feat p::after,
.sx-feat .icon::before,
.sx-feat .icon::after,
.sx-feat svg::before,
.sx-feat svg::after,
.sx-section h2::before,
.sx-section h2::after,
.sx-section h3::before,
.sx-section h3::after,
.sx-section p::before,
.sx-section p::after,
.sx-section .sx-sub::before,
.sx-section .sx-sub::after,
.sx-section .sx-container::before,
.sx-section .sx-container::after,
.sx-brands::before,
.sx-brands::after,
.sx-brands > *::before,
.sx-brands > *::after {
  content: none !important;
  display: none !important;
}

/* === RESET tous les transforms d'imperfections === */
.sx-trust-grid .sx-stat,
.sx-trust-grid .sx-stat:nth-child(1),
.sx-trust-grid .sx-stat:nth-child(2),
.sx-trust-grid .sx-stat:nth-child(3),
.sx-trust-grid .sx-stat:nth-child(4),
.sx-why-grid .sx-feat,
.sx-why-grid .sx-feat:nth-child(odd),
.sx-why-grid .sx-feat:nth-child(even),
.sx-tile,
.sx-tile:nth-child(1),
.sx-tile:nth-child(2),
.sx-tile:nth-child(3),
.sx-tile:nth-child(4),
.sx-tile:nth-child(5),
.sx-tile:nth-child(6),
.sx-tile:nth-child(7),
.sx-tile:nth-child(8),
.sx-tile:nth-child(9),
.sx-tile:nth-child(10),
.sx-tile:nth-child(11),
.sx-tile:nth-child(12) {
  transform: none !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.sx-tile:hover {
  transform: translateY(-3px) !important;
}

/* === RESTORE font-size sur ALL [p] qui avaient le hack font-size: 0 === */
.sx-feat p,
.sx-tile p,
.sx-stat .lbl,
.sx-section p,
.sx-section .sx-sub,
.sx-cta-band p,
.sx-trust .sx-stat .lbl,
.sx-why-grid .sx-feat p {
  font-size: revert !important;
  line-height: 1.6 !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
}

/* Force visible body texts everywhere */
.sx-feat p { font-size: clamp(0.88rem, 1vw, 0.96rem) !important; }
.sx-tile p { font-size: 0.92rem !important; }
.sx-stat .lbl { font-size: clamp(0.78rem, 1vw, 0.88rem) !important; }
.sx-cta-band p { font-size: clamp(0.95rem, 1.15vw, 1.05rem) !important; }
.sx-section .sx-sub { font-size: clamp(0.95rem, 1.1vw, 1.05rem) !important; }

/* === MASSIVE SPACING entre sections (Jeremy : "trop coller ensemble") === */
.sx-section,
section[class*="sx-"],
section.brxe-section {
  padding-top: clamp(4rem, 7vw, 7rem) !important;
  padding-bottom: clamp(4rem, 7vw, 7rem) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  contain: layout style !important;
  clear: both !important;
}

/* === Container clean === */
.sx-section .sx-container,
section[class*="sx-"] .sx-container {
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 2 !important;
}

/* === Sub-titles bien espacés au-dessous H2 === */
.sx-section h2 {
  margin: 0 auto 0.85rem !important;
  text-align: center !important;
  text-wrap: balance !important;
  max-width: 100% !important;
  position: relative !important;
  z-index: 3 !important;
}

.sx-section .sx-sub {
  margin: 0 auto 3rem !important;
  text-align: center !important;
  max-width: 740px !important;
  position: relative !important;
  z-index: 3 !important;
  line-height: 1.6 !important;
  color: rgba(29,35,39,0.7) !important;
}

/* Override sub on dark sections */
.sx-why .sx-sub,
.sx-cta-band .sx-sub,
.sx-cta-band p {
  color: rgba(255,255,255,0.85) !important;
}

/* === Grids spacing entre items === */
.sx-cat-grid,
.sx-services-grid,
.sx-why-grid,
.sx-trust-grid,
.sx-savoir-grid,
.sx-pq-grid,
.sx-eng-grid,
.sx-cmd-grid,
.sx-svctech-grid,
.sx-cats-grid,
.sx-vedettes-grid,
.sx-instal-grid {
  gap: clamp(1rem, 2vw, 1.6rem) !important;
}

/* === Mobile dedicated MASSIVE spacing === */
@media (max-width: 768px) {
  .sx-section,
  section[class*="sx-"],
  section.brxe-section {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }
  .sx-section .sx-container { padding-left: 1rem !important; padding-right: 1rem !important; }
  .sx-section h2 { font-size: clamp(1.7rem, 6vw, 2.2rem) !important; line-height: 1.15 !important; margin-bottom: 0.7rem !important; }
  .sx-section .sx-sub { font-size: 0.94rem !important; margin-bottom: 2rem !important; }
  .sx-cat-grid,
  .sx-services-grid,
  .sx-why-grid,
  .sx-savoir-grid,
  .sx-pq-grid,
  .sx-eng-grid,
  .sx-cmd-grid,
  .sx-svctech-grid,
  .sx-cats-grid,
  .sx-vedettes-grid,
  .sx-instal-grid {
    grid-template-columns: 1fr !important;
    gap: 0.85rem !important;
  }
  .sx-trust-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.65rem !important;
  }
  .sx-cards-grid {
    grid-template-columns: 1fr !important;
  }
}

/* === Eviter overflow horizontal === */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw !important;
}

/* === Tile spacing intern === */
.sx-tile, .sx-stat, .sx-feat,
.sx-savoir-card, .sx-pq-item, .sx-eng-card, .sx-cmd-card,
.sx-svctech-card, .sx-instal-card, .sx-ved-card, .sx-cat-card {
  margin: 0 !important;
}

/* === Animation cleanup : pas de scroll-driven animations qui causent le ghost === */
@supports (animation-timeline: view()) {
  .sx-savoir-card, .sx-pq-item, .sx-eng-card, .sx-cmd-card,
  .sx-svctech-card, .sx-instal-card, .sx-ved-card, .sx-cat-card,
  .sx-test-card {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* sx-NUCLEAR-FINAL-end */



/* sx-v40-clean */
/* Categories tile : h3 + .sx-cta correct spacing */
.sx-cat .sx-tile h3,
.sx-cat-grid .sx-tile h3,
.sx-section .sx-tile h3 {
  margin: 0 0 1rem !important;
  padding: 0 !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  font-size: clamp(1rem, 1.2vw, 1.15rem) !important;
}

.sx-cat .sx-tile p,
.sx-cat-grid .sx-tile p {
  margin: 0 0 1.2rem !important;
  flex-grow: 1 !important;
  font-size: 0.88rem !important;
  color: #4a5568 !important;
  line-height: 1.55 !important;
}

.sx-cat .sx-tile .sx-cta,
.sx-cat-grid .sx-tile .sx-cta,
.sx-section .sx-tile .sx-cta,
.sx-services .sx-tile .sx-cta {
  display: block !important;
  margin-top: auto !important;
  padding-top: 0.85rem !important;
  border-top: 1px solid rgba(0,131,143,0.15) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  color: #00838f !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

.sx-tile {
  padding: 1.4rem 1.4rem !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 180px !important;
}

/* Tile-large (1ère catégorie) */
.sx-tile.sx-tile-large {
  padding: 1.8rem 1.6rem !important;
  min-height: 220px !important;
}

@media (max-width: 768px) {
  .sx-tile, .sx-tile.sx-tile-large {
    padding: 1.2rem 1.1rem !important;
    min-height: 160px !important;
  }
  .sx-tile h3, .sx-tile.sx-tile-large h3 {
    font-size: 1rem !important;
    margin: 0 0 0.7rem !important;
  }
  .sx-tile p { font-size: 0.85rem !important; }
}

/* Hide TOUT autre mobile menu (qui causerait double affichage) */
/* Sticky bottom mobile nav si elle existe */
.brxe-block[id*="mobile-nav"],
.brxe-section[id*="bottom-nav"],
[class*="mobile-nav-bottom"],
[id*="mobile-bottom"],
.sx-mobile-bottom-nav,
.bottom-mobile-menu,
nav.mobile-fixed-bottom {
  display: none !important;
}

/* Hide ANY second offcanvas if there are multiple */
.brxe-offcanvas:not(:first-of-type) {
  display: none !important;
}

/* Black bar fix : check for left-side black div in offcanvas */
.brxe-offcanvas[data-direction="left"]::before,
.brxe-offcanvas[data-direction="left"]::after {
  display: none !important;
  content: none !important;
}

/* Force width 100% for offcanvas (no left strip) */
.brxe-offcanvas[data-direction="left"],
.brxe-offcanvas {
  width: 100vw !important;
  max-width: 100vw !important;
  left: 0 !important;
  right: 0 !important;
}

.brx-offcanvas-inner {
  width: 100vw !important;
  max-width: 100vw !important;
  left: 0 !important;
  right: 0 !important;
}

/* sx-v40-clean-end */



/* sx-v41-kill-all-doubled */
/* Disable all the ::after / ::before content: rules that DUPLICATE native Bricks text */

#brxe-rscbkw::before,
#brxe-rscbkw::after,
#brxe-xkpuak::before,
#brxe-xkpuak::after,
.sx-hero-search::before,
.sx-hero-search::after,
.sx-cat-band::before,
.sx-cat-band::after,
.sx-trust-grid .sx-stat:nth-child(1) .lbl::after,
.sx-trust-grid .sx-stat:nth-child(2) .lbl::after,
.sx-trust-grid .sx-stat:nth-child(3) .lbl::after,
.sx-trust-grid .sx-stat:nth-child(4) .lbl::after,
.sx-trust-grid .sx-stat .lbl::after,
.sx-trust-grid .sx-stat .lbl::before,
.sx-trust .sx-container::before,
.sx-trust .sx-container::after,
.sx-trust::before,
.sx-trust::after,
.sx-cat .sx-container::before,
.sx-cat .sx-container::after,
.sx-cat::before,
.sx-cat::after,
.sx-cat .sx-sub::after,
.sx-cat .sx-sub::before,
.sx-why .sx-container::before,
.sx-why .sx-container::after,
.sx-why::before,
.sx-why::after,
.sx-why-grid .sx-feat:nth-child(1) p::before,
.sx-why-grid .sx-feat:nth-child(1) p::after,
.sx-why-grid .sx-feat:nth-child(2) p::before,
.sx-why-grid .sx-feat:nth-child(2) p::after,
.sx-why-grid .sx-feat:nth-child(3) p::before,
.sx-why-grid .sx-feat:nth-child(3) p::after,
.sx-why-grid .sx-feat:nth-child(4) p::before,
.sx-why-grid .sx-feat:nth-child(4) p::after,
.sx-why-grid .sx-feat p::before,
.sx-why-grid .sx-feat p::after,
.sx-services::before,
.sx-services::after,
.sx-services .sx-container::before,
.sx-services .sx-container::after,
.sx-services .sx-sub::before,
.sx-services .sx-sub::after,
.sx-brands::before,
.sx-brands::after,
.sx-brands .sx-container::before,
.sx-brands .sx-container::after,
.sx-cta-band::before,
.sx-cta-band::after,
.sx-cta-band .sx-container::before,
.sx-cta-band .sx-container::after,
.sx-cta-band p::before,
.sx-cta-band p::after,
.sx-cta-band h2::before,
.sx-cta-band h2::after,
.sx-cta-band h3::before,
.sx-cta-band h3::after,
.sx-section::before,
.sx-section::after,
.sx-section .sx-container::before,
.sx-section .sx-container::after,
.sx-section h2::before,
.sx-section h2::after,
.sx-section .sx-sub::before,
.sx-section .sx-sub::after,
.sx-section p::before,
.sx-section p::after,
.sx-tile::before,
.sx-tile::after,
.sx-tile h3::before,
.sx-tile h3::after,
.sx-tile p::before,
.sx-tile p::after,
.sx-tile .sx-cta::before,
.sx-tile .sx-cta::after,
.sx-tile-large::before,
.sx-tile-large::after,
.sx-feat::before,
.sx-feat::after,
.sx-feat h3::before,
.sx-feat h3::after,
.sx-feat p::before,
.sx-feat p::after,
.sx-stat::before,
.sx-stat::after,
.sx-stat .num::before,
.sx-stat .num::after {
  content: none !important;
  display: none !important;
}

/* Restore font-size for the previously-zero'd elements */
.sx-trust-grid .sx-stat .lbl,
.sx-why-grid .sx-feat p,
.sx-tile p,
.sx-tile h3,
.sx-tile .sx-cta,
.sx-section p,
.sx-section .sx-sub,
.sx-cta-band p,
.sx-cta-band h2 {
  font-size: revert !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  line-height: 1.55 !important;
}

.sx-trust .sx-stat .lbl {
  font-size: 0.86rem !important;
  color: rgba(29,35,39,0.7) !important;
  font-weight: 500 !important;
  display: block !important;
}
.sx-trust .sx-stat .num {
  font-size: clamp(1.8rem, 4.2vw, 2.6rem) !important;
  font-weight: 800 !important;
  color: #1d2327 !important;
  -webkit-text-fill-color: initial !important;
  background: linear-gradient(120deg, #1d2327 30%, #00838f 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: block !important;
}

.sx-why-grid .sx-feat p {
  color: rgba(255,255,255,0.78) !important;
  font-size: 0.95rem !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

/* Force title contrast - never pale on pale */
.sx-section h2,
.sx-section h3 {
  color: #1d2327 !important;
  font-weight: 700 !important;
}
.sx-why h2, .sx-why h3,
.sx-cta-band h2, .sx-cta-band h3 {
  color: #ffffff !important;
}
.sx-tile h3, .sx-feat h3 { color: #1d2327 !important; }
.sx-why .sx-feat h3 { color: #ffffff !important; }

/* sx-v41-kill-all-doubled-end */



/* sx-v42-specific-kill */
/* Kill ALL the specific ::after content rules that duplicate native Bricks text.
   Also restore native font-size that was set to 0 to hide native text. */

#brxe-rscbkw::before, #brxe-rscbkw::after { content: none !important; display: none !important; }
#brxe-xkpuak::before, #brxe-xkpuak::after { content: none !important; display: none !important; }
#brxe-xkpuak { font-size: revert !important; line-height: revert !important; }

#brxe-ulwurh::before, #brxe-ulwurh::after { content: none !important; display: none !important; }
#brxe-ulwurh > div:last-child::after { content: none !important; display: none !important; }
#brxe-ulwurh > div:last-child::before { content: none !important; display: none !important; }

.brxe-offcanvas::after, .brxe-offcanvas::before { content: none !important; display: none !important; }

.sx-cat .sx-sub::after, .sx-cat .sx-sub::before { content: none !important; display: none !important; }
.sx-cat .sx-container::after, .sx-cat .sx-container::before { content: none !important; display: none !important; }

.sx-trust .sx-container::before, .sx-trust .sx-container::after { content: none !important; display: none !important; }
.sx-trust::before, .sx-trust::after { content: none !important; display: none !important; }
.sx-trust-grid .sx-stat .lbl::after, .sx-trust-grid .sx-stat .lbl::before { content: none !important; display: none !important; }

.sx-why-grid .sx-feat:nth-child(1) p::after, .sx-why-grid .sx-feat:nth-child(1) p::before,
.sx-why-grid .sx-feat:nth-child(2) p::after, .sx-why-grid .sx-feat:nth-child(2) p::before,
.sx-why-grid .sx-feat:nth-child(3) p::after, .sx-why-grid .sx-feat:nth-child(3) p::before,
.sx-why-grid .sx-feat:nth-child(4) p::after, .sx-why-grid .sx-feat:nth-child(4) p::before,
.sx-why-grid .sx-feat p::after, .sx-why-grid .sx-feat p::before,
.sx-why-grid .sx-feat:nth-child(4) h3::after, .sx-why-grid .sx-feat:nth-child(4) h3::before,
.sx-why-grid .sx-feat h3::after, .sx-why-grid .sx-feat h3::before {
  content: none !important;
  display: none !important;
}

.sx-why-grid .sx-feat:nth-child(1) p,
.sx-why-grid .sx-feat:nth-child(2) p,
.sx-why-grid .sx-feat:nth-child(3) p,
.sx-why-grid .sx-feat:nth-child(4) p,
.sx-why-grid .sx-feat p,
.sx-why-grid .sx-feat:nth-child(4) h3,
.sx-why-grid .sx-feat h3,
.sx-trust-grid .sx-stat .lbl,
.sx-cat .sx-sub,
#brxe-xkpuak {
  font-size: revert !important;
  line-height: revert !important;
  visibility: visible !important;
  height: auto !important;
  opacity: 1 !important;
}

/* Restore explicit sizes for visibility */
.sx-why-grid .sx-feat p {
  font-size: clamp(0.92rem, 1.1vw, 1rem) !important;
  line-height: 1.6 !important;
  color: rgba(255,255,255,0.78) !important;
  font-weight: 400 !important;
  display: block !important;
}

.sx-why-grid .sx-feat h3 {
  font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  margin-bottom: 0.65rem !important;
  display: block !important;
}

.sx-trust-grid .sx-stat .lbl {
  font-size: 0.86rem !important;
  color: rgba(29,35,39,0.7) !important;
  line-height: 1.4 !important;
  font-weight: 500 !important;
  display: block !important;
}

.sx-cat .sx-sub {
  font-size: clamp(0.95rem, 1.1vw, 1.05rem) !important;
  color: rgba(29,35,39,0.7) !important;
  line-height: 1.55 !important;
}

.sx-cta-band .sx-container::before, .sx-cta-band .sx-container::after { content: none !important; display: none !important; }
.sx-cta-band p::before, .sx-cta-band p::after { content: none !important; display: none !important; }
.sx-cta-band h2::before, .sx-cta-band h2::after { content: none !important; display: none !important; }
.sx-cta-band::before, .sx-cta-band::after { content: none !important; display: none !important; }

/* Brands section : keep PARTENAIRES DE CONFIANCE label but kill duplicates */
.sx-brands .sx-container::before, .sx-brands .sx-container::after { content: none !important; display: none !important; }

/* Imperfections volontaires reset */
.sx-trust-grid .sx-stat:nth-child(2),
.sx-trust-grid .sx-stat:nth-child(3),
.sx-why-grid .sx-feat:nth-child(odd),
.sx-tile:nth-child(7),
.sx-tile:nth-child(11) {
  transform: none !important;
  margin-top: 0 !important;
}

/* sx-v42-specific-kill-end */



/* sx-v43-single-menu */
/* Cause double menu mobile : 2 toggles visibles
   - #brxe-vmramk (position absolute top: 40px right: 40px) toujours visible
   - #brxe-wgwbjg (display: flex sur mobile)
   → On garde wgwbjg sur mobile + vmramk sur desktop */
@media (max-width: 767px) {
  #brxe-vmramk {
    display: none !important;
  }
}
@media (min-width: 768px) {
  #brxe-wgwbjg {
    display: none !important;
  }
}

/* Toggle button taille mobile et touch target */
#brxe-wgwbjg, #brxe-vmramk {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
}
@media (max-width: 767px) {
  #brxe-vmramk { display: none !important; }
  #brxe-wgwbjg {
    display: flex !important;
    position: absolute !important;
    top: 50% !important;
    right: 1rem !important;
    transform: translateY(-50%) !important;
    z-index: 100 !important;
  }
}
/* sx-v43-single-menu-end */

/* sx-v43-titles-contrast */
/* Titres blancs sur fond pale = invisible */
.sx-section h2:not(.sx-why h2):not(.sx-cta-band h2):not(.sx-particuliers h2):not(.sx-pourqui h2),
.sx-section h3:not(.sx-why h3):not(.sx-cta-band h3):not(.sx-particuliers h3):not(.sx-pourqui h3),
.sx-cat h2, .sx-trust h2, .sx-services h2, .sx-brands h2,
.sx-cats h2, .sx-vedettes h2, .sx-installations h2,
.sx-svc-tech h2, .sx-savoir-faire h2, .sx-engagements h2,
.sx-commander h2, .sx-faq h2 {
  color: #1d2327 !important;
  -webkit-text-fill-color: initial !important;
}

/* Garde les titres blancs uniquement sur fonds sombres */
.sx-why h2, .sx-why h3,
.sx-cta-band h2, .sx-cta-band h3,
.sx-particuliers h2, .sx-particuliers h3, .sx-particuliers h4,
.sx-pourqui h2, .sx-pourqui h3, .sx-pourqui h4 {
  color: #ffffff !important;
}

/* tile h3 dark */
.sx-tile h3, .sx-feat h3, .sx-savoir-card h3, .sx-eng-card h3,
.sx-cmd-card h3, .sx-svctech-card h3, .sx-instal-card h3,
.sx-ved-card .name, .sx-cat-card h3 {
  color: #1d2327 !important;
}

/* Mais sx-why feat h3 reste blanc */
.sx-why .sx-feat h3 { color: #ffffff !important; }
.sx-pourqui .sx-pq-item h4 { color: #ffffff !important; }

/* sx-v43-titles-contrast-end */



/* sx-v44-restore-legit-pseudo */
/* Some ::after content rules were LEGIT (the only text source) — restore them.
   Different from duplicates (rules that overlapped native text). */

#brxe-ulwurh::before {
  content: 'Prêt à passer une commande ?' !important;
  display: block !important;
  font-size: clamp(1.8rem, 3.5vw, 2.8rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.15 !important;
  background: linear-gradient(135deg, #ffffff 0%, #b3e8f1 50%, #5cc4d6 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  margin-bottom: 0.85rem !important;
  text-wrap: balance !important;
  max-width: 18ch !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

#brxe-ulwurh::after {
  content: 'Plus de 2 000 produits en stock et 20 000 SKU disponibles. Compte B2B ouvert en 24 h, livraison partout au Québec, pas de minimum.' !important;
  display: block !important;
  font-size: clamp(0.95rem, 1.15vw, 1.1rem) !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  letter-spacing: -0.005em !important;
  color: rgba(255,255,255,0.85) !important;
  margin: 0 auto clamp(1.5rem, 3vw, 2.5rem) !important;
  max-width: 56ch !important;
  text-wrap: pretty !important;
  text-align: center !important;
}

/* sx-trust : restore titre + texte (sx-trust container has no native heading) */
.sx-trust .sx-container::before {
  content: 'Quarante ans à servir le Québec' !important;
  display: block !important;
  font-size: clamp(1.6rem, 3vw, 2.4rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
  text-align: center !important;
  color: #1d2327 !important;
  margin-bottom: 0.85rem !important;
  text-wrap: balance !important;
  max-width: 22ch !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.sx-trust .sx-container::after {
  content: 'Une famille de Rivière-du-Loup qui distribue produits sanitaires, entretien et emballages depuis 1985. Et qui offre aussi les services d’entretien — du grand nettoyage industriel à la cuisine de restaurant, des hottes certifiées aux échangeurs d’air.' !important;
  display: block !important;
  font-size: clamp(0.9rem, 1.1vw, 1rem) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  letter-spacing: -0.005em !important;
  color: rgba(29,35,39,0.62) !important;
  text-align: center !important;
  max-width: 60ch !important;
  margin: 0 auto clamp(2rem, 3vw, 3rem) !important;
  text-wrap: pretty !important;
}

/* sx-brands : restore label + heading + tagline (no native text in sx-brands) */
.sx-brands::before {
  content: 'NOS MARQUES PARTENAIRES' !important;
  display: block !important;
  text-align: center !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.28em !important;
  color: rgba(29,35,39,0.45) !important;
  margin-bottom: 0.6rem !important;
}

.sx-brands .sx-container::before {
  content: 'Les marques que les pros choisissent' !important;
  display: block !important;
  font-size: clamp(1.4rem, 2.5vw, 2rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
  text-align: center !important;
  color: #1d2327 !important;
  margin-bottom: 0.5rem !important;
  text-wrap: balance !important;
}

.sx-brands .sx-container::after {
  content: 'Cascades · Tork · Tandem · Purell · BOD Groupe · Silverwax · Duracore · NaceCare · Unica · Kruger · Diversey · Ettore · Unger.' !important;
  display: block !important;
  font-size: clamp(0.85rem, 1.05vw, 0.95rem) !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  text-align: center !important;
  color: rgba(29,35,39,0.55) !important;
  max-width: 56ch !important;
  margin: 0 auto clamp(1.5rem, 3vw, 2.5rem) !important;
  text-wrap: pretty !important;
}

/* sx-v44-restore-legit-pseudo-end */


/* sx-v45-single-menu-final */
/* HIDE all secondary hamburger toggles - keep ONLY brxe-vmramk on desktop and brxe-wgwbjg on mobile */
#brxe-qhvoyt {
  display: none !important;
}

/* Make sure ONLY one is visible per breakpoint */
@media (max-width: 767px) {
  #brxe-vmramk { display: none !important; }
  #brxe-qhvoyt { display: none !important; }
  #brxe-wgwbjg { display: flex !important; }
}
@media (min-width: 768px) {
  #brxe-vmramk { display: flex !important; }
  #brxe-qhvoyt { display: none !important; }
  #brxe-wgwbjg { display: none !important; }
}

/* sx-v45-single-menu-final-end */



/* sx-v46-menu-align */
/* Aligne le hamburger mobile (wgwbjg) avec la cart et l'icône account */
@media (max-width: 767px) {
  #brxe-wgwbjg {
    align-self: center !important;
    margin: 0 0.5rem !important;
    top: 0 !important;
    transform: none !important;
    flex-shrink: 0 !important;
  }
  /* Cart icon mobile alignment */
  #brx-header [class*="cart"], #brx-header .mini-cart-link {
    align-self: center !important;
  }
  /* Account icon mobile */
  #brx-header [href*="mon-compte"], #brx-header [href*="account"] {
    align-self: center !important;
  }
  /* Header inner align center */
  #brx-header > section,
  #brx-header > div,
  #brx-header section.brxe-section,
  #brx-header .brxe-block:not([class*="offcanvas"]) {
    align-items: center !important;
  }
}

/* === Style menu complet injecté === */
.sx-fullmenu {
  width: 100%;
  box-sizing: border-box;
  padding: 0 0 4rem;
  background: #fff;
  font-family: inherit;
}

.sx-fm-cta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  padding: 0.85rem;
  background: linear-gradient(135deg, #fafafa 0%, #f4f8fa 100%);
  border-bottom: 1px solid rgba(0,0,0,0.06);
  position: sticky;
  top: 0;
  z-index: 5;
}

.sx-fm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.85rem 0.7rem;
  border-radius: 12px;
  font-size: 0.86rem;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.25s;
  line-height: 1.2;
  text-align: center;
}

.sx-fm-btn.sx-fm-call {
  background: #00838f;
  color: #fff;
  box-shadow: 0 4px 12px rgba(0,131,143,0.25);
}
.sx-fm-btn.sx-fm-call:hover, .sx-fm-btn.sx-fm-call:active {
  background: #006d76;
  transform: translateY(-1px);
}

.sx-fm-btn.sx-fm-quote {
  background: transparent;
  color: #00838f;
  border: 1.5px solid rgba(0,131,143,0.4);
}
.sx-fm-btn.sx-fm-quote:hover, .sx-fm-btn.sx-fm-quote:active {
  background: rgba(0,131,143,0.08);
  border-color: #00838f;
}

.sx-fm-all {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.2rem;
  margin: 0.85rem;
  background: linear-gradient(135deg, #00838f 0%, #4dd0e1 100%);
  color: #fff !important;
  border-radius: 14px;
  text-decoration: none;
  font-weight: 700;
  font-size: 0.95rem;
  box-shadow: 0 6px 18px rgba(0,131,143,0.25);
}
.sx-fm-all::after {
  content: '→';
  font-size: 1.2em;
  margin-left: 0.5rem;
  transition: transform 0.25s;
}
.sx-fm-all:hover::after, .sx-fm-all:active::after {
  transform: translateX(4px);
}

.sx-fm-section {
  margin: 0.5rem 0;
  padding: 0 0.85rem;
}

.sx-fm-title {
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #00838f;
  margin: 1.4rem 0 0.7rem;
  padding: 0;
  line-height: 1;
}

.sx-fm-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.sx-fm-list li {
  display: block;
  width: 100%;
}

.sx-fm-list li a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0.95rem 0.9rem !important;
  background: #f8fafb !important;
  border-radius: 10px;
  color: #1a202c !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  text-decoration: none !important;
  transition: all 0.2s;
  border: 1px solid transparent;
  width: 100% !important;
  box-sizing: border-box !important;
}

.sx-fm-list li a:hover, .sx-fm-list li a:active {
  background: rgba(0,131,143,0.06) !important;
  color: #00838f !important;
  border-color: rgba(0,131,143,0.18);
}

.sx-fm-count {
  font-size: 0.72rem;
  color: #4a5568;
  font-weight: 600;
  padding: 0.18rem 0.5rem;
  background: rgba(0,0,0,0.04);
  border-radius: 6px;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}

.sx-fm-contact {
  margin: 1.6rem 0.85rem 0;
  padding: 1.4rem 1.3rem;
  background: linear-gradient(135deg, #0f1115 0%, #1a2030 100%);
  color: #fff;
  border-radius: 16px;
}

.sx-fm-contact p {
  margin: 0.3rem 0 !important;
  color: rgba(255,255,255,0.92) !important;
  font-size: 0.92rem !important;
  line-height: 1.4 !important;
}

.sx-fm-contact .sx-fm-addr-sub {
  color: rgba(255,255,255,0.65) !important;
  font-size: 0.84rem !important;
}

.sx-fm-contact .sx-fm-hours {
  font-size: 0.82rem !important;
  color: rgba(255,255,255,0.7) !important;
  padding-top: 0.7rem;
  border-top: 1px solid rgba(255,255,255,0.12);
  margin-top: 0.85rem !important;
}

/* Force offcanvas inner full width + scroll */
.brxe-offcanvas .brx-offcanvas-inner {
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: #fff !important;
  padding: 0 !important;
}

/* sx-v46-menu-align-end */


/* sx-v47-brands-complete */
.sx-brands .sx-container::after {
  content: "3M · Akka · Aktif · Aurelia · Cascades · Clair · Debonnaire · Diversey · Duracore · Groupe BOD · JET · Kimberly-Clark · Kruger · Lalema · M2 · NaceCare · Polyaction · PRO SX · Rubbermaid · Silverwax · Tandem · Tena · Tork · Wipeco" !important;
  display: block !important;
  font-size: clamp(0.85rem, 1.05vw, 0.95rem) !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
  text-align: center !important;
  color: rgba(29,35,39,0.65) !important;
  max-width: 70ch !important;
  margin: 0 auto clamp(1.5rem, 3vw, 2.5rem) !important;
  text-wrap: pretty !important;
}
/* sx-v47-brands-complete-end */

/* sx-v48-eng-lighter */
.sx-engagements {
  background: #ffffff !important;
  background-image: none !important;
}
.sx-engagements::before, .sx-engagements::after {
  display: none !important;
  content: none !important;
}
.sx-engagements .sx-eng-card {
  background: #fafbfc !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}
.sx-engagements .sx-eng-card:hover {
  border-color: #00838f !important;
  box-shadow: 0 8px 24px rgba(0,131,143,0.12) !important;
  transform: translateY(-3px) !important;
}
.sx-engagements .sx-eng-card h3 {
  color: #1d2327 !important;
}
.sx-engagements .sx-eng-card p {
  color: #4a5568 !important;
}
.sx-engagements h2 {
  color: #1d2327 !important;
}
.sx-engagements .sub {
  color: #4a5568 !important;
}
/* sx-v48-eng-lighter-end */




/* sx-v49-fullmenu-show */
.brxe-offcanvas .brx-offcanvas-inner [data-sx-fullmenu],
[data-sx-fullmenu] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  z-index: 10 !important;
}
.brxe-offcanvas .brx-offcanvas-inner > .sx-fullmenu {
  display: block !important;
}
/* sx-v49-fullmenu-show-end */



/* sx-v50-hero-asp-and-fm */

/* Hero ASP : grand format + lisible */
.sx-hero-asp-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 720px !important;
  margin: 1.5rem auto !important;
}
.sx-hero-asp-wrap .asp_w_container,
.sx-hero-asp-wrap .asp_main_container {
  width: 100% !important;
  max-width: 100% !important;
  background: rgba(255,255,255,0.96) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.18) !important;
  border: 1px solid rgba(0,131,143,0.2) !important;
  overflow: hidden !important;
  height: auto !important;
}
.sx-hero-asp-wrap .probox {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  height: 56px !important;
}
.sx-hero-asp-wrap .probox form {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 100% !important;
}
.sx-hero-asp-wrap .probox input.orig,
.sx-hero-asp-wrap .probox input.autocomplete {
  width: 100% !important;
  height: 100% !important;
  padding: 0 1.2rem !important;
  font-size: 1rem !important;
  color: #1a202c !important;
  background: transparent !important;
  border: 0 !important;
}
.sx-hero-asp-wrap .probox input.orig::placeholder,
.sx-hero-asp-wrap .probox input.autocomplete::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}
.sx-hero-asp-wrap .promagnifier {
  background: #00838f !important;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  margin: 4px 4px 4px 0 !important;
  border-radius: 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 2px 8px rgba(0,131,143,0.3) !important;
  flex-shrink: 0 !important;
  order: 2 !important;
}
.sx-hero-asp-wrap .promagnifier:hover {
  background: #006d76 !important;
  transform: scale(1.05) !important;
}
.sx-hero-asp-wrap .promagnifier svg {
  width: 18px !important;
  height: 18px !important;
  fill: #fff !important;
}
.sx-hero-asp-wrap .proloading {
  display: none !important;
}

/* Fullmenu : force visible */
[data-sx-fullmenu],
.brxe-offcanvas [data-sx-fullmenu],
.brxe-offcanvas .brx-offcanvas-inner [data-sx-fullmenu],
.sx-fullmenu {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  z-index: 100 !important;
}

@media (max-width: 768px) {
  .sx-hero-asp-wrap {
    max-width: 100% !important;
    margin: 1rem 0 !important;
  }
  .sx-hero-asp-wrap .probox { height: 50px !important; }
  .sx-hero-asp-wrap .promagnifier { width: 44px !important; height: 44px !important; min-width: 44px !important; }
  .sx-hero-asp-wrap .probox input.orig { font-size: 0.92rem !important; padding: 0 0.85rem !important; }
}
/* sx-v50-hero-asp-and-fm-end */



/* sx-v53-loupe-center */
/* Forcer le SVG loupe centré DANS le bouton, partout */
.promagnifier,
.proloading,
.asp_main_container .promagnifier,
.sx-hero-asp-wrap .promagnifier,
#brx-header .promagnifier,
header .promagnifier {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  position: relative !important;
  padding: 0 !important;
  text-align: center !important;
}

.promagnifier svg,
.proloading svg,
.asp_main_container .promagnifier svg,
.sx-hero-asp-wrap .promagnifier svg,
#brx-header .promagnifier svg,
header .promagnifier svg {
  display: block !important;
  margin: auto !important;
  position: relative !important;
  width: 14px !important;
  height: 14px !important;
  fill: #fff !important;
  stroke: #fff !important;
  flex-shrink: 0 !important;
}

/* Si i (icon font) au lieu de svg */
.promagnifier i,
.promagnifier:before,
.proloading i,
.proloading:before {
  display: block !important;
  margin: auto !important;
  text-align: center !important;
  position: relative !important;
  font-size: 13px !important;
  line-height: 1 !important;
  color: #fff !important;
}

/* Hero ASP : button bigger */
.sx-hero-asp-wrap .promagnifier {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;
}
.sx-hero-asp-wrap .promagnifier svg {
  width: 18px !important;
  height: 18px !important;
}
.sx-hero-asp-wrap .promagnifier i,
.sx-hero-asp-wrap .promagnifier:before {
  font-size: 18px !important;
}

/* Header ASP : button moyen */
#brx-header .promagnifier {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
}
#brx-header .promagnifier svg {
  width: 14px !important;
  height: 14px !important;
}

/* Bouton "Chercher" custom hero (sx-search-form) si visible */
.sx-search-form button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.sx-search-form button svg {
  display: block !important;
  margin: auto !important;
}
/* sx-v53-loupe-center-end */


/* sx-v54-loupe-strict-center */
.promagnifier {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  vertical-align: middle !important;
  text-align: center !important;
  line-height: 1 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.promagnifier svg,
.proloading svg {
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
  display: block !important;
  align-self: center !important;
  justify-self: center !important;
  flex-shrink: 0 !important;
  flex-grow: 0 !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
}

/* Force the SVG itself to render centered */
.promagnifier svg path,
.promagnifier svg circle,
.promagnifier svg g {
  transform-origin: center center !important;
}

/* Si l'icone est font (i tag) */
.promagnifier i,
.promagnifier::before,
.proloading i,
.proloading::before {
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
  align-self: center !important;
  display: block !important;
  text-align: center !important;
  line-height: 1 !important;
  top: auto !important;
}
/* sx-v54-loupe-strict-center-end */


/* sx-v55-loupe-nuclear-center */
/* MAX specificity to beat ASP plugin defaults */
body .asp_main_container .promagnifier,
body .asp_w_container .promagnifier,
html body div.promagnifier,
html body button.promagnifier,
.brxe-offcanvas .promagnifier,
#brx-header .asp_main_container .promagnifier {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 4px !important;
  box-sizing: border-box !important;
  text-align: center !important;
  vertical-align: middle !important;
  line-height: 0 !important;
  position: relative !important;
  overflow: hidden !important;
}

body .asp_main_container .promagnifier > svg,
body .asp_w_container .promagnifier > svg,
html body div.promagnifier > svg,
html body button.promagnifier > svg,
.brxe-offcanvas .promagnifier > svg,
#brx-header .asp_main_container .promagnifier > svg,
.promagnifier > * {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  display: block !important;
  align-self: center !important;
  justify-self: center !important;
  flex-shrink: 0 !important;
  flex-grow: 0 !important;
  vertical-align: middle !important;
}

/* Direct svg child centering with grid as backup */
.promagnifier {
  display: grid !important;
  place-items: center !important;
  place-content: center !important;
}

/* If using ::before pseudo for icon */
.promagnifier::before,
.proloading::before {
  position: static !important;
  display: block !important;
  margin: 0 auto !important;
  align-self: center !important;
  justify-self: center !important;
  text-align: center !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

/* SVG path centering */
.promagnifier svg, .proloading svg {
  width: 14px !important;
  height: 14px !important;
  overflow: visible !important;
  display: block !important;
}

/* Header specific - make sure */
#brx-header .promagnifier {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  border-radius: 8px !important;
  background: var(--sx-teal, #00838f) !important;
  display: grid !important;
  place-items: center !important;
}
#brx-header .promagnifier svg {
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  fill: #fff !important;
  stroke: #fff !important;
}

/* sx-v55-loupe-nuclear-center-end */


/* sx-v56-layout-fix */

/* HERO ASP : loupe a DROITE, layout propre */
.sx-hero-asp-wrap {
  display: flex !important;
  width: 100% !important;
  max-width: 720px !important;
  margin: 1.5rem auto !important;
}
.sx-hero-asp-wrap .asp_w_container {
  width: 100% !important;
  max-width: 100% !important;
}
.sx-hero-asp-wrap .asp_main_container {
  width: 100% !important;
  max-width: 100% !important;
  background: rgba(255,255,255,0.97) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.15) !important;
  border: 1px solid rgba(0,131,143,0.15) !important;
  overflow: hidden !important;
  height: 56px !important;
  padding: 0 !important;
}
.sx-hero-asp-wrap .probox {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  margin: 0 !important;
  position: relative !important;
}
.sx-hero-asp-wrap .probox form {
  flex: 1 1 auto !important;
  order: 1 !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 100% !important;
  width: auto !important;
  background: transparent !important;
}
.sx-hero-asp-wrap .probox input.orig,
.sx-hero-asp-wrap .probox input.autocomplete {
  flex: 1 1 auto !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 1.4rem !important;
  font-size: 1rem !important;
  color: #1a202c !important;
  background: transparent !important;
  border: 0 !important;
  outline: none !important;
  margin: 0 !important;
  box-shadow: none !important;
}
.sx-hero-asp-wrap .probox input.orig::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}
.sx-hero-asp-wrap .promagnifier {
  order: 2 !important;
  flex-shrink: 0 !important;
  background: #00838f !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  margin: 6px !important;
  border-radius: 10px !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  transition: background 0.25s !important;
  position: static !important;
}
.sx-hero-asp-wrap .promagnifier:hover { background: #006d76 !important; }
.sx-hero-asp-wrap .promagnifier svg {
  width: 16px !important;
  height: 16px !important;
  fill: #fff !important;
  stroke: #fff !important;
  position: static !important;
  transform: none !important;
  margin: 0 !important;
}
.sx-hero-asp-wrap .proloading { display: none !important; }

/* HEADER search : loupe DROITE aussi, propre */
#brx-header .asp_main_container {
  background: #fff !important;
  border: 1px solid rgba(0,131,143,0.2) !important;
  border-radius: 12px !important;
  height: 40px !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
}
#brx-header .probox {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
#brx-header .probox form {
  flex: 1 1 auto !important;
  order: 1 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}
#brx-header .probox input.orig,
#brx-header .probox input.autocomplete {
  flex: 1 1 auto !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 0.95rem !important;
  font-size: 0.92rem !important;
  color: #1a202c !important;
  background: transparent !important;
  border: 0 !important;
  outline: none !important;
}
#brx-header .promagnifier {
  order: 2 !important;
  flex-shrink: 0 !important;
  background: #00838f !important;
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  margin: 5px !important;
  border-radius: 8px !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  position: static !important;
}
#brx-header .promagnifier svg {
  width: 13px !important;
  height: 13px !important;
  fill: #fff !important;
  stroke: #fff !important;
  position: static !important;
  margin: 0 !important;
}

/* H1 hero : reset taille et alignement */
#brxe-rscbkw {
  font-size: clamp(2.4rem, 5vw, 4.4rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.025em !important;
  text-align: center !important;
  max-width: 22ch !important;
  margin: 0 auto 1.5rem !important;
  text-wrap: balance !important;
  padding: 0 1rem !important;
}
@media (max-width: 768px) {
  #brxe-rscbkw {
    font-size: clamp(1.8rem, 7vw, 2.4rem) !important;
    line-height: 1.1 !important;
    max-width: 100% !important;
  }
}

/* sx-v56-layout-fix-end */


/* sx-v57-loupe-force-center */
/* Force ABSOLUTE center via grid + explicit size */
.promagnifier,
.sx-hero-asp-wrap .promagnifier,
.sx-hero-asp-clone .promagnifier,
.sx-hero-asp-wrap .asp_main_container .promagnifier,
#brx-header .promagnifier {
  display: grid !important;
  place-items: center !important;
  place-content: center !important;
  align-content: center !important;
  justify-content: center !important;
  align-items: center !important;
  justify-items: center !important;
  padding: 0 !important;
  border: 0 !important;
  box-sizing: border-box !important;
  line-height: 0 !important;
}

.promagnifier > *,
.promagnifier svg,
.promagnifier i,
.promagnifier::before,
.sx-hero-asp-wrap .promagnifier > *,
.sx-hero-asp-clone .promagnifier > * {
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  align-self: center !important;
  justify-self: center !important;
  grid-area: 1 / 1 !important;
  flex: 0 0 auto !important;
  vertical-align: middle !important;
}

/* Force button explicit dimensions */
.sx-hero-asp-wrap .promagnifier,
.sx-hero-asp-clone .promagnifier {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  background: #00838f !important;
  border-radius: 10px !important;
  margin: 6px !important;
  flex-shrink: 0 !important;
}
.sx-hero-asp-wrap .promagnifier svg,
.sx-hero-asp-clone .promagnifier svg {
  width: 16px !important;
  height: 16px !important;
  fill: #fff !important;
  stroke: #fff !important;
  display: block !important;
}

#brx-header .promagnifier {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  max-width: 30px !important;
  max-height: 30px !important;
  background: #00838f !important;
  border-radius: 8px !important;
}
#brx-header .promagnifier svg {
  width: 13px !important;
  height: 13px !important;
  fill: #fff !important;
  stroke: #fff !important;
  display: block !important;
}

/* Kill any pseudo on promagnifier that could push svg */
.promagnifier::before,
.promagnifier::after {
  content: none !important;
  display: none !important;
}
/* sx-v57-loupe-force-center-end */


/* sx-v58-innericon-center */
.promagnifier .innericon,
.proloading .innericon,
.sx-hero-asp-wrap .innericon,
.sx-hero-asp-clone .innericon,
#brx-header .innericon {
  display: grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  position: static !important;
  line-height: 0 !important;
}

.promagnifier .innericon svg,
.proloading .innericon svg {
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  align-self: center !important;
  justify-self: center !important;
  transform: none !important;
}

/* Hide ASP text button (it was offscreen anyway but force) */
.promagnifier .asp_text_button,
.proloading .asp_text_button {
  display: none !important;
  position: absolute !important;
  left: -9999px !important;
}
.promagnifier .asp_clear,
.proloading .asp_clear {
  position: absolute !important;
  display: none !important;
}

/* Force innericon to fill button */
.sx-hero-asp-wrap .promagnifier .innericon,
.sx-hero-asp-clone .promagnifier .innericon {
  width: 44px !important;
  height: 44px !important;
}
.sx-hero-asp-wrap .promagnifier .innericon svg,
.sx-hero-asp-clone .promagnifier .innericon svg {
  width: 16px !important;
  height: 16px !important;
}

#brx-header .promagnifier .innericon {
  width: 30px !important;
  height: 30px !important;
}
#brx-header .promagnifier .innericon svg {
  width: 13px !important;
  height: 13px !important;
}
/* sx-v58-innericon-center-end */


/* sx-v59-mobile-final-fix */

/* HIDE the ASP search INSIDE the offcanvas (it was cloned to hero, original duplicate visible) */
.brxe-offcanvas .brx-offcanvas-inner .asp_w_container,
.brxe-offcanvas .brx-offcanvas-inner .asp_main_container,
.brxe-offcanvas .brx-offcanvas-inner .brxe-shortcode {
  display: none !important;
}

/* Sauf si dans sx-fullmenu */
.sx-fullmenu .asp_w_container,
.sx-fullmenu .asp_main_container,
[data-sx-fullmenu] .asp_w_container {
  display: none !important;
}

/* HERO ASP : ENSURE button on RIGHT (force order) */
.sx-hero-asp-wrap .probox {
  display: flex !important;
  flex-direction: row !important;
}
.sx-hero-asp-wrap .probox > form,
.sx-hero-asp-wrap .probox form {
  order: 1 !important;
  flex: 1 1 auto !important;
}
.sx-hero-asp-wrap .probox > .promagnifier,
.sx-hero-asp-wrap .probox .promagnifier {
  order: 99 !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
}
.sx-hero-asp-wrap .probox .proloading {
  display: none !important;
}

/* Hide the asp_text_button hiddend (the broken "R...e" text) */
.promagnifier .asp_text_button {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  position: absolute !important;
  left: -9999px !important;
}

/* Force fullmenu visible in offcanvas (priority) */
.brxe-offcanvas .brx-offcanvas-inner [data-sx-fullmenu],
.brxe-offcanvas .brx-offcanvas-inner .sx-fullmenu {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 100 !important;
}

/* Hide native Bricks nav inside offcanvas */
.brxe-offcanvas .brx-offcanvas-inner > .brxe-nav-nested,
.brxe-offcanvas .brx-offcanvas-inner > nav,
.brxe-offcanvas .brx-offcanvas-inner > .brxe-shortcode {
  display: none !important;
}

/* sx-v59-mobile-final-fix-end */


/* sx-v60-center-hero-search */

/* Container of the hero search (parent of sx-hero-asp-wrap) */
.sx-hero-search,
.sx-hero-bar .sx-hero-search,
.sx-hero-bar .sx-search-wrap,
.sx-search-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  text-align: center !important;
}

/* Parent flex container */
.sx-hero-bar,
.sx-container.sx-hero-flex,
#brxe-olywij .brxe-container,
#brxe-ejehwy {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
}

/* The ASP wrapper itself */
.sx-hero-asp-wrap {
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 1.5rem !important;
  margin-bottom: 1rem !important;
  width: 100% !important;
  max-width: 720px !important;
  display: block !important;
  align-self: center !important;
  justify-self: center !important;
}

/* Hero pill, status, quicks - center too */
.sx-hero-quicks,
.sx-status-live,
.sx-hero-quicks span,
.sx-hero-pill {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

/* H1 hero center */
#brxe-rscbkw,
#brxe-olywij h1 {
  text-align: center !important;
  margin: 0 auto 1.5rem !important;
}

/* Subtitle */
#brxe-xkpuak,
#brxe-olywij p {
  text-align: center !important;
  margin: 0 auto 1rem !important;
}

/* sx-v60-center-hero-search-end */


/* sx-v99-fullmenu-nuclear */
/* Fix from CSS audit agent : :has() pattern + parent visibility */
.brx-offcanvas-inner > *:has([data-sx-fullmenu]),
.brx-offcanvas-inner [data-sx-fullmenu],
.brx-offcanvas-inner [data-sx-fullmenu] * {
  display: revert !important;
  visibility: visible !important;
  height: auto !important;
  width: auto !important;
  opacity: 1 !important;
  position: static !important;
  left: auto !important;
}
.brx-offcanvas-inner > *:has([data-sx-fullmenu]) {
  display: block !important;
  width: 100% !important;
  z-index: 100 !important;
}
[data-sx-fullmenu] {
  display: block !important;
  width: 100% !important;
}
.sx-fullmenu .sx-fm-cta { display: grid !important; }
.sx-fullmenu .sx-fm-section { display: block !important; }
.sx-fullmenu .sx-fm-list { display: flex !important; flex-direction: column !important; }
.sx-fullmenu .sx-fm-list li a { display: flex !important; }
.sx-fullmenu .sx-fm-contact { display: block !important; }
/* sx-v99-fullmenu-nuclear-end */


/* sx-v100-desktop-fixes (from audit agent) */

/* Fix 1: H1 hero center aligned */
#brxe-rscbkw {
  text-align: center !important;
  max-width: 980px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Fix 2: Single hamburger per breakpoint - explicit */
#brxe-qhvoyt, #brxe-zlzpvq, #brxe-wgwbjg {
  display: none !important;
}
@media (max-width: 767px) {
  #brxe-qhvoyt, #brxe-wgwbjg {
    display: inline-flex !important;
  }
  #brxe-vmramk {
    display: none !important;
  }
  #brxe-zlzpvq {
    display: none !important; /* close button - only when offcanvas open */
  }
}

/* Fix 3: vmramk position static on desktop (was absolute, overlapping cart) */
@media (min-width: 768px) {
  #brxe-vmramk {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    align-self: center !important;
  }
}

/* Fix 4: hero flex column not row */
#brxe-olywij {
  flex-direction: column !important;
  justify-content: center !important;
}

/* Fix 5: header section overflow-x clip */
#brx-header > section.brxe-section,
#brx-header section.brxe-section {
  overflow-x: clip !important;
}

/* sx-v100-desktop-fixes-end */


/* sx-v101-hero-consolide (Agent 2 report - 5 single-rule fixes) */

/* 1. CENTER ASP wrap horizontally - beat width:auto leakage */
.sx-hero-bar .sx-hero-search .sx-hero-asp-wrap,
.sx-hero-bar .sx-hero-asp-wrap {
  display: block !important;
  width: min(100%, 720px) !important;
  max-width: 720px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}

/* 2. Force probox row + form left + loupe right (collapse 9 layers) */
.sx-hero-asp-wrap .probox,
.sx-hero-asp-clone .probox {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  text-align: left !important;
}
.sx-hero-asp-wrap .probox > form { flex: 1 1 auto !important; order: 1 !important; min-width: 0 !important; }
.sx-hero-asp-wrap .probox > .promagnifier { order: 99 !important; margin-left: auto !important; flex: 0 0 auto !important; }

/* 3. SVG dead-center inside loupe - defeat ASP transform:translate */
.sx-hero-asp-wrap .promagnifier {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  line-height: 0 !important;
}
.sx-hero-asp-wrap .promagnifier > svg,
.sx-hero-asp-wrap .promagnifier .innericon,
.sx-hero-asp-wrap .promagnifier .innericon > svg {
  position: static !important;
  inset: auto !important;
  margin: 0 !important;
  transform: none !important;
  align-self: center !important;
  justify-self: center !important;
  display: block !important;
}

/* 4. Placeholder readable slate-600 (8.3:1 contrast vs 3.4:1) */
.sx-hero-asp-wrap .probox input.orig::placeholder,
.sx-hero-asp-wrap .probox input.autocomplete::placeholder,
.sx-hero-asp-wrap input::placeholder {
  color: #475569 !important;
  opacity: 1 !important;
  font-weight: 500 !important;
}

/* 5. Kill legacy .sx-search-form (no flash of duplicate bar) */
.sx-hero-bar .sx-search-form { display: none !important; }
.sx-hero-search:has(.sx-hero-asp-wrap) > .sx-search-form,
.sx-hero-search:has(.sx-hero-asp-clone) > .sx-search-form { display: none !important; }

/* sx-v101-hero-consolide-end */


/* sx-v102-header-align */
/* Force ALL header items aligned center vertically + on same row */

#brx-header > section,
#brx-header > div,
#brx-header section.brxe-section,
#brx-header section.brxe-section > .brxe-container,
#brx-header section.brxe-section .brxe-block:not([class*="offcanvas"]) {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
}

/* Account icon (link to mon-compte) */
#brx-header a[href*="mon-compte"],
#brx-header a[href*="/account/"],
#brx-header [class*="account"]:not([class*="content"]),
#brx-header .brxe-icon[id*="account"] {
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
  position: relative !important;
  top: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Cart */
#brx-header .brxe-woocommerce-mini-cart,
#brx-header .mini-cart-link {
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
  position: relative !important;
}

/* Right block (cart + account container) - force flex row */
#brx-header section.brxe-section > .brxe-container > .brxe-block:last-child,
#brx-header [class*="right"]:not([class*="border"]) {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 1rem !important;
}

/* Mobile - same alignment but compact */
@media (max-width: 767px) {
  #brx-header > section,
  #brx-header > div,
  #brx-header section.brxe-section {
    flex-wrap: nowrap !important;
    align-items: center !important;
    padding: 0.5rem 0.75rem !important;
    gap: 0.5rem !important;
  }
  #brx-header img[src*="logo"] {
    height: 44px !important;
    width: auto !important;
  }
  /* All icons same size mobile */
  #brx-header svg,
  #brx-header .brxe-icon i {
    align-self: center !important;
  }
}

/* sx-v102-header-align-end */


/* sx-v103-offcanvas-inner-height */
/* Parent .brx-offcanvas-inner had height:0 collapsed - menu inside but invisible */
.brxe-offcanvas .brx-offcanvas-inner,
.brxe-offcanvas[data-direction="left"] .brx-offcanvas-inner,
.brxe-offcanvas[data-direction="right"] .brx-offcanvas-inner,
.brxe-offcanvas.brx-open .brx-offcanvas-inner {
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100vh !important;
  max-height: 100dvh !important;
  min-height: 100vh !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: #fff !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 99999 !important;
}

/* Hide native bricks-lazy class effect */
.brxe-offcanvas .brx-offcanvas-inner.bricks-lazy-hidden,
.brxe-offcanvas.brx-open .brx-offcanvas-inner {
  background: #fff !important;
}

/* Force fullmenu inside to be inside the visible viewport */
.brxe-offcanvas .brx-offcanvas-inner [data-sx-fullmenu] {
  display: block !important;
  width: 100% !important;
  max-width: 100vw !important;
  position: relative !important;
  top: 0 !important;
  z-index: 100 !important;
  background: #fff !important;
}

/* sx-v103-offcanvas-inner-height-end */


/* sx-v104-h1-center-mobile */
#brxe-rscbkw,
#brxe-olywij h1,
body.home #brxe-rscbkw {
  text-align: center !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  display: block !important;
  width: 100% !important;
  text-wrap: balance !important;
  text-indent: 0 !important;
  float: none !important;
}

#brxe-gjalcd,
#brxe-ejehwy {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  box-sizing: border-box !important;
}

#brxe-olywij {
  text-align: center !important;
  align-items: center !important;
  justify-content: center !important;
}

@media (max-width: 767px) {
  #brxe-rscbkw {
    font-size: clamp(1.6rem, 7vw, 2.2rem) !important;
    line-height: 1.15 !important;
    max-width: 100% !important;
    padding: 0 0.5rem !important;
    text-align: center !important;
  }
  #brxe-gjalcd, #brxe-ejehwy {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
}
/* sx-v104-h1-center-mobile-end */


/* sx-v105-rollback-stable */
/* Remove conflicting position:fixed on inner that broke desktop offcanvas open */
.brxe-offcanvas .brx-offcanvas-inner {
  position: relative !important;
  height: auto !important;
  min-height: auto !important;
  z-index: auto !important;
  top: auto !important;
}
/* When offcanvas is OPEN, then inner full screen */
.brxe-offcanvas.brx-open .brx-offcanvas-inner,
body.brx-open-active .brx-offcanvas-inner {
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  overflow-y: auto !important;
  background: #fff !important;
}
/* sx-v105-rollback-stable-end */


/* sx-v106-final-align */

/* ALL header items same row + center aligned vertically */
#brx-header,
#brx-header > section,
#brx-header section.brxe-section,
#brx-header section.brxe-section > .brxe-container,
#brx-header section.brxe-section .brxe-block:not([class*="offcanvas"]):not([class*="lazy"]) {
  align-items: center !important;
}

/* Right block container (cart + login + hamburger) - same horizontal row */
#brx-header section.brxe-section > .brxe-container > .brxe-block:last-child,
#brx-header section.brxe-section > .brxe-container > .brxe-div:last-child,
#brx-header section.brxe-section > div:last-child,
#brxe-pvrqgj,
#brxe-zdbhew {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 1rem !important;
  flex-wrap: nowrap !important;
}

/* All icon links/buttons in header center vertically */
#brx-header a,
#brx-header button,
#brx-header .brxe-svg,
#brx-header .brxe-icon,
#brx-header .brxe-woocommerce-mini-cart,
#brx-header .mini-cart-link,
#brx-header [class*="account"],
#brx-header [href*="mon-compte"] {
  align-self: center !important;
  vertical-align: middle !important;
}

/* Specific account icon override */
#brx-header a[href*="mon-compte"],
#brx-header a[href*="account"],
#brx-header [aria-label*="compte"],
#brx-header [aria-label*="ompte"] {
  display: inline-flex !important;
  align-items: center !important;
  align-self: center !important;
  position: relative !important;
  top: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Mobile : everything compact same row */
@media (max-width: 767px) {
  #brx-header section.brxe-section,
  #brx-header section.brxe-section > .brxe-container {
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 0.4rem !important;
    padding: 0.5rem 0.85rem !important;
  }
  #brx-header img[src*="logo"] {
    height: 44px !important;
    width: auto !important;
  }
}

/* sx-v106-final-align-end */


/* sx-v107-hero-search-mobile-wider */
@media (max-width: 767px) {
  .sx-hero-asp-wrap,
  .sx-hero-bar .sx-hero-asp-wrap {
    width: calc(100vw - 2rem) !important;
    max-width: calc(100vw - 2rem) !important;
    margin: 1.2rem auto !important;
    padding: 0 !important;
  }
  
  /* Reduce parent padding to give more room */
  .sx-hero-bar,
  .sx-hero-search,
  .sx-hero-bar .sx-container.sx-hero-flex {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  
  .sx-hero-asp-wrap .asp_main_container {
    height: 56px !important;
  }
  
  .sx-hero-asp-wrap .probox input.orig {
    font-size: 1rem !important;
    padding: 0 1.2rem !important;
  }
  
  .sx-hero-asp-wrap .promagnifier {
    width: 44px !important;
    height: 44px !important;
    margin: 6px !important;
  }
  
  .sx-hero-asp-wrap .promagnifier svg {
    width: 16px !important;
    height: 16px !important;
  }
}

@media (max-width: 480px) {
  .sx-hero-asp-wrap,
  .sx-hero-bar .sx-hero-asp-wrap {
    width: calc(100vw - 1.5rem) !important;
    max-width: calc(100vw - 1.5rem) !important;
    margin: 1rem auto !important;
  }
  .sx-hero-bar, .sx-hero-search { padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
}
/* sx-v107-hero-search-mobile-wider-end */


/* sx-v108-products-asp-fix */

/* ASP top of mobile menu */
.sx-fm-search {
  padding: 0.85rem 0.85rem 0 !important;
  background: #fff !important;
}
.sx-fm-search .asp_main_container {
  width: 100% !important;
  max-width: 100% !important;
  background: #f5f7fa !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  border-radius: 12px !important;
  height: 48px !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
}
.sx-fm-search .probox {
  display: flex !important;
  flex-direction: row !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
}
.sx-fm-search .probox form {
  flex: 1 1 auto !important;
  order: 1 !important;
}
.sx-fm-search .probox input.orig {
  width: 100% !important;
  height: 100% !important;
  padding: 0 1rem !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 0.95rem !important;
  color: #1a202c !important;
}
.sx-fm-search .promagnifier {
  order: 99 !important;
  width: 38px !important;
  height: 38px !important;
  margin: 5px !important;
  background: #00838f !important;
  border-radius: 8px !important;
  display: grid !important;
  place-items: center !important;
  flex-shrink: 0 !important;
}
.sx-fm-search .promagnifier svg {
  width: 14px !important;
  height: 14px !important;
  fill: #fff !important;
}
.sx-fm-search .proloading { display: none !important; }
.sx-fm-search .asp_text_button { display: none !important; }

/* Products page : fix mobile ASP buttons centered (dead center) */
@media (max-width: 767px) {
  body.archive .asp_main_container,
  body.tax-product_cat .asp_main_container,
  body.post-type-archive-product .asp_main_container,
  .archive .asp_main_container,
  .tax-product_cat .asp_main_container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 1rem !important;
  }
  
  /* Filter buttons / sort buttons not centered */
  body.archive .woocommerce-ordering,
  body.archive .filter-button,
  body.tax-product_cat .woocommerce-ordering,
  body.archive .wc-block-product-sort-select,
  body.archive [class*="ordering"],
  body.archive [class*="filter"]:not([class*="filtered"]) {
    text-align: left !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    width: 100% !important;
  }
  
  /* Pagination buttons left-align mobile */
  body.archive .woocommerce-pagination,
  body.tax-product_cat .woocommerce-pagination {
    text-align: center !important;
  }
  
  /* Add to cart / View buttons stay full width */
  body.archive .button.add_to_cart_button,
  body.tax-product_cat .button.add_to_cart_button,
  body.archive .product .button {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
  }
}

/* sx-v108-products-asp-fix-end */


/* sx-v109-internal-pages-padding */
/* Header sticky cachait le debut des pages internes - add scroll-padding + body padding */

html {
  scroll-padding-top: 100px !important;
}

/* Internal pages (not home) - add padding to first content */
body:not(.home) #brx-content,
body:not(.home) main,
body:not(.home) .brx-content {
  padding-top: 80px !important;
}

/* Specific pages */
body.page-id-5891 #brx-content,    /* qui-sommes-nous */
body.page-id-5824 #brx-content,    /* home */
body.page-template-default #brx-content {
  padding-top: 0 !important;       /* home stays no padding */
}

body:not(.home) #brx-content > section:first-child,
body:not(.home) main > section:first-child,
body:not(.home) #brx-content > div:first-child {
  padding-top: clamp(2rem, 4vw, 4rem) !important;
}

/* Specific qui-sommes-nous page */
body.page-id-5891 #brx-content {
  padding-top: 60px !important;
}
body.page-id-5891 #brx-content > section:first-child,
body.page-id-5891 #brx-content > div:first-child {
  padding-top: 2rem !important;
}

/* Service pages (lavage-vitres etc) */
body.page-template-default #brx-content > .sx-svc-page,
body.page .sx-svc-page {
  padding-top: clamp(60px, 8vw, 100px) !important;
}

/* Mobile : header smaller so less padding needed */
@media (max-width: 767px) {
  html { scroll-padding-top: 70px !important; }
  body:not(.home) #brx-content { padding-top: 60px !important; }
  body.page-id-5891 #brx-content { padding-top: 50px !important; }
}

/* sx-v109-internal-pages-padding-end */

/* === sx-SUBS-CTA-BUTTONS (2026-04-29) === */
/* Subtitles must be readable on light section backgrounds (rgb(248,249,250)).
   The default rgba(255,255,255,.96) is white-on-white. */
section.sx-cat .sx-sub,
section.sx-services .sx-sub,
section[class*="sx-cat"] .sx-sub,
section[class*="sx-services"] .sx-sub,
.sx-cat .sx-container .sx-sub,
.sx-services .sx-container .sx-sub {
  color: rgba(29, 35, 39, 0.72) !important;
}

/* Equal-width CTA buttons in dark section */
.sx-cta-btns {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  width: 100%;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}
.sx-cta-btns .sx-primary,
.sx-cta-btns .sx-secondary {
  flex: 1 1 280px;
  min-width: 240px;
  max-width: 340px;
  text-align: center !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  padding-left: clamp(1rem, 3vw, 2rem) !important;
  padding-right: clamp(1rem, 3vw, 2rem) !important;
}
@media (max-width: 480px) {
  .sx-cta-btns .sx-primary,
  .sx-cta-btns .sx-secondary {
    flex: 1 1 100%;
    max-width: 100%;
  }
}
/* === end sx-SUBS-CTA-BUTTONS === */

/* === sx-WHY-GRID-DESKTOP (2026-04-29) === */
/* Align 'Pourquoi Sani Express' 4-column features vertically */
.sx-why-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: clamp(1.5rem, 2.5vw, 2rem) !important;
  align-items: stretch !important;
}
@media (max-width: 991px) {
  .sx-why-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 559px) {
  .sx-why-grid { grid-template-columns: 1fr !important; }
}
.sx-why-grid .sx-feat {
  display: grid !important;
  grid-template-rows: auto 2.4em 1fr !important;
  gap: 0.75rem !important;
  text-align: center;
  align-items: start;
  justify-items: center;
}
.sx-why-grid .sx-feat h3 {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}
.sx-why-grid .sx-feat p {
  margin: 0 !important;
  text-align: center;
}
.sx-why-grid .sx-feat .icon {
  margin: 0 auto;
}
/* === end sx-WHY-GRID-DESKTOP === */

/* === sx-MINI-CART (2026-04-29) === */
/* Cause finale : la transition CSS reste running à currentTime:0
   indéfiniment. Solution: transition: none + animation: none pour skip. */
.brxe-woocommerce-mini-cart.show-cart-details .cart-detail,
.brxe-woocommerce-mini-cart.show-cart-details [class*="cart-detail-"],
.brxe-woocommerce-mini-cart .cart-detail.show,
.brxe-woocommerce-mini-cart .cart-detail.active {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 99999 !important;
  display: block !important;
  transition: none !important;
  animation: none !important;
  transform: none !important;
}

/* Hidden state when not opened */
.brxe-woocommerce-mini-cart:not(.show-cart-details) .cart-detail:not(.active) {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: none !important;
}

/* Header sections z-index above page sections (z:1) */
#brx-header section.brxe-section,
header.brxe-header section.brxe-section {
  z-index: 200 !important;
}
/* The section containing the mini-cart needs even higher z to be above
   any sibling header section that comes later in DOM */
#brx-header section.brxe-section:has(.brxe-woocommerce-mini-cart),
header.brxe-header section.brxe-section:has(.brxe-woocommerce-mini-cart) {
  z-index: 300 !important;
}
/* === end sx-MINI-CART === */

/* === sx-WC-PAGES-MOBILE (2026-04-29) === */
/* Pages panier/checkout/mon-compte n'ont pas de padding horizontal sur mobile. */
@media (max-width: 768px) {
  body.woocommerce-page #brx-content,
  body.woocommerce-cart #brx-content,
  body.woocommerce-checkout #brx-content,
  body.woocommerce-account #brx-content {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    box-sizing: border-box;
  }
  /* Tableaux WC qui débordent souvent */
  body.woocommerce-page table.shop_table {
    width: 100% !important;
    box-sizing: border-box;
  }
  body.woocommerce-page .cart_totals,
  body.woocommerce-page .woocommerce-checkout-review-order,
  body.woocommerce-page .woocommerce-MyAccount-content {
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
  }
  /* Buttons full width on mobile */
  body.woocommerce-page button.button,
  body.woocommerce-page input[type="submit"].button {
    width: 100% !important;
  }
}
@media (max-width: 480px) {
  body.woocommerce-page #brx-content,
  body.woocommerce-cart #brx-content,
  body.woocommerce-checkout #brx-content,
  body.woocommerce-account #brx-content {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }
}
/* === end sx-WC-PAGES-MOBILE === */



/* === sx-CART-DESKTOP (2026-04-29) === */
/* Cart page table title was clipped on desktop. Force horizontal padding
   and prevent overflow:hidden on parent. */
body.woocommerce-cart #brx-content,
body.woocommerce-checkout #brx-content,
body.woocommerce-account #brx-content {
  padding-left: clamp(1rem, 4vw, 3rem) !important;
  padding-right: clamp(1rem, 4vw, 3rem) !important;
  overflow-x: visible !important;
  box-sizing: border-box;
}
body.woocommerce-cart .shop_table,
body.woocommerce-cart .woocommerce-cart-form,
body.woocommerce-checkout .woocommerce-checkout {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  box-sizing: border-box;
}
body.woocommerce-cart .product-name,
body.woocommerce-cart .product-name a {
  white-space: normal !important;
  word-break: break-word !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
body.woocommerce-cart td,
body.woocommerce-cart th {
  overflow: visible !important;
}
/* === end sx-CART-DESKTOP === */

/* === sx-WHY-GRID-MOBILE (2026-04-29) === */
/* On mobile, override v114 grid-template-rows: auto 2.4em 1fr which causes
   H3 to overlap when paragraph above is longer than expected. */
@media (max-width: 991px) {
  .sx-why-grid .sx-feat {
    display: flex !important;
    flex-direction: column !important;
    grid-template-rows: none !important;
    gap: 1rem !important;
    align-items: center;
  }
  .sx-why-grid .sx-feat h3 {
    min-height: auto !important;
    text-align: center !important;
    margin-bottom: 0.5rem !important;
    line-height: 1.3 !important;
  }
  .sx-why-grid .sx-feat p {
    margin-top: 0 !important;
  }
  .sx-why-grid {
    gap: 2.5rem !important;
  }
}
/* === end sx-WHY-GRID-MOBILE === */

/* === sx-CRITICAL-BG (2026-04-29) === */
/* Force-load critical above-the-fold bg-images so they're never lazy-hidden.
   These specific section-level bg-images would otherwise wait for IntersectionObserver. */

/* QSN hero (page id 5891) */
body.page-id-5891 #brx-content > section:first-of-type,
body.page-id-5891 #brxe-ocnrwn {
  background-image: url('https://www.saniexpress.ca/wp-content/uploads/2025/09/saniexpresshero.webp') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* Hide lazy-hidden CSS-effect: do NOT touch image lazy-load swap.
   Just override any hidden visibility that the Bricks lazy class might inflict. */
.bricks-lazy-hidden {
  visibility: visible !important;
  opacity: 1 !important;
}
/* === end sx-CRITICAL-BG === */

/* === sx-DROPDOWN-DEFAULT-HIDDEN (2026-04-29) === */
/* Force the desktop dropdown content hidden by default; only show on hover or when .open class added by user interaction. */
@media (min-width: 768px) {
  #brx-header li.brxe-dropdown:not(.open):not(:hover):not(:focus-within) > ul.brx-dropdown-content,
  #brx-header li.brxe-dropdown:not(.open):not(:hover):not(:focus-within) > .brx-dropdown-content,
  #brx-header li.brx-has-megamenu:not(.open):not(:hover):not(:focus-within) > ul.brx-dropdown-content,
  #brx-header li.brx-has-megamenu:not(.open):not(:hover):not(:focus-within) > .brx-dropdown-content {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  #brx-header li.brxe-dropdown:hover > ul.brx-dropdown-content,
  #brx-header li.brxe-dropdown:hover > .brx-dropdown-content,
  #brx-header li.brxe-dropdown.open > ul.brx-dropdown-content,
  #brx-header li.brxe-dropdown.open > .brx-dropdown-content {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
}
/* === end sx-DROPDOWN-DEFAULT-HIDDEN === */

/* === sx-DROPDOWN-BG-OPAQUE (2026-04-29) === */
/* Force the desktop dropdown content to be visually opaque
   (was transparent because bricks-lazy-hidden stripped its bg-image). */
@media (min-width: 768px) {
  #brx-header li.brxe-dropdown > ul.brx-dropdown-content,
  #brx-header li.brxe-dropdown > .brx-dropdown-content,
  #brx-header li.brx-has-megamenu > ul.brx-dropdown-content,
  #brx-header li.brx-has-megamenu > .brx-dropdown-content {
    background-color: #ffffff !important;
    background-image: none !important;
    box-shadow: 0 24px 48px -12px rgba(15, 18, 20, 0.18), 0 8px 24px -8px rgba(15, 18, 20, 0.12) !important;
    border-top: 2px solid #3a9bb8 !important;
  }
}
/* === end sx-DROPDOWN-BG-OPAQUE === */

/* === sx-DROPDOWN-TRIM-COLS (2026-04-29) === */
/* Hide unused dropdown columns (stronger specificity vs Bricks). */
@media (min-width: 768px) {
  body #brx-header #brxe-zpeknr,
  body #brx-header #brxe-lqhaox,
  body #brx-header #brxe-nmqbxq,
  html body #brxe-zpeknr,
  html body #brxe-lqhaox,
  html body #brxe-nmqbxq {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    flex: 0 0 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  body #brxe-pzgutb {
    justify-content: center !important;
  }
  body #brxe-fyntci {
    max-width: 800px !important;
    margin: 0 auto !important;
    flex: 0 1 800px !important;
  }
}
/* === end sx-DROPDOWN-TRIM-COLS === */

/* === sx-MENU-DESKTOP-REDESIGN (2026-04-29) === */
/* Complete visual rewrite of the desktop dropdown menu. Modern grid + clean spacing. */
@media (min-width: 768px) {
  /* Hide the "Nos Produits" H5 label inside dropdown column */
  body #brxe-gjyvrc {
    display: none !important;
  }

  /* Center & cap the dropdown */
  body #brxe-pzgutb {
    justify-content: center !important;
    padding: 1.5rem 2rem 2rem !important;
  }
  body #brxe-fyntci {
    max-width: 960px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  /* Categories grid: 2 columns, clean cards */
  body #brxe-cjhomk {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.5rem 1.5rem !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  body #brxe-cjhomk > ul {
    display: contents !important;
  }
  body #brxe-cjhomk > ul > li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid rgba(15, 18, 20, 0.06) !important;
  }
  body #brxe-cjhomk > ul > li:hover {
    background: rgba(58, 155, 184, 0.06) !important;
  }
  body #brxe-cjhomk > ul > li > a,
  body #brxe-cjhomk > ul > li > .bu-acrd-menu-link {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0.85rem 0.5rem !important;
    font-size: 0.95rem !important;
    font-weight: 500 !important;
    color: #1d2327 !important;
    text-decoration: none !important;
    border-radius: 4px !important;
    transition: color 0.15s, background 0.15s !important;
  }
  body #brxe-cjhomk > ul > li > a:hover,
  body #brxe-cjhomk > ul > li > .bu-acrd-menu-link:hover {
    color: #3a9bb8 !important;
  }
  /* Sub-items (revealed on hover/click) — keep them subtle */
  body #brxe-cjhomk ul ul {
    background: rgba(15, 18, 20, 0.02) !important;
    padding: 0.25rem 0.5rem 0.5rem 1.5rem !important;
    border-radius: 0 0 4px 4px !important;
  }
  body #brxe-cjhomk ul ul li > a {
    padding: 0.4rem 0.5rem !important;
    font-size: 0.85rem !important;
    color: #5b6770 !important;
  }
  body #brxe-cjhomk ul ul li > a:hover {
    color: #3a9bb8 !important;
  }
  /* Accordion toggle arrows: smaller, more refined */
  body #brxe-cjhomk .bu-acrd-arrow,
  body #brxe-cjhomk [class*="arrow"] {
    width: 14px !important;
    height: 14px !important;
    opacity: 0.5 !important;
    transition: opacity 0.15s, transform 0.2s !important;
  }
  body #brxe-cjhomk li:hover .bu-acrd-arrow,
  body #brxe-cjhomk li:hover [class*="arrow"] {
    opacity: 1 !important;
  }

  /* Make the dropdown wrapper itself cleaner */
  body #brxe-pzgutb {
    border-radius: 0 0 12px 12px !important;
    box-shadow: 0 24px 48px -12px rgba(15, 18, 20, 0.18), 0 8px 24px -8px rgba(15, 18, 20, 0.12) !important;
    border-top: 2px solid #3a9bb8 !important;
    background: #ffffff !important;
  }
}
/* === end sx-MENU-DESKTOP-REDESIGN === */

/* === sx-HERO-LCP-NO-ANIM (2026-04-29) === */
/* Disable sxImgReveal animation on hero (above-fold images must be visible
   immediately, not wait for IntersectionObserver trigger). */
#brxe-odgvii,
.sx-hero-eager img,
.sx-hero-eager [class*="image"],
img[src*="signature-bandeau-sani"],
section:first-of-type img:not([class*="logo"]) {
  animation: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}
/* Same for the H1 if it has the reveal animation */
.sx-hero-eager h1, .sx-hero-eager h2 {
  animation: none !important;
  opacity: 1 !important;
}
/* === end sx-HERO-LCP-NO-ANIM === */



/* sx-v149-SUB-CONTRAST: lisibilité des sous-titres .sx-sub sur fond clair (étaient blanc 96% sur blanc) */
p.sx-sub{color:#2a4a52!important;opacity:.78!important;letter-spacing:.045em!important;font-weight:500!important}
/* sx-v149-SUB-CONTRAST-end */

/* sx-v150-NO-HYPHEN: stop césure type "Embal-lages alimentaires" sur titres de tiles */
.sx-tile h3,.sx-tile h4,.sx-tile-title{hyphens:none!important;-webkit-hyphens:none!important;word-break:normal!important;overflow-wrap:break-word!important}
/* sx-v150-NO-HYPHEN-end */

/* sx-v151-TILE-SCRUBBER: hover signature autorécureuse — balayage de gloss teal + élévation + ring */
.sx-tile{position:relative;overflow:hidden;transition:transform .42s cubic-bezier(.16,1,.3,1),border-color .42s ease,box-shadow .42s ease;border:1px solid rgba(58,155,184,.12)}
.sx-tile::after{content:'';position:absolute;top:0;bottom:0;left:-60%;width:45%;background:linear-gradient(115deg,rgba(255,255,255,0) 0%,rgba(58,155,184,.10) 35%,rgba(255,255,255,.55) 50%,rgba(58,155,184,.10) 65%,rgba(255,255,255,0) 100%);transform:skewX(-22deg);transition:left .95s cubic-bezier(.22,.61,.36,1);pointer-events:none;mix-blend-mode:overlay}
.sx-tile:hover{transform:translateY(-5px);border-color:rgba(58,155,184,.55);box-shadow:0 18px 38px -16px rgba(58,155,184,.32),0 6px 14px -6px rgba(15,18,20,.07)}
.sx-tile:hover::after{left:110%}
@media (prefers-reduced-motion: reduce){.sx-tile,.sx-tile::after{transition:none!important}.sx-tile:hover{transform:none!important}}
/* sx-v151-TILE-SCRUBBER-end */

/* sx-v152-CTA-LINE: underline animé sur les CTA des tiles (EN SAVOIR PLUS / VOIR LES X PRODUITS) */
.sx-tile-cta{position:relative;display:inline-block}
.sx-tile-cta::after{content:'';position:absolute;left:0;bottom:-3px;width:0;height:1.5px;background:linear-gradient(90deg,#3a9bb8,#6cc8dd);transition:width .5s cubic-bezier(.16,1,.3,1)}
.sx-tile:hover .sx-tile-cta::after{width:100%}
/* sx-v152-CTA-LINE-end */

/* sx-v153-HERO-H1-FORCE: re-force gradient teal sur H1 hero (perdait le clip-path text à cause d'overrides) */
#brxe-rscbkw{background-image:linear-gradient(135deg,#ffffff 0%,#c8eef6 35%,#6cc8dd 70%,#3a9bb8 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;filter:drop-shadow(0 2px 22px rgba(58,155,184,.30)) drop-shadow(0 0 1px rgba(255,255,255,.4))}
/* sx-v153-HERO-H1-FORCE-end */


/* sx-v149b-SUB-CONTRAST-OVERRIDE: l'ID wrapper hero #brxe-olywij forçait blanc sur tout p enfant — on regagne la spec */
#brxe-olywij p.sx-sub,body.home #brxe-olywij p.sx-sub{color:#2a4a52!important;opacity:.85!important;letter-spacing:.045em!important;font-weight:500!important}
/* sx-v149b-SUB-CONTRAST-OVERRIDE-end

/* sx-SANI-FX-STYLE */

/* MOP WIPE — streak diagonal au hover des cards */
.sx-mop-mask{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  border-radius:inherit;
  z-index:3;
}
.sx-mop-streak{
  position:absolute;
  inset:-14px;
  background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.36) 50%,transparent 62%);
  transform:translateX(-130%);
  transition:transform .82s cubic-bezier(.22,.61,.36,1);
  will-change:transform;
}
.sx-mop-ready:hover .sx-mop-streak,
.sx-mop-ready:focus-within .sx-mop-streak{
  transform:translateX(130%);
}
@media (hover:none),(pointer:coarse){.sx-mop-mask{display:none;}}
@media (prefers-reduced-motion:reduce){.sx-mop-mask{display:none!important;}}

/* SANI BLADE — lame teal qui flash en diagonal au scroll, sans toucher le contenu */
.sx-blade-flash{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:99;
}
.sx-blade-flash::before{
  content:'';
  position:absolute;
  top:-10%;
  bottom:-10%;
  left:-50%;
  width:200%;
  background:linear-gradient(
    115deg,
    transparent 46%,
    rgba(58,155,184,.45) 48.5%,
    rgba(190,232,241,.92) 50%,
    rgba(58,155,184,.45) 51.5%,
    transparent 54%);
  filter:drop-shadow(0 0 10px rgba(58,155,184,.55));
  transform:translateX(-100%);
  opacity:0;
  will-change:transform,opacity;
}
.sx-bladed .sx-blade-flash::before{
  animation:sxBladeFlash 1.05s cubic-bezier(.4,0,.2,1) forwards;
}
@keyframes sxBladeFlash{
  0%   {opacity:0; transform:translateX(-100%);}
  12%  {opacity:1;}
  88%  {opacity:1;}
  100% {opacity:0; transform:translateX(100%);}
}
@media (prefers-reduced-motion:reduce){.sx-blade-flash{display:none!important;}}

/* FIX: KARVO/se-price tooltip */
.se-price-info-tooltip[data-visible="1"]{
  opacity:1!important;
  animation:.2s sePitIn forwards!important;
}

/* sx-SEO-LANDING-FIX-V2 — hide default WP H1 on all SEO landing pages */
.page-id-364981 #brx-content > h1,
.page-id-368839 #brx-content > h1,
.page-id-368848 #brx-content > h1,
.page-id-368849 #brx-content > h1,
.page-id-368850 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V3 */
.page-id-368852 #brx-content > h1,
.page-id-368853 #brx-content > h1,
.page-id-368854 #brx-content > h1,
.page-id-368855 #brx-content > h1,
.page-id-368856 #brx-content > h1,
.page-id-368857 #brx-content > h1,
.page-id-368858 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V4 */
.page-id-368864 #brx-content > h1,
.page-id-368865 #brx-content > h1,
.page-id-368866 #brx-content > h1,
.page-id-368867 #brx-content > h1,
.page-id-368868 #brx-content > h1,
.page-id-368869 #brx-content > h1,
.page-id-368870 #brx-content > h1,
.page-id-368871 #brx-content > h1,
.page-id-368872 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V5 */
.page-id-369254 #brx-content > h1,
.page-id-369255 #brx-content > h1,
.page-id-369256 #brx-content > h1,
.page-id-369257 #brx-content > h1,
.page-id-369258 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-FAQ-GLOBAL-CSS */
.sx-hub-faq{margin:48px 0 16px}
.sx-hub-faq details{border:1px solid #e2e8f0;border-radius:10px;margin:10px 0;padding:16px 20px;background:#fff;cursor:pointer;transition:border-color .2s}
.sx-hub-faq details[open]{border-color:#3a9bb8}
.sx-hub-faq summary{font-weight:600;color:#1d2327;font-size:1.02rem;list-style:none;outline:none}
.sx-hub-faq summary::-webkit-details-marker{display:none}
.sx-hub-faq summary::after{content:" + ";float:right;color:#3a9bb8;font-weight:400;font-size:1.2rem}
.sx-hub-faq details[open] summary::after{content:" 2212 "}
.sx-hub-faq details>div{padding-top:14px;color:#2c3338;line-height:1.6}
.sx-hub-faq details>div p{margin:0 0 10px}

/* sx-SEO-LANDING-FIX-V6 */
.page-id-369307 #brx-content > h1,
.page-id-369308 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V7 */
.page-id-369321 #brx-content > h1,
.page-id-369322 #brx-content > h1,
.page-id-369323 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V8 */
.page-id-369327 #brx-content > h1,
.page-id-369328 #brx-content > h1,
.page-id-369329 #brx-content > h1,
.page-id-369330 #brx-content > h1,
.page-id-369331 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V9 */
.page-id-369336 #brx-content > h1,
.page-id-369337 #brx-content > h1,
.page-id-369338 #brx-content > h1,
.page-id-369339 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V10 */
.page-id-369347 #brx-content > h1,
.page-id-369348 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V11 */
.page-id-369978 #brx-content > h1,
.page-id-369979 #brx-content > h1,
.page-id-369980 #brx-content > h1,
.page-id-369981 #brx-content > h1,
.page-id-369982 #brx-content > h1,
.page-id-369995 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V12 */
.page-id-370431 #brx-content > h1,
.page-id-370432 #brx-content > h1,
.page-id-370433 #brx-content > h1,
.page-id-370434 #brx-content > h1,
.page-id-370435 #brx-content > h1,
.page-id-370436 #brx-content > h1,
.page-id-370437 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V13 */
.page-id-370466 #brx-content > h1,
.page-id-370467 #brx-content > h1,
.page-id-370468 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* sx-SEO-LANDING-FIX-V14 */
.page-id-370476 #brx-content > h1,
.page-id-370477 #brx-content > h1,
.page-id-370478 #brx-content > h1,
.page-id-370479 #brx-content > h1,
.page-id-370480 #brx-content > h1,
.page-id-370481 #brx-content > h1,
.page-id-370482 #brx-content > h1 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}
