
:root{
  --encre:#111111; --gris:#666666; --gris2:#8a8a8a; --trait:#E2E2E2; --fond2:#F5F5F5; --fond3:#F7F7F7; --blanc:#FFFFFF;
  --rouge-louzon:#ED1C24;            /* bandeau, d'après louzon.net */
  --rouge-vif:#ED0037;               /* remise, guide des pointures, d'après fcbayern.com */
  --r1:#A41D2C; --r2:#B92736; --r3:#C92E3E;   /* en-tête : rouges doux du Bayern, ordre inversé, du plus foncé (haut) au plus clair (menu) */
  --rouge-fonce:#A60027;             /* CTA « Voir l'offre », d'après le dégradé du Bayern */
  --deg:linear-gradient(18deg,#A60027,#ED0037);
  --noir:#0B0B0B; --gris-clair:#9A9A94; --flash:#FF2D4F;   /* bandeau RunningDeals, rouge à la place du fluo */
  --ok:#1F7A4D; --ok-soft:#E7F4EC;
  --police:"Helvetica Neue",Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:84px}
body{margin:0;background:var(--blanc);color:var(--encre);font-family:var(--police);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
button{font:inherit;color:inherit}
.c{max-width:1340px;margin:0 auto;padding-inline:24px}
.sa-flip{transform:scaleX(-1)}

/* En-tête de la piste A */
.tete{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:20px 0 0}
.logo{display:inline-flex;flex-direction:column;align-items:center;text-decoration:none}
.logo b{background:var(--rouge-vif);color:#fff;font-size:26px;letter-spacing:-.06em;line-height:1;padding:10px 14px 9px}
.logo span{font-size:11px;font-weight:700;letter-spacing:.2em;margin-top:8px}
.nav{display:flex;align-items:center;gap:28px;padding-top:14px;font-size:15px;font-weight:700}
.nav a{text-decoration:none}
.nav a:hover{text-decoration:underline}
.chip{border:0;background:none;padding:0;cursor:pointer;font-weight:700;border-bottom:2px solid var(--rouge-vif)}
.cherche{display:flex;align-items:center;gap:12px;margin:24px 0 0;border-bottom:1px solid var(--encre);padding:10px 0}
.cherche input{flex:1;border:0;outline:0;font:inherit;font-size:17px;background:none;color:var(--encre);min-width:0}
.cherche input::placeholder{color:var(--gris2)}
.fil{margin:22px 0 0;font-size:14px;color:var(--gris)}
.fil a{text-decoration:none}

/* Bloc produit, d'après la fiche Foot Inside */
.prod{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:44px;padding:22px 0 8px;align-items:start}
.galerie{position:sticky;top:94px}
.galerie .scene{position:relative;background:var(--fond2);border:1px solid #ECECEC;border-radius:12px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;padding:8%}
.badge{position:absolute;top:0;left:0;background:var(--rouge-vif);color:#fff;font-size:16px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;border-radius:12px 0 10px 0;padding:10px 16px;z-index:2}
.scene-marque{position:absolute;right:18px;top:16px;width:48px;height:48px;opacity:.92}
.coeur{position:absolute;bottom:12px;right:12px;width:40px;height:40px;border-radius:50%;border:0;background:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.vignettes{display:flex;gap:10px;margin-top:12px}
.vignettes button{width:76px;height:76px;border-radius:10px;background:var(--fond2);border:2px solid transparent;padding:6px;cursor:pointer}
.vignettes button[aria-pressed="true"]{border-color:var(--encre)}

.titre-l{display:flex;align-items:flex-start;gap:14px;margin:0 0 12px}
.marque{height:40px;width:40px;flex:none;margin-top:2px}
h1{font-size:38px;line-height:1.08;letter-spacing:-.025em;font-weight:800;font-style:italic;margin:0}
.note-l{display:flex;align-items:center;gap:9px;font-size:14px;color:#3a3a3a;margin-bottom:24px;flex-wrap:wrap;position:relative}
.stars{display:flex;gap:1px;color:var(--encre)}
.indice{display:inline-flex;align-items:center;gap:6px}
.indice-i{width:18px;height:18px;padding:0;border-radius:50%;border:1.5px solid currentColor;background:none;font-size:11px;font-weight:700;line-height:1;cursor:pointer}
.indice-bulle{display:none;position:absolute;left:0;top:calc(100% + 6px);z-index:30;max-width:min(340px,100%);background:var(--encre);color:#fff;font-size:13px;line-height:1.45;border-radius:8px;padding:10px 12px}
.indice.ouvert .indice-bulle{display:block}
.pastille-ok{display:inline-flex;align-items:center;gap:7px;background:#EFEFEF;color:#444;font-size:12.5px;font-weight:600;border-radius:999px;padding:4px 11px}
.pastille-ok i{width:7px;height:7px;border-radius:50%;background:#777}

.best{border:2px solid var(--encre);border-radius:14px;padding:22px;margin-bottom:22px;position:relative}
.best-tag{position:absolute;top:-11px;left:18px;background:var(--encre);color:#fff;font-size:11px;font-weight:700;letter-spacing:.06em;padding:4px 12px;border-radius:6px;text-transform:uppercase}
.best-top{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.best-p{font-style:italic;font-weight:800;font-size:46px;letter-spacing:-.04em;line-height:1}
.best-av{font-size:15px;color:var(--gris2);text-decoration:line-through}
.best-rem{background:var(--rouge-vif);color:#fff;font-size:13px;font-weight:700;padding:4px 10px;border-radius:6px}
.best-rem--sur{background:#EDEDED;color:var(--encre)}
.best-m{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.best-mlogo{width:52px;height:52px;border:1px solid var(--trait);border-radius:8px;display:grid;place-items:center;flex:none;overflow:hidden;background:#fff;font-size:11px;font-weight:700}
.best-mlogo img{max-width:78%;max-height:64%;object-fit:contain}
.verif{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--gris);margin-top:2px}
.btn-cta{flex:1 1 280px;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 24px;background:var(--rouge-vif);color:#fff;border-radius:999px;font-weight:700;font-size:15px;text-decoration:none;animation:halo 2.6s ease-in-out infinite;transition:background .2s}
.btn-cta:hover,.btn-cta:focus-visible{background:var(--rouge-fonce);animation:none}
.btn-cta svg{animation:panier 2s ease-in-out infinite;transform-origin:70% 85%}
@keyframes halo{0%,100%{box-shadow:0 0 0 0 rgba(237,0,55,.5),0 6px 18px -8px rgba(237,0,55,.5)}50%{box-shadow:0 0 0 10px rgba(237,0,55,0),0 10px 26px -8px rgba(237,0,55,.7)}}
@keyframes panier{0%,78%,100%{transform:translateY(0) rotate(0)}84%{transform:translateY(-3px) rotate(-10deg)}90%{transform:translateY(0) rotate(6deg)}}
.best-note{display:flex;gap:9px;align-items:flex-start;margin-top:16px;padding-top:14px;border-top:1px solid #EFEFEF;font-size:13.5px;color:#3a3a3a;line-height:1.5}
.best-note svg{flex:none;margin-top:3px;color:var(--gris2)}

.bloc-h{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.bloc-h b{font-size:15.5px}
.bloc-h small{color:var(--gris);font-size:13.5px}
.guide{margin-left:auto;display:inline-flex;align-items:center;gap:9px;background:#0B0B0B;color:#fff;font-weight:700;font-size:14px;border-radius:999px;padding:9px 18px;text-decoration:none}
.guide:hover{background:#333}
/* Pointures : pilules de la piste C, liseré noir */
.grille-tailles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.sa-taille{border:1.5px solid var(--encre);border-radius:999px;background:#fff;padding:7px 2px;cursor:pointer;display:flex;flex-direction:column;align-items:center;line-height:1.2}
.sa-taille:hover{background:var(--fond2)}
.sa-taille-n{font-weight:700;font-size:15px}
.sa-taille-p{font-size:11px;color:var(--gris)}
.sa-taille--bas .sa-taille-p{color:var(--rouge-vif);font-weight:700}
.sa-taille[aria-pressed="true"]{background:var(--encre);color:#fff}
.sa-taille[aria-pressed="true"] .sa-taille-p{color:#fff}
.conseil{display:flex;gap:12px;align-items:flex-start;background:var(--fond2);border-radius:12px;padding:12px 14px;margin-top:14px;font-size:14px}
.conseil svg{flex:none;margin-top:2px}
.infobox{border:1px solid var(--trait);border-radius:12px;margin-top:18px}
.infobox p{display:flex;gap:12px;align-items:center;margin:0;padding:12px 16px;font-size:14px}
.infobox p + p{border-top:1px solid var(--trait)}
.infobox svg{flex:none;color:var(--gris)}
.alerte-fi{border:1px solid var(--trait);border-radius:12px;margin-top:14px;padding:16px}
.alerte-fi h3{display:flex;align-items:center;gap:10px;font-size:15px;margin:0}
.alerte-fi > p{margin:4px 0 12px 32px;font-size:13.5px;color:var(--gris)}
.alerte{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.alerte input{font:inherit;font-size:14px;border:1px solid #D6D6D6;border-radius:999px;padding:10px 14px;min-width:0}
.alerte input[type=number]{width:120px}
.alerte input[type=email]{flex:1 1 180px}
.alerte button{background:var(--encre);color:#fff;border:0;border-radius:999px;padding:11px 18px;font-weight:700;cursor:pointer}
.retour{font-size:13px;color:var(--gris);width:100%;margin:0}

/* Bandeau rouge, mesures du bandeau .r-feel de louzon.net */
.bande{background:linear-gradient(150deg,#D2002E 0%,#ED0037 55%,#C2002B 100%);color:#fff;padding-block:40px}
.bande .index{display:flex;justify-content:space-between;align-items:baseline;gap:30px;font-size:12px;letter-spacing:.035em;line-height:1.5;border-bottom:1px solid #ffffff60;padding-bottom:22px;margin-bottom:26px;text-transform:uppercase}
.bande .index span:first-child{font-size:16px;font-weight:800;letter-spacing:.06em}
.entre{display:grid;grid-template-columns:auto minmax(0,1fr);gap:48px;align-items:center}
.questions{border-top:1px solid #ffffff60;display:flex;flex-wrap:wrap;justify-content:center;gap:12px 30px;margin:26px 0 0;padding:20px 0 0;list-style:none}
.questions a{font-size:14px;font-weight:600;text-decoration:none}
.questions a:hover{text-decoration:underline}
/* Étiquette, d'après l'étiquette de taille Nike */
.etiq{display:grid;grid-template-columns:96px 400px 30px;background:var(--rouge-vif);border:2px solid #fff;border-radius:6px;overflow:hidden;box-shadow:0 10px 30px -14px rgba(60,0,0,.6)}
.etiq-code{background:#fff;display:flex;align-items:center;justify-content:center;padding:8px 6px}
.etiq-code svg{width:80px;height:auto}
.etiq-corps{padding:14px 18px 12px;display:flex;flex-direction:column;gap:6px;min-width:0}
.etiq-nom{font-size:15px;font-weight:800;letter-spacing:.01em;text-transform:uppercase;line-height:1.15;margin:0}
.etiq-taille{display:flex;align-items:center;gap:18px}
.etiq-taille b{font-size:52px;line-height:.9;font-weight:800;letter-spacing:-.03em}
.etiq-taille dl{display:grid;grid-template-columns:auto auto;gap:2px 16px;margin:0;font-size:12.5px;font-weight:700;letter-spacing:.02em}
.etiq-taille dd{margin:0}
.etiq-col{font-size:10.5px;text-transform:uppercase;letter-spacing:.03em;margin:0;opacity:.95}
.etiq-pied{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.etiq-style{font-size:26px;font-weight:800;letter-spacing:.02em;line-height:1;white-space:nowrap}
.etiq-ean{font-size:15px;font-weight:800;letter-spacing:.04em;text-align:right;line-height:1.2;white-space:nowrap}
.etiq-prix{background:#fff;color:var(--encre);writing-mode:vertical-rl;transform:rotate(180deg);font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;display:flex;align-items:center;justify-content:center;white-space:nowrap}
/* Pictos, d'après la fiche RunningDeals */
.pictos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 28px;margin:0;padding:0;list-style:none}
.pictos li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;align-items:center}
.pictos svg{width:28px;height:28px}
.pictos small{display:block;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.75}
.pictos b{display:block;font-size:15px;font-weight:800;text-transform:uppercase;letter-spacing:.01em;line-height:1.2}

/* Comparateur : encadré gris de la piste C, meilleure offre en dégradé et boutons de la piste B */
.sec{padding-block:64px}
.boite-gris{background:var(--fond3);border-radius:16px;padding:28px}
.cmp{padding-block:16px 48px}
.cmp .boite-gris{padding:20px 22px}
.cmp-tete{display:flex;align-items:center;justify-content:space-between;gap:10px 20px;flex-wrap:wrap}
.cmp-titre{margin:0;font-size:12px;font-weight:800;line-height:1.5;text-transform:uppercase;letter-spacing:.12em;color:var(--encre)}
.cmp-titre .rouge{color:var(--rouge-vif);text-transform:uppercase;letter-spacing:.12em;font-weight:800;margin-right:10px}
.bulles{display:flex;gap:8px;flex-wrap:wrap}
.bulle{display:inline-flex;align-items:center;gap:6px;background:#FFE5EB;color:#A60027;font-size:12.5px;font-weight:600;border-radius:999px;padding:5px 12px}
.cmp-cols{display:grid;grid-template-columns:34px 46px minmax(0,1fr) 150px 120px 160px;gap:14px;padding:14px 17px 8px;border-bottom:2px solid var(--encre);font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gris)}
.cmp-cols .col-m{grid-column:span 2}
.cmp-cols .num{text-align:right}
.cmp .offres{gap:7px;margin-top:10px}
.cmp .sa-ligne{padding:9px 16px;gap:14px;border-radius:12px;grid-template-columns:34px 46px minmax(0,1fr) 150px 120px 160px}
.cmp .sa-rang{font-size:18px;font-weight:800;letter-spacing:0;color:#9A9A94;text-align:center}
.cmp .sa-ligne--top .sa-rang{color:#fff}
.sa-port{font-size:13px;color:var(--gris)}
.sa-ligne--top .sa-port{color:#ffd0da}
.badge-mp{display:inline-block;background:#fff;color:var(--rouge-fonce);font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:2px 8px;margin-left:8px;vertical-align:2px}
/* CTA animés de la fiche Foot Inside (.btn-sm.o-cta) : reflet qui traverse, flèche au survol, halo sur la meilleure offre */
.cmp .sa-voir{justify-self:end;display:inline-flex;align-items:center;gap:8px;position:relative;overflow:hidden;background:var(--rouge-vif);color:#fff;border-radius:999px;padding:10px 18px;font-size:14.5px;font-weight:700;white-space:nowrap;box-shadow:0 6px 16px -8px rgba(237,0,55,.65);transition:.18s}
.cmp .sa-voir:hover,.cmp .sa-voir:focus-visible{background:var(--rouge-fonce);transform:translateY(-1px)}
.cmp .sa-voir::after{content:"";position:absolute;top:0;left:-30%;width:22%;height:100%;background:linear-gradient(115deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-18deg);animation:cta-reflet 3.2s ease-in-out infinite}
@keyframes cta-reflet{0%,18%{left:-30%}55%,100%{left:130%}}
.cta-arr{display:inline-flex;transition:transform .2s ease}
.cmp .sa-voir:hover .cta-arr{transform:translateX(3px)}
.cmp .sa-ligne--top .sa-voir{background:#fff;color:var(--rouge-fonce);animation:halo-blanc 2.6s ease-in-out infinite}
.cmp .sa-ligne--top .sa-voir::after{background:linear-gradient(115deg,transparent,rgba(237,0,55,.25),transparent)}
@keyframes halo-blanc{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}50%{box-shadow:0 0 0 8px rgba(255,255,255,0)}}
@media (prefers-reduced-motion:reduce){.cmp .sa-voir::after{display:none}.cmp .sa-ligne--top .sa-voir{animation:none}}
.cmp .sa-logo{width:46px;height:46px;border-radius:50%;border:0;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.14)}
.cmp .sa-logo img{max-width:74%;max-height:58%}
.sa-logo.plein,.pt-bille.plein{background:#111}
.sa-logo.plein img,.pt-bille.plein img{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover}
.cmp .sa-ligne--top .sa-logo{box-shadow:0 4px 14px rgba(60,0,15,.35)}
.cmp .sa-boutique strong{font-size:16.5px}
.cmp .sa-montant{font-size:22px}

.h2{font-size:34px;letter-spacing:-.025em;line-height:1.1;margin:0}
.chapo{color:var(--gris);font-size:16px;margin:8px 0 0;max-width:760px}
.offres{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.sa-ligne{display:grid;grid-template-columns:130px 56px minmax(0,1fr) 100px 130px 160px;align-items:center;gap:16px;padding:14px 20px;background:#fff;border:1px solid #EAEAEA;border-radius:14px}
.sa-ligne--top{background:var(--deg);color:#fff;border-color:transparent}
.sa-rang{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.sa-logo{width:56px;height:56px;border-radius:10px;background:#fff;border:1px solid #EAEAEA;display:grid;place-items:center;overflow:hidden;font-weight:700;font-size:12px;color:var(--encre)}
.sa-logo img{max-width:80%;max-height:66%;object-fit:contain}
.sa-boutique strong{display:block;font-size:18px}
.sa-boutique small{color:var(--gris);font-size:13px}
.sa-ligne--top .sa-boutique small{color:#ffd0da}
.sa-diff{color:var(--gris);font-size:14px;text-align:right}
.sa-montant{font-size:26px;font-weight:800;font-style:italic;letter-spacing:-.03em;text-align:right}
.sa-voir{justify-self:end;text-decoration:none;font-weight:700;border-radius:999px;padding:11px 18px;background:var(--encre);color:#fff}
.sa-ligne--top .sa-voir{background:#fff;color:var(--rouge-fonce)}
.note{font-size:13px;color:var(--gris);margin:14px 0 0}

/* Bandeau noir de RunningDeals (fiche_template.py), rouge à la place du vert fluo */
.bande-prix{background:var(--noir);color:#fff;padding:52px 0;overflow:hidden}
.regle-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:36px;flex-wrap:wrap;margin-bottom:38px}
.regle-sur{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--flash);margin-bottom:8px}
.regle-titre{font-size:30px;font-weight:700;letter-spacing:-.7px;line-height:1.15;max-width:30ch}
.regle-gain{text-align:right}
.regle-gain b{display:block;font-size:72px;font-weight:900;font-style:italic;letter-spacing:-2px;color:var(--flash);line-height:.95}
.regle-gain span{font-size:13px;color:#fff;font-weight:700;text-transform:uppercase;letter-spacing:.07em}
.regle-piste{position:relative;height:162px;margin:0 30px}
.regle-barre{position:absolute;top:39px;left:0;right:0;height:4px;border-radius:2px;background:linear-gradient(90deg,#33332F 0%,#4A4A46 45%,var(--flash) 100%)}
.regle-barre::after{content:"";position:absolute;left:0;right:0;top:9px;height:6px;background:repeating-linear-gradient(90deg,#3a3a37 0 1px,transparent 1px 10%)}
.regle-pct{display:inline-block;background:var(--flash);color:#fff;font-size:12px;font-weight:800;border-radius:999px;padding:3px 10px;margin:8px 0 6px}
.regle-gain span:last-child{display:block}
.regle-pied{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.regle-pied a{color:#fff;font-weight:700;text-decoration:none;border-bottom:2px solid var(--flash)}
.coureur{position:absolute;top:28px;display:flex;align-items:center;gap:7px;animation:court 6s cubic-bezier(.45,0,.35,1) infinite;z-index:3}
.coureur .go{font-size:29px;font-weight:900;font-style:italic;color:#fff;letter-spacing:-.03em;line-height:1;text-shadow:0 2px 8px rgba(0,0,0,.85);animation:pousseGo .34s ease-in-out infinite}
@keyframes pousseGo{0%,100%{transform:translateX(0)}50%{transform:translateX(1.5px)}}
.coureur .filets{display:flex;flex-direction:column;gap:3px;align-items:flex-end}
.coureur .filets i{display:block;height:2.6px;border-radius:1.3px;background:var(--flash);animation:file .5s linear infinite}
.coureur .filets i:nth-child(1){width:17px}
.coureur .filets i:nth-child(2){width:12px;animation-delay:-.17s}
.coureur .filets i:nth-child(3){width:8px;animation-delay:-.33s}
@keyframes file{0%{transform:translateX(9px);opacity:0}35%{opacity:.95}100%{transform:translateX(-11px);opacity:0}}
@keyframes court{0%{left:1%}46%{left:91%}64%{left:91%}96%,100%{left:1%}}
.pt-reg{position:absolute;top:0;transform:translateX(-50%);text-align:center;width:130px}
.pt-prix{display:block;font-size:14px;font-weight:700;margin-bottom:9px;white-space:nowrap}
.pt-bille{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff;margin:0 auto;border:3px solid #4A4A46;position:relative;top:-8px;overflow:hidden}
.pt-bille img{max-width:74%;max-height:60%;object-fit:contain}
.pt-march{display:block;font-size:11px;color:var(--gris-clair);margin-top:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pt-reg.mini{width:190px}
.pt-reg.mini .pt-prix{color:var(--flash);font-size:19px;font-weight:800}
.pt-reg.mini .pt-bille{width:40px;height:40px;top:-11px;border-color:var(--flash);box-shadow:0 0 0 6px rgba(255,45,79,.28)}
.pt-reg.mini .pt-march{color:#fff;font-weight:600;white-space:nowrap;overflow:visible;position:absolute;top:110px;left:50%;transform:translateX(-50%)!important;width:max-content}
.pt-reg.mini.bord-d .pt-march{left:auto;right:calc(50% - 26px);transform:none!important}
.pt-achat{display:inline-flex;align-items:center;gap:8px;background:var(--flash);color:#fff;font-size:12.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;border-radius:999px;padding:9px 15px;text-decoration:none;box-shadow:0 8px 22px -10px rgba(255,45,79,.8);transition:.18s}
.pt-achat:hover{transform:translateY(-1px);box-shadow:0 10px 26px -10px rgba(255,45,79,1)}
.pt-achat mark{display:inline-flex;align-items:center;gap:6px;background:#fff;color:var(--flash);font-weight:900;padding:5px 12px;border-radius:999px;box-shadow:0 0 0 2px rgba(255,255,255,.45)}
.pt-achat mark svg{flex:none;transition:transform .2s ease}
.pt-achat:hover mark svg{transform:translateX(3px)}
.pt-descend{position:absolute;top:64px;left:50%;color:var(--flash);display:block;width:22px;height:30px;transform:translateX(-50%);animation:descend 1.1s ease-in-out infinite}
.pt-descend svg{display:block;width:22px;height:30px}
@keyframes descend{0%,100%{transform:translateX(-50%) translateY(-3px);opacity:.55}50%{transform:translateX(-50%) translateY(7px);opacity:1}}
@media (prefers-reduced-motion:reduce){.pt-descend{animation:none}}
.pt-reg.muet{width:16px}
.pt-reg.muet{width:28px}
.pt-reg.muet .pt-bille{width:28px;height:28px;transform:translateY(25px)}
.pt-lien{display:block;color:inherit;text-decoration:none;border-bottom:1px solid transparent;width:fit-content;margin:0 auto}
.pt-lien:hover,.pt-lien:focus-visible{border-bottom-color:var(--flash)}
.pt-cta{display:block;font-size:10.5px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:#fff;white-space:nowrap;text-decoration:underline;text-decoration-color:var(--flash);text-underline-offset:3px;text-decoration-thickness:2px;margin-bottom:2px}
.pt-fleches{display:block;color:var(--flash);font-size:15px;font-weight:900;line-height:1;letter-spacing:1px;margin-bottom:4px;animation:filePt 1.1s ease-in-out infinite}
@keyframes filePt{0%,100%{transform:translateX(-3px);opacity:.55}50%{transform:translateX(4px);opacity:1}}
.pt-reg.bord-d .pt-prix,.pt-reg.bord-d .pt-march{transform:translateX(-38%)}
.pt-reg.bord-g .pt-prix,.pt-reg.bord-g .pt-march{transform:translateX(38%)}
.pt-reg.mini.bord-d .pt-prix,.pt-reg.mini.bord-d .pt-march{transform:translateX(-26%)}
.pt-reg.mini.bord-g .pt-prix,.pt-reg.mini.bord-g .pt-march{transform:translateX(26%)}
.regle-pied{margin-top:14px;font-size:12.5px;color:#8A8A84}
@media (prefers-reduced-motion:reduce){
  .coureur,.coureur .go,.coureur .filets i,.pt-fleches,.btn-cta,.btn-cta svg{animation:none}
  .coureur{left:91%}
}


/* Onglets Description / Caractéristiques / Livraison, d'après la fiche RunningDeals */
.onglets-zone{padding-block:72px}
.onglets{display:flex;gap:0;border-bottom:2px solid var(--encre);margin-bottom:28px}
.onglet{background:none;border:none;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;padding:13px 22px;cursor:pointer;color:var(--gris);border-radius:0}
.onglet:hover{color:var(--encre)}
.onglet[aria-selected="true"]{background:var(--encre);color:#fff}
.v-texte{font-size:15px;line-height:1.7;max-width:78ch}
.v-texte p{margin:0}
.v-texte p+p{margin-top:12px}
.v-texte a{font-weight:700;color:var(--rouge-fonce)}
.specs{width:100%;border-collapse:collapse;max-width:720px;font-size:14px}
.specs th{text-align:left;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--gris);padding:14px 24px 14px 0;border-bottom:1px solid var(--trait);width:34%;white-space:nowrap;vertical-align:middle}
.specs td{padding:14px 0;border-bottom:1px solid var(--trait);font-weight:600;white-space:nowrap}
.v-note{margin-top:18px;font-size:12.5px;color:var(--gris)}
/* « Vous aimerez aussi », carrousel de RunningDeals : badge rouge vif à la place du fluo */
.voisins{padding-block:72px 64px}
.voisins-tete{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.fleches{display:flex;gap:8px;flex:none}
.fl-v{width:42px;height:42px;padding:0;border:1px solid var(--encre);background:#fff;color:var(--encre);display:grid;place-items:center;cursor:pointer}
.fl-v:hover,.fl-v:focus-visible{background:var(--encre);color:#fff}
.defile{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 66px) / 4);gap:22px;margin-top:22px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;scrollbar-width:none}
.defile::-webkit-scrollbar{display:none}
.carte-v{scroll-snap-align:start;min-width:0;text-decoration:none;display:block}
.carte-v .c-img{background:#EFEFEC;aspect-ratio:1;display:grid;place-items:center;padding:20px;position:relative}
.carte-v .c-img img{max-height:100%;object-fit:contain}
.etiq-c{position:absolute;top:0;left:0;background:var(--rouge-vif);color:#fff;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:6px 11px;z-index:2}
.carte-v b{display:block;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);margin-top:12px}
.carte-v .n{font-size:15px;font-weight:600;margin:2px 0 6px}
.carte-v .p{font-size:16px;font-weight:800}
.carte-v:hover .n{text-decoration:underline}
@media (prefers-reduced-motion:reduce){.defile{scroll-behavior:auto}}

/* Les autres coloris : piste A */
.gris{background:var(--fond2)}
.entete-sec{display:flex;justify-content:space-between;gap:20px;color:var(--gris);font-size:17px;padding-bottom:20px;border-bottom:1px solid var(--trait)}
.h2-filet{margin-top:0!important;padding-bottom:18px;border-bottom:1px solid var(--trait);font-size:34px!important;text-transform:uppercase;letter-spacing:-.01em!important}
.h2a{font-size:60px;letter-spacing:-.04em;line-height:1.06;margin:30px 0 0}
.cw-grille{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:36px}
.sa-cw{text-decoration:none;display:block}
.sa-cw-img{display:block;background:#fff;aspect-ratio:1/1;padding:10%}
.gris .sa-cw-img{background:#fff}
.sa-cw-nom{display:block;font-weight:700;margin-top:12px;font-size:16px}
.sa-cw-prix{display:block;color:var(--gris);font-size:14px}
.sa-cw:hover .sa-cw-nom{text-decoration:underline}
.duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;margin-top:30px}
.duo .txt{font-size:19px;line-height:1.7;color:var(--gris);margin:0}
.carte{display:flex;align-items:flex-end;gap:6px;height:240px;margin-top:40px;overflow-x:auto;padding-bottom:4px}
.sa-barre{flex:1 0 34px;height:100%;border:0;background:none;padding:0;cursor:pointer;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px}
.sa-barre-v{width:100%;height:var(--h);background:#cfcfcf}
.sa-barre-p{font-size:11px;color:var(--gris)}
.sa-barre-n{font-size:13px;font-weight:700}
.sa-barre--bas .sa-barre-v{background:var(--rouge-vif)}
.sa-barre[aria-pressed="true"] .sa-barre-v{background:var(--encre)}
.sa-barre[aria-pressed="true"] .sa-barre-p{color:var(--encre);font-weight:700}
.chrono{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid var(--trait)}
.chrono li{display:grid;grid-template-columns:150px minmax(0,1fr) 40px;gap:24px;padding:26px 0;border-bottom:1px solid var(--trait)}
.chrono .an{color:var(--gris);font-size:15px;padding-top:4px}
.chrono .lab{font-size:14px;color:var(--gris)}
.chrono h3{font-size:28px;letter-spacing:-.025em;line-height:1.15;margin:4px 0 10px}
.chrono b{display:block;margin-bottom:8px}
.chrono p{color:var(--gris);margin:0;max-width:640px;line-height:1.65}
.chrono .fl{justify-self:end;text-decoration:none;font-size:20px}
.archives{list-style:none;margin:28px 0 0;padding:0;columns:2;column-gap:40px}
.sa-arch{break-inside:avoid;display:grid;grid-template-columns:110px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--trait);font-size:15px}
.sa-arch time{color:var(--gris)}
.sa-arch a{text-decoration:none;font-weight:700}

/* En-tête façon Foot Inside, trois rouges du Bayern du plus foncé au plus clair */
.util{background:#0B0B0B;color:rgba(255,255,255,.9);font-size:12.5px;overflow:hidden;white-space:nowrap;padding:8px 0}
.util-piste{display:inline-block;animation:util-defile 95s linear infinite;will-change:transform}
.util:hover .util-piste{animation-play-state:paused}
.util-item{display:inline-flex;align-items:center;gap:9px;padding:0 24px;color:inherit;text-decoration:none}
.util-item:hover{color:#fff;text-decoration:underline}
.util-item .pt{width:7px;height:7px;border-radius:50%;background:#FF2D4F;flex:none}
.util-item .remise{background:#FF2D4F;color:#fff;font-weight:800;font-size:11.5px;padding:2px 8px;border-radius:999px;line-height:1.4}
@keyframes util-defile{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.head-fi{background:#EC0138;color:#fff;position:sticky;top:0;z-index:120}
.head-fi .c{display:flex;align-items:center;gap:26px;height:70px}
.logo-fi{display:flex;align-items:center;flex:none}
.logo-fi img{display:block;height:46px;width:auto}
.rech{flex:1;max-width:640px;display:flex;background:#fff;border-radius:999px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.2);border:1px solid #FF2D4F}
.rech:focus-within{box-shadow:0 3px 12px rgba(0,0,0,.28)}
.rech input:focus,.rech .go:focus{outline:none}
.rech .go:focus-visible{background:#9A1A28}
.rech select{border:0;background:#F2F2F2;padding:0 30px 0 18px;font:inherit;font-size:14px;color:#3a3a3a;cursor:pointer;border-right:1px solid var(--trait)}
.rech input{flex:1;border:0;outline:none;padding:12px 16px;font:inherit;font-size:15px;min-width:0;color:var(--encre)}
.rech .go{background:#B92736;color:#fff;border:0;padding:0 22px;display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;cursor:pointer}
.rech .go:hover{background:#9A1A28}
.head-r{margin-left:auto;display:flex;align-items:center;gap:8px;flex:none}
.hbtn{display:flex;align-items:center;gap:8px;padding:9px 13px;border-radius:8px;font-size:14px;color:rgba(255,255,255,.92);text-decoration:none}
.hbtn:hover{background:rgba(255,255,255,.12);color:#fff}
.rnav{background:#DF0234;color:#fff;box-shadow:inset 0 -3px 0 #EC0138}
.rnav .c{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;position:relative}
.rnav .c::-webkit-scrollbar{display:none}
.rnav a{display:flex;align-items:center;gap:8px;padding:11px 17px;font-size:14.5px;font-weight:600;white-space:nowrap;border-bottom:3px solid transparent;color:#fff;text-decoration:none}
.rnav a:first-child{padding-left:0}
.rnav-ind{position:absolute;bottom:0;left:0;width:0;height:3px;background:#B92736;border-radius:0;transition:left .28s ease,width .28s ease;pointer-events:none}
.rnav a.on{border-bottom-color:transparent}
.rnav .lv{background:#fff;color:#B92736;font-size:10px;font-weight:800;padding:1px 6px;border-radius:3px}
/* Pied façon Foot Inside */
.pf-liens{background:#161616}
.pf-liens .c{display:flex;justify-content:center;gap:34px;flex-wrap:wrap;padding-block:16px}
.pf-liens a{color:rgba(255,255,255,.9);font-size:14px;font-weight:600;text-decoration:none}
.pf-liens a:hover{color:#fff;text-decoration:underline}
.pf{background:#0B0B0B;color:#fff;padding:56px 0 26px}
.pf-sitemap{padding-bottom:38px;border-bottom:1px solid rgba(255,255,255,.14)}
.pf-titre{font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;margin:0 0 22px;color:#fff;text-align:center}
.pf-cols{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:30px}
.pf h4{font-size:15px;margin:0 0 12px;color:#FF2D4F}
.pf ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:14.5px}
.pf a{color:rgba(255,255,255,.78);text-decoration:none}
.pf a:hover{color:#fff;text-decoration:underline}
.pf-brand{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:30px 0}
.pf-brand .logo-fi img{height:64px}
.pf-brand p{color:rgba(255,255,255,.75);font-size:14.5px;margin:0}
.pf-b{padding-top:22px;border-top:1px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;gap:10px 22px;flex-wrap:wrap;font-size:13px;color:rgba(255,255,255,.6)}
.pf-b a{color:rgba(255,255,255,.7)}
@media (max-width:820px){
  .head-fi .c{height:auto;padding-block:12px;flex-wrap:wrap;gap:12px}
  .logo-fi img{height:38px}
  .rech{order:3;flex-basis:100%;max-width:none}
  .rech select{display:none}
  .hbtn span{display:none}
  .pf-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pf-liens .c{gap:12px 22px}
}
@media (prefers-reduced-motion:reduce){.util-piste{animation:none}}

.barre-mob{display:none}

@media (max-width:1100px){
  .entre{grid-template-columns:1fr;gap:28px}
}
@media (max-width:960px){
  .c{padding-inline:16px}
  .galerie{position:static}
  .vignettes{gap:8px}
  .vignettes button{width:calc((100% - 32px) / 5);height:auto;aspect-ratio:1;padding:4px}
  .etiq-pied{flex-wrap:wrap;gap:4px}
  .pt-reg.mini .pt-march{white-space:normal;width:290px}
  .pt-reg.mini.bord-d .pt-march{right:calc(50% - 10px)}
  .regle-piste{height:196px}
  .pt-achat{flex-wrap:wrap;justify-content:center;row-gap:6px;text-align:center}
  .etiq-ean{font-size:13px;text-align:left;white-space:nowrap}
  .onglets{overflow-x:auto;scrollbar-width:none}
  .onglet{padding:12px 14px;font-size:12px;flex:none}
  .specs th,.specs td{white-space:normal}
  .defile{grid-auto-columns:72%}
  .fleches{display:none}
  .nav .cache{display:none}
  .prod{grid-template-columns:1fr;gap:24px}
  h1{font-size:28px}
  .grille-tailles{grid-template-columns:repeat(4,minmax(0,1fr))}
  .guide{margin-left:0}
  .etiq{grid-template-columns:64px minmax(0,1fr) 26px}
  .etiq-taille b{font-size:44px}
  .pictos{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
  .sa-ligne,.cmp .sa-ligne{grid-template-columns:44px minmax(0,1fr) auto;gap:6px 12px;padding:12px}
  .cmp-cols{display:none}
  .cmp .sa-ligne{grid-template-columns:22px 44px minmax(0,1fr) auto;grid-template-areas:"rang logo bout prix" "rang logo port prix" "cta cta cta cta"}
  .cmp .sa-rang{grid-area:rang}
  .cmp .sa-logo{grid-area:logo}
  .cmp .sa-boutique{grid-area:bout}
  .sa-port{grid-area:port;font-size:12px}
  .cmp .sa-montant{grid-area:prix;align-self:center}
  .cmp .sa-voir{grid-area:cta;justify-self:stretch;justify-content:center}
  .sa-rang{grid-column:1 / -1}
  .sa-logo{width:48px;height:48px}
  .sa-diff{display:none}
  .sa-voir{grid-column:1 / -1;justify-self:stretch;text-align:center}
  .regle-piste{margin:0 12px}
  .pt-reg.bord-d .pt-prix,.pt-reg.bord-d .pt-march,.pt-reg.mini.bord-d .pt-prix,.pt-reg.mini.bord-d .pt-march{transform:translateX(-50%)}
  .pt-reg.bord-g .pt-prix,.pt-reg.bord-g .pt-march,.pt-reg.mini.bord-g .pt-prix,.pt-reg.mini.bord-g .pt-march{transform:translateX(50%)}
  .etiq-code svg{width:56px}
  .h2a{font-size:36px}
  .duo{grid-template-columns:1fr;gap:16px}
  .cw-grille{grid-template-columns:repeat(2,minmax(0,1fr))}
  .chrono li{grid-template-columns:1fr;gap:6px}
  .chrono .fl{display:none}
  .archives{columns:1}
  .sa-barre{flex:0 0 30px}
  .barre-mob{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--trait);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));gap:12px;align-items:center;justify-content:space-between}
  .barre-mob div{font-size:14px;line-height:1.3}
  .barre-mob strong{font-size:18px;font-style:italic}
  .barre-mob a{background:var(--rouge-vif);color:#fff;text-decoration:none;font-weight:700;padding:12px 18px;border-radius:999px;white-space:nowrap}
  body{padding-bottom:74px}
}
@media (max-width:420px){
  .logo b{font-size:20px}
  .etiq-corps{padding:12px}
  .etiq-style{font-size:20px}
  .best-p{font-size:40px}
}

/* Header validé le 12/10/2026 (generer.py, section 9 bis) */
.util{background:#0B0B0B}
.head-fi{background:#1C1C1F;border-top:0}
.rnav{background:#2B2B30;box-shadow:inset 0 -1px 0 rgba(255,255,255,.06);position:sticky;top:var(--haut,70px);z-index:119}
.rnav-ind{background:#ED0037;height:2px}
.rnav a:hover{color:#fff;background:rgba(255,255,255,.04)}
