/* MyPeptide — boutique /shop/ v3 (prototype du 15/10/2026).
 * Habille la boutique en sections v2 (mypeptide-boutique-sections.php) sans toucher au balisage des cartes
 * WooCommerce : hero labo + flacons en orbite, sommaire collant à pastille glissante, têtes de section numérotées,
 * cartes à liseré électrique / inclinaison 3D / reflet, décharge vers le panier, bandeau de réassurance.
 * Tout est rangé sous body.mp-shop-v3. Animations en transform/opacity ; rien sous prefers-reduced-motion. */

@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:600 800;font-display:swap;src:url(fonts/bricolage-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:600 800;font-display:swap;src:url(fonts/bricolage-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C4,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/inter-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C4,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/geistmono-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC}

@font-face{font-family:"Bricolage Fallback";src:local("Arial");size-adjust:102.8%;ascent-override:90.5%;descent-override:26.3%;line-gap-override:0%}

@property --mps-ang{syntax:'<angle>';inherits:false;initial-value:0deg}

body.mp-shop-v3{
  --bg:#08090A;--surface:#0F110F;--surface-2:#131613;--line:#1F231D;--line-2:#353A32;
  --fg:#F4F6F0;--soft:#C9CCC4;--muted:#A1A69C;--dim:#5E6359;
  --lime:#C9F64A;--mint:#BDF07D;--teal:#62C5C5;--ink:#08090A;
  --f-display:"Bricolage Grotesque","Bricolage Fallback",Arial,sans-serif;
  --f-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --f-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --ease:cubic-bezier(.16,1,.3,1);
  /* bas des barres fixes (bandeau promo + menu + barre de langue), mesuré le 15/10 */
  --mps-bars:calc(var(--mp-alert-h,0px) + 151px);
}
@media (max-width:768px){body.mp-shop-v3{--mps-bars:calc(var(--mp-alert-h,0px) + 117px)}}
/* #page passe en overflow:hidden sous 768 px (thème) : ça casse le sommaire collant → clip, qui ne crée pas de conteneur de défilement */
body.mp-shop-v3 #page{overflow:visible!important;overflow-x:clip!important}
body.mp-shop-v3 .woocommerce-products-header{display:none}
body.mp-shop-v3 .woocommerce-breadcrumb{position:relative;z-index:2;font-family:var(--f-mono);font-size:12px!important;letter-spacing:.04em;color:var(--dim)!important;margin-bottom:0!important}
body.mp-shop-v3 .woocommerce-breadcrumb a{color:var(--muted)!important}

/* ============================== HERO ============================== */
.mps-hero{position:relative;isolation:isolate;margin:18px calc(50% - 50vw) 34px;padding:56px max(16px,calc(50vw - 620px)) 70px;overflow:hidden;
  background:radial-gradient(60% 80% at 78% 40%,rgba(98,197,197,.10),transparent 70%),radial-gradient(50% 70% at 20% 10%,rgba(201,246,74,.08),transparent 70%),linear-gradient(180deg,#08090A 0%,#0b0d0b 70%,#08090A 100%);
  border-block:1px solid var(--line);font-family:var(--f-body);color:var(--fg)}
.mps-hero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:56px 56px;-webkit-mask:radial-gradient(70% 90% at 60% 50%,#000,transparent);mask:radial-gradient(70% 90% at 60% 50%,#000,transparent)}
/* boucles du hero figées jusqu'à .is-live (posée par shop-v3.js après load) : rien ne repeint pendant le chargement */
.mps-hero:not(.is-live) *,.mps-hero:not(.is-live) *::before,.mps-hero:not(.is-live) *::after{animation-play-state:paused!important}
.mps-hero .mp3-mol{position:absolute;inset:0;width:100%;height:100%;max-width:none;pointer-events:none;z-index:0;opacity:0;transition:opacity 1.4s ease}
.mps-hero .mp3-mol.is-on{opacity:1}
.mps-hero__in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:40px;align-items:center;max-width:1240px;margin:0 auto}
.mps-kicker{display:flex;align-items:center;gap:10px;margin:0 0 16px;font-family:var(--f-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--lime)}
.mps-kicker i{position:relative;width:8px;height:8px;border-radius:50%;background:var(--lime)}
.mps-kicker i::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--lime);animation:mps-ping 2.2s infinite}
.mps-h1{font-family:var(--f-display)!important;font-weight:800!important;font-size:clamp(40px,6.2vw,84px)!important;line-height:.98!important;letter-spacing:-.032em!important;margin:0 0 22px!important;color:var(--fg)!important}
/* Titre d'un seul bloc de texte (pas une balise par ligne) : c'est lui l'élément LCP, pas le flacon (Lighthouse 15/10). */
.mps-h1 .g{display:block;padding-bottom:.06em}
.mps-h1 .g{background:linear-gradient(100deg,var(--lime) 0%,var(--mint) 35%,var(--teal) 70%,var(--lime) 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:mps-grad 7s linear infinite}
.mps-sub{max-width:52ch;margin:0 0 30px;font-size:clamp(16px,1.35vw,18px);line-height:1.62;color:var(--soft)}
.mps-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:34px}
.mps-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:10px;font-family:var(--f-body);font-weight:700;font-size:15px;text-decoration:none!important;border-radius:14px;padding:15px 22px;transition:transform .25s var(--ease),box-shadow .25s,background .2s,color .2s}
.mps-btn svg{width:18px;height:18px;transition:transform .25s var(--ease)}
.mps-btn:hover svg{transform:translateX(4px)}
.mps-btn--lime{background:var(--lime);color:var(--ink)!important;box-shadow:0 10px 40px -10px rgba(201,246,74,.6)}
.mps-btn--lime::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);transform:translateX(-120%);animation:mps-shine 4.5s ease-in-out 1.5s infinite}
.mps-btn--lime:hover{transform:translateY(-2px);box-shadow:0 18px 50px -12px rgba(201,246,74,.8)}
.mps-btn--ghost{color:var(--fg)!important;border:1px solid var(--line-2);background:rgba(255,255,255,.03)}
.mps-btn--ghost:hover{border-color:var(--teal);background:rgba(98,197,197,.08);transform:translateY(-2px)}
.mps-stats{display:flex;flex-wrap:wrap;gap:0;margin:0;padding:0;list-style:none;border:1px solid var(--line);border-radius:18px;background:rgba(10,12,10,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);width:fit-content;max-width:100%}
.mps-stats li{margin:0;padding:14px 22px;border-right:1px solid var(--line);min-width:0}
.mps-stats li:last-child{border-right:0}
.mps-stats b{display:block;font-family:var(--f-mono);font-weight:700;font-size:26px;line-height:1.1;color:var(--fg)}
.mps-stats b em{font-style:normal;color:var(--lime)}
.mps-stats span{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mps-trust{display:flex;flex-wrap:wrap;gap:8px 20px;margin:20px 0 0;padding:0;list-style:none;font-size:13px;color:var(--muted)}
.mps-trust li{display:flex;align-items:center;gap:7px;margin:0}
.mps-trust svg{width:15px;height:15px;color:var(--lime);flex:none}

/* --- scène : 3 flacons en orbite --- */
.mps-stage{position:relative;aspect-ratio:1/1.02;width:100%;max-width:560px;justify-self:center;--rx:0deg;--ry:0deg}
.mps-stage__glow{position:absolute;left:50%;top:48%;width:120%;aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(201,246,74,.2),rgba(98,197,197,.1) 46%,transparent 74%);animation:mps-breath 5s ease-in-out infinite;pointer-events:none}
.mps-orbit{position:absolute;inset:0;transform:perspective(1200px) rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .5s var(--ease)}
.mps-ring{position:absolute;left:4%;right:4%;top:60%;height:26%;overflow:visible;pointer-events:none}
.mps-ring--back{z-index:1}.mps-ring--front{z-index:20}
.mps-ring ellipse{fill:none;stroke-width:1.2}
.mps-ring .base{stroke:rgba(201,246,74,.18)}
.mps-ring .run{stroke:url(#mpsRingGrad);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:60 540;animation:mps-ring 6s linear infinite}
.mps-ring .run.h{stroke:rgba(201,246,74,.28);stroke-width:9}
.mps-ring .run.b{animation-delay:-3s;stroke-dasharray:24 576;opacity:.8}
.mps-ring .run.b.h{opacity:.5}
.mps-vial{position:absolute;left:50%;bottom:16%;width:29%;aspect-ratio:405/929;margin-left:-14.5%;transform-origin:50% 100%;will-change:transform,opacity,filter}
/* positions de départ de l'orbite (angle 0, mêmes valeurs que place() dans shop-v3.js) : la 1re image n'attend pas le JS */
.mps-orbit>.mps-vial:nth-child(2){z-index:18}
.mps-orbit>.mps-vial:nth-child(3){z-index:6;opacity:.565;transform:translate(77.6%,-23.3%) scale(.625);filter:blur(1.2px)}
.mps-orbit>.mps-vial:nth-child(4){z-index:6;opacity:.565;transform:translate(-77.6%,-23.3%) scale(.625);filter:blur(1.2px)}
.mps-orbit>.mps-vial:nth-child(3) .dk,.mps-orbit>.mps-vial:nth-child(4) .dk{opacity:.45}
.mps-vial img{display:block;width:100%;height:100%;object-fit:contain;max-width:none;filter:drop-shadow(0 30px 40px rgba(0,0,0,.6))}
.mps-vial__fx{position:absolute;inset:0;overflow:hidden;pointer-events:none;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.mps-vial__fx i{position:absolute;display:block}
.mps-vial__fx .dk{inset:0;background:#05070a;opacity:0;z-index:2}
.mps-vial__fx .rl{top:0;bottom:0;left:0;width:38%;opacity:.35;mix-blend-mode:screen;background:linear-gradient(90deg,rgba(98,197,197,.95),rgba(98,197,197,.3) 24%,transparent 70%)}
.mps-vial__fx .rr{top:0;bottom:0;right:0;width:38%;opacity:.35;mix-blend-mode:screen;background:linear-gradient(270deg,rgba(201,246,74,1),rgba(201,246,74,.32) 24%,transparent 70%)}
.mps-vial__fx .sw{top:-10%;bottom:-10%;left:0;width:55%;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.62) 48%,rgba(255,255,255,.16) 56%,transparent 70%);mix-blend-mode:screen;transform:translateX(-120%) skewX(-8deg);animation:mps-sweep 6.5s cubic-bezier(.45,0,.2,1) 1.2s infinite}
.mps-vial__fx .sc{left:0;right:0;top:0;height:16%;background:linear-gradient(180deg,transparent,rgba(201,246,74,.06) 55%,rgba(201,246,74,.6) 92%,rgba(240,255,200,1) 97%,transparent);mix-blend-mode:screen;transform:translateY(-110%);animation:mps-scan 7s cubic-bezier(.55,0,.35,1) 2s infinite;opacity:0;transition:opacity .4s}
.mps-vial.is-front .mps-vial__fx .sc{opacity:1}
.mps-vial__refl{position:absolute;left:0;top:100%;width:100%;height:100%;object-fit:contain;transform:scaleY(-1);opacity:.14;pointer-events:none;-webkit-mask:linear-gradient(to top,#000,transparent 18%);mask:linear-gradient(to top,#000,transparent 18%)}
.mps-vial__tag{position:absolute;left:50%;bottom:-13%;transform:translateX(-50%);white-space:nowrap;font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;color:var(--lime);background:rgba(8,9,10,.8);border:1px solid rgba(201,246,74,.35);border-radius:999px;padding:4px 11px;opacity:0;transition:opacity .4s;text-decoration:none!important}
.mps-vial.is-front .mps-vial__tag{opacity:1}
.mps-zaps{position:absolute;inset:0;width:100%;height:100%;z-index:30;pointer-events:none;overflow:visible}
.mps-zaps path,.mps-bolt path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.mps-zaps .core,.mps-bolt .core{stroke:#f4ffd9;stroke-width:1.6}
.mps-zaps .halo,.mps-bolt .halo{stroke:rgba(201,246,74,.55);stroke-width:6;filter:blur(3px)}
.mps-scroll{position:absolute;left:50%;bottom:16px;z-index:2;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;font-family:var(--f-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);text-decoration:none!important}
.mps-scroll i{width:1px;height:34px;background:linear-gradient(var(--lime),transparent);animation:mps-drop 2s ease-in-out infinite;transform-origin:top}

/* ============================== SOMMAIRE COLLANT ============================== */
body.mp-shop-v3 .mp-shop{font-family:var(--f-body)}
/* Sommaire NON collant (demande de Sami 16/10) : il reste à sa place sous le hero. */
body.mp-shop-v3 .mp-shop-nav{position:relative;z-index:40;gap:16px;flex-wrap:nowrap;margin:0 0 56px;padding:8px 8px 8px 18px;border-radius:18px;border:1px solid var(--line-2);background:rgba(12,14,12,.72);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);box-shadow:0 20px 50px -30px rgba(0,0,0,.9);transition:box-shadow .3s,border-color .3s}
body.mp-shop-v3 .mp-shop-nav.is-stuck{border-color:rgba(201,246,74,.3);box-shadow:0 20px 50px -20px rgba(0,0,0,.95),0 0 0 1px rgba(201,246,74,.06),0 0 40px -10px rgba(201,246,74,.25)}
body.mp-shop-v3 .mp-shop-nav-label{font-family:var(--f-mono);font-weight:600;letter-spacing:.12em}
body.mp-shop-v3 .mp-shop-nav ul{position:relative;flex-wrap:nowrap;gap:4px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;min-width:0;flex:1 1 auto}
body.mp-shop-v3 .mp-shop-nav ul::-webkit-scrollbar{display:none}
body.mp-shop-v3 .mp-shop-nav li{position:relative;z-index:1;flex:none}
body.mp-shop-v3 .mp-shop-nav a{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;background:transparent;border-color:transparent;font-family:var(--f-body);font-size:14px;padding:9px 14px;color:var(--soft);transition:color .3s}
body.mp-shop-v3 .mp-shop-nav a b{font-family:var(--f-mono);font-size:11px;font-weight:600;color:var(--dim);transition:color .3s}
body.mp-shop-v3 .mp-shop-nav a:hover{background:rgba(255,255,255,.05);border-color:transparent;color:var(--fg)}
body.mp-shop-v3 .mp-shop-nav a.is-on,body.mp-shop-v3 .mp-shop-nav a.is-on:hover{color:var(--ink);background:transparent}
body.mp-shop-v3 .mp-shop-nav a.is-on b{color:rgba(8,9,10,.6)}
.mps-ind{position:absolute;z-index:0;top:0;left:0;height:100%;width:0;border-radius:999px;background:var(--lime);box-shadow:0 0 24px -2px rgba(201,246,74,.7);opacity:0;transition:transform .5s var(--ease),width .5s var(--ease),opacity .3s;pointer-events:none}
.mps-ind.is-on{opacity:1}

/* ============================== SECTIONS ============================== */
body.mp-shop-v3 .mp-shop-section{position:relative;isolation:isolate;scroll-margin-top:calc(var(--mps-bars) + 20px);margin:0 0 90px;padding-top:10px}
body.mp-shop-v3 .mp-shop-section+.mp-shop-section{border-top:0;padding-top:10px}
body.mp-shop-v3 .mp-shop-section>:not(.mp3-hexfx){position:relative;z-index:1}
body.mp-shop-v3 .mp-shop-section .mp3-hexfx{position:absolute;inset:-40px -60px;width:calc(100% + 120px);height:calc(100% + 80px);max-width:none;pointer-events:none;z-index:0;opacity:.75}
body.mp-shop-v3 .mp-shop-head{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:26px;align-items:end;margin:0 0 34px;padding-bottom:22px}
body.mp-shop-v3 .mp-shop-head::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,var(--lime),rgba(98,197,197,.5) 40%,transparent);transform-origin:left;transform:scaleX(var(--mps-line,1));transition:transform 1.4s var(--ease) .2s}
.mps-num{grid-row:1/span 3;font-family:var(--f-display);font-weight:800;font-size:clamp(72px,10vw,140px);line-height:.8;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1.5px rgba(201,246,74,.55);text-shadow:0 0 30px rgba(201,246,74,.15);user-select:none}
.mp-shop-section.is-in .mps-num{animation:mps-flicker 1.1s steps(1) .15s both}
body.mp-shop-v3 .mp-shop-count{justify-self:start;font-family:var(--f-mono);font-weight:600;letter-spacing:.12em;background:rgba(201,246,74,.1);border:1px solid rgba(201,246,74,.3)}
body.mp-shop-v3 .mp-shop-head h2{font-family:var(--f-display)!important;font-size:clamp(30px,4.2vw,52px)!important;font-weight:800!important;letter-spacing:-.04em!important;line-height:1!important;padding-left:0!important;margin:12px 0 0!important}
body.mp-shop-v3 .mp-shop-head h2::before{display:none}
body.mp-shop-v3 .mp-shop-head p{margin:12px 0 0;font-size:16px;color:var(--muted)}

/* ============================== CARTES ============================== */
body.mp-shop-v3 .mp-shop ul.products{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
body.mp-shop-v3 .mp-shop ul.products li.product{
  --rx:0deg;--ry:0deg;--mx:50%;--my:50%;--lift:0px;
  position:relative;isolation:isolate;min-width:0;padding:12px 12px 16px;border-radius:22px;border:1px solid var(--line);
  background:linear-gradient(180deg,#121512,#0b0d0b);text-align:left;
  transition:transform .5s var(--ease),border-color .3s,box-shadow .4s,opacity .8s var(--ease)}
/* Bouton « Ajouter au panier » au même niveau sur toute la rangée, quelle que soit la longueur du titre ou la présence des étoiles (16/10). */
body.mp-shop-v3 .mp-shop ul.products li.product{display:flex!important;flex-direction:column}
body.mp-shop-v3 .mp-shop ul.products li.product .astra-shop-summary-wrap{flex:1 1 auto;display:flex;flex-direction:column}
body.mp-shop-v3 .mp-shop ul.products li.product .astra-shop-summary-wrap>.button{margin-top:auto!important}
/* Astra met .review-rating{order:2} : sans effet en bloc, mais en flex les étoiles passaient sous le bouton. */
body.mp-shop-v3 .mp-shop ul.products li.product .astra-shop-summary-wrap>.review-rating{order:0!important;padding:0 16px}
body.mp-shop-v3 .mp-shop ul.products li.product:hover{--lift:-6px;border-color:rgba(201,246,74,.25);box-shadow:0 30px 60px -28px rgba(201,246,74,.35),0 30px 60px -30px rgba(0,0,0,.9);transform:perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--lift));transform-style:preserve-3d}
/* relief des éléments de la carte, seulement pendant le survol (33 cartes en 3D = autant de calques au chargement) */
body.mp-shop-v3 .mp-shop ul.products li.product:hover .astra-shop-thumbnail-wrap{transform:translateZ(30px)}
body.mp-shop-v3 .mp-shop ul.products li.product:hover .woocommerce-loop-product__title{transform:translateZ(20px)}
body.mp-shop-v3 .mp-shop ul.products li.product:hover .price{transform:translateZ(24px)}
body.mp-shop-v3 .mp-shop ul.products li.product:hover .button{transform:translateZ(26px)}
body.mp-shop-v3 .mp-shop ul.products li.product:hover .button:hover{transform:translateZ(26px) translateY(-2px)}
body.mp-shop-v3 .mp-shop ul.products li.product.is-tilting{transition:transform .12s linear,border-color .3s,box-shadow .4s}
/* liseré électrique qui tourne */
body.mp-shop-v3 .mp-shop ul.products li.product::before{content:"";position:absolute;inset:-1px;z-index:3;border-radius:inherit;padding:2px;pointer-events:none;
  background:conic-gradient(from var(--mps-ang),transparent 0 50%,rgba(98,197,197,.9) 66%,var(--lime) 82%,#fff 85%,var(--lime) 88%,transparent 96%);filter:drop-shadow(0 0 6px rgba(201,246,74,.8));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  opacity:0;transition:opacity .35s}
body.mp-shop-v3 .mp-shop ul.products li.product:hover::before,body.mp-shop-v3 .mp-shop ul.products li.product.is-zap::before{opacity:1;animation:mps-spin 2.6s linear infinite}
/* halo qui suit la souris */
body.mp-shop-v3 .mp-shop ul.products li.product::after{content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none;background:radial-gradient(320px circle at var(--mx) var(--my),rgba(201,246,74,.13),transparent 60%);opacity:0;transition:opacity .35s}
body.mp-shop-v3 .mp-shop ul.products li.product:hover::after{opacity:1}
body.mp-shop-v3 .mp-shop ul.products li.product>*{position:relative;z-index:1}
body.mp-shop-v3 .mp-shop ul.products li.product .astra-shop-thumbnail-wrap{position:relative;overflow:hidden;border-radius:16px;margin:0 0 14px}
body.mp-shop-v3 .mp-shop ul.products li.product .astra-shop-thumbnail-wrap::after{content:"";position:absolute;inset:-20% -60%;z-index:2;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.28) 50%,rgba(201,246,74,.12) 54%,transparent 62%);transform:translateX(-70%);opacity:0}
body.mp-shop-v3 .mp-shop ul.products li.product:hover .astra-shop-thumbnail-wrap::after,body.mp-shop-v3 .mp-shop ul.products li.product.is-shine .astra-shop-thumbnail-wrap::after{animation:mps-card-shine 1.1s var(--ease) forwards}
body.mp-shop-v3 .mp-shop ul.products li.product img{margin:0!important;border-radius:16px;transition:transform .9s var(--ease),filter .5s}
body.mp-shop-v3 .mp-shop ul.products li.product:hover img{transform:scale(1.07);filter:saturate(1.15) brightness(1.05)}
body.mp-shop-v3 .mp-shop ul.products li.product .woocommerce-loop-product__title{font-family:var(--f-display)!important;font-size:16px!important;font-weight:600!important;letter-spacing:-.01em;line-height:1.3!important;min-height:2.6em}
body.mp-shop-v3 .mp-shop ul.products li.product .review-rating{margin:0 0 8px}
body.mp-shop-v3 .mp-shop ul.products li.product .star-rating{color:var(--lime)!important;font-size:12px}
body.mp-shop-v3 .mp-shop ul.products li.product .price{font-family:var(--f-mono);font-size:21px;font-weight:700;letter-spacing:-.02em;text-shadow:0 0 18px rgba(201,246,74,.35)}
body.mp-shop-v3 .mp-shop ul.products li.product .price del{font-size:14px;text-shadow:none}
body.mp-shop-v3 .mp-shop ul.products li.product .button{position:relative;overflow:hidden;text-align:center;font-family:var(--f-body)!important;font-weight:700!important;border-radius:13px!important;padding:12px 14px!important;background:rgba(201,246,74,.07)!important;color:var(--lime)!important;border:1px solid rgba(201,246,74,.45)!important;transition:transform .25s var(--ease),box-shadow .25s,background .25s,color .25s!important}
/* sur la carte survolée (ou touchée), le bouton se remplit */
body.mp-shop-v3 .mp-shop ul.products li.product:hover .button,body.mp-shop-v3 .mp-shop ul.products li.product.is-zap .button{background:var(--lime)!important;color:var(--ink)!important;border-color:var(--lime)!important;box-shadow:0 10px 30px -8px rgba(201,246,74,.75)}
body.mp-shop-v3 .mp-shop ul.products li.product .button::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.7) 50%,transparent 70%);transform:translateX(-120%)}
body.mp-shop-v3 .mp-shop ul.products li.product:hover .button::after{animation:mps-shine-once .9s ease forwards}
body.mp-shop-v3 .mp-shop ul.products li.product .button:hover{transform:translateY(-2px);box-shadow:0 14px 34px -10px rgba(201,246,74,.85)}
body.mp-shop-v3 .mp-shop ul.products li.product .button.loading{opacity:.85}
body.mp-shop-v3 .mp-shop ul.products li.product .onsale{font-family:var(--f-mono)!important;border-radius:999px!important;box-shadow:0 0 20px rgba(0,229,160,.5);animation:mps-pulse 2.4s ease-in-out infinite}
/* apparition en cascade : seulement si le JS tourne (html.mps-js), sinon tout reste visible */
html.mps-js body.mp-shop-v3 .mp-shop ul.products li.product:not(.is-in){opacity:0;transform:perspective(1000px) rotateX(14deg) translateY(46px) scale(.95)}
html.mps-js body.mp-shop-v3 .mp-shop ul.products li.product.is-in{transition-delay:calc(var(--i,0) * 70ms)}
html.mps-js body.mp-shop-v3 .mp-shop ul.products li.product.is-in.is-done{transition-delay:0s}
html.mps-js body.mp-shop-v3 .mp-shop-section:not(.is-in) .mp-shop-head{--mps-line:0}
html.mps-js body.mp-shop-v3 .mp-shop-section .mp-shop-head>*{transition:opacity .8s var(--ease),transform .8s var(--ease)}
html.mps-js body.mp-shop-v3 .mp-shop-section:not(.is-in) .mp-shop-head>*{opacity:0;transform:translateY(24px)}

/* décharge vers le panier */
.mps-bolt{position:fixed;inset:0;width:100vw;height:100vh;z-index:99998;pointer-events:none;overflow:visible}
.mps-spark{position:fixed;z-index:99999;width:6px;height:6px;margin:-3px;border-radius:50%;background:#f4ffd9;box-shadow:0 0 10px 3px rgba(201,246,74,.9);pointer-events:none}
.mps-cart-hit{animation:mps-cart-hit .7s var(--ease)}

/* ============================== RÉASSURANCE ============================== */
.mps-assure{position:relative;isolation:isolate;margin:20px 0 70px;padding:46px clamp(18px,4vw,44px);border:1px solid var(--line-2);border-radius:28px;background:radial-gradient(80% 120% at 0% 0%,rgba(201,246,74,.08),transparent 60%),radial-gradient(80% 120% at 100% 100%,rgba(98,197,197,.08),transparent 60%),#0c0e0c;font-family:var(--f-body);overflow:hidden}
.mps-assure>:not(.mp3-hexfx){position:relative;z-index:1}
.mps-assure .mp3-hexfx{position:absolute;inset:0;width:100%;height:100%;max-width:none;pointer-events:none;z-index:0}
.mps-assure h2{font-family:var(--f-display)!important;font-weight:800!important;font-size:clamp(26px,3.4vw,40px)!important;letter-spacing:-.035em!important;line-height:1.05!important;margin:0 0 28px!important;color:var(--fg)!important;max-width:22ch}
.mps-assure h2 em{font-style:normal;color:var(--lime)}
.mps-assure ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.mps-assure li{margin:0;min-width:0}
.mps-assure a,.mps-assure li>div{display:flex;flex-direction:column;gap:10px;height:100%;padding:20px;border-radius:18px;border:1px solid var(--line);background:rgba(8,9,10,.55);color:var(--fg)!important;text-decoration:none!important;transition:border-color .3s,transform .3s var(--ease),background .3s}
.mps-assure a:hover{border-color:var(--lime);transform:translateY(-4px);background:rgba(201,246,74,.05)}
.mps-assure svg{width:26px;height:26px;color:var(--lime)}
.mps-assure strong{font-family:var(--f-display);font-size:18px;font-weight:700;letter-spacing:-.02em}
.mps-assure span{font-size:14px;line-height:1.5;color:var(--muted)}
.mps-assure a span:last-child{color:var(--lime);font-weight:600;margin-top:auto}

/* ============================== KEYFRAMES ============================== */
@keyframes mps-spin{to{--mps-ang:360deg}}
@keyframes mps-ping{0%{transform:scale(1);opacity:.7}80%,100%{transform:scale(3.2);opacity:0}}
@keyframes mps-grad{to{background-position:-220% 0}}
@keyframes mps-shine{0%{transform:translateX(-120%)}30%,100%{transform:translateX(120%)}}
@keyframes mps-shine-once{to{transform:translateX(120%)}}
@keyframes mps-card-shine{0%{opacity:1;transform:translateX(-70%)}100%{opacity:1;transform:translateX(70%)}}
@keyframes mps-breath{0%,100%{opacity:.75;transform:translate(-50%,-50%) scale(.96)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.04)}}
@keyframes mps-ring{to{stroke-dashoffset:-600}}
@keyframes mps-sweep{0%{transform:translateX(-120%) skewX(-8deg)}38%,100%{transform:translateX(230%) skewX(-8deg)}}
@keyframes mps-scan{0%{transform:translateY(-110%)}30%{transform:translateY(640%)}30.01%,100%{transform:translateY(-110%)}}
@keyframes mps-drop{0%{transform:scaleY(0);opacity:1}60%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
@keyframes mps-flicker{0%{-webkit-text-stroke-color:rgba(201,246,74,.1);text-shadow:none}10%{-webkit-text-stroke-color:#f4ffd9;text-shadow:0 0 40px rgba(201,246,74,.9)}20%{-webkit-text-stroke-color:rgba(201,246,74,.2);text-shadow:none}35%{-webkit-text-stroke-color:#f4ffd9;text-shadow:0 0 60px rgba(201,246,74,1)}50%{-webkit-text-stroke-color:rgba(201,246,74,.3)}70%,100%{-webkit-text-stroke-color:rgba(201,246,74,.55);text-shadow:0 0 30px rgba(201,246,74,.15)}}
@keyframes mps-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes mps-cart-hit{0%{transform:scale(1);filter:none}30%{transform:scale(1.45) rotate(-8deg);filter:drop-shadow(0 0 12px #c9f64a) brightness(1.6)}60%{transform:scale(.92) rotate(4deg)}100%{transform:scale(1);filter:none}}

/* ============================== RESPONSIVE ============================== */
@media (max-width:1100px){body.mp-shop-v3 .mp-shop ul.products{grid-template-columns:repeat(3,minmax(0,1fr))}.mps-assure ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .mps-hero{padding-top:34px;padding-bottom:64px}
  .mps-hero__in{grid-template-columns:minmax(0,1fr);gap:8px}
  .mps-stage{order:-1;max-width:400px;width:88%;aspect-ratio:1/.86;margin-bottom:-6px}
  .mps-vial{bottom:20%;width:30%;margin-left:-15%}
  .mps-ring{top:58%}
}
@media (max-width:768px){
  body.mp-shop-v3 .mp-shop ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  body.mp-shop-v3 .mp-shop-nav{padding:6px;border-radius:16px;margin-bottom:40px}
  body.mp-shop-v3 .mp-shop-nav-label{display:none}
  body.mp-shop-v3 .mp-shop-nav a{font-size:13px;padding:8px 12px}
  body.mp-shop-v3 .mp-shop-section{margin-bottom:64px;scroll-margin-top:calc(var(--mps-bars) + 14px)}
  body.mp-shop-v3 .mp-shop-head{column-gap:14px}
  .mps-num{font-size:64px}
  body.mp-shop-v3 .mp-shop ul.products li.product{padding:8px 8px 12px;border-radius:18px}
  body.mp-shop-v3 .mp-shop ul.products li.product .woocommerce-loop-product__title{font-size:14px!important}
  body.mp-shop-v3 .mp-shop ul.products li.product .price{font-size:17px}
  body.mp-shop-v3 .mp-shop ul.products li.product .button{font-size:13px!important;padding:10px 8px!important}
  .mps-stats li{padding:11px 14px}
  .mps-stats b{font-size:21px}
  .mps-scroll{display:none}
}
@media (max-width:560px){
  .mps-assure ul{grid-template-columns:minmax(0,1fr)}
  .mps-stats{width:100%}
  .mps-stats li{flex:1 1 0}
  .mps-ctas .mps-btn{flex:1 1 100%;justify-content:center}
}
@media (max-width:380px){body.mp-shop-v3 .mp-shop ul.products{gap:9px}.mps-num{font-size:52px}}

@media (prefers-reduced-motion:reduce){
  body.mp-shop-v3 *,body.mp-shop-v3 *::before,body.mp-shop-v3 *::after{animation:none!important;transition-duration:.01ms!important}
  html.mps-js body.mp-shop-v3 .mp-shop ul.products li.product:not(.is-in),html.mps-js body.mp-shop-v3 .mp-shop-section:not(.is-in) .mp-shop-head>*{opacity:1;transform:none}
  .mps-vial__fx .sc,.mps-zaps{display:none}
}
