/* =============================================================================
   E4 · design tokens (chantier thème 2026) — source : spec-theme-growled.md §1
   Chargé sur toutes les pages. N'altère RIEN tant que les composants
   n'utilisent pas les variables. Seul effet actif : le fix [hidden].
   ============================================================================= */
/* ═══════════════════════════════════════════════════════════════════════
   ADN GrowLED · tokens v1.0 — SOURCE DE VÉRITÉ (brandbook :
   admin.greatwhiteshark.fr/maquette-dna-styleguide.html) — P0 audit 14/07/2026
   ═══════════════════════════════════════════════════════════════════════ */
:root{
  /* encre — structure */
  --gw-ink-950:#160029; --gw-ink-900:#1a0033; --gw-ink-800:#230642;
  --gw-ink-700:#2B004F; --gw-ink-600:#3a0a63; --gw-ink-500:#4a1574;
  /* vert — signature */
  --gw-green-300:#9bd968; --gw-green-400:#8ed04e; --gw-green-500:#7BBF3F;
  --gw-green-700:#5e9a2a; --gw-green-800:#3e6b1a;
  /* or — transaction */
  --gw-gold-300:#ffcd52; --gw-gold-400:#ffc53d; --gw-gold-500:#f2a114;
  /* magenta — éditorial */
  --gw-magenta-500:#7E1E57; --gw-magenta-600:#5f1642; --gw-magenta-50:#f7e9f1;
  /* neutres violacés */
  --gw-n0:#ffffff; --gw-n50:#f8f5fd; --gw-n75:#f5f2f9; --gw-n100:#f4f0fa;
  --gw-n150:#f1ecf6; --gw-n200:#ece5f2; --gw-n400:#a99fbb; --gw-n500:#7e7099;
  --gw-n600:#6d6480; --gw-n700:#4f4760; --gw-hairline:rgba(43,0,79,.10);
  /* Texte secondaire POSE SUR ENCRE : la palette n'avait que des gris pour fond clair,
     illisibles sur les bandes .band--brand. Valeur reprise de `.band--brand .head p`,
     seul lilas deja employe pour ce role dans le theme (audit d'harmonie 01/08). */
  --gw-on-ink-70:#c9b8de;
  /* sémantique */
  --gw-success-bg:#eef7e4; --gw-success-fg:#3e6b1a; --gw-success-bd:rgba(123,191,63,.38);
  --gw-warn-bg:#fdf3dd; --gw-warn-fg:#8a5a00; --gw-warn-bd:rgba(242,161,20,.45);
  --gw-danger-bg:#fdecef; --gw-danger-fg:#a91838; --gw-danger-bd:rgba(169,24,56,.30);
  --gw-info-bg:#f1ecf6; --gw-info-fg:#2B004F; --gw-info-bd:rgba(43,0,79,.18);
  /* gradients signature */
  --gw-grad-key:linear-gradient(100deg,#7BBF3F 0%,#5e9a2a 42%,#7E1E57 100%);
  --gw-grad-green:linear-gradient(100deg,#8ed04e,#5e9a2a);
  --gw-grad-ink:linear-gradient(150deg,#3a0a63,#1a0033);
  --gw-grad-night:linear-gradient(150deg,#2c0850,#160029);
  --gw-grad-gold:linear-gradient(100deg,#ffc53d,#f2a114);
  --gw-grad-gold-hover:linear-gradient(100deg,#ffcd52,#f5a623);
  /* surfaces & reliefs */
  --gw-r-sm:8px; --gw-r:12px; --gw-r-lg:16px; --gw-r-xl:22px; --gw-r-pill:999px;
  --gw-shadow-soft:0 1px 2px rgba(43,0,79,.05),0 10px 28px rgba(43,0,79,.08);
  --gw-shadow-lift:0 1px 2px rgba(43,0,79,.06),0 28px 64px rgba(43,0,79,.16);
  --gw-glow-green:0 0 0 1px rgba(123,191,63,.18),0 6px 16px rgba(123,191,63,.10);
  --gw-glow-green-lg:0 0 0 1px rgba(123,191,63,.24),0 10px 24px rgba(123,191,63,.14);
  --gw-gold-shadow:0 8px 14px rgba(242,161,20,.22),0 0 0 1px rgba(242,161,20,.20);
  --gw-glass:rgba(255,255,255,.62); --gw-glass-strong:rgba(255,255,255,.78);
  --gw-skew:-5deg;
  /* mouvement */
  --gw-dur-1:120ms; --gw-dur-2:200ms; --gw-dur-3:320ms; --gw-dur-4:560ms;
  --gw-ease-out:cubic-bezier(.22,1,.36,1);
  --gw-ease-inout:cubic-bezier(.65,.05,.36,1);
  --gw-ease-pop:cubic-bezier(.34,1.56,.64,1);
  /* typographie */
  --gw-font-disp:'Russo One','Arial Narrow Bold',sans-serif;
  --gw-font-ui:'Poppins',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}
/* ── DIVERGENCES ASSUMÉES — état validé client le 15/07/2026.
      La bascule P7 a migré 816 usages vers --gw-* ; ne restent nommés ici
      que les tokens dont la VALEUR diffère volontairement du canon
      (les unifier changerait des pages validées). ── */
:root{
  --wrap:1280px;                       /* layout historique (≠ --gw-wrap fluide) */
  --green-text:#13002a;                /* texte sur fond vert signature */
  --f-body:'Inter',system-ui,sans-serif; /* Inter scopée checkout (validée ainsi) */
  --b3-shadow-soft:0 1px 2px rgba(43,0,79,.04),0 4px 12px rgba(43,0,79,.05); /* version faible hors-home */
  --b3-shadow-lift:0 2px 6px rgba(43,0,79,.05),0 12px 26px rgba(43,0,79,.08);
  --b3-r-card:13px;                    /* radius carte historique */
}
/* Piège documenté (spec §7) : l'attribut hidden doit TOUJOURS gagner. */
[hidden]{display:none!important}

/* ═══ QW#6 — bandeau avantages pré-footer (iqitparallax) restylé E4 ═══ */
#parallax_block_center .parallax-outer{background-image:none !important;background:#f5f2f9 !important;border-top:1px solid rgba(43,0,79,.1);border-bottom:1px solid rgba(43,0,79,.1)}
#parallax_block_center .parallax-inner{padding:26px 0 !important}
/* Le bandeau n'avait aucun conteneur : sa .row heritee s'etalait sur 1890px en
   1920 et les tuiles etaient simplement centrees, ce qui le laissait a droite du
   bord de l'en-tete. On lui donne le meme gabarit que tout le reste ; le fond
   reste pleine largeur sur .parallax-outer. */
/* Le .container Bootstrap interne au bandeau insere 15px de chaque cote : sans
   ca, le 90% de --gw-wrap se calcule sur 1410 au lieu de 1440 et le bandeau
   tombe 15px a droite de l'en-tete. Portee limitee au bloc parallax. */
#parallax_block_center .container{padding-left:0 !important;padding-right:0 !important}
/* body#cms .rte (e4-pages.css) habille le contenu CMS en carte blanche —
   bordure, ombre, 36px de padding — et attrapait aussi le <article class="rte">
   du module parallax : sur les pages CMS le bandeau se retrouvait enferme dans
   une carte. Selecteur a 2 classes + 1 id (1,2,0), il prime sur body#cms .rte
   (1,1,1) quel que soit l'ordre de chargement des feuilles. */
#parallax_block_center .parallax-inner .rte{background:none !important;border:0 !important;border-radius:0 !important;
  box-shadow:none !important;padding:0 !important}
#parallax_block_center .img-box-3{max-width:var(--gw-wrap);margin-left:auto !important;margin-right:auto !important;padding:0 !important;float:none !important}
@media(max-width:1100px){#parallax_block_center .img-box-3{padding-left:14px !important;padding-right:14px !important}}
#parallax_block_center .img-box-3 .row{display:grid !important;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:12px;margin:0 !important}
/* .row est un clearfix Bootstrap : ses ::before/::after deviennent des items de
   grille. 8 tuiles + 2 pseudos occupaient 10 pistes sur 11, les tuiles etaient
   poussees d'une piste et ne remplissaient pas la bande (321px au lieu de 160 en
   1920). e4-mobile.css les neutralisait deja, mais sous media query seulement. */
#parallax_block_center .img-box-3 .row::before,
#parallax_block_center .img-box-3 .row::after{display:none !important;content:none !important}
#parallax_block_center .img-box-3 [class*="col-"]{width:auto !important;float:none !important;padding:0 !important;margin:0 !important}
#parallax_block_center .img-box-3-item{background:#fff;border:1px solid rgba(43,0,79,.1);border-radius:12px;padding:14px 10px !important;height:100%;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:8px;margin:0 !important}
#parallax_block_center .img-box-3-icon{width:auto !important;height:auto !important;background:none !important;padding:0 !important;border-radius:0 !important;margin:0 !important;box-shadow:none !important}
#parallax_block_center .img-box-3-icon img{width:40px !important;height:40px !important;object-fit:contain}
#parallax_block_center h4{margin:0 !important;font-family:'Poppins',sans-serif !important;font-weight:700 !important;font-size:12px !important;color:#2B004F !important;line-height:1.3 !important;text-transform:none !important;text-shadow:none !important}
#parallax_block_center .bor{display:none !important}

/* ═══ Harmonisation largeur site : conteneur unique fluide (fonds full-bleed, contenu aligné) ═══ */
:root{--gw-wrap:min(90%,1600px);
  /* Gouttière intérieure des bandes. Valeur reprise du `padding:var(--space) 24px`
     de `.bw` (home-e4.css), et ramenée à 16px sous 767px par e4-mobile.css, qui
     fait la même chose sur `.bw`. Exister comme jeton permet au hero de se caler
     sur les bandes sans recopier le nombre — voir `.gw-hero .hero-wrap`. */
  --gw-gutter:24px}
#header .container{max-width:var(--gw-wrap) !important;margin:0 auto !important;float:none !important;padding-left:0;padding-right:0}
/* ═══ Pages sans feuille E4 dédiée : magasins, plan du site, blog, connexion.
   Elles etaient restees sur le .container Bootstrap brut (max-width:100%,
   padding 15px), soit 57px a gauche du bord de l'en-tete en 1440.

   Le gabarit est porte par .row.content-inner et non par .container : sous
   768px, custom-growled-2026-260427.css force en !important
   `#center_column,#columns,#columns>.container,.container>.row,.row>.col-xs-12
   {padding:0;margin:0}` — c'est la convention mobile du theme (conteneurs
   pleine largeur, chaque composant porte sa gouttiere). Nos regles sont donc
   scopees par id de body, ce qui suffit a primer, et reaffirment margin et
   padding en !important a ces largeurs. Le blog garde sa colonne laterale :
   c'est la RANGEE qui est centree, pas chaque colonne. */
body#stores .columns-container > .container,
body#sitemap .columns-container > .container,
body[id^="module-ybc_blog"] .columns-container > .container{padding-left:0;padding-right:0}
body#stores .row.content-inner,
body#sitemap .row.content-inner,
body[id^="module-ybc_blog"] .row.content-inner{
  max-width:var(--gw-wrap);
  margin-left:auto !important;margin-right:auto !important;
  padding-left:0 !important;padding-right:0 !important}
body#stores #center_column,
body#sitemap #center_column,
body[id^="module-ybc_blog"] #center_column{padding-left:0;padding-right:0}
@media(max-width:1100px){
  body#stores .row.content-inner,
  body#sitemap .row.content-inner,
  body[id^="module-ybc_blog"] .row.content-inner{padding-left:14px !important;padding-right:14px !important}
}
/* La page de connexion vit sur le systeme .glc-page (celui du tunnel), cale a
   1500px. On l'aligne sur le gabarit du site — scope a l'authentification :
   le tunnel de commande, lui, masque tout le footer et suit ses propres
   regles. */
/* Connexion ET tunnel de commande vivent sur le systeme .glc-page. Une regle
   plus bas alignait deja .glc-page__inner sur --gw-wrap, mais la gouttiere
   restait sur .glc-page : le 90% se calculait sur (fenetre - 40px) et le
   contenu tombait 18px a droite de l'en-tete en 1440. La gouttiere passe donc
   sur le composant, comme partout ailleurs.
   Scope par id de body, JAMAIS globalement : .glc-page sert aussi de classe aux
   boutons de pagination (40px de large, 12px de padding) sur les pages de
   listing — une regle globale les aplatirait. */
body#authentication .glc-page,
body#order .glc-page,
body#order-opc .glc-page{padding-left:0 !important;padding-right:0 !important}
body#authentication .glc-page__inner,
body#order .glc-page__inner,
body#order-opc .glc-page__inner{max-width:var(--gw-wrap);margin-left:auto;margin-right:auto;
  padding-left:0;padding-right:0}
@media(max-width:1100px){
  body#authentication .glc-page__inner,
  body#order .glc-page__inner,
  body#order-opc .glc-page__inner{padding-left:14px;padding-right:14px}
}
@media(max-width:1100px){#header .container{padding-left:14px;padding-right:14px}}
.ets_mm_megamenu .mm_menus_ul{max-width:var(--gw-wrap);margin-left:auto !important;margin-right:auto !important}
.ets_mm_megamenu .mm_columns_ul{max-width:var(--gw-wrap) !important;left:50% !important;transform:translateX(-50%);right:auto !important;border-radius:0 0 14px 14px}
/* sections home (bands) : même conteneur */
.band .bw,.gw-cat .bw{max-width:var(--gw-wrap) !important}
/* `.reassure-in` retiré de cette liste le 24/08 : sa règle de home-e4.css
   déclare désormais `--gw-wrap` elle-même, le rattrapage est donc inutile.
   Sans risque de portée : `.reassure-in` n'existe que dans le gabarit
   _reassurance.tpl, accroché à la seule page d'accueil — vérifié sur accueil,
   catégorie, fiche, panier et CMS — et home-e4.css n'est chargé que là. */
/* checkout : conteneur aligné (était 1500) */
.glc-page__inner{max-width:var(--gw-wrap) !important}
/* menu + recherche compactés (tiennent aussi quand l'écran est moyen) */
.ets_mm_megamenu .mm_menus_ul .mm_menus_li>a{padding-left:9px !important;padding-right:9px !important;font-size:12px !important;letter-spacing:.02em}
#header #search_block_top,#header .search{max-width:570px !important}

/* ═══ Header sticky global (toutes pages hors home, cf. .gw-stick pour la home dans e4-home.css) ═══ */
/* header Signature 02/08 : le menu ne colle plus (la barre marchande .gw-sbar le remplace au scroll) */

/* Correctif : "Bonjour Prenom" plus long que "Hi" — tenait dans le slot compact 70px */
body .gw-h2 .header_user_info .account{font-size:8.5px !important;text-overflow:ellipsis;overflow:hidden;max-width:70px}

/* ═══ Utilitaire vague E4 (portable, hors home — pas de dépendance à var(--dvh)) ═══ */
.gw-wave{position:relative;z-index:3;overflow:visible;margin-top:clamp(32px,3vw,48px);margin-bottom:clamp(32px,3vw,48px)}
.gw-wave::before{content:"";position:absolute;left:0;right:0;top:calc(-1 * clamp(32px,3vw,48px) + 1px);height:clamp(32px,3vw,48px);z-index:1;pointer-events:none;transform:none;opacity:1;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201440%2060%27%20preserveAspectRatio%3D%27none%27%3E%3Cpolygon%20points%3D%270.0%2C60%20102.9%2C60%200.0%2C6%27%20fill%3D%27%233a0a63%27/%3E%3Cpolygon%20points%3D%27102.9%2C60%20102.9%2C27%200.0%2C6%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27102.9%2C60%20205.7%2C60%20102.9%2C27%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27205.7%2C60%20205.7%2C13%20102.9%2C27%27%20fill%3D%27%234a1574%27/%3E%3Cpolygon%20points%3D%27205.7%2C60%20308.6%2C60%20205.7%2C13%27%20fill%3D%27%234a1574%27/%3E%3Cpolygon%20points%3D%27308.6%2C60%20308.6%2C33%20205.7%2C13%27%20fill%3D%27%233a0a63%27/%3E%3Cpolygon%20points%3D%27308.6%2C60%20411.4%2C60%20308.6%2C33%27%20fill%3D%27%233a0a63%27/%3E%3Cpolygon%20points%3D%27411.4%2C60%20411.4%2C9%20308.6%2C33%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27411.4%2C60%20514.3%2C60%20411.4%2C9%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27514.3%2C60%20514.3%2C24%20411.4%2C9%27%20fill%3D%27%234a1574%27/%3E%3Cpolygon%20points%3D%27514.3%2C60%20617.1%2C60%20514.3%2C24%27%20fill%3D%27%234a1574%27/%3E%3Cpolygon%20points%3D%27617.1%2C60%20617.1%2C4%20514.3%2C24%27%20fill%3D%27%233a0a63%27/%3E%3Cpolygon%20points%3D%27617.1%2C60%20720.0%2C60%20617.1%2C4%27%20fill%3D%27%233a0a63%27/%3E%3Cpolygon%20points%3D%27720.0%2C60%20720.0%2C30%20617.1%2C4%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27720.0%2C60%20822.9%2C60%20720.0%2C30%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27822.9%2C60%20822.9%2C16%20720.0%2C30%27%20fill%3D%27%234a1574%27/%3E%3Cpolygon%20points%3D%27822.9%2C60%20925.7%2C60%20822.9%2C16%27%20fill%3D%27%234a1574%27/%3E%3Cpolygon%20points%3D%27925.7%2C60%20925.7%2C28%20822.9%2C16%27%20fill%3D%27%233a0a63%27/%3E%3Cpolygon%20points%3D%27925.7%2C60%201028.6%2C60%20925.7%2C28%27%20fill%3D%27%233a0a63%27/%3E%3Cpolygon%20points%3D%271028.6%2C60%201028.6%2C8%20925.7%2C28%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%271028.6%2C60%201131.4%2C60%201028.6%2C8%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%271131.4%2C60%201131.4%2C22%201028.6%2C8%27%20fill%3D%27%234a1574%27/%3E%3Cpolygon%20points%3D%271131.4%2C60%201234.3%2C60%201131.4%2C22%27%20fill%3D%27%234a1574%27/%3E%3Cpolygon%20points%3D%271234.3%2C60%201234.3%2C12%201131.4%2C22%27%20fill%3D%27%233a0a63%27/%3E%3Cpolygon%20points%3D%271234.3%2C60%201337.1%2C60%201234.3%2C12%27%20fill%3D%27%233a0a63%27/%3E%3Cpolygon%20points%3D%271337.1%2C60%201337.1%2C31%201234.3%2C12%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%271337.1%2C60%201440.0%2C60%201337.1%2C31%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%271440.0%2C60%201440.0%2C7%201337.1%2C31%27%20fill%3D%27%234a1574%27/%3E%3Cpolyline%20points%3D%270.0%2C6%20102.9%2C27%20205.7%2C13%20308.6%2C33%20411.4%2C9%20514.3%2C24%20617.1%2C4%20720.0%2C30%20822.9%2C16%20925.7%2C28%201028.6%2C8%201131.4%2C22%201234.3%2C12%201337.1%2C31%201440.0%2C7%27%20fill%3D%27none%27%20stroke%3D%27%237BBF3F%27%20stroke-width%3D%276%27%20opacity%3D%27.18%27%20stroke-linejoin%3D%27round%27/%3E%3Cpolyline%20points%3D%270.0%2C6%20102.9%2C27%20205.7%2C13%20308.6%2C33%20411.4%2C9%20514.3%2C24%20617.1%2C4%20720.0%2C30%20822.9%2C16%20925.7%2C28%201028.6%2C8%201131.4%2C22%201234.3%2C12%201337.1%2C31%201440.0%2C7%27%20fill%3D%27none%27%20stroke%3D%27%237BBF3F%27%20stroke-width%3D%272.4%27%20opacity%3D%27.95%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");background-size:100% 100%;background-repeat:no-repeat}
.gw-wave::after{content:"";position:absolute;top:auto;left:0;right:0;bottom:calc(-1 * clamp(32px,3vw,48px) + 1px);height:clamp(32px,3vw,48px);z-index:1;pointer-events:none;transform:none;opacity:1;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201440%2060%27%20preserveAspectRatio%3D%27none%27%3E%3Cpolygon%20points%3D%270.0%2C0%20102.9%2C0%200.0%2C54%27%20fill%3D%27%231a0033%27/%3E%3Cpolygon%20points%3D%27102.9%2C0%20102.9%2C33%200.0%2C54%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27102.9%2C0%20205.7%2C0%20102.9%2C33%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27205.7%2C0%20205.7%2C47%20102.9%2C33%27%20fill%3D%27%23230642%27/%3E%3Cpolygon%20points%3D%27205.7%2C0%20308.6%2C0%20205.7%2C47%27%20fill%3D%27%23230642%27/%3E%3Cpolygon%20points%3D%27308.6%2C0%20308.6%2C27%20205.7%2C47%27%20fill%3D%27%231a0033%27/%3E%3Cpolygon%20points%3D%27308.6%2C0%20411.4%2C0%20308.6%2C27%27%20fill%3D%27%231a0033%27/%3E%3Cpolygon%20points%3D%27411.4%2C0%20411.4%2C51%20308.6%2C27%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27411.4%2C0%20514.3%2C0%20411.4%2C51%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27514.3%2C0%20514.3%2C36%20411.4%2C51%27%20fill%3D%27%23230642%27/%3E%3Cpolygon%20points%3D%27514.3%2C0%20617.1%2C0%20514.3%2C36%27%20fill%3D%27%23230642%27/%3E%3Cpolygon%20points%3D%27617.1%2C0%20617.1%2C56%20514.3%2C36%27%20fill%3D%27%231a0033%27/%3E%3Cpolygon%20points%3D%27617.1%2C0%20720.0%2C0%20617.1%2C56%27%20fill%3D%27%231a0033%27/%3E%3Cpolygon%20points%3D%27720.0%2C0%20720.0%2C30%20617.1%2C56%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27720.0%2C0%20822.9%2C0%20720.0%2C30%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%27822.9%2C0%20822.9%2C44%20720.0%2C30%27%20fill%3D%27%23230642%27/%3E%3Cpolygon%20points%3D%27822.9%2C0%20925.7%2C0%20822.9%2C44%27%20fill%3D%27%23230642%27/%3E%3Cpolygon%20points%3D%27925.7%2C0%20925.7%2C32%20822.9%2C44%27%20fill%3D%27%231a0033%27/%3E%3Cpolygon%20points%3D%27925.7%2C0%201028.6%2C0%20925.7%2C32%27%20fill%3D%27%231a0033%27/%3E%3Cpolygon%20points%3D%271028.6%2C0%201028.6%2C52%20925.7%2C32%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%271028.6%2C0%201131.4%2C0%201028.6%2C52%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%271131.4%2C0%201131.4%2C38%201028.6%2C52%27%20fill%3D%27%23230642%27/%3E%3Cpolygon%20points%3D%271131.4%2C0%201234.3%2C0%201131.4%2C38%27%20fill%3D%27%23230642%27/%3E%3Cpolygon%20points%3D%271234.3%2C0%201234.3%2C48%201131.4%2C38%27%20fill%3D%27%231a0033%27/%3E%3Cpolygon%20points%3D%271234.3%2C0%201337.1%2C0%201234.3%2C48%27%20fill%3D%27%231a0033%27/%3E%3Cpolygon%20points%3D%271337.1%2C0%201337.1%2C29%201234.3%2C48%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%271337.1%2C0%201440.0%2C0%201337.1%2C29%27%20fill%3D%27%232b004f%27/%3E%3Cpolygon%20points%3D%271440.0%2C0%201440.0%2C53%201337.1%2C29%27%20fill%3D%27%23230642%27/%3E%3Cpolyline%20points%3D%270.0%2C54%20102.9%2C33%20205.7%2C47%20308.6%2C27%20411.4%2C51%20514.3%2C36%20617.1%2C56%20720.0%2C30%20822.9%2C44%20925.7%2C32%201028.6%2C52%201131.4%2C38%201234.3%2C48%201337.1%2C29%201440.0%2C53%27%20fill%3D%27none%27%20stroke%3D%27%237BBF3F%27%20stroke-width%3D%276%27%20opacity%3D%27.18%27%20stroke-linejoin%3D%27round%27/%3E%3Cpolyline%20points%3D%270.0%2C54%20102.9%2C33%20205.7%2C47%20308.6%2C27%20411.4%2C51%20514.3%2C36%20617.1%2C56%20720.0%2C30%20822.9%2C44%20925.7%2C32%201028.6%2C52%201131.4%2C38%201234.3%2C48%201337.1%2C29%201440.0%2C53%27%20fill%3D%27none%27%20stroke%3D%27%237BBF3F%27%20stroke-width%3D%272.4%27%20opacity%3D%27.95%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");background-size:100% 100%;background-repeat:no-repeat}

/* ═══════════════════════════════════════════════════════════════════════
   Popup "ajout au panier" (#layer_cart, module blockcart) — refonte "V2
   Modal célébration" (choisie parmi 4 maquettes). Namespace : .gwl-cel-
   Site-wide (blockcart rendu sur toutes les pages), donc dans ce fichier
   chargé sans condition de page.
   ═══════════════════════════════════════════════════════════════════════ */

#layer_cart.gwl-cel-overlay{
  /* P7 : tokens PROPRES à la popup (le reste est passé au canon --gw-*) */
  --gwl-ink-70:rgba(43,0,79,.70);--gwl-ink-55:rgba(43,0,79,.55);
  --gwl-shadow-soft:0 14px 32px -8px rgba(43,0,79,.16);--gwl-shadow-lift:0 20px 44px -12px rgba(43,0,79,.30);
  --gwl-font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  /* blockcart.css (legacy) impose #layer_cart{width:84%;max-width:960px;margin:0 auto} :
     meme specificite d'ID, mais la regle V2 ne parlait pas de largeur, donc le voile
     ne faisait que 960px de large et laissait 240px de site NET de chaque cote en 1440.
     On neutralise les trois proprietes ici — la carte .gwl-cel-modal garde son max-width. */
  position:fixed!important;inset:0!important;top:0!important;left:0!important;right:0!important;bottom:0!important;
  width:auto!important;max-width:none!important;min-width:0!important;margin:0!important;
  z-index:9999;padding:24px;
  background:radial-gradient(circle at 50% 20%,rgba(59,10,105,.55),rgba(22,0,41,.78));
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  font-family:var(--gwl-font-body);box-sizing:border-box}
/* pas de display:flex ici : .fadeIn() de blockcart force display:block au premier show
   (jQuery ne consulte pas le CSS auteur pour la valeur par défaut) — donc centrage de
   .gwl-cel-modal en absolute/transform, indépendant du display réel du parent */
.gwl-cel-overlay *,.gwl-cel-overlay *::before,.gwl-cel-overlay *::after{box-sizing:border-box}
#layer_cart .unvisible{display:none!important}
.layer_cart_overlay{display:none!important}

.gwl-cel-modal{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:calc(100% - 48px);max-width:900px;max-height:min(92vh,900px);background:var(--gw-n50);
  border-radius:18px;box-shadow:var(--gwl-shadow-lift);overflow:hidden;display:flex;flex-direction:column}
.gwl-cel-scroll{overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgba(43,0,79,.25) transparent}
.gwl-cel-scroll::-webkit-scrollbar{width:8px}
.gwl-cel-scroll::-webkit-scrollbar-thumb{background:rgba(43,0,79,.20);border-radius:8px}

.gwl-cel-close{position:absolute;top:16px;right:16px;z-index:5;width:36px;height:36px;display:flex;align-items:center;
  justify-content:center;border:none;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;cursor:pointer}
.gwl-cel-close:hover{background:rgba(255,255,255,.26)}
.gwl-cel-close svg{width:16px;height:16px}
/* markup legacy blockcart : le span porte encore la classe .cross (icône FontAwesome
   ::before "\f00d" définie dans modules/blockcart/blockcart.css) en plus du SVG gwl-cel-close
   ci-dessus -> double croix superposée. On garde .cross pour le binding JS de fermeture,
   on retire juste son icône visuelle. */
.gwl-cel-close.cross{position:absolute;top:16px;right:16px;width:36px;height:36px}
.gwl-cel-close.cross::before{content:none!important;display:none!important}

.gwl-cel-hero{position:relative;background:var(--gw-grad-night);padding:20px 32px 46px;text-align:center;overflow:hidden;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;column-gap:10px;row-gap:6px}
.gwl-cel-hero-glow{position:absolute;top:-60px;left:50%;width:360px;height:220px;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(255,197,61,.30),transparent 70%);pointer-events:none}
/* check + titre sur une seule ligne (demande du 18/07) : kicker garde sa propre ligne (order 1,
   flex-basis 100%), check + headline suivent groupés sur la ligne du dessous (order 2 et 3). */
.gwl-cel-check{position:relative;width:30px;height:30px;margin:0;flex:none;order:2;display:flex;align-items:center;justify-content:center;
  border-radius:50%;background:var(--gw-grad-gold);color:var(--gw-ink-700);
  box-shadow:0 0 0 4px rgba(255,197,61,.16),0 8px 16px -6px rgba(0,0,0,.45)}
.gwl-cel-check svg{width:16px;height:16px}
.gwl-cel-kicker{margin:0 0 2px;position:relative;z-index:1;order:1;flex:0 0 100%}
.gwl-cel-kicker-text{display:inline-block;transform:skewX(-5deg);font-family:var(--gw-font-ui);font-weight:700;
  font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gw-green-300)}
.gwl-cel-headline{margin:0;font-family:var(--gw-font-disp);font-style:italic;text-transform:uppercase;
  font-size:clamp(18px,3vw,24px);line-height:1.1;letter-spacing:.01em;color:#fdf6e6;text-wrap:balance;order:3;white-space:nowrap}

.gwl-cel-body{position:relative;padding:0 28px 28px;display:flex;flex-direction:column;gap:18px}

.gwl-cel-product{position:relative;margin-top:-42px;background:#fff;border-radius:16px;box-shadow:var(--gwl-shadow-soft);
  padding:18px;display:grid;grid-template-columns:104px 1fr;gap:18px;align-items:center}
.gwl-cel-visual{position:relative}
.gwl-cel-visual .layer_cart_img{aspect-ratio:1/1;border-radius:12px;background:var(--gw-n100);overflow:hidden;
  display:flex;align-items:center;justify-content:center}
.gwl-cel-visual .layer_cart_img img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.gwl-cel-qtybadge{position:absolute;top:-8px;right:-8px;transform:skewX(-5deg);background:var(--gw-grad-gold);
  border-radius:8px;padding:3px 8px;box-shadow:0 6px 14px -4px rgba(242,161,20,.55)}
.gwl-cel-qtybadge-text{display:inline-block;transform:skewX(5deg);font-family:var(--gw-font-ui);font-weight:800;
  font-size:12px;color:var(--gw-ink-700)}

.gwl-cel-info{min-width:0;display:flex;flex-direction:column;gap:5px}
.gwl-cel-name{margin:0;font-family:var(--gw-font-ui);font-weight:800;font-size:16.5px;line-height:1.28;color:var(--gw-ink-700)}
.gwl-cel-attrs{font-size:12px;color:var(--gwl-ink-70)}
.gwl-cel-attrs:empty{display:none}
.gwl-cel-priceline{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:8px;
  padding-top:8px;border-top:1px dashed var(--gw-hairline)}
.gwl-cel-linetotal-label{font-size:12.5px;color:var(--gwl-ink-70)}
.gwl-cel-linetotal{margin:0;font-family:var(--gw-font-ui);font-weight:800;font-size:19px;color:var(--gw-ink-700);
  font-variant-numeric:tabular-nums}

.gwl-cel-shipbadge{display:inline-block;align-self:flex-start;transform:skewX(-5deg);background:var(--gw-green-500);border-radius:7px}
.gwl-cel-shipbadge-inner{display:inline-flex;align-items:center;gap:5px;transform:skewX(5deg);padding:5px 11px;
  font-family:var(--gw-font-ui);font-weight:700;font-size:12px;color:#fff;white-space:nowrap}
.gwl-cel-shipbadge-inner svg{width:13px;height:13px}

.gwl-cel-summary{background:var(--gw-n200);border-radius:14px;padding:14px 18px;display:flex;align-items:center;
  flex-wrap:wrap;gap:10px 16px}
.gwl-cel-summary-left{display:flex;align-items:center;gap:8px;color:var(--gw-ink-700)}
.gwl-cel-summary-left svg{width:18px;height:18px;flex-shrink:0;color:var(--gwl-ink-70)}
.gwl-cel-summary-text{font-size:13.5px;font-weight:500;font-variant-numeric:tabular-nums}
.gwl-cel-summary-total{margin-left:auto;display:flex;align-items:baseline;gap:8px}
.gwl-cel-total-label{font-size:12.5px;color:var(--gwl-ink-70)}
.gwl-cel-total-value{font-family:var(--gw-font-ui);font-weight:800;font-size:18px;color:var(--gw-ink-700);
  font-variant-numeric:tabular-nums}

.gwl-cel-ctas{display:flex;gap:12px}
.gwl-cel-btn{appearance:none;border:none;cursor:pointer;border-radius:12px;font-family:var(--gw-font-ui);
  font-weight:700;font-size:14.5px;padding:13px 18px;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.gwl-cel-btn-ghost{flex:0 0 auto;background:transparent;color:var(--gw-ink-700)!important;border:1.5px solid rgba(43,0,79,.18);
  text-decoration:none!important}
.gwl-cel-btn-ghost:hover{background:var(--gw-n100)}
.gwl-cel-btn-primary{flex:1 1 auto;background:var(--gw-grad-gold);color:var(--gw-ink-700)!important;
  box-shadow:0 12px 24px -8px rgba(242,161,20,.55);text-decoration:none!important}
.gwl-cel-btn-primary:hover{box-shadow:0 16px 30px -8px rgba(242,161,20,.62)}
.gwl-cel-btn-primary svg{width:17px;height:17px}

/* ---- cross-sell : markup réel product-slider.tpl (pas de carte custom possible, module partagé) ---- */
.gwl-cel-cross{padding-top:16px;border-top:1px solid var(--gw-hairline)}
.gwl-cel-cross-kicker{margin:0 0 2px}
.gwl-cel-cross-kicker-text{display:inline-block;transform:skewX(-5deg);font-family:var(--gw-font-disp);
  font-style:italic;text-transform:uppercase;font-size:16px;background:var(--gw-grad-key);-webkit-background-clip:text;
  background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.gwl-cel-cross-sub{margin:0 0 12px;font-size:12px;color:var(--gwl-ink-70)}

#layer_cart .crossseling-content .slick_carousel{display:flex;gap:12px;overflow-x:auto;padding-bottom:4px;
  scrollbar-width:thin;scrollbar-color:rgba(43,0,79,.20) transparent}
#layer_cart .crossseling-content .slick_carousel::-webkit-scrollbar{height:7px}
#layer_cart .crossseling-content .slick_carousel::-webkit-scrollbar-thumb{background:rgba(43,0,79,.18);border-radius:8px}
#layer_cart .crossseling-content .product-container{flex:0 0 138px;background:#fff;border:1px solid var(--gw-hairline);
  border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:8px}
#layer_cart .crossseling-content .product-image-container{position:relative;border-radius:10px;overflow:hidden;
  background:var(--gw-n100);aspect-ratio:1/1}
#layer_cart .crossseling-content .product-image-container img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
#layer_cart .crossseling-content .product-flags,
#layer_cart .crossseling-content .functional-buttons,
#layer_cart .crossseling-content .availability,
#layer_cart .crossseling-content .product-reference,
#layer_cart .crossseling-content .livraison-gratuite,
#layer_cart .crossseling-content .toutes-taxes,
#layer_cart .crossseling-content .paiement-plusieurs-fois,
#layer_cart .crossseling-content .pl-quantity-input-wrapper{display:none!important}
#layer_cart .crossseling-content .product-name-container{margin:0;flex:1}
#layer_cart .crossseling-content .product-name-container a.product-name{font-family:var(--gwl-font-body);
  font-size:12px;font-weight:600;line-height:1.35;color:var(--gw-ink-700)!important;text-decoration:none!important;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#layer_cart .crossseling-content .content_price{margin:0;display:flex;align-items:center;justify-content:space-between;gap:8px}
#layer_cart .crossseling-content .content_price .product-price{font-family:var(--gw-font-ui);font-weight:700;
  font-size:12.5px;color:var(--gw-ink-700)}
#layer_cart .crossseling-content .content_price .old-price{display:none}
#layer_cart .crossseling-content .button-container{margin:0}
#layer_cart .crossseling-content .button-container .ajax_add_to_cart_button{width:26px;height:26px;padding:0;
  border-radius:50%;border:none;background:var(--gw-green-500);color:#fff!important;display:flex;align-items:center;
  justify-content:center;font-size:0;text-decoration:none!important}
#layer_cart .crossseling-content .button-container .ajax_add_to_cart_button::before{content:"+";font-size:16px;
  font-weight:700;line-height:1}
#layer_cart .crossseling-content .button-container .ajax_add_to_cart_button:hover{background:var(--gw-green-700)}
#layer_cart .crossseling-content .button-container .lnk_view{display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;background:var(--gw-n100);color:var(--gw-ink-700)!important;font-size:11px;
  text-decoration:none!important}

@media(max-width:620px){
  #layer_cart.gwl-cel-overlay{padding:0}
  .gwl-cel-modal{position:fixed;top:auto;left:0;right:0;bottom:0;transform:none;width:100%;
    max-width:none;max-height:94vh;border-radius:18px 18px 0 0}
  .gwl-cel-hero{padding:16px 20px 44px}
  .gwl-cel-body{padding:0 16px 20px}
  .gwl-cel-product{grid-template-columns:76px 1fr;padding:14px;gap:12px}
  .gwl-cel-name{font-size:15px}
  .gwl-cel-linetotal{font-size:17px}
  .gwl-cel-summary-total{margin-left:0;width:100%;justify-content:space-between;padding-top:8px;
    border-top:1px dashed rgba(43,0,79,.12)}
  .gwl-cel-ctas{flex-direction:column-reverse}
}

/* ═══ Contrat reduced-motion GrowLED (brandbook, pilier Mouvement) ═══ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;
    animation-iteration-count:1!important;transition-duration:.01ms!important;
    scroll-behavior:auto!important}
  .gw-reveal{opacity:1;transform:none}
}

/* ═══ P4 (15/07) — alertes & erreurs de formulaire aux tokens (brandbook :
   le framboise est le SEUL rouge du système ; message utile, pas de panique) ═══ */
.alert.alert-danger, .alert-danger{background:var(--gw-danger-bg)!important;
  color:var(--gw-danger-fg)!important;border:1px solid var(--gw-danger-bd)!important;
  border-radius:var(--gw-r)!important;box-shadow:none!important}
.alert.alert-danger a{color:var(--gw-danger-fg);text-decoration:underline}
.alert.alert-danger ol li, .alert.alert-danger ul li{color:var(--gw-danger-fg)}
.form-group.form-error input, .form-group.form-error select, .form-group.form-error textarea,
input.form-error, select.form-error, textarea.form-error{
  border-color:var(--gw-danger-fg)!important;box-shadow:0 0 0 1px var(--gw-danger-fg)!important;
  background:var(--gw-danger-bg)!important;color:var(--gw-n700)!important}
.form-group.form-ok input, .form-group.form-ok select{border-color:var(--gw-green-700)!important}
.alert.alert-success{background:var(--gw-success-bg)!important;color:var(--gw-success-fg)!important;
  border:1px solid var(--gw-success-bd)!important;border-radius:var(--gw-r)!important}
.alert.alert-warning{background:var(--gw-warn-bg)!important;color:var(--gw-warn-fg)!important;
  border:1px solid var(--gw-warn-bd)!important;border-radius:var(--gw-r)!important}

/* --- Audit 2026-07 : les sous-menus fermes du megamenu sont masques par
   visibility:hidden et non display:none. Ils restent donc dans le flux, en
   position:absolute;left:100%, et etendent la largeur du document jusqu'a
   1725px sur une fenetre de 1440 — un defilement horizontal reel sur 22
   pages. Cette protection existait deja sur la page d'accueil seulement.
   Correction de fond a prevoir dans le module ets_megamenu. --- */
html {
  overflow-x: clip;
}
body {
  overflow-x: clip;
}

/* ═══ Anti-décalage au survol des cartes produit (global, toutes pages) ═══
   themeeditor/css/options/hover.css pose padding-top/bottom:9px sur
   .ajax_block_product:hover : +18px de hauteur, la ligne entiere se re-dispose
   et tout ce qui suit se decale. Le thème neutralisait deja ce padding en mode
   liste et tableau, mais pas en grille — le mode par defaut du site.
   Le survol n'etant pas un « recent input » au sens de l'API Layout Instability,
   ces decalages COMPTENT dans le CLS mesure par PageSpeed.
   L'effet de survol reste porte par box-shadow et transform, qui n'entrainent
   aucun reflow. Regle posee ici (feuille chargee sur toutes les pages) plutot
   que dans hover.css, que le themeeditor regenere. */
.ajax_block_product:hover{padding-top:0!important;padding-bottom:0!important}

/* — modale panier : ligne « dont livraison » sous le total (masquée par JS quand port offert) — */
.gwl-cel-shipline{display:flex;justify-content:flex-end;align-items:baseline;gap:6px;margin:6px 4px 0;color:var(--gw-ink-700);font-size:12.5px}
.gwl-cel-ship-value{font-weight:600;font-variant-numeric:tabular-nums}
.gwl-cel-shipmeta{text-align:right;margin:4px 4px 0;font-size:12px;color:var(--gw-ink-700);line-height:1.45}
/* — la valeur de la ligne livraison porte la classe .price (Russo One, capitales,
   nowrap) : correct pour « 7,08 € », illisible pour le libellé « Offerte en
   Point Relais… » qui débordait à gauche en modale mobile. Fonte de corps. — */
.gwl-cel-shipline .gwl-cel-ship-value{font-family:'Poppins',sans-serif!important;font-size:12.5px!important;font-weight:600!important;text-transform:none!important;white-space:normal!important;letter-spacing:0!important;font-style:normal!important;transform:none!important;text-align:right}
/* — h1 des pages blog (posé par blog_list_16.tpl, V3-L9) — */
.gw-blog-h1{font-family:'Russo One',sans-serif;font-weight:400;font-size:clamp(24px,3vw,36px);color:#2B004F;text-transform:uppercase;margin:18px 0 22px;letter-spacing:-.01em}