/* Kando — habillage type place de marché mobile */
:root{
  --orange:#FF5000; --orange-fonce:#E64600; --rouge:#FF2D46;
  --fond:#F2F3F5; --blanc:#FFFFFF; --encre:#1A1A1A; --gris:#8A8F99; --gris-clair:#E6E8EB;
  --vert:#0FA36B;
  --r:10px; --max:1180px;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--fond); color:var(--encre);
  font:400 14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased; padding-bottom:64px;
}
@media(min-width:860px){body{padding-bottom:0}}
img{max-width:100%;display:block}
button{font:inherit;cursor:pointer}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.01em}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:10px}
[hidden]{display:none!important}

/* ---------- en-tête ---------- */
header{position:sticky;top:0;z-index:40;background:var(--blanc);border-bottom:1px solid var(--gris-clair)}
.barre{display:flex;align-items:center;gap:10px;padding:9px 0}
.logo{display:flex;align-items:center;gap:6px;font-weight:800;font-size:21px;color:var(--orange);letter-spacing:-.04em;flex:none}
.logo .marque{width:26px;height:26px;border-radius:7px;background:var(--orange);color:#fff;display:grid;place-items:center;font-size:15px;font-weight:800}
.recherche{flex:1;display:flex;align-items:center;background:var(--fond);border:1px solid var(--gris-clair);border-radius:999px;padding:3px 3px 3px 13px;min-width:0}
.recherche input{flex:1;border:0;background:none;font:inherit;font-size:14px;color:var(--encre);outline:none;min-width:0;padding:6px 0}
.recherche input::placeholder{color:var(--gris)}
.recherche button{border:0;background:var(--orange);color:#fff;border-radius:999px;padding:7px 17px;font-weight:700;font-size:13.5px}
.panier-lien{position:relative;flex:none;width:38px;height:38px;display:grid;place-items:center;border:0;background:none;color:var(--encre)}
.panier-lien svg{width:23px;height:23px}
.pastille-nb{position:absolute;top:1px;right:0;background:var(--rouge);color:#fff;border-radius:999px;min-width:17px;height:17px;display:grid;place-items:center;font-size:11px;font-weight:700;padding:0 4px;line-height:1}
.onglets-haut{display:none}
@media(min-width:860px){
  .onglets-haut{display:flex;gap:2px;flex:none}
  .onglets-haut a{padding:8px 14px;border-radius:8px;font-size:14.5px;color:#555;font-weight:500}
  .onglets-haut a:hover{background:var(--fond);color:var(--encre)}
  .onglets-haut a[aria-current="page"]{color:var(--orange);font-weight:700}
}

/* ---------- bandeau de réassurance ---------- */
.reassurance{background:linear-gradient(90deg,#FF5000,#FF7A29);color:#fff;font-size:11.5px;font-weight:600;padding:6px 0}
.reassurance .wrap{display:flex;align-items:center;gap:6px 14px;justify-content:center;flex-wrap:wrap;text-align:center}
@media(min-width:520px){.reassurance .wrap{flex-wrap:nowrap;white-space:nowrap;gap:14px}}
.reassurance .wrap::-webkit-scrollbar{display:none}
.reassurance b{font-weight:800}

/* ---------- rangée de catégories ---------- */
.rayons{background:var(--blanc);padding:12px 0 4px;margin-bottom:8px}
.rayons-piste{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;padding-bottom:8px}
.rayons-piste::-webkit-scrollbar{display:none}
.rayon{flex:none;width:72px;text-align:center;background:none;border:0;padding:0;color:var(--encre)}
.rayon .rond{width:46px;height:46px;margin:0 auto 5px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:17px;letter-spacing:-.02em;overflow:hidden}
.rayon .rond img{width:100%;height:100%;object-fit:cover}
.rayon .rond svg{width:24px;height:24px}
.rayon span{display:block;font-size:11.5px;line-height:1.25;color:#444}
.rayon[aria-pressed="true"] span{color:var(--orange);font-weight:700}
.sous-rayons{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:4px 0 10px}
.sous-rayons::-webkit-scrollbar{display:none}
.sous-rayons button{flex:none;border:1px solid var(--gris-clair);background:var(--blanc);color:#333;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer}
.sous-rayons button[aria-pressed="true"]{background:var(--orange);border-color:var(--orange);color:#fff}

/* ---------- garanties ---------- */
.garanties{background:var(--blanc);border-radius:var(--r);display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:8px;overflow:hidden}
.garantie{padding:12px 8px;text-align:center;position:relative}
.garantie + .garantie::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:1px;background:var(--gris-clair)}
.garantie svg{width:20px;height:20px;color:var(--orange);margin:0 auto 6px;display:block}
.garantie b{display:block;font-size:12.5px;font-weight:700;margin-bottom:2px}
.garantie span{display:block;font-size:11px;color:var(--gris);line-height:1.35}
@media(min-width:620px){.garantie b{font-size:13.5px}.garantie span{font-size:12px}}

/* ---------- moyens de paiement ---------- */
.paiements{display:flex;align-items:center;gap:8px;margin:4px 0 12px;flex-wrap:wrap}
.paiements .libelle{font-size:12.5px;color:var(--gris);width:100%;margin-bottom:1px}
.paiements .badge{display:inline-flex;align-items:center;gap:6px;background:var(--blanc);border:1px solid var(--gris-clair);border-radius:6px;padding:5px 9px;height:34px}
.paiements .badge img{height:20px;width:auto;border-radius:3px;display:block}
.paiements .badge span{font-size:13px;font-weight:700;color:#222}

/* ---------- grille produits ---------- */
.titre-rang{display:flex;align-items:center;gap:8px;padding:12px 2px 9px}
.titre-rang h2{font-size:16px}
.titre-rang .trait{flex:1;height:1px;background:var(--gris-clair)}
.titre-rang a{font-size:13px;color:var(--gris)}
.grille{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
@media(min-width:620px){.grille{grid-template-columns:repeat(3,1fr)}}
@media(min-width:900px){.grille{grid-template-columns:repeat(4,1fr);gap:10px}}
@media(min-width:1100px){.grille{grid-template-columns:repeat(5,1fr)}}
.carte{background:var(--blanc);border:0;border-radius:var(--r);overflow:hidden;padding:0;text-align:left;display:flex;flex-direction:column}
.carte .vignette{position:relative;aspect-ratio:1;background:#F7F8FA;overflow:hidden}
.carte .vignette img{width:100%;height:100%;object-fit:cover}
.carte .vignette .sans{position:absolute;inset:0;display:grid;place-items:center;color:var(--gris);font-size:11.5px}
.carte .marque-video{position:absolute;left:6px;top:6px;background:rgba(0,0,0,.55);color:#fff;font-size:10.5px;font-weight:600;padding:2px 7px;border-radius:999px}
.carte .corps{padding:8px 9px 10px;display:flex;flex-direction:column;gap:5px;flex:1}
.carte .nom{font-size:13px;line-height:1.35;color:var(--encre);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.carte .prix{margin-top:auto;color:var(--rouge);font-weight:800;font-size:18px;line-height:1;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:3px}
.carte .prix i{font-style:normal;font-size:12px;font-weight:700}
.carte .delai{font-size:11px;color:var(--gris)}
.vide{grid-column:1/-1;background:var(--blanc);border-radius:var(--r);padding:38px 20px;text-align:center;color:var(--gris);font-size:13px}
.vide b{display:block;color:var(--encre);font-size:15px;margin-bottom:5px}

/* ---------- pages de contenu ---------- */
.page-tete{background:var(--blanc);padding:18px 0 16px;margin-bottom:8px}
.page-tete h1{font-size:22px;margin-bottom:6px}
.page-tete p{color:#555;font-size:13.5px;margin:0;max-width:64ch;line-height:1.55}
.panneaux{display:grid;grid-template-columns:1fr;gap:8px}
@media(min-width:760px){.panneaux{grid-template-columns:1fr 1fr}}
.panneau-info{background:var(--blanc);border-radius:var(--r);padding:14px 14px 16px}
.panneau-info h3{font-size:14.5px;margin-bottom:6px;display:flex;align-items:center;gap:7px}
.panneau-info h3::before{content:"";width:3px;height:14px;border-radius:2px;background:var(--orange);flex:none}
.panneau-info p{color:#555;font-size:13px;line-height:1.6;margin:0 0 7px}
.panneau-info p:last-child{margin-bottom:0}
.panneau-info strong{color:var(--encre)}
.rappel-fort{background:#FFF3EE;border:1px solid #FFD9C7;border-radius:var(--r);padding:12px 14px;font-size:13px;color:#5A3420;margin-top:8px}
.rappel-fort b{color:var(--orange)}
.gros-num{display:block;font-size:21px;font-weight:800;color:var(--encre);margin:2px 0 12px;font-variant-numeric:tabular-nums}
.bouton{display:inline-block;border:1px solid var(--gris-clair);background:var(--blanc);color:var(--encre);border-radius:999px;padding:9px 18px;font-weight:600;font-size:13.5px}
.bouton.plein{background:var(--orange);border-color:var(--orange);color:#fff}
.bouton.vert{background:#25D366;border-color:#25D366;color:#06301A}

/* ---------- barre d'onglets du bas ---------- */
.onglets{position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--blanc);border-top:1px solid var(--gris-clair);
  display:flex;padding-bottom:env(safe-area-inset-bottom,0px)}
@media(min-width:860px){.onglets{display:none}}
.onglets a{flex:1;padding:6px 0 5px;text-align:center;color:var(--gris);font-size:10.5px;font-weight:600;position:relative}
.onglets a svg{width:22px;height:22px;margin:0 auto 2px;display:block}
.onglets a[aria-current="page"]{color:var(--orange)}
.onglets .compteur{position:absolute;top:2px;left:calc(50% + 5px);background:var(--rouge);color:#fff;border-radius:999px;min-width:16px;height:16px;display:grid;place-items:center;font-size:10px;padding:0 4px;line-height:1}

/* ---------- pied ---------- */
.pied{background:var(--blanc);margin-top:10px;padding:18px 0 22px;border-top:1px solid var(--gris-clair)}
.pied-liens{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:10px}
.pied-liens a{font-size:13px;color:#555}
.pied .mention{color:var(--gris);font-size:11.5px;line-height:1.6}

/* ---------- fiche et panier ---------- */
.voile{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:60;display:flex;align-items:flex-end;justify-content:center}
.panneau{background:var(--blanc);width:100%;max-width:640px;max-height:94vh;display:flex;flex-direction:column;border-radius:14px 14px 0 0}
@media(min-width:640px){.voile{align-items:center}.panneau{border-radius:14px;max-height:90vh}}
.panneau-tete{display:flex;align-items:center;gap:10px;padding:13px 14px;border-bottom:1px solid var(--gris-clair);flex:none}
.panneau-tete h2{font-size:15.5px;flex:1;line-height:1.35}
.fermer{border:0;background:var(--fond);color:#555;width:30px;height:30px;border-radius:50%;font-size:17px;line-height:1;flex:none}
.panneau-corps{overflow-y:auto;padding:0 0 12px;flex:1}
.panneau-pied{flex:none;border-top:1px solid var(--gris-clair);padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));display:flex;gap:8px;background:var(--blanc)}
.panneau-pied .bouton{flex:1;text-align:center;padding:12px 10px;border-radius:999px;font-size:14.5px}
.galerie{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;background:var(--fond)}
.galerie::-webkit-scrollbar{display:none}
.galerie img,.galerie video{width:100%;flex:none;scroll-snap-align:center;aspect-ratio:1;object-fit:cover;background:var(--fond)}
.fiche-prix{padding:12px 14px 10px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.fiche-prix .montant{color:var(--rouge);font-weight:800;font-size:27px;line-height:1;font-variant-numeric:tabular-nums}
.fiche-prix .montant i{font-style:normal;font-size:15px}
.fiche-prix .ref{color:var(--gris);font-size:12px;margin-left:auto}
.fiche-bloc{padding:0 14px 12px}
.fiche-bloc p{font-size:13.5px;color:#444;line-height:1.6;margin:0 0 10px}
.champ{display:block;margin-bottom:11px}
.champ span{display:block;font-size:12.5px;font-weight:600;margin-bottom:5px;color:#444}
.champ input,.champ textarea,.champ select{width:100%;border:1px solid var(--gris-clair);background:var(--blanc);color:var(--encre);border-radius:8px;padding:10px 11px;font:inherit;font-size:15px}
.champ input:focus,.champ textarea:focus,.champ select:focus{outline:2px solid var(--orange);outline-offset:-1px;border-color:var(--orange)}
.specs{width:100%;border-collapse:collapse;font-size:13px}
.specs td{padding:7px 0;border-bottom:1px solid var(--gris-clair);vertical-align:top}
.specs td:first-child{color:var(--gris);width:42%}
.ligne-panier{display:flex;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--gris-clair)}
.ligne-panier .info{flex:1;font-size:13.5px;line-height:1.4}
.ligne-panier .info small{display:block;color:var(--gris);font-size:11.5px}
.ligne-panier .info .pu{color:var(--rouge);font-weight:700}
.ligne-panier .qte{font-variant-numeric:tabular-nums;font-weight:700;min-width:18px;text-align:center}
.ligne-panier button{border:1px solid var(--gris-clair);background:var(--blanc);border-radius:6px;width:28px;height:28px;font-size:15px;line-height:1;color:#444}
.total{display:flex;justify-content:space-between;align-items:baseline;padding:12px 14px 4px;font-weight:800;font-size:16px}
.total .montant{color:var(--rouge);font-size:22px;font-variant-numeric:tabular-nums}
.rappel{background:#FFF3EE;margin:10px 14px;border-radius:8px;padding:10px 12px;font-size:12.5px;color:#5A3420;line-height:1.55}
.rappel b{color:var(--orange)}
.erreur{color:var(--rouge);font-size:13px;padding:0 14px 8px}
.confirme{padding:28px 20px;text-align:center}
.confirme b{display:block;font-size:17px;margin-bottom:6px}
.confirme p{color:#555;font-size:13.5px;line-height:1.6;margin:0 0 14px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- suivi de commande ---------- */
.suivi-form{background:var(--blanc);border-radius:var(--r);padding:16px 14px 18px;margin-bottom:8px}
.suivi-form h1{font-size:19px;margin-bottom:5px}
.suivi-form .aide{color:var(--gris);font-size:13px;margin:0 0 14px;line-height:1.55}
.suivi-form .duo{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:560px){.suivi-form .duo{grid-template-columns:1fr 1fr}}
.suivi-form .bouton{width:100%;margin-top:12px;padding:12px;border-radius:999px;font-size:15px}
.etat{background:var(--blanc);border-radius:var(--r);padding:16px 14px;margin-bottom:8px}
.etat-tete{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:4px}
.etat-tete b{font-size:17px}
.etat-tete .badge-statut{font-size:11.5px;font-weight:700;color:#fff;background:var(--orange);border-radius:999px;padding:3px 10px}
.etat-tete .badge-statut.fini{background:var(--vert)}
.etat-tete .badge-statut.stop{background:var(--gris)}
.etat .prevu{font-size:13.5px;color:#444;margin:6px 0 0}
.etat .prevu b{color:var(--encre)}
.fil{margin:16px 0 4px;padding:0;list-style:none}
.fil li{position:relative;padding:0 0 18px 26px;font-size:13.5px;color:var(--gris)}
.fil li::before{content:"";position:absolute;left:0;top:2px;width:13px;height:13px;border-radius:50%;background:var(--blanc);border:2px solid var(--gris-clair)}
.fil li::after{content:"";position:absolute;left:6px;top:15px;bottom:0;width:2px;background:var(--gris-clair)}
.fil li:last-child::after{display:none}
.fil li.fait{color:var(--encre)}
.fil li.fait::before{background:var(--vert);border-color:var(--vert)}
.fil li.fait::after{background:var(--vert)}
.fil li.encours{color:var(--orange);font-weight:700}
.fil li.encours::before{background:var(--orange);border-color:var(--orange);box-shadow:0 0 0 4px #FFE3D6}
.fil li small{display:block;font-weight:400;color:var(--gris);font-size:12px;margin-top:2px}
.recap{border-top:1px solid var(--gris-clair);margin-top:10px;padding-top:12px}
.recap .ligne{display:flex;gap:10px;font-size:13.5px;padding:5px 0}
.recap .ligne .q{color:var(--gris);flex:none}
.recap .ligne .t{flex:1}
.recap .ligne .p{font-variant-numeric:tabular-nums;color:#444}
.recap .tot{display:flex;justify-content:space-between;align-items:baseline;margin-top:8px;font-weight:800}
.recap .tot span:last-child{color:var(--rouge);font-size:19px;font-variant-numeric:tabular-nums}
.autres-cmd a{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--gris-clair);font-size:13.5px}
.autres-cmd a:last-child{border-bottom:0}
.autres-cmd .num{font-weight:700}
.autres-cmd .st{color:var(--gris);font-size:12px}
.autres-cmd .mt{margin-left:auto;font-variant-numeric:tabular-nums;color:#444}

/* ---------- fiche produit pleine page ---------- */
.fp{margin-bottom:8px}
.fil-ariane{display:none}

.fp-gauche{background:var(--blanc);margin-inline:-10px;overflow:hidden}
.fp-galerie{position:relative;background:#F7F8FA;overflow:hidden}
.fp-piste{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.fp-piste::-webkit-scrollbar{display:none}
.fp-piste>*{width:100%;flex:none;scroll-snap-align:center;aspect-ratio:var(--ratio,1);object-fit:contain;background:#F7F8FA;display:block}
.fp-piste .fp-vide{display:grid;place-items:center;color:var(--gris);font-size:13px}
.fp-compteur{position:absolute;right:10px;bottom:10px;background:rgba(0,0,0,.5);color:#fff;font-size:12px;font-weight:600;border-radius:999px;padding:3px 11px;font-variant-numeric:tabular-nums;pointer-events:none}
.fp-vignettes{display:none}

.fp-droite{background:var(--blanc);border-radius:0 0 var(--r) var(--r);overflow:hidden}
.fp-entete{padding:13px 14px 12px}
.fp-prix{color:var(--rouge);font-weight:800;font-size:30px;line-height:1;display:flex;align-items:baseline;gap:4px;font-variant-numeric:tabular-nums}
.fp-prix i{font-style:normal;font-size:17px;font-weight:700}
.fp-etiquettes{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.fp-etq{font-size:11.5px;font-weight:700;border-radius:4px;padding:3px 8px;background:#FFF0EA;color:var(--orange);border:1px solid #FFD9C7}
.fp-titre{font-size:17px;line-height:1.45;font-weight:600;margin:11px 0 0;letter-spacing:0}
.fp-sous{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--gris);margin-top:8px}
.fp-sous a{color:var(--orange);font-weight:600}

.fp-lignes{border-top:1px solid var(--gris-clair);padding:2px 14px}
.fp-ligne{display:flex;gap:12px;align-items:flex-start;padding:10px 0;font-size:13px;border-bottom:1px solid #F1F2F4}
.fp-ligne:last-child{border-bottom:0}
.fp-lab{flex:none;width:78px;color:var(--gris);font-size:12.5px;padding-top:1px}
.fp-val{flex:1;min-width:0;color:#333;line-height:1.5}
.fp-val b{color:var(--encre);font-weight:600}
.fp-moyens{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.fp-moyens img{height:19px;width:auto;border-radius:3px}

.fp-choix{border-top:8px solid var(--fond);padding:13px 14px 14px}
.fp-choix .champ:last-child{margin-bottom:0}
.fp-qte{display:flex;align-items:center;gap:0;border:1px solid var(--gris-clair);border-radius:8px;overflow:hidden;width:fit-content}
.fp-qte button{width:40px;height:38px;border:0;background:var(--fond);color:var(--encre);font-size:19px;line-height:1;display:grid;place-items:center}
.fp-qte button:active{background:var(--gris-clair)}
.fp-qte input{width:52px;height:38px;border:0;border-inline:1px solid var(--gris-clair);text-align:center;font:inherit;font-size:15px;font-weight:600;background:var(--blanc);color:var(--encre);-moz-appearance:textfield}
.fp-qte input::-webkit-outer-spin-button,.fp-qte input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.fp-actions{display:none}

.fp-detail{background:var(--blanc);border-radius:var(--r);padding:14px;margin-bottom:8px}
.fp-detail h2{font-size:15px;margin-bottom:11px;display:flex;align-items:center;gap:7px}
.fp-detail h2::before{content:"";width:3px;height:14px;border-radius:2px;background:var(--orange);flex:none}
.fp-detail p{font-size:13.5px;color:#444;line-height:1.7;margin:0}

@media(min-width:860px){
  .fil-ariane{display:flex;gap:6px;align-items:center;font-size:12.5px;color:var(--gris);padding:10px 0 4px}
  .fil-ariane a{color:var(--gris)}
  .fil-ariane a:hover{color:var(--orange)}
  .fil-ariane span{color:var(--gris-clair)}
  .fp{display:grid;grid-template-columns:minmax(300px,44%) minmax(0,1fr);gap:20px;align-items:start;margin-bottom:12px}
  .fp-gauche{position:sticky;top:76px;border-radius:var(--r);padding:12px;margin-inline:0}
  .fp-galerie{border-radius:8px}
  .fp-compteur{display:none}
  .fp-vignettes{display:flex;gap:8px;margin-top:10px;overflow-x:auto;scrollbar-width:none}
  .fp-vignettes::-webkit-scrollbar{display:none}
  .fp-vignettes button{flex:none;width:62px;height:62px;padding:0;border:2px solid var(--gris-clair);border-radius:7px;overflow:hidden;background:#F7F8FA}
  .fp-vignettes button[aria-current="true"]{border-color:var(--orange)}
  .fp-vignettes img,.fp-vignettes video{width:100%;height:100%;object-fit:contain;display:block;background:#fff}
  .fp-vignettes button.est-video{position:relative}
  .fp-vignettes button.est-video .jouer{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.30)}
  .fp-vignettes button.est-video .jouer::before{content:"";width:0;height:0;border-left:13px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:3px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}
  .fp-droite{border-radius:var(--r);padding-bottom:16px}
  .fp-entete{padding:17px 18px 14px}
  .fp-prix{font-size:34px}
  .fp-prix i{font-size:19px}
  .fp-titre{font-size:19px}
  .fp-lignes{padding:2px 18px}
  .fp-choix{border-top:1px solid var(--gris-clair);padding:14px 18px 0}
  .fp-actions{display:flex;gap:10px;padding:16px 18px 0}
  .fp-actions .bouton{flex:1;text-align:center;padding:13px 8px;border-radius:999px;font-size:15px}
  .fp-actions .bouton.plein{flex:1.5}
  .fp-detail{padding:18px}
  body.avec-barre{padding-bottom:0}
  body.avec-barre .barre-achat{display:none}
}

.bloc-blanc{background:var(--blanc);border-radius:var(--r);padding:14px;margin-bottom:8px}
.bloc-blanc h2{font-size:15px;margin-bottom:10px}
.barre-achat{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--blanc);border-top:1px solid var(--gris-clair);
  display:flex;gap:8px;padding:9px 10px calc(9px + env(safe-area-inset-bottom,0px))}
.barre-achat .bouton{flex:1;text-align:center;padding:12px 8px;border-radius:999px;font-size:14.5px}
.barre-achat .bouton.plein{flex:1.4}
body.avec-barre{padding-bottom:78px}
body.avec-barre .onglets{display:none}
.mini{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
@media(min-width:620px){.mini{grid-template-columns:repeat(6,1fr)}}
.mini a{display:block}
.mini .v{display:block;aspect-ratio:1;background:#F7F8FA;border-radius:8px;overflow:hidden;margin-bottom:5px}
.mini .v img{width:100%;height:100%;object-fit:cover}
.mini .v .sans{width:100%;height:100%;display:grid;place-items:center;color:var(--gris);font-size:10px}
.mini .n{font-size:11.5px;line-height:1.3;color:var(--encre);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mini .p{display:block;font-size:12.5px;color:var(--rouge);font-weight:700;margin-top:2px;font-variant-numeric:tabular-nums}

/* photo en grand */
.lb{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center}
.lb[hidden]{display:none}
.lb-zone{width:100%;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;touch-action:none}
.lb-zone img{max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-in;transform-origin:center;user-select:none;-webkit-user-drag:none}
.lb-x,.lb-g,.lb-d{position:absolute;z-index:2;background:rgba(255,255,255,.15);color:#fff;border:0;border-radius:50%;width:44px;height:44px;font-size:28px;line-height:44px;cursor:pointer}
.lb-x{top:14px;right:14px}.lb-g{left:10px;top:50%;transform:translateY(-50%)}.lb-d{right:10px;top:50%;transform:translateY(-50%)}

/* vignettes des couleurs */
.fp-couleurs{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.fp-couleurs button{width:84px;padding:0;border:2px solid transparent;border-radius:14px;background:#f2f2f2;cursor:pointer;overflow:hidden;text-align:center}
.fp-couleurs button img{width:100%;aspect-ratio:1;object-fit:cover;display:block;border-radius:12px}
.fp-couleurs button span{display:block;font-size:11px;line-height:1.2;padding:4px 2px;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fp-couleurs button[aria-pressed="true"]{border-color:var(--orange,#ff5000)}

/* choix façon boutique : couleurs en pastilles avec photo, pointures en boutons */
.choix-bloc{margin:4px 0 12px}
.choix-lab{display:block;font-size:13px;color:var(--gris,#666);margin-bottom:6px}
.choix-lab b{color:#111;font-weight:600}
.puces{display:flex;flex-wrap:wrap;gap:8px}
.puces button{display:flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;border:1.5px solid #e2e2e2;border-radius:8px;background:#fff;font-size:13px;cursor:pointer;min-height:40px}
.puces button img{width:32px;height:32px;object-fit:cover;border-radius:5px;background:#f2f2f2}
.puces.tailles button{padding:0 14px;min-width:52px;justify-content:center}
.puces button[aria-pressed="true"]{border-color:var(--orange,#ff5000);color:var(--orange,#ff5000);background:#fff6f1}
.puces button:disabled{opacity:.35;text-decoration:line-through;cursor:not-allowed}
@media (min-width:860px){
  /* vitrine des couleurs sous la photo (ordinateur) */
  .fp-gauche .fp-couleurs{grid-column:2;grid-row:2;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;gap:8px;margin-top:2px;padding-bottom:4px}
  .fp-gauche .fp-couleurs button{flex:none;width:78px}
  .fp-gauche{display:grid;grid-template-columns:70px minmax(0,1fr);gap:10px}
  .fp-gauche .fp-galerie{grid-column:2;grid-row:1}
  .fp-gauche .fp-vignettes{grid-column:1;grid-row:1;flex-direction:column;margin-top:0;overflow-y:auto;overflow-x:hidden;max-height:560px}
}

/* petites couleurs sous la photo des cartes */
.carte .vignette{border-radius:12px;margin:6px 6px 0}
.mini-couleurs{display:flex;gap:6px;padding:6px 6px 0;overflow:hidden}
.mini-couleurs .mc{flex:0 0 calc(25% - 5px);aspect-ratio:1;border-radius:9px;overflow:hidden;background:#F2F2F2;display:grid;place-items:center}
.mini-couleurs .mc img{width:100%;height:100%;object-fit:cover}
.mini-couleurs .mc{box-sizing:border-box;border:2px solid transparent}
.mini-couleurs .mc.actif{border-color:var(--orange,#F26522)}
.mini-couleurs .mc.plus{font-size:12px;font-weight:700;color:var(--gris)}

/* loupe (ordinateur) */
.fp-loupe{position:absolute;z-index:3;pointer-events:none;background:rgba(255,80,0,.12);border:1px solid rgba(255,80,0,.55)}
.fp-loupe[hidden],.fp-vue[hidden]{display:none}
.fp-vue{position:absolute;z-index:30;top:12px;left:calc(100% + 16px);background:#fff no-repeat;border:1px solid var(--gris-clair);border-radius:8px;box-shadow:0 8px 30px rgba(0,0,0,.18);pointer-events:none}
@media(min-width:860px){.fp-gauche{overflow:visible}}

/* guide des tailles + photos détaillées */
.guide-defile{overflow-x:auto}
.guide{border-collapse:collapse;font-size:13px;min-width:100%;font-variant-numeric:tabular-nums}
.guide th,.guide td{border:1px solid var(--gris-clair);padding:8px 10px;text-align:center;white-space:nowrap}
.guide th{background:var(--fond);font-weight:600;text-align:left;color:#555}
.guide tr:first-child td{font-weight:700;color:var(--encre)}
.guide-note{margin-top:10px!important;font-size:12.5px!important;color:var(--gris)!important}
.fp-photos{display:flex;flex-direction:column;gap:6px;max-width:790px;margin:0 auto}
.fp-photos img{width:100%;height:auto;display:block;border-radius:6px}

/* choix obligatoire */
.choix-bloc.manque .puces button:not(:disabled){border-color:#E5484D}
.choix-alerte{color:#E5484D;font-size:12.5px;font-weight:600;margin-top:6px}
.champ.manque select{border-color:#E5484D}
.fp-onglets{position:sticky;top:var(--haut-entete,0px);z-index:5;display:flex;gap:22px;overflow-x:auto;scrollbar-width:none;background:var(--blanc);border-radius:var(--r);padding:0 14px;margin-bottom:8px;border-bottom:1px solid #eee}
.fp-onglets::-webkit-scrollbar{display:none}
.fp-onglets a{flex:none;padding:12px 0 10px;font-size:14px;font-weight:600;color:#333;text-decoration:none;border-bottom:3px solid transparent}
.fp-onglets a.actif{color:var(--orange);border-bottom-color:var(--orange)}
.fp-detail[id]{scroll-margin-top:calc(var(--haut-entete,0px) + 52px)}
.guide-simple{font-size:15px;font-weight:600;color:#222;line-height:1.6}.guide-simple span{font-weight:400;color:#666;font-size:13.5px}
/* bandeau prix (mobile façon appli : orange plein ; ordinateur : clair) */
.fp-bandeau{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px 13px;color:#fff;
  background:linear-gradient(105deg,#FF7A1A 0%,#FF5000 55%,#F03C00 100%);position:relative;overflow:hidden}
.fp-bandeau::after{content:"";position:absolute;width:160px;height:160px;right:-50px;top:-90px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.28),rgba(255,255,255,0) 70%);pointer-events:none}
.fp-prix-lab{display:block;font-size:11px;font-weight:600;opacity:.9;letter-spacing:.2px;margin-bottom:3px}
.fp-bandeau .fp-prix{color:#fff;font-size:29px;font-weight:800;text-shadow:0 2px 8px rgba(0,0,0,.12)}
.fp-bandeau-d{display:flex;flex-direction:column;align-items:flex-end;gap:5px;position:relative;z-index:1}
.fp-bandeau-d span{font-size:10.5px;font-weight:600;white-space:nowrap;padding:3px 9px;border-radius:999px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.4)}
.fp-entete{padding:12px 14px 12px}
.fp-titre{margin-top:0}
.barre-achat .bouton-wa{flex:none;display:flex;align-items:center;gap:6px;padding:11px 16px;color:#1FA855;border-color:#CDEFD9}
@media(max-width:859px){
  .fp-couleurs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:8px;margin:0;padding:10px 12px;background:var(--blanc);border-top:1px solid #F1F2F4}
  .fp-couleurs::-webkit-scrollbar{display:none}
  .fp-couleurs button{flex:none;width:72px;border-radius:10px;border-width:1.5px}
  .fp-couleurs button img{border-radius:8px 8px 0 0}
  .fp-couleurs button span{font-size:10.5px;padding:3px 2px 4px}
  .fp-droite{border-radius:0;margin-inline:-10px}
  .fp-bandeau{padding-inline:16px}.fp-entete,.fp-lignes,.fp-choix{padding-inline:16px}
}
@media(min-width:860px){
  .fp-bandeau{margin:16px 18px 0;border-radius:10px;color:var(--encre);background:linear-gradient(90deg,#FFF1EA,#FFF8F4)}
  .fp-bandeau::after{display:none}
  .fp-bandeau .fp-prix{color:var(--rouge);font-size:34px;text-shadow:none}
  .fp-prix-lab{color:var(--gris)}
  .fp-bandeau-d span{background:#fff;border-color:#FFD9C7;color:var(--orange);font-size:11.5px}
  .fp-entete{padding:14px 18px 14px}
}
/* mobile : fiche aérée */
.puces button{color:var(--encre);-webkit-appearance:none;appearance:none}
@media(max-width:859px){
  .reassurance{font-size:11px;padding:5px 0}.reassurance .wrap{flex-wrap:nowrap;white-space:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none}
  .fp-bandeau{padding:9px 16px}
  .fp-bandeau .fp-prix{font-size:26px}
  .fp-bandeau-d{flex-direction:row;gap:6px}.fp-bandeau-d span{font-size:10.5px;padding:3px 9px}
  .fp-entete{padding:18px 16px 16px}
  .fp-titre{font-size:15.5px;line-height:1.5;font-weight:600}
  .fp-sous{margin-top:10px;font-size:12.5px}
  .fp-lignes{padding-top:4px;padding-bottom:4px}
  .fp-ligne{padding:14px 0;gap:14px;font-size:13.5px}
  .fp-lab{width:84px}
  .fp-choix{padding:18px 16px 20px}
  .choix-bloc{margin:0 0 22px}
  .choix-lab{font-size:14px;margin-bottom:11px}
  .puces{gap:10px}
  .puces button{min-height:48px;padding:6px 14px 6px 6px;font-size:14px;border-radius:10px;gap:9px}
  .puces button img{width:36px;height:36px;border-radius:7px}
  .puces.tailles button{min-width:58px;padding:0 14px}
  .fp-qte button{width:46px;height:44px}.fp-qte input{width:58px;height:44px}
  .fp-onglets{margin-top:10px}
  .fp-detail{padding:18px 16px;margin-bottom:10px}
}
@media(max-width:519px){.reassurance .wrap{justify-content:center}.reassurance .wrap span:first-child{display:none}}

/* couleurs : grille régulière, vignettes identiques */
.puces:not(.tailles){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.puces:not(.tailles) button{width:100%;min-height:56px;padding:6px 10px 6px 6px;gap:10px;justify-content:flex-start;text-align:left}
.puces:not(.tailles) button img{flex:none;width:44px;height:44px;object-fit:cover;object-position:center;border-radius:8px;transform:none}
.puces:not(.tailles) button span:not(.vg){flex:1;min-width:0;line-height:1.25}
@media(min-width:860px){.puces:not(.tailles){grid-template-columns:repeat(4,minmax(0,1fr))}}
.puces button .vg{flex:none;width:44px;height:44px;border-radius:8px;background-color:#C3CAC8;background-repeat:no-repeat;background-size:112% auto;background-position:50% 74%}
/* fil d'Ariane au-dessus du produit, avec la référence */
.fil-ariane{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12.5px;color:var(--gris);padding:10px 0 8px}
.fil-ariane a.fa-r{color:var(--orange);font-weight:600}
.fil-ariane span{color:#C9CDD3}
.fil-ariane .fa-ref{font-style:normal;color:var(--gris);margin-left:auto}
@media(max-width:859px){.fil-ariane .fa-acc{display:none}.fil-ariane{padding:10px 6px 10px}}
@media(min-width:860px){.fil-ariane a.fa-acc{color:var(--gris)}}
/* boutons : WhatsApp (rond) · Ajouter au panier · Commander */
.bouton-ajout{background:#FFF1EA;border-color:#FFD2BC;color:var(--orange)}
.barre-achat{gap:8px}
.barre-achat .bouton-wa{flex:none;width:46px;height:46px;padding:0;border-radius:50%;display:grid;place-items:center}
.barre-achat .bouton-ajout,.barre-achat .bouton.plein{flex:1;padding:13px 6px;font-size:14px;font-weight:700}
.fp-actions .bouton-wa{flex:none;width:48px;height:48px;padding:0;border-radius:50%;display:grid;place-items:center;color:#1FA855;border-color:#CDEFD9}
.fp-actions .bouton-ajout,.fp-actions .bouton.plein{flex:1;font-weight:700}
/* l'article qui vole jusqu'au panier */
.vol-article{position:fixed;z-index:999;border-radius:50%;background:#C3CAC8 50% 76%/105% auto no-repeat;border:4px solid #fff;box-shadow:0 0 0 3px var(--orange),0 14px 34px rgba(0,0,0,.3);pointer-events:none;will-change:transform}
@keyframes secoue{0%{transform:scale(1) rotate(0)}25%{transform:scale(1.35) rotate(-10deg)}50%{transform:scale(.9) rotate(8deg)}75%{transform:scale(1.1) rotate(-4deg)}100%{transform:scale(1) rotate(0)}}
.secoue{animation:secoue .6s ease}
.toast-panier{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;z-index:998;background:#1A1A1A;color:#fff;border-radius:999px;padding:10px 18px;font-size:13.5px;display:flex;gap:8px;align-items:center;transition:.25s;pointer-events:none;width:max-content;max-width:calc(100vw - 32px);box-sizing:border-box;flex-direction:column;text-align:center;gap:2px;border-radius:16px;line-height:1.3}
.toast-panier b{font-weight:700}.toast-panier b::before{content:"✓ ";color:#3DDC84}
.toast-panier b{white-space:nowrap}.toast-panier span{opacity:.75;max-width:100%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.toast-panier span:empty{display:none}
.toast-panier.vu{opacity:1;transform:translate(-50%,0)}
@media(min-width:860px){.toast-panier{bottom:30px}}
/* Réception / Paiement : sous la quantité */
.fp-choix + .fp-lignes{border-top:1px solid var(--gris-clair)}
@media(max-width:859px){.fp-choix{padding-bottom:6px}.fp-choix + .fp-lignes{margin:0 0 4px}}
.fp-vignettes .jouer[hidden]{display:none!important}
.mini-couleurs .mc.vide-mc{visibility:hidden}

/* cadre orange des couleurs (règle Sare 08/10/2026) : dessiné à l'intérieur de la case, jamais en débord */
.mini-couleurs .mc{position:relative;border:0!important}
.mini-couleurs .mc::after{content:"";position:absolute;inset:0;border:2px solid transparent;border-radius:inherit;pointer-events:none}
.mini-couleurs .mc.actif::after{border-color:var(--orange,#F26522)}
.fp-couleurs button{position:relative;border:0!important}
.fp-couleurs button::after{content:"";position:absolute;inset:0;border:2px solid transparent;border-radius:inherit;pointer-events:none}
.fp-couleurs button[aria-pressed="true"]::after{border-color:var(--orange,#ff5000)}

/* la vue agrandie (loupe) passe au-dessus du bandeau prix */
@media(min-width:860px){.fp-gauche{z-index:20}.fp-vue{z-index:1000}}

/* vitrine des couleurs : photos seules, sans le nom (règle Sare 08/10/2026) */
.fp-couleurs button span{display:none}
.fp-couleurs button img{border-radius:inherit!important}
/* quantité : de l'air avant la ligne « Réception » (règle Sare 08/10/2026) */
.fp-qte{margin-bottom:18px}
@media(max-width:859px){.fp-qte{margin-bottom:14px}}
/* photo de l'article dans le panier (règle Sare 08/10/2026) */
.ligne-panier .photo-panier{flex:0 0 64px;width:64px;height:64px;border-radius:8px;overflow:hidden;background:var(--fond,#f2f3f5);border:1px solid var(--gris-clair)}
.ligne-panier .photo-panier img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:600px){.ligne-panier .photo-panier{flex-basis:54px;width:54px;height:54px}}
/* encadré « Important » du panier (règle Sare 08/10/2026) */
.avis-cmd{margin:10px 14px;border:2px solid var(--orange,#F26522);border-radius:10px;overflow:hidden;background:#FFF7F2;color:#3d2416}
.avis-tete{display:flex;align-items:center;gap:8px;background:var(--orange,#F26522);color:#fff;font-weight:800;font-size:13.5px;letter-spacing:.2px;padding:8px 12px;text-transform:uppercase}
.avis-ico{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#fff;color:var(--orange,#F26522);font-weight:900;font-size:14px;flex:none}
.avis-intro{margin:10px 12px 4px;font-size:13.5px;line-height:1.45}
.avis-intro b{color:var(--orange,#F26522)}
.avis-etapes{list-style:none;margin:6px 12px 4px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;position:relative}
.avis-etapes li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;background:#fff;border:1px solid #FFD9C7;border-radius:8px;padding:10px 6px;position:relative}
.avis-etapes li:not(:last-child)::after{content:"›";position:absolute;right:-8px;top:50%;transform:translate(50%,-50%);color:var(--orange,#F26522);font-weight:900;font-size:20px;z-index:1}
.avis-etapes .n{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--orange,#F26522);color:#fff;font-weight:800;font-size:13px}
.avis-etapes .t{font-size:12px;line-height:1.35;color:#5A3420}
.avis-etapes .t b{display:block;font-size:12.5px;color:#2b1a10;margin-bottom:2px}
.avis-logos{display:flex;justify-content:center;gap:5px;margin-top:5px}
.avis-logos img{height:16px;width:auto;border-radius:3px}
.avis-note{margin:4px 12px 10px;font-size:11.5px;color:#8a6a58}
@media(max-width:480px){
  .avis-etapes{grid-template-columns:1fr}
  .avis-etapes li{flex-direction:row;text-align:left;padding:8px 10px}
  .avis-etapes li:not(:last-child)::after{content:"⌄";right:auto;left:22px;top:auto;bottom:-6px;transform:translate(-50%,50%);font-size:16px}
  .avis-logos{justify-content:flex-start}
}
/* formulaire de livraison du panier, sur le modèle de la boutique Timarket (règle Sare 08/10/2026) */
.form-livraison .form-titre{font-size:16px;font-weight:800;margin:4px 0 10px;color:var(--encre,#1b1b1b)}
.form-livraison .champ > span{text-transform:uppercase;letter-spacing:.6px;font-size:11.5px;font-weight:700;color:#555}
.form-livraison select{width:100%;height:44px;border:1px solid var(--gris-clair);border-radius:8px;padding:0 12px;font:inherit;font-size:15px;background:var(--blanc,#fff);color:var(--encre,#1b1b1b)}
.form-livraison .champ[hidden]{display:none!important}
.aide-champ{display:block;color:#c0392b;font-size:12px;margin-top:4px}
.note-champs{font-size:12px;color:var(--gris);margin:2px 0 0}
#c-valider.inactif{background:#EFE7E1!important;color:#B5A79C!important;border-color:#EFE7E1!important}
/* encadré « Important » en version compacte sur la fiche produit (remplace Réception / Paiement) */
.avis-cmd.compact{margin:12px 0 4px;border-width:1.5px;border-radius:9px}
.fp-choix + .avis-cmd.compact{margin-top:12px}
.avis-cmd.compact .avis-tete{font-size:11.5px;padding:6px 10px;gap:6px}
.avis-cmd.compact .avis-ico{width:16px;height:16px;font-size:11px}
.avis-cmd.compact .avis-intro{margin:7px 10px 3px;font-size:12.5px}
.avis-cmd.compact .avis-etapes{margin:5px 10px 3px;gap:7px}
.avis-cmd.compact .avis-etapes li{padding:6px 5px;gap:3px;border-radius:7px}
.avis-cmd.compact .avis-etapes .n{width:19px;height:19px;font-size:11px}
.avis-cmd.compact .avis-etapes .t{font-size:11px;line-height:1.3}
.avis-cmd.compact .avis-etapes .t b{font-size:11.5px;margin-bottom:1px}
.avis-cmd.compact .avis-logos{margin-top:3px;gap:4px}
.avis-cmd.compact .avis-logos img{height:14px}
.avis-cmd.compact .avis-note{margin:3px 10px 7px;font-size:10.5px}
@media(max-width:480px){.avis-cmd.compact .avis-etapes li{padding:6px 8px}}
.avis-cmd.compact,.fp-choix + .avis-cmd.compact{margin:12px 18px 8px}
@media(max-width:859px){.avis-cmd.compact,.fp-choix + .avis-cmd.compact{margin:10px 14px 8px}}
/* téléphone : boutons Ajouter au panier / Commander placés juste sous l'encadré « Important », plus de barre flottante en bas (règle Sare 08/10/2026) */
@media(max-width:859px){
  .fp-actions{display:flex;gap:8px;padding:4px 14px 6px;align-items:center}
  .fp-actions .bouton-ajout,.fp-actions .bouton.plein{flex:1;text-align:center;padding:13px 6px;border-radius:999px;font-size:14.5px}
  .barre-achat{display:none!important}
  body.avec-barre{padding-bottom:0!important}
}
/* logo WhatsApp officiel sur tous les boutons WhatsApp (règle Sare 08/10/2026) */
.ico-wa{width:20px;height:20px;flex:none;display:inline-block;vertical-align:middle}
.bouton-wa-texte{display:inline-flex!important;align-items:center;justify-content:center;gap:8px}
.bouton.vert,.bouton-wa-texte.vert{background:#25D366;border-color:#25D366;color:#fff}
.bouton.bouton-wa,.fp-actions .bouton-wa,.barre-achat .bouton-wa{background:#25D366!important;border-color:#25D366!important;color:#fff!important}
.bouton.bouton-wa .ico-wa{width:24px;height:24px}
/* bouton WhatsApp flottant : accueil et pages d'information */
.wa-flottant{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;align-items:center;gap:8px;background:#25D366;color:#fff;border-radius:999px;padding:12px 18px 12px 14px;font-weight:700;font-size:14.5px;text-decoration:none;box-shadow:0 6px 18px rgba(0,0,0,.22)}
.wa-flottant .ico-wa{width:26px;height:26px}
.wa-flottant:hover{background:#1ebe5b}
body:has(.voile:not([hidden])) .wa-flottant{display:none}
@media(max-width:600px){.wa-flottant{right:14px;bottom:14px;padding:13px}.wa-flottant span{display:none}.wa-flottant .ico-wa{width:30px;height:30px}}
/* case « J'ai lu et j'accepte » obligatoire avant d'envoyer la commande */
.accepte{display:flex;gap:10px;align-items:flex-start;background:#FFF7F2;border:1.5px solid #FFD9C7;border-radius:9px;padding:11px 12px;margin-top:4px;font-size:13px;line-height:1.45;color:#3d2416;cursor:pointer}
.accepte input{width:20px;height:20px;flex:none;margin-top:1px;accent-color:var(--orange,#F26522);cursor:pointer}
.accepte b{color:var(--orange,#F26522)}
.accepte.a-cocher{border-color:var(--orange,#F26522);box-shadow:0 0 0 3px rgba(242,101,34,.15)}
@media(max-width:859px){body:has(nav.onglets) .wa-flottant{bottom:calc(74px + env(safe-area-inset-bottom,0px))}}
.fp-qte[hidden]{display:none!important}
/* téléphone : pas de bouton WhatsApp flottant, c'est l'onglet « Contact » du bas qui porte le logo WhatsApp (règle Sare 08/10/2026) */
@media(max-width:859px){.wa-flottant{display:none!important}}
.onglets a svg.ico-wa-nav{width:22px;height:22px;margin:0 auto 2px;display:block;color:#25D366}
/* encadré « Important » : animé (lueur du cadre + « ! » qui bat) ; sur téléphone, version réduite qui garde les 3 étapes côte à côte (règle Sare 08/10/2026) */
.avis-cmd{animation:avis-lueur 2.4s ease-in-out infinite}
.avis-cmd .avis-tete .avis-ico{animation:avis-pouls 1.4s ease-in-out infinite}
@keyframes avis-pouls{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,255,255,.7)}50%{transform:scale(1.15);box-shadow:0 0 0 5px rgba(255,255,255,0)}}
@keyframes avis-lueur{0%,100%{box-shadow:0 0 0 0 rgba(242,101,34,0)}50%{box-shadow:0 0 0 4px rgba(242,101,34,.2)}}
@media (prefers-reduced-motion:reduce){.avis-cmd,.avis-cmd .avis-tete .avis-ico{animation:none}}
@media(max-width:859px){
  .avis-cmd.compact .avis-tete{font-size:10.5px;padding:5px 9px}
  .avis-cmd.compact .avis-intro{font-size:11.5px;margin:6px 9px 2px}
  .avis-cmd.compact .avis-etapes{grid-template-columns:repeat(3,1fr)!important;gap:6px;margin:4px 9px 2px}
  .avis-cmd.compact .avis-etapes li{flex-direction:column!important;text-align:center!important;padding:5px 3px!important;gap:2px}
  .avis-cmd.compact .avis-etapes li:not(:last-child)::after{content:"›"!important;left:auto!important;right:-7px!important;top:50%!important;bottom:auto!important;transform:translate(50%,-50%)!important;font-size:15px!important}
  .avis-cmd.compact .avis-etapes .n{width:16px;height:16px;font-size:9.5px}
  .avis-cmd.compact .avis-etapes .t{font-size:9.5px;line-height:1.25}
  .avis-cmd.compact .avis-etapes .t b{font-size:10px}
  .avis-cmd.compact .avis-logos{justify-content:center!important}
  .avis-cmd.compact .avis-logos img{height:11px}
  .avis-cmd.compact .avis-note{font-size:9.5px;margin:2px 9px 6px}
}
/* « J'ai lu et j'accepte » dans le message Important du panier */
.avis-cmd .accepte{display:flex;align-items:center;justify-content:center;gap:10px;margin:2px 12px 12px;padding:10px 12px;background:#fff;border:2px solid var(--orange,#F26522);border-radius:999px;font-size:14px;font-weight:800;color:var(--orange,#F26522);cursor:pointer;box-shadow:none;line-height:1.2}
.avis-cmd .accepte input{width:20px;height:20px;margin:0;accent-color:var(--orange,#F26522)}
.avis-cmd .accepte:has(input:checked){background:var(--orange,#F26522);color:#fff}
.avis-cmd .accepte:has(input:checked) input{accent-color:#fff}
.avis-cmd .accepte.a-cocher{animation:accepte-appel 1s ease-in-out infinite}
@keyframes accepte-appel{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}
/* panier : articles + livraison (barème Timarket) = total */
.recap{padding:10px 14px 0;display:grid;gap:5px;font-size:14px}
.recap > div{display:flex;justify-content:space-between;align-items:baseline}
.recap span{color:#555}
.recap b{font-variant-numeric:tabular-nums}
.recap b.a-choisir{font-weight:500;color:var(--gris);font-style:italic;font-size:13px}
.recap + .total{border-top:1px solid var(--gris-clair);margin:8px 14px 0;padding:10px 0 4px}
/* panier : ce qui manque pour commander, affiché en direct (règle Sare 08/10/2026) */
#panier-pied{flex-wrap:wrap}
.manque-liste{flex:0 0 100%;width:100%;font-size:12.5px;line-height:1.35;color:#9a3412;background:#FFF1E8;border-radius:8px;padding:7px 10px;margin-bottom:2px}
.manque-liste b{color:#c2410c}
.manque-liste[hidden]{display:none}
.a-remplir{animation:a-remplir 1.2s ease 2}
@keyframes a-remplir{0%,100%{box-shadow:0 0 0 0 rgba(242,101,34,0)}50%{box-shadow:0 0 0 4px rgba(242,101,34,.45)}}
/* panier : photo plus grande (la chaussure se voit bien) et texte court */
.ligne-panier{align-items:center}
.ligne-panier .photo-panier{flex:0 0 92px!important;width:92px!important;height:70px!important;border-radius:9px}
.ligne-panier .photo-panier img{object-fit:cover;transform:scale(1.25)}
.ligne-panier .info .titre-court{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:600;font-size:13.5px;line-height:1.3}
@media(max-width:600px){.ligne-panier .photo-panier{flex-basis:80px!important;width:80px!important;height:62px!important}.ligne-panier{gap:8px;padding:9px 10px}}
/* panier sur téléphone : la fenêtre tient dans la partie visible de l'écran (barres du navigateur comprises), la croix reste visible */
.panneau{max-height:94vh;max-height:calc(100dvh - 16px)}
@media(min-width:640px){.panneau{max-height:90vh;max-height:90dvh}}
.panneau-tete .fermer{width:38px;height:38px;border-radius:50%;background:#1f1f1f;color:#fff;border:0;font-size:24px;line-height:1;display:grid;place-items:center;flex:none;cursor:pointer}
.panneau-tete .fermer:hover{background:#000}
/* photo du panier : plus grande, chaussure entière (sans zoom qui la coupe) */
.ligne-panier .photo-panier{flex:0 0 112px!important;width:112px!important;height:88px!important;border-radius:10px}
.ligne-panier .photo-panier img{object-fit:cover;transform:none}
@media(max-width:600px){.ligne-panier .photo-panier{flex-basis:104px!important;width:104px!important;height:82px!important}}
/* bandeau orange du haut : « Commandez en 3 étapes » (remplace l'ancien message, règle Sare 08/10/2026) */
.reassurance .wrap.eb{display:flex;align-items:center;justify-content:center;gap:6px 9px;flex-wrap:wrap;white-space:normal}
.eb-titre{font-weight:800;text-transform:uppercase;letter-spacing:.4px;background:rgba(255,255,255,.2);border-radius:999px;padding:2px 9px}
.eb-e{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.eb-e i{font-style:normal;display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#fff;color:#FF5000;font-size:10px;font-weight:900}
.eb-s{opacity:.8;font-weight:800}
.eb .ct{display:none}
@media(min-width:520px){.reassurance .wrap.eb{flex-wrap:nowrap;white-space:nowrap}}
@media(max-width:519px){
  .reassurance{padding:6px 0 7px}
  .eb-titre{flex:0 0 100%;text-align:center;background:none;padding:0;font-size:11px}
  .eb .lg{display:none}.eb .ct{display:inline}
  .eb-e{font-size:10.5px;gap:4px}.eb-e i{width:14px;height:14px;font-size:9px}
  .reassurance .wrap.eb{gap:3px 5px}
}
@media(max-width:519px){.reassurance .wrap.eb span.eb-titre{display:block!important}.reassurance .wrap.eb{flex-wrap:wrap!important;white-space:normal!important;overflow:visible!important;justify-content:center!important}}
/* fiche produit : message « Important » en frise animée (règle Sare 08/10/2026) */
.avis-fiche{margin:12px 18px 8px;border-radius:14px;overflow:hidden;background:linear-gradient(180deg,#FFF6F0,#FFFFFF);border:1.5px solid #FFC9AE;box-shadow:0 6px 18px rgba(242,101,34,.12);animation:avis-lueur 2.6s ease-in-out infinite}
@media(max-width:859px){.avis-fiche{margin:10px 14px 8px}}
.af-tete{display:flex;align-items:center;gap:8px;background:linear-gradient(90deg,#FF5000,#FF7A29);color:#fff;font-weight:800;font-size:12px;letter-spacing:.4px;text-transform:uppercase;padding:8px 12px}
.af-tete .avis-ico{width:20px;height:20px;font-size:13px;background:#fff;color:#FF5000;border-radius:50%;display:grid;place-items:center;flex:none;animation:avis-pouls 1.4s ease-in-out infinite}
.af-intro{margin:10px 12px 2px;font-size:13px;color:#3d2416;text-align:center}
.af-intro b{color:#FF5000}
.af-etapes{list-style:none;margin:8px 8px 2px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);position:relative}
.af-etapes::before{content:"";position:absolute;left:16.6%;right:16.6%;top:21px;height:3px;border-radius:3px;background:repeating-linear-gradient(90deg,#FF7A29 0 8px,transparent 8px 14px);opacity:.7}
.af-etapes li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;padding:0 4px;position:relative}
.af-rond{position:relative;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#FF5000,#FF8A3D);color:#fff;display:grid;place-items:center;box-shadow:0 4px 10px rgba(255,80,0,.3);margin-bottom:5px;animation:af-allume 2.4s ease-in-out infinite;animation-delay:var(--d)}
.af-rond svg{width:22px;height:22px}
.af-rond i{position:absolute;top:-4px;right:-4px;width:18px;height:18px;border-radius:50%;background:#1f1f1f;color:#fff;font-style:normal;font-size:10.5px;font-weight:800;display:grid;place-items:center;border:2px solid #fff}
.af-etapes b{font-size:12.5px;color:#1f140d;line-height:1.2}
.af-etapes small{font-size:11px;color:#7a5640;line-height:1.25}
.af-logos{display:flex;gap:4px;justify-content:center;margin-top:3px}
.af-logos img{height:15px;width:auto;border-radius:3px}
.af-note{margin:6px 12px 9px;font-size:10.5px;color:#9b7a66;text-align:center}
@keyframes af-allume{0%,60%,100%{transform:scale(1);box-shadow:0 4px 10px rgba(255,80,0,.3)}20%{transform:scale(1.14);box-shadow:0 0 0 7px rgba(255,80,0,.16),0 4px 12px rgba(255,80,0,.4)}}
@media (prefers-reduced-motion:reduce){.avis-fiche,.af-rond,.af-tete .avis-ico{animation:none}}
/* bandeau « Commandez en 3 étapes » : une seule ligne ; sur téléphone elle défile en continu (règle Sare 08/10/2026) */
.reassurance .wrap.eb{display:block!important;overflow:hidden!important;white-space:nowrap!important;padding-inline:0}
.eb-piste{display:flex;width:max-content;margin:0 auto}
.eb-lot{display:flex;align-items:center;gap:9px;padding-right:9px}
.eb-copie,.eb-fin{display:none}
.eb .eb-titre{display:inline-block!important;flex:none!important;background:rgba(255,255,255,.2)!important;padding:2px 9px!important;border-radius:999px;font-size:11px!important}
.eb-e{font-size:11.5px!important}
.eb-e i{width:16px!important;height:16px!important;font-size:10px!important}
@media(max-width:859px){
  .reassurance{padding:7px 0!important}
  .reassurance .wrap.eb{-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
  .eb-piste{margin:0;animation:eb-defile 22s linear infinite}
  .eb-copie,.eb-fin{display:flex}
  .eb-fin{display:inline}
  .eb-lot{padding-right:22px}
}
@keyframes eb-defile{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.eb-piste{animation:none}}
/* accueil : les 3 cases reprennent les 3 étapes de commande, avec les logos de paiement (règle Sare 08/10/2026) */
.etapes-accueil .garantie{padding-top:14px}
.etapes-accueil .ga-n{position:absolute;top:8px;left:10px;display:grid!important;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--orange,#FF5000);color:#fff!important;font-size:10.5px!important;font-weight:800;line-height:1}
.etapes-accueil .garantie svg{width:24px;height:24px}
.etapes-accueil .ga-logos{display:flex!important;justify-content:center;gap:4px;margin-top:5px}
.etapes-accueil .ga-logos img{height:16px;width:auto;border-radius:3px}
.etapes-accueil .garantie + .garantie::after{content:"›";position:absolute;left:-5px;top:24px;color:var(--orange,#FF5000);font-weight:900;font-size:16px;background:var(--blanc);line-height:1}
@media(max-width:600px){.etapes-accueil .garantie b{font-size:12px}.etapes-accueil .garantie span{font-size:10.5px}.etapes-accueil .ga-logos img{height:13px}}

/* ===== bandeau du haut, version « nuit » : se détache du site (règle Sare 08/10/2026) ===== */
.reassurance{background:linear-gradient(90deg,#141414,#2a1a12 50%,#141414)!important;color:#fff;padding:0!important;border-bottom:2px solid #FF5000;position:relative}
.reassurance .wrap.eb{height:38px;display:flex!important;align-items:center;overflow:hidden!important;white-space:nowrap!important}
.eb-piste{display:flex;align-items:center;width:max-content;margin:0 auto}
.eb-lot{display:flex!important;align-items:center;gap:14px;padding-right:14px}
.eb .eb-titre{display:inline-flex!important;align-items:center;flex:none!important;background:linear-gradient(90deg,#FF5000,#FF8A3D)!important;color:#fff;padding:4px 12px!important;border-radius:999px;font-size:11px!important;font-weight:800;letter-spacing:.6px;text-transform:uppercase;box-shadow:0 0 14px rgba(255,80,0,.45)}
.eb-e{display:inline-flex!important;align-items:center;gap:7px;font-size:13px!important;font-weight:600;color:#fff}
.eb-e b{color:#FF9A5C;font-weight:800}
.eb-ic{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:rgba(255,80,0,.18);color:#FF8A3D;flex:none}
.eb-ic svg{width:15px;height:15px}
.eb-s{display:inline-block!important;width:5px;height:5px;border-radius:50%;background:#FF5000;opacity:.9}
.eb-copie,.eb-fin{display:none!important}
@media(max-width:859px){
  .reassurance .wrap.eb{height:40px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);padding:0!important;max-width:none}
  .eb-piste{margin:0;animation:eb-defile 24s linear infinite}
  .eb-copie{display:flex!important}.eb-fin{display:inline-block!important}
  .eb-e{font-size:13px!important}
}
@keyframes eb-defile{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ===== accueil : « Commandez en 3 étapes » (règle Sare 08/10/2026) ===== */
.etapes3{position:relative;overflow:hidden;border-radius:18px;margin:4px 0 12px;padding:18px 16px 18px;color:#fff;
  background:radial-gradient(120% 140% at 0% 0%,#3a1d0e 0%,#171212 55%,#101010 100%);box-shadow:0 10px 30px rgba(0,0,0,.18)}
.etapes3::before{content:"";position:absolute;width:260px;height:260px;right:-80px;top:-120px;border-radius:50%;background:radial-gradient(circle,rgba(255,80,0,.35),rgba(255,80,0,0) 70%)}
.e3-tete{position:relative;text-align:center;margin-bottom:16px}
.e3-sur{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:#FF9A5C;margin-bottom:4px}
.e3-tete h2{font-size:20px;font-weight:800;letter-spacing:-.2px;margin:0;color:#fff}
.e3-liste{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
/* le fil qui relie les 3 icônes, avec une lumière qui le parcourt */
.e3-liste::before{content:"";position:absolute;top:29px;left:16.66%;right:16.66%;height:2px;background:linear-gradient(90deg,rgba(255,138,61,.25),rgba(255,138,61,.6),rgba(255,138,61,.25));border-radius:2px}
.e3-liste::after{content:"";position:absolute;top:25px;left:16.66%;width:10px;height:10px;border-radius:50%;background:#FFB37D;box-shadow:0 0 12px 4px rgba(255,120,40,.8);animation:e3-voyage 3.6s ease-in-out infinite}
@keyframes e3-voyage{0%{left:16.66%;opacity:0}8%{opacity:1}50%{left:calc(50% - 5px)}92%{opacity:1}100%{left:calc(83.33% - 10px);opacity:0}}
.e3-liste li{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;z-index:1}
.e3-ico{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;margin-bottom:8px;color:#fff;
  background:linear-gradient(145deg,#FF7A29,#FF4D00);box-shadow:0 8px 20px rgba(255,80,0,.4),inset 0 1px 0 rgba(255,255,255,.35);animation:e3-flotte 3.6s ease-in-out infinite}
.e3-liste li:nth-child(2) .e3-ico{animation-delay:1.2s}
.e3-liste li:nth-child(3) .e3-ico{animation-delay:2.4s}
@keyframes e3-flotte{0%,70%,100%{transform:translateY(0)}20%{transform:translateY(-5px) scale(1.06);box-shadow:0 14px 26px rgba(255,80,0,.55),inset 0 1px 0 rgba(255,255,255,.35)}}
.e3-ico svg{width:28px;height:28px}
.e3-liste b{font-size:14px;font-weight:800;color:#fff;line-height:1.2}
.e3-s{font-size:12px;color:rgba(255,255,255,.68);line-height:1.3}
.e3-pay{display:flex;gap:5px;justify-content:center;margin-top:6px;background:#fff;border-radius:999px;padding:3px 8px}
.e3-pay img{height:15px;width:auto;border-radius:3px}
@media(min-width:860px){.etapes3{padding:24px 28px}.e3-tete h2{font-size:24px}.e3-ico{width:66px;height:66px;border-radius:20px}.e3-liste::before{top:33px}.e3-liste::after{top:29px}.e3-liste b{font-size:16px}.e3-s{font-size:13px}}
@media(max-width:600px){.etapes3{padding:16px 10px}.e3-tete h2{font-size:18px}.e3-liste b{font-size:12.5px}.e3-s{font-size:10.5px}.e3-ico{width:52px;height:52px;border-radius:16px}.e3-ico svg{width:25px;height:25px}.e3-liste::before{top:26px}.e3-liste::after{top:22px}.e3-pay{padding:3px 6px;gap:4px}.e3-pay img{height:12px}}
@media (prefers-reduced-motion:reduce){.e3-ico,.e3-liste::after,.eb-piste{animation:none}}
.rayons-piste[hidden]{display:none!important}
/* le message est plus long : il défile aussi sur ordinateur */
.reassurance .wrap.eb{-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);max-width:none}
.eb-piste{margin:0!important;animation:eb-defile 34s linear infinite}
.eb-copie{display:flex!important}.eb-fin{display:inline-block!important}
.eb-lot{padding-right:28px}
.reassurance:hover .eb-piste{animation-play-state:paused}
@media(max-width:859px){.eb-piste{animation-duration:30s}}
.reassurance .wrap.eb .eb-ic{display:inline-grid!important}

/* ===== message « Important » (fiche + panier) au style de l'accueil : carte sombre, icônes orange (règle Sare 08/10/2026) ===== */
.imp{position:relative;overflow:hidden;border-radius:16px;margin:12px 18px 8px;padding:0 0 12px;color:#fff;
  background:radial-gradient(120% 140% at 0% 0%,#3a1d0e 0%,#171212 55%,#101010 100%);box-shadow:0 10px 26px rgba(0,0,0,.18)}
.imp::before{content:"";position:absolute;width:220px;height:220px;right:-70px;top:-110px;border-radius:50%;background:radial-gradient(circle,rgba(255,80,0,.32),rgba(255,80,0,0) 70%);pointer-events:none}
.panneau-corps .imp{margin:12px 14px 10px}
@media(max-width:859px){.imp{margin:10px 14px 8px}}
.imp-tete{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 12px 4px;font-size:12px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:#FF9A5C}
.imp-ico{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#FF5000;color:#fff;font-size:12px;font-weight:900;animation:avis-pouls 1.4s ease-in-out infinite}
.imp-liste{position:relative;list-style:none;margin:10px 6px 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.imp-liste::before{content:"";position:absolute;top:24px;left:16.66%;right:16.66%;height:2px;background:linear-gradient(90deg,rgba(255,138,61,.25),rgba(255,138,61,.6),rgba(255,138,61,.25));border-radius:2px}
.imp-liste::after{content:"";position:absolute;top:20px;left:16.66%;width:10px;height:10px;border-radius:50%;background:#FFB37D;box-shadow:0 0 12px 4px rgba(255,120,40,.8);animation:e3-voyage 3.6s ease-in-out infinite}
.imp-liste li{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;padding:0 2px}
.imp-rond{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;margin-bottom:7px;color:#fff;background:linear-gradient(145deg,#FF7A29,#FF4D00);box-shadow:0 8px 18px rgba(255,80,0,.4),inset 0 1px 0 rgba(255,255,255,.35);animation:e3-flotte 3.6s ease-in-out infinite}
.imp-liste li:nth-child(2) .imp-rond{animation-delay:1.2s}
.imp-liste li:nth-child(3) .imp-rond{animation-delay:2.4s}
.imp-rond svg{width:23px;height:23px}
.imp-liste b{font-size:13px;font-weight:800;color:#fff;line-height:1.2}
.imp-s{font-size:11.5px;color:rgba(255,255,255,.7);line-height:1.3}
.imp-pay{display:flex;gap:4px;justify-content:center;margin-top:5px;background:#fff;border-radius:999px;padding:3px 7px}
.imp-pay img{height:13px;width:auto;border-radius:3px}
.imp-note{position:relative;margin:10px 12px 0;font-size:10.5px;color:rgba(255,255,255,.5);text-align:center}
.imp .accepte{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;margin:12px 12px 0;padding:11px 12px;background:transparent;border:2px solid #FF5000;border-radius:999px;font-size:14px;font-weight:800;color:#fff;cursor:pointer}
.imp .accepte input{width:20px;height:20px;margin:0;accent-color:#FF5000}
.imp .accepte:has(input:checked){background:linear-gradient(90deg,#FF5000,#FF7A29);border-color:transparent}
.imp .accepte.a-cocher{animation:accepte-appel 1s ease-in-out infinite}
@media(max-width:600px){.imp-liste b{font-size:11.5px}.imp-s{font-size:10px}.imp-rond{width:44px;height:44px;border-radius:14px}.imp-rond svg{width:21px;height:21px}.imp-liste::before{top:22px}.imp-liste::after{top:18px}.imp-tete{font-size:11px}.imp-pay img{height:11px}}
@media (prefers-reduced-motion:reduce){.imp-rond,.imp-liste::after,.imp-ico{animation:none}}
/* panier : une ligne par paire, couleur + pointure lisibles, bouton pour retirer */
.ligne-panier .det{display:block;font-size:12px;color:#666;margin-top:2px}
.ligne-panier .det b{color:#222;font-weight:700}
.ligne-panier .pu{font-size:14px!important;margin-top:3px}
.ligne-panier .retirer{flex:none;width:32px;height:32px;border-radius:50%;border:1px solid var(--gris-clair);background:#fff;color:#888;font-size:20px;line-height:1;display:grid;place-items:center;cursor:pointer}
.ligne-panier .retirer:hover{color:#c0392b;border-color:#f3c2bb;background:#fff5f4}
.recap{margin-top:6px;border-top:1px solid var(--gris-clair);padding-top:12px}
/* bandeau : plus haut, plus lisible, plus rapide, reflet lumineux qui passe (règle Sare 08/10/2026) */
.reassurance .wrap.eb{height:50px!important}
@media(max-width:859px){.reassurance .wrap.eb{height:48px!important}}
.eb-e{font-size:15px!important;font-weight:700!important;gap:9px!important}
.eb-ic{width:30px!important;height:30px!important;background:linear-gradient(145deg,#FF7A29,#FF4D00)!important;color:#fff!important;box-shadow:0 0 10px rgba(255,90,0,.55)}
.eb-ic svg{width:17px!important;height:17px!important}
.eb .eb-titre{font-size:12.5px!important;padding:6px 14px!important;animation:eb-pastille 1.6s ease-in-out infinite}
.eb-s{width:7px!important;height:7px!important;box-shadow:0 0 8px #FF5000}
.eb-lot{gap:18px!important;padding-right:18px!important}
.eb-piste{animation-duration:20s!important}
@media(max-width:859px){.eb-piste{animation-duration:15s!important}.eb-e{font-size:14.5px!important}}
@keyframes eb-pastille{0%,100%{box-shadow:0 0 10px rgba(255,80,0,.4);transform:scale(1)}50%{box-shadow:0 0 22px rgba(255,110,30,.85);transform:scale(1.05)}}
/* reflet lumineux qui balaie la bande */
.reassurance{overflow:hidden}
.reassurance::after{content:"";position:absolute;top:0;bottom:0;left:-30%;width:30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.10),transparent);animation:eb-reflet 3.2s ease-in-out infinite;pointer-events:none}
@keyframes eb-reflet{0%{left:-30%}60%,100%{left:110%}}
@media (prefers-reduced-motion:reduce){.reassurance::after,.eb .eb-titre{animation:none}}
/* fiche produit sur téléphone : photo carrée (moins haute), la chaussure reste entière au centre (règle Sare 08/10/2026) */
@media(max-width:859px){.fp-piste>*{aspect-ratio:var(--ratio-mob,1)!important;object-fit:cover!important;object-position:center 55%}}
/* entête : plus d'air sur les côtés ; bande un peu plus lente */
header .wrap.barre{padding-inline:18px}
@media(max-width:859px){header .wrap.barre{padding-inline:16px}}
.eb-piste{animation-duration:27s!important}
@media(max-width:859px){.eb-piste{animation-duration:23s!important}}
/* barre du bas (Accueil, Suivi, Infos, Contact) visible sur toutes les pages, y compris la fiche produit */
@media(max-width:859px){body.avec-barre .onglets{display:flex!important}body.avec-barre{padding-bottom:64px!important}}
.recap-note{margin:6px 0 0;font-size:12.5px;line-height:1.4;color:#7a4a12;background:#fff4e6;border-radius:8px;padding:8px 10px}

/* iPhone : empêche Safari de grossir tout seul certains textes (tailles incohérentes dans la bande défilante) */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.eb-e{white-space:nowrap!important;line-height:1.2}

/* message après « Commander » : même ambiance que l'accueil */
.cf{padding:22px 16px 18px!important}
.cf-ok{width:64px;height:64px;margin:0 auto 10px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#FF7A29,#FF4D00);box-shadow:0 8px 22px rgba(255,80,0,.45);animation:cf-pop .5s cubic-bezier(.2,1.6,.4,1) both}
.cf-ok svg{width:34px;height:34px}
@keyframes cf-pop{from{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}
.cf-titre{font-size:21px;font-weight:800;margin:0;color:var(--encre)}
.cf-num{display:inline-block;margin:6px 0 8px;padding:3px 12px;border-radius:999px;background:#FFF1E8;color:#E04800;font-weight:800;font-size:13px}
.confirme .cf-sous{color:#444;font-size:14px;margin:0 0 14px}
.cf-carte{position:relative;overflow:hidden;text-align:left;border-radius:18px;padding:16px 14px;color:#fff;background:radial-gradient(120% 140% at 0% 0%,#3a1d0e 0%,#171212 55%,#101010 100%);box-shadow:0 10px 30px rgba(0,0,0,.18);display:grid;gap:12px}
.cf-carte::before{content:"";position:absolute;width:220px;height:220px;right:-80px;top:-110px;border-radius:50%;background:radial-gradient(circle,rgba(255,80,0,.35),rgba(255,80,0,0) 70%);pointer-events:none}
.cf-etape{position:relative;display:flex;gap:12px;align-items:center}
.cf-etape b{display:block!important;font-size:14.5px!important;margin:0!important;color:#fff}
.cf-etape span:not(.cf-ico){display:block;font-size:12.5px;color:rgba(255,255,255,.75);line-height:1.35}
.cf-ico{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#FF7A29,#FF4D00);box-shadow:0 6px 16px rgba(255,80,0,.4)}
.cf-ico svg{width:22px;height:22px}
.cf-pay{position:relative;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-left:56px}
.cf-pay img{height:24px;width:auto;border-radius:6px;background:#fff;padding:2px}
.cf-pay span{font-size:11.5px;color:rgba(255,255,255,.6)}
.cf-montant{position:relative;text-align:center;border-radius:14px;padding:10px;background:rgba(255,255,255,.07);border:1px solid rgba(255,138,61,.35)}
.cf-montant span{display:block;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#FF9A5C}
.cf-montant strong{display:block;font-size:26px;font-weight:800;color:#fff;line-height:1.2}
.cf-montant small{display:block;font-size:12px;color:rgba(255,255,255,.7)}
.confirme .cf-suivi{margin:14px 0 12px;font-size:13px}
.cf-suivi a{color:var(--orange);font-weight:700}
.confirme .cf-note{font-size:11.5px;color:var(--gris);margin:10px 0 0}

/* choix d'un modèle (articles hors chaussures) : vignette + nom + prix */
.puces-v{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
.puces-v button{display:flex!important;align-items:center;gap:8px;text-align:left;min-height:56px;padding:6px 8px 6px 6px!important;justify-content:flex-start!important}
.puces-v button img{flex:none;width:44px;height:44px;object-fit:cover;border-radius:8px;background:#f2f2f2}
.puces-v button span{flex:1;min-width:0;font-size:12.5px;line-height:1.25}
.puces-v button small{display:block;color:var(--orange,#ff5000);font-weight:700;font-size:12px;margin-top:2px}
.puces-v button:disabled{opacity:.4}
@media(min-width:860px){.puces-v{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
/* choix du modèle dans une fenêtre quand il y en a beaucoup (règle Sare 09/10/2026) */
.ouvre-v{display:flex;align-items:center;gap:10px;width:100%;padding:8px 12px 8px 8px;border:1.5px solid #e3e3e3;border-radius:12px;background:#fff;cursor:pointer;text-align:left;font:inherit;color:#111}
.ouvre-v:hover{border-color:var(--orange,#ff5000)}
.ouvre-v .ov-img{display:flex;flex:none}
.ouvre-v .ov-img img{width:40px;height:40px;object-fit:cover;border-radius:8px;border:2px solid #fff;background:#f2f2f2;margin-left:-14px}
.ouvre-v .ov-img img:first-child{margin-left:0}
.ouvre-v.choisi .ov-img img{width:52px;height:52px}
.ouvre-v .ov-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ouvre-v .ov-txt b{font-size:14px;font-weight:600;line-height:1.25}
.ouvre-v .ov-txt small{font-size:12px;color:var(--orange,#ff5000);font-weight:600}
.ouvre-v .ov-fl{font-size:26px;color:#999;line-height:1}
.choix-bloc.manque .ouvre-v{border-color:#E5484D}
.fen-v{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-end;justify-content:center}
.fen-v[hidden]{display:none}
.fen-v .fv-fond{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.fen-v .fv-boite{position:relative;background:#fff;width:100%;max-width:720px;max-height:82vh;border-radius:18px 18px 0 0;display:flex;flex-direction:column;animation:fvMonte .22s ease-out}
@keyframes fvMonte{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
.fen-v .fv-tete{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #eee}
.fen-v .fv-tete b{font-size:16px}
.fen-v .fv-x{border:0;background:#f2f2f2;width:34px;height:34px;border-radius:50%;font-size:22px;line-height:1;cursor:pointer}
.fen-v .fv-corps{overflow-y:auto;padding:12px 12px calc(16px + env(safe-area-inset-bottom))}
.puces-v.en-fenetre{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.puces-v.en-fenetre button{flex-direction:column!important;align-items:stretch!important;padding:6px!important;min-height:0}
.puces-v.en-fenetre button img{width:100%!important;height:auto!important;aspect-ratio:1}
.puces-v.en-fenetre button span{font-size:12px}
@media(min-width:860px){.fen-v{align-items:center}.fen-v .fv-boite{border-radius:18px;max-height:86vh}.puces-v.en-fenetre{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
#p-montant.plage{font-size:.72em;white-space:nowrap}
.carte .prix .des{font-size:.62em;font-weight:600;opacity:.85;margin-right:2px}
/* photos toujours entières (règle Sare 09/10/2026) : jamais rognées, ni dans la galerie ni dans le choix des modèles */
.fp-piste>img{object-fit:contain!important;background:#fff}
@media(max-width:859px){.fp-piste>img{object-fit:contain!important;object-position:center!important}}
.puces-v button img,.puces-v.en-fenetre button img,.ouvre-v .ov-img img{object-fit:contain!important;background:#fff}
/* aperçu en grand dans la fenêtre des modèles */
.fv-corps[hidden],.fv-apercu[hidden]{display:none!important}
.fen-v .fv-boite{height:82vh}
@media(min-width:860px){.fen-v .fv-boite{height:86vh}}
.fv-apercu{flex:1;min-height:0;display:flex;flex-direction:column;padding:10px 12px calc(14px + env(safe-area-inset-bottom))}
.fv-apercu .fa-zone{position:relative;flex:1;min-height:0;background:#fff;border:1px solid #eee;border-radius:14px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.fv-apercu .fa-zone img{width:100%;height:100%;object-fit:contain;background:#fff}
.fv-apercu .fa-fl{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:#fff;font-size:30px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding-bottom:4px}
.fv-apercu .fa-g{left:8px}.fv-apercu .fa-d{right:8px}
.fv-apercu .fa-n{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.55);color:#fff;font-size:12px;padding:3px 10px;border-radius:20px}
.fv-apercu .fa-info{padding:10px 2px 8px;display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.fv-apercu .fa-nom{font-size:15px}
.fv-apercu .fa-prix{color:var(--orange);font-weight:700;white-space:nowrap}
.fv-apercu .fa-act{display:flex;gap:8px}
.fv-apercu .fa-retour{flex:0 0 auto;border:1px solid #ddd;background:#fff;border-radius:12px;padding:12px 14px;font-size:14px;cursor:pointer}
.fv-apercu .fa-ok{flex:1;border:0;background:var(--orange);color:#fff;border-radius:12px;padding:12px;font-size:15px;font-weight:700;cursor:pointer}
.panier-vide{padding:28px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}.panier-vide p{margin:0}.panier-vide .bouton{margin-top:14px}
.puces-v button:disabled{position:relative}
.puces-v button:disabled span::after{content:"Épuisé";display:block;font-size:11px;font-weight:700;color:#B42318;text-decoration:none}

/* ---------- rayons illustrés (09/10/2026) ---------- */
.rayons-piste{gap:6px;align-items:flex-start;padding:4px 2px 10px}
@media(min-width:860px){.rayons-piste{justify-content:center;gap:18px}}
.rayon{width:82px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.rayon .rond.illus-rond{width:64px;height:64px;margin:0 auto 7px;box-shadow:0 3px 10px rgba(0,0,0,.10), inset 0 -3px 8px rgba(0,0,0,.05);border:2px solid #fff;transition:transform .2s, box-shadow .2s}
.rayon .rond.illus-rond svg{width:56px;height:56px;overflow:visible}
.rayon:hover .rond{transform:translateY(-2px)}
.rayon[aria-pressed="true"] .rond.illus-rond{box-shadow:0 0 0 2.5px var(--orange), 0 4px 12px rgba(255,80,0,.25)}
.rayon .rayon-nom{display:flex;align-items:flex-start;justify-content:center;min-height:2.6em;font-size:12px;line-height:1.3;color:#444;font-weight:500;padding:0 2px}
.rayon[aria-pressed="true"] .rayon-nom{color:var(--orange);font-weight:700}
@media(min-width:860px){.rayon{width:96px}.rayon .rond.illus-rond{width:76px;height:76px}.rayon .rond.illus-rond svg{width:66px;height:66px}.rayon .rayon-nom{font-size:13px}}
@media (prefers-reduced-motion:no-preference){
  .illus .il-anime{animation:il-flotte 3.2s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
  .il-chaussures .il-a2{animation-delay:-1.6s}
  .il-pales{animation:il-tourne 1.1s linear infinite;transform-origin:32px 25px}
  .il-crayon{animation:il-ecrit 1.8s ease-in-out infinite;transform-origin:44px 50px}
  .il-eclat{animation:il-brille 2.4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
}
@keyframes il-flotte{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.2px)}}
@keyframes il-tourne{to{transform:rotate(360deg)}}
@keyframes il-ecrit{0%,100%{transform:rotate(0)}30%{transform:rotate(-7deg) translateX(-1px)}60%{transform:rotate(4deg)}}
@keyframes il-brille{0%,100%{transform:scale(.6);opacity:.4}50%{transform:scale(1.15);opacity:1}}

/* ---------- sous-menu des chaussures dans le rond « Chaussures » (09/10/2026, v2 illustrée) ---------- */
.rayon.a-sous-menu{position:relative}
.rayon.a-sous-menu .rayon-nom::after{content:"";flex:none;display:inline-block;width:12px;height:12px;margin:2px 0 0 3px;background:currentColor;opacity:.65;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .2s}
.rayon.a-sous-menu[aria-expanded="true"] .rayon-nom::after{transform:rotate(180deg)}
.rayon .sous-choix{display:inline-flex!important;align-items:center;gap:4px;margin:-2px auto 0;padding:2px 9px 2px 2px;border-radius:999px;background:#fff;border:1px solid #FFD2BA;box-shadow:0 1px 3px rgba(255,80,0,.12);color:var(--orange)!important;font-size:11px!important;font-weight:700;line-height:1.3!important;white-space:nowrap}
.rayon .sous-choix i{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;overflow:hidden}
.rayon .sous-choix i svg{width:20px;height:20px}
.rayon .sous-choix[hidden]{display:none!important}

.sous-menu{position:absolute;z-index:60;width:340px;max-width:calc(100vw - 16px);background:#fff;border-radius:20px;padding:14px;border:1px solid #EEF0F3;box-shadow:0 24px 60px -12px rgba(20,24,40,.28),0 4px 12px rgba(20,24,40,.06);opacity:0;visibility:hidden;transform:translateY(-8px) scale(.97);transform-origin:var(--fleche,50%) top;transition:opacity .2s,transform .22s cubic-bezier(.2,.9,.3,1.2),visibility 0s .2s}
.sous-menu.ouvert{opacity:1;visibility:visible;transform:none;transition:opacity .2s,transform .22s cubic-bezier(.2,.9,.3,1.2)}
.sous-menu::before{content:"";position:absolute;top:-7px;left:calc(var(--fleche,50%) - 7px);width:14px;height:14px;background:#fff;transform:rotate(45deg);border-radius:3px;border-left:1px solid #EEF0F3;border-top:1px solid #EEF0F3}
.sm-tete{display:flex;align-items:baseline;justify-content:space-between;padding:2px 4px 12px;margin-bottom:10px;border-bottom:1px solid #F1F2F4}
.sm-tete span{font-size:15px;font-weight:800;color:var(--encre);letter-spacing:-.01em}
.sm-tete small{font-size:11.5px;color:var(--gris)}
.sm-tuile{position:relative;display:flex;align-items:center;gap:10px;width:100%;border:1.5px solid #EEF0F3;background:#fff;border-radius:14px;padding:8px 10px 8px 8px;text-align:left;color:var(--encre);cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s,background .15s}
.sm-tuile:hover{border-color:#FFC7A8;box-shadow:0 6px 16px -6px rgba(255,80,0,.25);transform:translateY(-1px)}
.sm-tuile:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.sm-tuile[aria-pressed="true"]{border-color:var(--orange);background:linear-gradient(180deg,#FFF7F2,#FFF);box-shadow:0 0 0 3px rgba(255,80,0,.12)}
.sm-ill{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;overflow:hidden;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.08),inset 0 -2px 6px rgba(0,0,0,.04)}
.sm-ill svg{width:44px;height:44px;overflow:visible}
.sm-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.sm-txt b{font-size:13.5px;font-weight:700;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sm-txt small{font-size:11.5px;color:var(--gris);font-weight:500}
.sm-tuile[aria-pressed="true"] .sm-txt b{color:var(--orange)}
.sm-coche{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;background:var(--orange);color:#fff;display:grid;place-items:center;box-shadow:0 2px 6px rgba(255,80,0,.4);transform:scale(0);transition:transform .2s cubic-bezier(.2,.9,.3,1.4)}
.sm-coche svg{width:12px;height:12px}
.sm-tuile[aria-pressed="true"] .sm-coche{transform:scale(1)}
.sm-toutes{margin-bottom:8px}
.sm-toutes .sm-ill{width:52px;height:52px}.sm-toutes .sm-ill svg{width:48px;height:48px}
.sm-grille{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sm-grille .sm-tuile{flex-direction:column;align-items:center;text-align:center;gap:6px;padding:12px 6px 10px}
.sm-grille .sm-ill{width:58px;height:58px}.sm-grille .sm-ill svg{width:54px;height:54px}
.sm-grille .sm-txt{align-items:center}
.sm-grille .sm-txt b{white-space:normal}
@media (prefers-reduced-motion:no-preference){
  .sm-a-pas{animation:sm-pas 2.6s ease-in-out infinite;transform-origin:30px 48px}
  .sm-a-ombre{animation:sm-ombre 2.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
  .sm-a-balance{animation:sm-balance 3s ease-in-out infinite;transform-origin:28px 46px}
  .sm-a-coeur{animation:il-brille 1.8s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
  .sm-a-course{animation:sm-course .9s ease-in-out infinite}
  .sm-a-vitesse path{animation:sm-vitesse .9s linear infinite}
  .sm-a-vitesse path:nth-child(2){animation-delay:.15s}.sm-a-vitesse path:nth-child(3){animation-delay:.3s}
  .sm-a-flotte{animation:il-flotte 3s ease-in-out infinite}
  .sm-a-soleil{animation:il-tourne 9s linear infinite;transform-origin:50px 14px}
  .sm-a-couvercle{animation:sm-couvercle 2.8s ease-in-out infinite;transform-origin:10px 34px}
  .sm-a-sort,.sm-a-sort2{animation:sm-sort 2.8s ease-in-out infinite}
  .sm-a-sort2{animation-delay:.12s}
}
@keyframes sm-pas{0%,100%{transform:rotate(0)}25%{transform:rotate(-6deg) translateY(-1px)}50%{transform:rotate(0)}}
@keyframes sm-ombre{0%,100%{transform:scaleX(1)}25%{transform:scaleX(.88)}}
@keyframes sm-balance{0%,100%{transform:rotate(0)}50%{transform:rotate(-5deg)}}
@keyframes sm-course{0%,100%{transform:translateX(0)}50%{transform:translateX(2px) translateY(-1px)}}
@keyframes sm-vitesse{0%{transform:translateX(4px);opacity:0}40%{opacity:1}100%{transform:translateX(-6px);opacity:0}}
@keyframes sm-couvercle{0%,15%,100%{transform:rotate(0)}40%,65%{transform:rotate(-16deg) translateY(-3px)}}
@keyframes sm-sort{0%,15%,100%{transform:translateY(5px)}40%,65%{transform:translateY(-3px)}}

/* vidéo en tête de la fiche : lecture automatique sans le son, bouton « Son » (règle Sare 10/10/2026) */
.fp-galerie .fp-son{position:absolute;right:12px;top:12px;z-index:3;display:inline-flex;align-items:center;gap:6px;padding:7px 12px 7px 10px;border:0;border-radius:999px;background:rgba(20,20,20,.62);color:#fff;font-size:13px;font-weight:600;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);cursor:pointer}
.fp-galerie .fp-son svg{width:18px;height:18px}
.fp-galerie .fp-son[hidden]{display:none}

/* vignettes des modèles : elles coulissent, la vidéo en premier (règle Sare 10/10/2026) */
.mini-couleurs{overflow-x:auto!important;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.mini-couleurs::-webkit-scrollbar{display:none}
.mini-couleurs .mc{scroll-snap-align:start;cursor:pointer}
.mini-couleurs.defile .mc{flex:0 0 calc(22% - 5px)}
.mini-couleurs.defile{-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
.mini-couleurs .mc-jouer{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.28);border-radius:inherit}
.mini-couleurs .mc-jouer::before{content:"";width:0;height:0;border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.45))}
.vignette{position:relative}
.vignette video.video-carte{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#F7F8FA;z-index:2}
.mini-couleurs.defile.fin{-webkit-mask-image:none;mask-image:none}

/* lecteur des cartes : ▶ devient ❚❚ pendant la lecture, bouton son (règle Sare 10/10/2026) */
.mini-couleurs .mc-video.lecture .mc-jouer::before{width:11px;height:13px;border:0;border-left:3.5px solid #fff;border-right:3.5px solid #fff;margin-left:0;box-sizing:border-box}
.vignette .son-carte{position:absolute;top:8px;right:8px;z-index:3;width:34px;height:34px;border:0;border-radius:50%;display:grid;place-items:center;background:rgba(20,20,20,.6);color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.vignette .son-carte svg{width:18px;height:18px}

/* photo de la carte posée sur la vidéo de la fiche tant que la vidéo n'affiche pas sa première image (jamais d'écran noir) */
.fp-galerie{position:relative}
.fp-cache-video{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;background:#fff;pointer-events:none;z-index:2;transition:opacity .35s}
.fp-cache-video.parti{opacity:0}
.fp-galerie .fp-son{z-index:3}
@media(max-width:859px){.fp-cache-video{object-fit:cover;object-position:center 55%}}
.fp-galerie .fp-compteur{z-index:3}

/* commandes de la vidéo de la fiche, sans voile noir */
.fp-piste video{cursor:pointer}
.fp-jouer{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;width:64px;height:64px;border:0;border-radius:50%;background:rgba(20,20,20,.45);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.fp-jouer svg{width:30px;height:30px;margin-left:4px}
.fp-jouer[hidden],.fp-progres[hidden]{display:none}
.fp-progres{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.35);z-index:3;pointer-events:none}
.fp-progres i{display:block;height:100%;width:0;background:var(--orange,#FF5A1F);transition:width .25s linear}

/* Confort sur téléphone (rapport Khadija, accord Sare 10/10/2026) */
@media (pointer:coarse),(max-width:859px){
  /* l'iPhone zoome sur tout champ écrit en moins de 16px : on écrit en 16px */
  input,select,textarea,.champ input,.champ textarea,.champ select,.fp-qte input{font-size:16px!important}
  /* boutons assez grands pour le doigt (44px), sans changer leur dessin */
  .fermer,.retirer,.fv-x{width:44px;height:44px}
  .fp-qte button{width:44px;height:44px}
  .fp-qte input{height:44px}
  .vignette .son-carte{width:40px;height:40px}
}
/* panier : la photo montre l'article entier, jamais coupé */
.ligne-panier .photo-panier img{object-fit:contain!important;transform:none!important;background:#fff}
.puces button[hidden]{display:none!important}

/* Vitrine de l'accueil (proposition B, 10/10/2026) */
#vitrine{padding-bottom:10px}
.vt-diapo{margin:6px 0 18px;position:relative}
.vt-piste{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:18px}
.vt-piste::-webkit-scrollbar{display:none}
.vt-slide{flex:none;width:100%;scroll-snap-align:center;display:flex;align-items:stretch;background:#161616;color:#fff;text-decoration:none;min-height:190px;overflow:hidden}
.vt-slide img{width:46%;object-fit:cover;display:block;background:#fff}
.vt-txt{flex:1;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:18px 16px 18px 18px;min-width:0}
.vt-badge{align-self:flex-start;font-size:11px;font-weight:800;letter-spacing:.08em;background:var(--orange);padding:4px 9px;border-radius:99px}
.vt-txt b{font-size:19px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.vt-prix{font-size:20px;font-weight:800;color:#FFB48A}
.vt-btn{align-self:flex-start;background:#fff;color:#1A1A1A;font-weight:800;font-size:14px;padding:10px 16px;border-radius:99px}
.vt-points{display:flex;justify-content:center;gap:6px;margin-top:10px}
.vt-points i{width:7px;height:7px;border-radius:99px;background:#D1D5DB;transition:width .3s,background .3s}
.vt-points i[data-on="true"]{width:20px;background:var(--orange)}
.vt-bloc{margin:0 0 20px}
.vt-tete{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}
.vt-tete h2{margin:0;font-size:19px;font-weight:800}
.vt-voir{border:0;background:none;color:var(--orange);font:700 14px inherit;font-family:inherit;cursor:pointer;padding:8px 0;white-space:nowrap}
.vt-rangee{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;margin:0 -2px;padding:0 2px 4px}
.vt-rangee::-webkit-scrollbar{display:none}
.vt-grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media(min-width:860px){.vt-grille{grid-template-columns:repeat(4,minmax(0,1fr))}.vt-slide{height:320px;min-height:0}.vt-slide img{width:40%;height:100%}.vt-txt{padding:28px 36px}.vt-txt b{font-size:28px}}
.vt-carte{flex:none;width:150px;scroll-snap-align:start;background:#fff;border-radius:12px;overflow:hidden;text-decoration:none;color:var(--encre);display:flex;flex-direction:column}
.vt-carte.vt-l{width:auto}
.vt-ph{position:relative;display:block;aspect-ratio:1;background:#fff}
.vt-ph img{width:100%;height:100%;object-fit:cover;display:block}
.vt-ph .marque-video{position:absolute;left:8px;top:8px;background:rgba(0,0,0,.55);color:#fff;font-size:10.5px;font-weight:600;padding:2px 7px;border-radius:999px}
.vt-t{font-size:13px;line-height:1.3;padding:8px 10px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vt-p{font-size:16px;font-weight:800;color:var(--orange);padding:4px 10px 10px}
.vt-petits{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;border:0;background:#FFEDE2;border-radius:16px;padding:16px;margin:0 0 20px;text-align:left;cursor:pointer;font:inherit;color:var(--encre)}
.vt-petits b{display:block;font-size:17px}.vt-petits small{display:block;font-size:13px;color:#6B4A36;margin-top:3px}
.vt-petits .vt-btn{background:var(--orange);color:#fff}
/* vitrine : toutes les photos carrées, même quand la photo d'origine est en hauteur */
.vt-ph{overflow:hidden;min-height:0}
.vt-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* 10/10/2026 (Sare) : ronds des rayons alignés à gauche ; sous-menu chaussures plus petit (liste compacte) */
@media(min-width:860px){.rayons-piste{justify-content:flex-start!important}}
.sous-menu{width:236px;padding:8px;border-radius:16px}
.sm-tete{padding:2px 6px 7px;margin-bottom:6px}
.sm-tete span{font-size:13.5px}
.sm-tete small{display:none}
.sm-toutes{margin-bottom:4px}
.sm-grille{grid-template-columns:1fr;gap:4px}
.sm-tuile,.sm-grille .sm-tuile{flex-direction:row;align-items:center;text-align:left;gap:9px;padding:5px 8px 5px 5px;border-radius:11px;border-width:1px}
.sm-ill,.sm-toutes .sm-ill,.sm-grille .sm-ill{width:34px;height:34px;border-width:1.5px}
.sm-ill svg,.sm-toutes .sm-ill svg,.sm-grille .sm-ill svg{width:31px;height:31px}
.sm-grille .sm-txt{align-items:flex-start}
.sm-txt{flex-direction:row;align-items:baseline;justify-content:space-between;gap:6px}
.sm-txt b{font-size:13px}
.sm-txt small{font-size:11px}
.sm-coche{top:50%;right:8px;margin-top:-9px;width:18px;height:18px}
.sm-tuile[aria-pressed="true"] .sm-txt small{visibility:hidden}
.sm-txt small{flex:none;background:#F2F3F5;border-radius:999px;padding:1px 7px;color:#6B7280;font-weight:600}
.sm-tuile[aria-pressed="true"]{padding-right:30px}

/* ===== Accueil vivant (Sare 10/10/2026) : diaporama clair et coloré, coups de cœur, grandes tuiles de rayons ===== */
.vt-diapo{margin:14px 0 22px}
.vt-piste{border-radius:22px}
.vt-slide{position:relative;background:var(--fond,#FFE4D2);color:var(--encre);min-height:210px;isolation:isolate}
.vt-slide::before{content:"";position:absolute;inset:auto -60px -90px auto;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.55);z-index:-1}
.vt-slide::after{content:"";position:absolute;left:-40px;top:-50px;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.35);z-index:-1}
.vt-txt{gap:10px;padding:20px 8px 20px 20px}
.vt-badge{background:#fff;color:var(--orange);box-shadow:0 2px 8px rgba(255,80,0,.15);letter-spacing:.02em;font-size:12px}
.vt-txt b{font-size:20px;color:var(--encre)}
.vt-prix{font-size:22px;color:var(--orange)}
.vt-btn{background:var(--orange);color:#fff;box-shadow:0 6px 16px -6px rgba(255,80,0,.6)}
.vt-btn i{font-style:normal;display:inline-block;transition:transform .25s}
.vt-slide:hover .vt-btn i{transform:translateX(4px)}
.vt-scene{width:46%;flex:none;display:grid;place-items:center;padding:14px 14px 14px 0}
.vt-scene img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%;border:5px solid #fff;box-shadow:0 18px 34px -14px rgba(0,0,0,.35);background:#fff}
.vt-slide.actif .vt-scene img{animation:vt-flotte 4.5s ease-in-out infinite}
.vt-slide.actif .vt-txt > *{animation:vt-entre .6s cubic-bezier(.2,.8,.2,1) both}
.vt-slide.actif .vt-txt > :nth-child(2){animation-delay:.08s}.vt-slide.actif .vt-txt > :nth-child(3){animation-delay:.16s}.vt-slide.actif .vt-txt > :nth-child(4){animation-delay:.24s}
@keyframes vt-flotte{0%,100%{transform:translateY(0) rotate(-2deg) scale(1)}50%{transform:translateY(-8px) rotate(2deg) scale(1.03)}}
@keyframes vt-entre{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.vt-barres{display:flex;gap:6px;margin:12px auto 0;max-width:260px}
.vt-barres i{flex:1;height:4px;border-radius:99px;background:#E5E7EB;overflow:hidden;cursor:pointer}
.vt-barres i u{display:block;height:100%;width:0;background:var(--orange);border-radius:99px}
.vt-barres i[data-on="true"] u{animation:vt-barre 4.5s linear forwards}
.vt-diapo.pause .vt-barres i u{animation-play-state:paused}
@keyframes vt-barre{to{width:100%}}
@media(min-width:860px){.vt-slide{height:340px}.vt-txt{padding:36px 44px;gap:14px}.vt-txt b{font-size:32px}.vt-prix{font-size:28px}.vt-scene{width:44%;padding:26px 40px 26px 0}.vt-scene img{width:auto;height:100%}}
/* titres de blocs */
.vt-tete{align-items:center}
.vt-tete h2{font-size:21px;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.vt-sous{font-size:12.5px;color:var(--gris);background:#fff;border-radius:99px;padding:4px 10px}
.vt-coeur{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#FFE4EC;color:#E11D48;font-size:16px;animation:vt-bat 1.6s ease-in-out infinite}
@keyframes vt-bat{0%,100%{transform:scale(1)}15%{transform:scale(1.18)}30%{transform:scale(1)}45%{transform:scale(1.12)}}
/* cartes coups de cœur */
.vt-grille .vt-carte{border-radius:16px;box-shadow:0 1px 2px rgba(0,0,0,.04);transition:transform .25s,box-shadow .25s}
.vt-grille .vt-carte:hover{transform:translateY(-4px);box-shadow:0 14px 28px -14px rgba(0,0,0,.25)}
.vt-grille .vt-ph img{transition:transform .5s}
.vt-grille .vt-carte:hover .vt-ph img{transform:scale(1.05)}
/* apparition au défilement */
.vt-apparait{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s cubic-bezier(.2,.8,.2,1)}
.vt-apparait.vu{opacity:1;transform:none}
.vt-apparait.vu .vt-grille .vt-carte,.vt-apparait.vu .vt-tuile{animation:vt-entre .6s cubic-bezier(.2,.8,.2,1) both}
.vt-apparait.vu .vt-grille .vt-carte:nth-child(2),.vt-apparait.vu .vt-tuile:nth-child(2){animation-delay:.08s}
.vt-apparait.vu .vt-grille .vt-carte:nth-child(3),.vt-apparait.vu .vt-tuile:nth-child(3){animation-delay:.16s}
.vt-apparait.vu .vt-grille .vt-carte:nth-child(4),.vt-apparait.vu .vt-tuile:nth-child(4){animation-delay:.24s}
/* grandes tuiles des rayons */
.vt-tuiles{display:grid;grid-template-columns:1fr;gap:12px}
.vt-tuile{position:relative;display:flex;align-items:center;min-height:168px;border-radius:22px;padding:18px;overflow:hidden;cursor:pointer;color:#fff;isolation:isolate;transition:transform .25s,box-shadow .25s;-webkit-tap-highlight-color:transparent}
.vt-tuile:hover{transform:translateY(-3px);box-shadow:0 18px 36px -18px rgba(0,0,0,.45)}
.vt-tuile:active{transform:scale(.985)}
.vt-tuile::before{content:"";position:absolute;width:240px;height:240px;right:-60px;top:-90px;border-radius:50%;background:rgba(255,255,255,.16);z-index:-1}
.vt-tuile::after{content:"";position:absolute;width:140px;height:140px;left:-50px;bottom:-70px;border-radius:50%;background:rgba(255,255,255,.12);z-index:-1}
.vt-t-orange{background:linear-gradient(135deg,#FF7A2F 0%,#FF5000 45%,#E63E00 100%)}
.vt-t-indigo{background:linear-gradient(135deg,#7C6CF2 0%,#5B4BDB 55%,#4433B8 100%)}
.vt-t-soleil{background:linear-gradient(135deg,#FFC93C 0%,#FFAE1A 55%,#F59200 100%);color:#3B2600}
.vt-t-menthe{background:linear-gradient(135deg,#34D399 0%,#10B981 55%,#059669 100%)}
.vt-t-rose{background:linear-gradient(135deg,#FB7185 0%,#F43F5E 55%,#E11D48 100%)}
.vt-tuile-txt{position:relative;z-index:2;display:flex;flex-direction:column;gap:5px;max-width:58%}
.vt-tuile-nb{align-self:flex-start;font-size:11.5px;font-weight:700;background:rgba(255,255,255,.22);padding:3px 9px;border-radius:99px;backdrop-filter:blur(4px)}
.vt-tuile b{font-size:24px;line-height:1.1;letter-spacing:-.02em}
.vt-tuile small{font-size:13px;opacity:.9}
.vt-puces{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.vt-puces button{border:0;background:#fff;color:var(--encre);font:700 13.5px inherit;font-family:inherit;padding:9px 16px;border-radius:99px;cursor:pointer;box-shadow:0 4px 12px -4px rgba(0,0,0,.3);transition:transform .2s}
.vt-puces button:hover{transform:translateY(-2px)}
.vt-fleche{margin-top:8px;align-self:flex-start;font-weight:800;font-size:14px;background:rgba(255,255,255,.95);color:var(--encre);padding:9px 16px;border-radius:99px}
.vt-fleche i{font-style:normal;display:inline-block;transition:transform .25s}
.vt-tuile:hover .vt-fleche i{transform:translateX(4px)}
.vt-bulles{position:absolute;right:0;top:0;bottom:0;width:48%;z-index:1}
.vt-bulle{position:absolute;border-radius:50%;overflow:hidden;border:4px solid rgba(255,255,255,.95);box-shadow:0 12px 24px -10px rgba(0,0,0,.4);background:#fff}
.vt-bulle img{width:100%;height:100%;object-fit:cover;display:block}
.vt-b0{width:112px;height:112px;right:14px;top:50%;margin-top:-56px;animation:vt-flotte 5s ease-in-out infinite}
.vt-b1{width:70px;height:70px;right:118px;top:14px;animation:vt-flotte 6s ease-in-out -1.5s infinite}
.vt-b2{width:62px;height:62px;right:108px;bottom:12px;animation:vt-flotte 5.5s ease-in-out -3s infinite}
@media(min-width:860px){
  .vt-tuiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .vt-tuile{min-height:230px;padding:28px}
  .vt-tuile-l{grid-column:1 / -1;min-height:260px}
  .vt-tuile b{font-size:32px}
  .vt-b0{width:150px;height:150px;margin-top:-75px;right:28px}
  .vt-b1{width:96px;height:96px;right:170px;top:20px}
  .vt-b2{width:84px;height:84px;right:160px;bottom:18px}
  .vt-tuile-l .vt-b0{width:180px;height:180px;margin-top:-90px;right:60px}
  .vt-tuile-l .vt-b1{width:110px;height:110px;right:250px}
  .vt-tuile-l .vt-b2{width:100px;height:100px;right:240px}
}
@media(prefers-reduced-motion:reduce){.vt-slide .vt-scene img,.vt-bulle,.vt-coeur,.vt-slide.actif .vt-txt > *{animation:none!important}.vt-apparait{opacity:1;transform:none}}
@media(max-width:519px){.vt-tete h2{font-size:19px;white-space:nowrap}.vt-sous{font-size:11px;padding:3px 8px;white-space:nowrap}.vt-coeur{width:26px;height:26px;font-size:14px}}
@media(min-width:860px){.vt-scene{height:100%;box-sizing:border-box}.vt-scene img{height:100%;width:auto;max-width:100%}
  .vt-tuile:not(.vt-tuile-l) .vt-tuile-txt{max-width:48%}.vt-tuile:not(.vt-tuile-l) b{font-size:28px}
  .vt-tuile:not(.vt-tuile-l) .vt-b1{right:150px;width:84px;height:84px}.vt-tuile:not(.vt-tuile-l) .vt-b2{right:142px;width:74px;height:74px}}
@media(min-width:860px){.vt-scene img{height:270px;width:270px;max-width:none}}
.pied-liens a.lien-fb{display:inline-flex;align-items:center;gap:5px}