@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Instrument+Serif:ital@0;1&display=swap');

:root{
  --foret:#0B2E1F; --foret-2:#123D2A; --foret-3:#1A5238;
  --menthe:#BFEFC9; --menthe-vive:#8FE3A6; --menthe-pale:#EAF8EE; --creme:#F7FBF6;
  --vert:#159A52; --vert-vif:#22C55E; --vert-fonce:#0B2E1F;
  --corail:#FF5C38; --corail-fonce:#C23A1B; --corail-pale:#FFEDE7;
  --encre:#10241B; --gris:#4F6558; --gris-clair:#8AA093; --ligne:#DFECE2; --blanc:#FFFFFF;
  --wa:#25D366; --wa-fonce:#128C4B; --etoile:#FFB020;
  --radius:14px; --radius-lg:24px; --rond:999px;
  --ombre:0 6px 24px rgba(11,46,31,.08); --ombre-hover:0 14px 34px rgba(11,46,31,.16);
  --maxw:1180px;
  --parachou-green:#0E3B2E; --parachou-green-light:#1C5A47; --parachou-cream:#F7F5EE;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--encre);background:var(--creme);font-size:15px;line-height:1.65;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
input,select,textarea{font-family:inherit;font-size:15px;color:var(--encre)}
.conteneur{max-width:var(--maxw);margin:0 auto;padding:0 16px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.serif{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:.3px}

.topbar{background:var(--parachou-cream);color:var(--foret-3);font-size:12.5px;text-align:center;padding:8px 12px;font-weight:600;letter-spacing:.3px;border-bottom:1px solid #E6E1D3}
.topbar strong{color:var(--foret);font-weight:800}

.entete{position:sticky;top:0;z-index:50;padding:0;background:var(--parachou-green)}
.entete::before{content:none}
.entete-in{display:flex;align-items:center;gap:12px;padding:10px 22px;max-width:none;margin:0;width:100%;background:var(--parachou-green);border:none;border-radius:0;box-shadow:none;transition:box-shadow .25s}
.entete.entete-scroll{box-shadow:0 4px 18px rgba(6,26,20,.22)}
.entete-bas{display:none;position:relative}
.logo{display:flex;align-items:center;flex-shrink:0}
.logo img{height:46px;width:auto;display:block}
@media(max-width:520px){.logo img{height:40px}}
.logo-pied img{height:54px;width:auto}
.recherche{flex:1;display:flex;max-width:430px;margin:0 auto;background:var(--parachou-cream);border:1.5px solid transparent;border-radius:var(--rond);overflow:hidden;transition:border-color .2s}
.recherche:focus-within{border-color:var(--parachou-green-light);background:#fff}
.recherche input{flex:1;border:none;padding:10px 18px;font-size:14px;background:transparent;outline:none;min-width:0;color:var(--parachou-green)}
.recherche input::placeholder{color:var(--gris-clair)}
.recherche button{background:var(--parachou-green);color:var(--parachou-cream);border-radius:var(--rond);width:38px;height:38px;margin:2px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s}
.recherche button:hover{background:var(--parachou-green-light)}
.recherche-cat{border:none;background-color:transparent;padding:10px 24px 10px 16px;font-size:12.5px;font-weight:700;color:var(--parachou-green);max-width:170px;flex-shrink:0;outline:none;cursor:pointer;-webkit-appearance:none;appearance:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E3B2E' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 5px center;background-size:11px}
.recherche-sep{width:1px;align-self:stretch;background:#DBD6C7;margin:8px 0;flex-shrink:0}
@media(max-width:1023px){
  .recherche-cat{display:none}
  .recherche-sep{display:none}
  /* Sur mobile/tablette, burger + logo + recherche + icônes ne tiennent pas
     sur une seule ligne : la recherche passe en pleine largeur sur sa propre
     ligne, et le sélecteur de langue rejoint le tiroir (voir .tiroir-panneau)
     pour laisser la place aux icônes essentielles (comparer/favoris/panier/compte). */
  .entete-in{flex-wrap:wrap;row-gap:8px;padding:10px 14px;gap:8px}
  .recherche{order:5;flex:1 1 100%;max-width:none;margin:0}
  .actions-entete{gap:4px}
  .lang-toggle{display:none}
}
.actions-entete{display:flex;align-items:center;gap:6px;margin-left:auto}
.btn-icone{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--rond);color:var(--parachou-cream);background:var(--parachou-green-light);transition:background .2s}
.btn-icone:hover{background:#256B51}
.lang-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 12px;border-radius:var(--rond);border:1.5px solid var(--parachou-cream);background:transparent;color:var(--parachou-cream);font-weight:800;font-size:13px;line-height:1;text-decoration:none;transition:all .2s}
.lang-toggle:hover{background:var(--parachou-cream);color:var(--parachou-green)}
.avatar-mini{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--parachou-cream);color:var(--parachou-green);font-weight:800;font-size:13px;line-height:1}
.badge-panier{position:absolute;top:-3px;right:-3px;background:var(--parachou-cream);color:var(--parachou-green);font-size:10.5px;font-weight:700;min-width:19px;height:19px;border-radius:var(--rond);display:flex;align-items:center;justify-content:center;padding:0 5px}
.burger{display:flex}

.nav-principale{display:none;flex:1;min-width:0;margin:0}
.nav-principale > ul{display:flex;flex:1;gap:2px;padding:0;justify-content:center;flex-wrap:nowrap}
.nav-principale a{display:block;padding:9px 11px;font-size:15px;font-weight:600;color:var(--parachou-green);border-radius:var(--rond);transition:all .2s;white-space:nowrap}
.nav-principale a:hover{background:rgba(14,59,46,.08)}
.nav-principale a.actif{background:var(--parachou-green);color:var(--parachou-cream)}
.nav-principale a.actif:hover{background:var(--parachou-green)}
.nav-principale a.promo-lien{color:var(--corail-fonce)}
.nav-principale a.promo-lien:hover{background:var(--corail-pale)}

.nav-secondaire{display:none}
.nav-secondaire a{display:block;padding:9px 11px;font-size:15px;font-weight:600;color:var(--parachou-green);border-radius:var(--rond);white-space:nowrap;transition:all .2s}
.nav-secondaire a:hover{background:rgba(14,59,46,.08)}
.nav-secondaire a.actif{background:var(--parachou-green);color:var(--parachou-cream)}
.nav-secondaire a.actif:hover{background:var(--parachou-green)}

.nav-dropdown{position:relative}
.nav-dropdown>a{display:flex;align-items:center;gap:4px}
.nav-dropdown .chevron{transition:transform .2s}
.nav-dropdown:hover .chevron,.nav-dropdown:focus-within .chevron{transform:rotate(180deg)}
.menu-deroulant{position:absolute;top:calc(100% + 8px);left:0;min-width:210px;background:#fff;border:1px solid var(--ligne);border-radius:var(--radius);box-shadow:var(--ombre-hover);z-index:70;padding:6px;margin:0;opacity:0;visibility:hidden;transform:translateY(-6px);transition:all .2s}
.nav-dropdown:hover .menu-deroulant,.nav-dropdown:focus-within .menu-deroulant{opacity:1;visibility:visible;transform:translateY(0)}
.menu-deroulant li{list-style:none}
.menu-deroulant a{display:block;padding:10px 14px;font-size:14px;font-weight:600;color:var(--parachou-green);border-radius:8px;white-space:nowrap}
.menu-deroulant a:hover{background:rgba(14,59,46,.07)}
.categories-trigger{border-right:1px solid #DBD6C7;padding-right:10px;margin-right:8px}
.categories-trigger>a{color:var(--parachou-green);font-weight:700}
.categories-trigger>a:hover{background:rgba(14,59,46,.08)}

.entete-in a:focus-visible,.entete-in button:focus-visible,.entete-in select:focus-visible{outline:2px solid var(--parachou-cream);outline-offset:2px;border-radius:var(--rond)}
.entete-bas a:focus-visible{outline:2px solid var(--parachou-green);outline-offset:2px}
.tiroir-panneau a:focus-visible{outline:2px solid var(--parachou-green);outline-offset:2px}

.tiroir{position:fixed;inset:0;z-index:100;visibility:hidden}
.tiroir.ouvert{visibility:visible}
.tiroir-fond{position:absolute;inset:0;background:rgba(8,28,19,.55);opacity:0;transition:opacity .25s}
.tiroir.ouvert .tiroir-fond{opacity:1}
.tiroir-panneau{position:absolute;top:0;left:0;bottom:0;width:300px;background:var(--parachou-cream);transform:translateX(-100%);transition:transform .25s;overflow-y:auto;padding:20px;border-radius:0 24px 24px 0}
.tiroir.ouvert .tiroir-panneau{transform:none}
.tiroir-panneau h3{font-size:11.5px;text-transform:uppercase;letter-spacing:1.4px;color:var(--gris-clair);margin:20px 0 6px}
.tiroir-panneau a{display:block;padding:10px 12px;font-weight:600;font-size:14.5px;border-radius:12px;color:var(--parachou-green)}
.tiroir-panneau a:hover{background:rgba(14,59,46,.08)}
.tiroir-fermer{margin-left:auto;display:block;color:var(--gris)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:700;font-size:14.5px;border-radius:var(--rond);padding:13px 26px;transition:all .18s;text-align:center;letter-spacing:.1px}
.btn:hover{transform:translateY(-1px)}
.btn-corail{background:var(--corail);color:#fff;box-shadow:0 8px 20px rgba(255,92,56,.35)}
.btn-corail:hover{background:#E84A27}
.btn-vert{background:var(--foret);color:var(--menthe-vive)}
.btn-vert:hover{background:var(--foret-2)}
.btn-menthe{background:var(--menthe);color:var(--foret)}
.btn-menthe:hover{background:var(--menthe-vive)}
.btn-contour{border:1.5px solid var(--foret);color:var(--foret);background:#fff}
.btn-contour:hover{background:var(--menthe-pale)}
.btn-wa{background:var(--wa);color:#fff;box-shadow:0 8px 20px rgba(37,211,102,.3)}
.btn-wa:hover{background:#1FB958}
.btn-bloc{width:100%}

.hero{position:relative;background:var(--foret);overflow:hidden;border-radius:28px;margin:14px 10px 0}
.hero-fond{position:absolute;inset:0;pointer-events:none}
.hero-in{position:relative;display:flex;flex-direction:column;gap:26px;align-items:flex-start;text-align:left;padding:52px 26px 58px;max-width:var(--maxw);margin:0 auto}
.hero h1{font-size:clamp(34px,6.4vw,64px);line-height:1.04;color:#fff;font-weight:700;letter-spacing:-1.5px}
.hero h1 em{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;color:var(--menthe-vive);letter-spacing:0}
.hero p.sous{color:#CDE9D6;font-size:16.5px;max-width:520px;font-weight:500}
.hero p.sous em{font-family:'Instrument Serif',Georgia,serif;font-style:italic;color:var(--menthe-vive);font-size:1.12em}
.hero .cta-rangee{display:flex;gap:12px;flex-wrap:wrap}
.pastille{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.1);border:1px solid rgba(191,239,201,.35);color:var(--menthe);font-size:12.5px;font-weight:700;padding:8px 16px;border-radius:var(--rond);backdrop-filter:blur(4px)}
.pastille .point{width:7px;height:7px;border-radius:50%;background:var(--menthe-vive)}
.hero-chips{display:flex;gap:9px;flex-wrap:wrap}
.chip{background:rgba(255,255,255,.94);color:var(--foret);font-size:12.5px;font-weight:700;padding:8px 15px;border-radius:var(--rond);display:inline-flex;align-items:center;gap:7px;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.chip.menthe{background:var(--menthe);color:var(--foret)}
.chip.corail{background:var(--corail);color:#fff}
.chip .fleche{width:19px;height:19px;border-radius:50%;background:var(--foret);color:var(--menthe-vive);display:inline-flex;align-items:center;justify-content:center;font-size:11px}
.carte-flottante{background:#fff;border-radius:20px;padding:13px;box-shadow:0 18px 44px rgba(0,0,0,.3);width:196px}
.carte-flottante .cf-visuel{background:var(--menthe-pale);border-radius:14px;padding:10px;display:flex;justify-content:center}
.carte-flottante .cf-nom{font-size:11.5px;font-weight:700;margin:9px 2px 2px;line-height:1.3}
.carte-flottante .cf-ligne{display:flex;align-items:center;justify-content:space-between;margin:4px 2px 0}
.carte-flottante .cf-prix{font-size:14px;font-weight:800;color:var(--foret)}
.hero-stats{display:flex;gap:22px;flex-wrap:wrap;border-top:1px solid rgba(191,239,201,.22);padding-top:20px;width:100%}
.hero-stats div{color:#fff}
.hero-stats b{display:block;font-size:21px;font-weight:800;letter-spacing:-.5px}
.hero-stats b .serif{color:var(--menthe-vive);font-size:1.1em}
.hero-stats span{font-size:12px;color:#9CC7AC;font-weight:600}

.section{padding:46px 0}
.section-titre{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:24px}
.section-titre h2{font-size:clamp(24px,3.6vw,34px);color:var(--foret);font-weight:800;letter-spacing:-1px}
.section-titre h2 .serif{color:var(--vert);font-weight:400;font-size:1.08em}
.section-titre a{color:var(--foret);font-weight:700;font-size:13.5px;white-space:nowrap;background:var(--menthe);padding:9px 18px;border-radius:var(--rond);transition:background .15s}
.section-titre a:hover{background:var(--menthe-vive)}
.section-alt{background:var(--menthe-pale);border-radius:32px;margin:0 10px}

.grille-cat{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.carte-cat{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--radius-lg);padding:22px 16px;text-align:center;transition:all .18s}
.carte-cat:hover{box-shadow:var(--ombre-hover);border-color:var(--menthe-vive);transform:translateY(-3px)}
.carte-cat .ico{width:56px;height:56px;border-radius:var(--rond);background:var(--menthe);color:var(--foret);display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.carte-cat .cat-photo{margin:-22px -16px 12px;height:130px;border-radius:var(--radius-lg) var(--radius-lg) 0 0;overflow:hidden;background:var(--menthe-pale)}
.carte-cat .cat-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.carte-cat:hover .cat-photo img{transform:scale(1.06)}
.carte-cat h3{font-size:14.5px;font-weight:700}
.carte-cat span{font-size:12px;color:var(--gris-clair);font-weight:500}

.grille-produits{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}
.carte-p{background:var(--blanc);border:1px solid var(--ligne);border-radius:20px;overflow:hidden;display:flex;flex-direction:column;transition:all .18s;position:relative}
.carte-p:hover{box-shadow:var(--ombre-hover);transform:translateY(-4px);border-color:var(--menthe-vive)}
.carte-p .visuel{background:var(--menthe-pale);padding:18px;display:flex;align-items:center;justify-content:center;height:158px;border-radius:0 0 18px 18px}
.carte-p .corps{padding:13px 15px 15px;display:flex;flex-direction:column;gap:5px;flex:1}
.carte-p .marque{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:1.1px;color:var(--vert)}
.carte-p h3{font-size:13.5px;font-weight:600;line-height:1.4;flex:1;letter-spacing:-.1px}
.carte-p h3 a::after{content:"";position:absolute;inset:0}
.prix-ligne{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.prix{font-size:16.5px;font-weight:800;color:var(--foret);letter-spacing:-.3px}
.prix-ancien{font-size:12.5px;color:var(--gris-clair);text-decoration:line-through;font-weight:600}
.badge{position:absolute;top:12px;left:12px;z-index:2;font-size:11.5px;font-weight:800;padding:5px 12px;border-radius:var(--rond)}
.badge-promo{background:var(--corail);color:#fff;box-shadow:0 4px 12px rgba(255,92,56,.4)}
.badge-best{background:var(--foret);color:var(--menthe-vive)}
.badge-nouveau{background:#fff;color:var(--foret);border:1.5px solid var(--foret)}
.stock{font-size:11.5px;color:var(--vert);font-weight:700}
.stock::before{content:"●";margin-right:4px;font-size:9px}
.etiquette{align-self:flex-start;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:var(--rond)}
.etiquette-date{background:var(--corail-pale);color:var(--corail-fonce)}
.etiquette-embal{background:var(--menthe-pale);color:var(--foret-3)}
.carte-p .boutons{display:flex;gap:7px;margin-top:9px;position:relative;z-index:2}
.carte-p .boutons .btn{padding:10px 10px;font-size:12.5px;flex:1;border-radius:var(--rond);box-shadow:none}
.carte-p .boutons .mini-wa{flex:0 0 42px;background:var(--wa);color:#fff;border-radius:var(--rond);display:flex;align-items:center;justify-content:center;transition:transform .15s}
.carte-p .boutons .mini-wa:hover{transform:scale(1.06)}

.bande-confiance{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;background:var(--foret);border-radius:28px;padding:28px 24px}
.item-confiance{display:flex;gap:13px;align-items:flex-start}
.item-confiance .ico{flex:0 0 46px;height:46px;border-radius:var(--rond);background:rgba(191,239,201,.14);color:var(--menthe-vive);display:flex;align-items:center;justify-content:center}
.item-confiance h3{font-size:14px;font-weight:700;color:#fff}
.item-confiance p{font-size:12.5px;color:#9CC7AC;font-weight:500}

.grille-marques{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.pilule-marque{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--rond);padding:12px 26px;font-weight:800;font-size:14.5px;color:var(--foret);transition:all .18s;letter-spacing:-.2px}
.pilule-marque:hover{background:var(--foret) !important;color:var(--menthe-vive) !important;transform:translateY(-2px);box-shadow:var(--ombre-hover)}

.cadre-marques{position:relative;background:var(--menthe-pale);border:1px solid var(--ligne);border-radius:var(--radius-lg);padding:34px 0 26px;margin-top:22px}
.badge-cadre{position:absolute;top:-15px;left:50%;transform:translateX(-50%);background:var(--foret);color:var(--menthe-vive);font-weight:800;font-size:12.5px;padding:7px 20px;border-radius:var(--rond);letter-spacing:.2px;white-space:nowrap;box-shadow:0 6px 16px rgba(11,46,31,.22)}
.marquee-marques{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marquee-track{display:flex;align-items:center;gap:14px;width:max-content;animation:defilerMarques 30s linear infinite}
.marquee-marques:hover .marquee-track{animation-play-state:paused}
.marquee-track .pilule-marque{flex-shrink:0;white-space:nowrap;background:var(--blanc)}
.pilule-marque-serif{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;font-size:19px;padding:8px 26px;letter-spacing:.3px}
.logo-marque{display:flex;align-items:center;justify-content:center;flex-shrink:0;height:46px;padding:2px 10px}
.logo-marque img{height:100%;width:auto;max-width:132px;object-fit:contain}
@keyframes defilerMarques{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none}}

.grille-avis{display:grid;grid-template-columns:1fr;gap:13px}
.carte-avis{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--radius-lg);padding:20px;position:relative}
.carte-avis::before{content:"“";font-family:'Instrument Serif',Georgia,serif;font-size:44px;line-height:1;color:var(--menthe-vive);position:absolute;top:12px;right:18px}
.etoiles{color:var(--etoile);font-size:15px;letter-spacing:2px;margin-bottom:9px}
.carte-avis p{font-size:13.5px;color:var(--gris);font-weight:500}
.carte-avis footer{margin-top:12px;font-size:13px;font-weight:800;color:var(--foret)}
.carte-avis footer span{color:var(--gris-clair);font-weight:600}

.bandeau-cta{background:var(--menthe);border-radius:28px;padding:38px 26px;text-align:center;color:var(--foret);position:relative;overflow:hidden}
.bandeau-cta h2{font-size:clamp(22px,3.4vw,30px);margin-bottom:6px;font-weight:800;letter-spacing:-.8px}
.bandeau-cta h2 .serif{font-weight:400;font-size:1.08em}
.bandeau-cta p{color:var(--foret-3);margin-bottom:20px;font-size:14.5px;font-weight:600}

.fil{font-size:12.5px;color:var(--gris-clair);padding:18px 0 0;font-weight:600}
.fil a:hover{color:var(--vert)}

.page-boutique{display:grid;grid-template-columns:1fr;gap:22px;padding:20px 0 50px}
.filtres{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--radius-lg);padding:20px;align-self:start}
.filtres h3{font-size:11.5px;text-transform:uppercase;letter-spacing:1.4px;color:var(--gris-clair);margin:18px 0 8px}
.filtres h3:first-child{margin-top:0}
.filtres label{display:flex;align-items:center;gap:9px;font-size:13.5px;padding:5px 0;color:var(--gris);cursor:pointer;font-weight:600}
.filtres input[type=checkbox],.filtres input[type=radio]{accent-color:var(--foret);width:16px;height:16px}
.filtres input[type=range]{width:100%;accent-color:var(--corail)}
.filtre-bascule{width:100%;justify-content:space-between;display:flex;align-items:center;font-weight:800;font-size:14.5px;color:var(--foret);padding:4px 0}
.barre-outils{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.barre-outils .compte{font-size:13px;color:var(--gris);font-weight:700;background:var(--menthe-pale);padding:8px 16px;border-radius:var(--rond)}
.barre-outils select{border:1.5px solid var(--ligne);border-radius:var(--rond);padding:9px 16px;background:#fff;font-size:13.5px;font-weight:600}
.vide{grid-column:1/-1;text-align:center;padding:50px 20px;color:var(--gris)}

.page-produit{display:grid;grid-template-columns:1fr;gap:26px;padding:20px 0 50px}
.produit-visuel{background:var(--menthe-pale);border:1px solid var(--ligne);border-radius:28px;padding:34px;display:flex;align-items:center;justify-content:center;min-height:340px;position:relative;overflow:hidden;cursor:zoom-in}
.produit-info h1{font-size:clamp(22px,3.2vw,30px);line-height:1.22;margin:6px 0 12px;font-weight:800;letter-spacing:-.8px;color:var(--foret)}
.produit-info .marque-lien{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:1.4px;color:var(--vert);background:var(--menthe-pale);padding:6px 14px;border-radius:var(--rond)}
.produit-info .prix{font-size:28px}
.produit-info .prix-ancien{font-size:16px}
.economie{display:inline-block;background:var(--corail);color:#fff;font-size:12.5px;font-weight:800;padding:4px 13px;border-radius:var(--rond);margin-left:8px}
.produit-meta{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--gris);margin:14px 0;padding:13px 0;border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne);font-weight:600}
.qte{display:inline-flex;align-items:center;border:1.5px solid var(--ligne);border-radius:var(--rond);overflow:hidden;background:#fff}
.qte button{width:44px;height:46px;font-size:19px;color:var(--foret);font-weight:700}
.qte button:hover{background:var(--menthe-pale)}
.qte input{width:50px;text-align:center;border:none;font-weight:800;font-size:15px;outline:none}
.achat-rangee{display:flex;gap:10px;margin:16px 0 10px;flex-wrap:wrap}
.achat-rangee .btn{flex:1;min-width:180px}
.onglets{margin-top:28px}
.onglets h2{font-size:16px;font-weight:800;color:var(--foret);margin:20px 0 8px;letter-spacing:-.3px}
.onglets p{color:var(--gris);font-size:14px;font-weight:500}
.note-livraison{background:var(--menthe-pale);border:1px solid var(--menthe);border-radius:var(--radius-lg);padding:14px 18px;font-size:13px;color:var(--foret);margin-top:16px;display:flex;gap:11px;align-items:center;font-weight:600}

.page-panier{padding:20px 0 50px}
.lignes-panier{display:flex;flex-direction:column;gap:12px}
.ligne-panier{display:grid;grid-template-columns:80px 1fr auto;gap:14px;background:var(--blanc);border:1px solid var(--ligne);border-radius:20px;padding:15px;align-items:center}
.ligne-panier .mini-visuel{background:var(--menthe-pale);border-radius:14px;padding:9px;height:80px;display:flex;align-items:center;justify-content:center}
.ligne-panier h3{font-size:13.5px;font-weight:700;line-height:1.35}
.ligne-panier .marque{font-size:10.5px;font-weight:800;text-transform:uppercase;color:var(--vert);letter-spacing:1px}
.ligne-panier .qte button{height:34px;width:34px;font-size:16px}
.ligne-panier .qte input{width:38px;font-size:14px}
.supprimer{color:var(--gris-clair);font-size:12.5px;text-decoration:underline;margin-top:6px;font-weight:600}
.supprimer:hover{color:var(--corail)}
.recap{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--radius-lg);padding:22px;align-self:start}
.recap h2{font-size:18px;margin-bottom:14px;font-weight:800;color:var(--foret);letter-spacing:-.4px}
.recap .ligne{display:flex;justify-content:space-between;font-size:14px;padding:6px 0;color:var(--gris);font-weight:600}
.recap .total{border-top:1.5px solid var(--ligne);margin-top:8px;padding-top:13px;font-size:18px;font-weight:800;color:var(--foret)}
.mention-gratuite{font-size:12.5px;color:var(--vert);font-weight:800;margin-top:7px;background:var(--menthe-pale);padding:8px 13px;border-radius:12px}
.formulaire{display:grid;gap:14px;margin-top:8px}
.champ label{display:block;font-size:13px;font-weight:700;margin-bottom:6px}
.champ input,.champ select,.champ textarea{width:100%;border:1.5px solid var(--ligne);border-radius:var(--radius);padding:12px 16px;background:var(--creme);outline:none;transition:all .15s;font-weight:500}
.champ input:focus,.champ select:focus,.champ textarea:focus{border-color:var(--foret);background:#fff}
.champ .erreur-msg{display:none;color:var(--corail-fonce);font-size:12px;margin-top:4px;font-weight:600}
.champ.invalide input,.champ.invalide select{border-color:var(--corail)}
.champ.invalide .erreur-msg{display:block}
.confirmation{background:var(--foret);border-radius:28px;padding:34px 24px;text-align:center;color:#fff}
.confirmation h2{color:#fff;margin-bottom:8px;font-weight:800;letter-spacing:-.5px}
.confirmation p{color:#CDE9D6;font-size:14.5px;margin-bottom:18px;font-weight:500}

.page-texte{max-width:760px;margin:0 auto;padding:26px 16px 56px}
.page-texte h1{font-size:clamp(28px,4.6vw,40px);color:var(--foret);margin-bottom:16px;font-weight:800;letter-spacing:-1.2px}
.page-texte h2{font-size:20px;margin:28px 0 10px;font-weight:800;color:var(--foret);letter-spacing:-.4px}
.page-texte p{color:var(--gris);margin-bottom:12px;font-weight:500}
.page-texte ul{list-style:disc;padding-left:22px;color:var(--gris);margin-bottom:12px;font-weight:500}
.faq-item{background:var(--blanc);border:1px solid var(--ligne);border-radius:18px;margin-bottom:10px;overflow:hidden;transition:border .15s}
.faq-item[open]{border-color:var(--menthe-vive)}
.faq-item summary{padding:16px 20px;font-weight:700;font-size:14.5px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;list-style:none;gap:12px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:22px;color:var(--vert);font-weight:400;flex-shrink:0}
.faq-item[open] summary::after{content:"−"}
.faq-item .reponse{padding:0 20px 17px;color:var(--gris);font-size:14px;font-weight:500}

.carte-contact{display:flex;gap:14px;align-items:center;background:var(--blanc);border:1px solid var(--ligne);border-radius:20px;padding:18px;margin-bottom:12px;transition:all .18s}
.carte-contact:hover{transform:translateY(-2px);box-shadow:var(--ombre-hover)}
.carte-contact .ico{flex:0 0 48px;height:48px;border-radius:var(--rond);display:flex;align-items:center;justify-content:center;background:var(--menthe-pale);color:var(--foret)}
.carte-contact h3{font-size:14.5px;font-weight:800}
.carte-contact p{font-size:12.5px;color:var(--gris);font-weight:500}

.pied{background:var(--foret);color:#9CC7AC;margin-top:36px;border-radius:32px 32px 0 0}
.pied-in{display:grid;grid-template-columns:1fr;gap:28px;padding:44px 20px 30px;max-width:var(--maxw);margin:0 auto}
.pied p{font-size:13px;line-height:1.75;font-weight:500}
.pied h3{color:#fff;font-size:12px;text-transform:uppercase;letter-spacing:1.6px;margin-bottom:13px;font-weight:800}
.pied ul li{margin-bottom:9px}
.pied a{font-size:13.5px;font-weight:600}
.pied a:hover{color:var(--menthe-vive)}
.sociaux{display:flex;gap:10px;margin-top:16px}
.sociaux a{width:42px;height:42px;border-radius:var(--rond);background:rgba(191,239,201,.12);display:flex;align-items:center;justify-content:center;color:var(--menthe-vive);transition:all .15s}
.sociaux a:hover{background:var(--menthe-vive);color:var(--foret)}
.pied-bas{border-top:1px solid rgba(191,239,201,.16);text-align:center;font-size:12px;padding:17px;color:#6FA184;font-weight:600}

.flotteur-wa{position:fixed;right:16px;bottom:16px;z-index:80;width:58px;height:58px;border-radius:50%;background:var(--wa);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(18,140,75,.45);transition:transform .18s;border:3px solid #fff}
.flotteur-wa:hover{transform:scale(1.1)}

.toast{position:fixed;left:50%;bottom:88px;transform:translateX(-50%) translateY(20px);background:var(--foret);color:var(--menthe-vive);font-size:13.5px;font-weight:700;padding:13px 24px;border-radius:var(--rond);opacity:0;pointer-events:none;transition:all .25s;z-index:90;white-space:nowrap;box-shadow:var(--ombre-hover)}
.toast.visible{opacity:1;transform:translateX(-50%)}

@media(min-width:720px){
  .grille-cat{grid-template-columns:repeat(3,1fr)}
  .grille-produits{grid-template-columns:repeat(3,1fr)}
  .bande-confiance{grid-template-columns:repeat(4,1fr)}
  .grille-avis{grid-template-columns:repeat(2,1fr)}
  .page-produit{grid-template-columns:1fr 1fr}
  .page-panier .colonnes{display:grid;grid-template-columns:1.6fr 1fr;gap:22px;align-items:start}
  .pied-in{grid-template-columns:1.4fr 1fr 1fr 1.2fr}
  .hero{margin:14px auto 0;max-width:calc(var(--maxw) + 20px)}
  .hero-in{padding:64px 48px 60px}
}
@media(min-width:1024px){
  .page-boutique{grid-template-columns:255px 1fr}
  .filtre-bascule{display:none}
  .filtres .filtres-corps{display:block!important}
  .grille-avis{grid-template-columns:repeat(4,1fr)}
  .hero-in{flex-direction:row;align-items:center;justify-content:space-between;gap:40px}
  .hero-in > div:first-child{max-width:56%}
  .hero-cote{display:flex!important}
}
@media(min-width:1280px){
  .entete-bas{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:var(--parachou-cream);padding:0 22px}
  .nav-principale{display:flex;grid-column:2;justify-self:center;flex:0 0 auto;margin:0}
  .nav-secondaire{display:flex;grid-column:3;justify-self:end;align-items:center;gap:2px}
  .recherche{flex:1 1 560px;min-width:200px;max-width:560px;margin:0 auto}
  .actions-entete{margin-left:0}
  .logo img{height:52px}
  .burger{display:none}
}
@media(max-width:1023px){
  .filtres .filtres-corps{display:none}
  .filtres .filtres-corps.ouvert{display:block}
  .hero-cote{display:none!important}
}

/* ===== Ajouts : rupture de stock, avis, recherche instantanée ===== */
.carte-p .rupture{font-size:11.5px;color:var(--corail);font-weight:800}
.carte-p .rupture::before{content:"●";margin-right:4px;font-size:9px}

/* étoiles */
.etoiles{color:var(--etoile);letter-spacing:1px;white-space:nowrap}
.note-resume{display:inline-flex;align-items:center;gap:7px;margin:2px 0 6px;font-size:14px;color:var(--gris)}
.note-resume strong{color:var(--encre)}

/* section avis fiche produit */
.avis-section{border-top:1px solid var(--ligne);margin-top:10px}
.avis-grille{display:grid;grid-template-columns:1.5fr 1fr;gap:30px;align-items:start}
.avis-entete{display:flex;align-items:center;gap:14px;background:var(--menthe-pale);border-radius:var(--radius);padding:14px 18px;margin-bottom:16px}
.avis-moy{font-size:34px;font-weight:800;color:var(--foret);line-height:1}
.avis-compte{font-size:12.5px;color:var(--gris)}
.avis-item{border-bottom:1px solid var(--ligne);padding:14px 0}
.avis-item:last-child{border-bottom:none}
.avis-tete{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px}
.avis-date{color:var(--gris-clair);font-size:12px;margin-left:auto}
.avis-item p{color:var(--gris);font-size:14px;margin-top:4px}
.avis-vide{color:var(--gris);font-size:14px}
.avis-ok{background:var(--menthe-pale);color:var(--vert);border:1px solid var(--menthe);border-radius:var(--radius);padding:12px 16px;font-weight:600;margin-bottom:16px}
.avis-form{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--ombre)}
.avis-form h3{color:var(--foret);margin-bottom:12px}
.avis-form input[type=text],.avis-form textarea{width:100%;border:1.5px solid var(--ligne);border-radius:12px;padding:10px 14px;margin-bottom:10px;outline:none}
.avis-form input:focus,.avis-form textarea:focus{border-color:var(--foret)}
.avis-form .btn{width:100%}
.aide-avis{font-size:12px;color:var(--gris-clair);margin-top:8px;text-align:center}
.captcha-label{display:block;font-size:13px;color:var(--gris);margin-bottom:6px}
.captcha-label strong{color:var(--foret)}
.avis-form input#captcha{width:100%;border:1.5px solid var(--ligne);border-radius:12px;padding:10px 14px;margin-bottom:10px;outline:none}
.avis-form input#captcha:focus{border-color:var(--foret)}
.alerte-avis{background:var(--corail-pale);color:var(--corail-fonce);border-radius:10px;padding:8px 12px;font-size:13px;margin-bottom:10px}
.champ-piege{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
/* notation par étoiles (radios inversés en flex-row-reverse) */
.etoiles-choix{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;margin-bottom:10px}
.etoiles-choix input{position:absolute;opacity:0;width:0;height:0}
.etoiles-choix label{font-size:30px;color:var(--ligne);cursor:pointer;padding:0 2px;transition:color .12s;line-height:1}
.etoiles-choix input:checked ~ label,
.etoiles-choix label:hover,
.etoiles-choix label:hover ~ label{color:var(--etoile)}
@media(max-width:760px){.avis-grille{grid-template-columns:1fr}}

/* recherche instantanée façon Instagram (voir initRecherche dans js/app.js).
   overflow:visible : la règle de base .recherche avait overflow:hidden (pour
   les coins arrondis), ce qui coupait complètement la boîte de suggestions. */
.recherche{position:relative;overflow:visible}
.recherche-suggestions{position:absolute;top:calc(100% + 8px);left:0;right:0;min-width:320px;background:#fff;border:1px solid var(--ligne);border-radius:18px;box-shadow:0 18px 44px rgba(11,46,31,.20);z-index:60;display:none;max-height:min(72vh,560px);overflow-y:auto;overscroll-behavior:contain;padding:6px 0;text-align:start}
.recherche-suggestions.ouvert{display:block;animation:sugApparait .14s ease-out}
@keyframes sugApparait{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.sug-groupe{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px 4px;font-size:12px;font-weight:800;color:var(--foret);text-transform:uppercase;letter-spacing:.6px}
.sug-groupe .sug-nb{font-style:normal;font-weight:700;color:var(--gris-clair);margin-inline-start:4px}
.sug-ligne{display:flex;align-items:center}
.sug-lien{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:8px 16px;color:var(--encre);text-decoration:none}
.sug-lien:hover,.sug-lien.actif{background:var(--menthe-pale)}
.sug-av{width:44px;height:44px;flex-shrink:0;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--creme);border:1px solid var(--ligne)}
.sug-av img{width:100%;height:100%;object-fit:cover}
.sug-av-txt{color:#fff;font-weight:800;font-size:15px;border:none;letter-spacing:.3px}
.sug-av-ico{color:var(--foret)}
.sug-txt{min-width:0;display:flex;flex-direction:column;line-height:1.3}
.sug-titre{font-size:14px;font-weight:500;color:var(--encre);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sug-titre b{font-weight:800;color:var(--foret)}
.sug-sous{font-size:12.5px;color:var(--gris);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sug-sous .sug-prix{font-weight:800;color:var(--vert)}
.sug-sous s{color:var(--gris-clair)}
.sug-rupture{color:#C2410C;font-weight:700}
.recherche .recherche-suggestions button{background:none;color:var(--gris);width:auto;height:auto;margin:0;padding:0;border:none;border-radius:var(--rond);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
.recherche .recherche-suggestions .sug-effacer{font-size:12.5px;font-weight:700;color:var(--vert);text-transform:none;letter-spacing:0;padding:2px 4px}
.recherche .recherche-suggestions .sug-effacer:hover{text-decoration:underline}
.recherche .recherche-suggestions .sug-suppr{width:34px;height:34px;margin-inline-end:10px}
.recherche .recherche-suggestions .sug-suppr:hover{background:var(--menthe-pale);color:var(--foret)}
.sug-puces{display:flex;flex-wrap:wrap;gap:8px;padding:6px 16px 10px}
.sug-puce{padding:7px 14px;border-radius:var(--rond);background:var(--menthe-pale);color:var(--foret);font-size:13px;font-weight:700;text-decoration:none}
.sug-puce:hover{background:var(--menthe)}
.sug-ligne:last-child .sug-tout{border-top:1px solid var(--ligne);margin-top:6px;padding-top:12px;padding-bottom:12px}
.sug-tout .sug-titre{font-weight:700;color:var(--vert);white-space:normal}
.sug-tout .sug-av{width:36px;height:36px;margin-inline-start:4px;margin-inline-end:4px}
.sug-vide{padding:14px 16px 4px;color:var(--gris);font-size:13.5px;line-height:1.5}
@media(max-width:1023px){
  .recherche input{font-size:16px} /* évite le zoom automatique d'iOS quand on touche la barre */
  .recherche-suggestions{min-width:0;max-height:70vh;max-height:calc(100dvh - 150px);border-radius:16px}
}

/* codes promo (panier) */
.ligne.remise{color:var(--vert);font-weight:700}
.ligne.remise strong{font-family:monospace;font-size:12px}
.promo-bloc{display:flex;gap:8px;margin-top:12px}
.promo-bloc input{flex:1;border:1.5px solid var(--ligne);border-radius:12px;padding:9px 13px;text-transform:uppercase;outline:none;min-width:0}
.promo-bloc input:focus{border-color:var(--foret)}
.promo-bloc button{background:var(--foret);color:var(--menthe-vive);border-radius:12px;padding:9px 16px;font-weight:800;font-size:13px;white-space:nowrap}
.promo-bloc button:disabled{opacity:.5;cursor:wait}
.promo-msg{font-size:12.5px;margin-top:6px;min-height:16px}
.promo-msg.ok{color:var(--vert);font-weight:700}
.promo-msg.erreur{color:var(--corail-fonce);font-weight:600}

/* galerie multi-photos (fiche produit) */
.produit-galerie{display:flex;flex-direction:column;gap:12px}
.vignettes{display:flex;gap:10px;flex-wrap:wrap}
.vignette{width:62px;height:62px;border:2px solid var(--ligne);border-radius:12px;overflow:hidden;background:#fff;padding:2px;transition:border-color .15s}
.vignette img{width:100%;height:100%;object-fit:contain}
.vignette.actif{border-color:var(--foret)}
.vignette:hover{border-color:var(--menthe-vive)}

/* favoris (cœur) */
.carte-p-actions{position:absolute;top:10px;right:10px;z-index:3;display:flex;gap:6px}
@media(hover:hover){
  .carte-p-actions{opacity:0;transition:opacity .2s}
  .carte-p:hover .carte-p-actions,.carte-p:focus-within .carte-p-actions,.carte-p-actions:has(.actif){opacity:1}
}
.coeur{width:36px;height:36px;border-radius:var(--rond);background:rgba(255,255,255,.92);color:var(--gris-clair);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(11,46,31,.12);transition:transform .15s,color .15s}
.coeur:hover{transform:scale(1.1);color:var(--corail)}
.coeur.actif{color:var(--corail)}
.coeur.actif svg{fill:var(--corail)}
.badge-favoris{position:absolute;top:-3px;right:-3px;background:var(--corail);color:#fff;font-size:10.5px;font-weight:700;min-width:19px;height:19px;border-radius:var(--rond);display:flex;align-items:center;justify-content:center;padding:0 5px;border:2px solid #fff}
.btn-coeur{flex:0 0 auto;background:#fff;border:1.5px solid var(--ligne);color:var(--gris)}
.btn-coeur.actif{color:var(--corail);border-color:var(--corail)}
.btn-coeur.actif svg{fill:var(--corail)}
.btn-coeur .coeur-txt{margin-left:6px}

/* suivi de commande */
.suivi-grille{display:grid;grid-template-columns:340px 1fr;gap:24px;align-items:start;margin-top:8px}
.suivi-form{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--radius-lg);padding:22px;box-shadow:var(--ombre)}
.suivi-form label{display:block;font-weight:700;font-size:13px;margin:10px 0 5px;color:var(--foret)}
.suivi-form input{width:100%;border:1.5px solid var(--ligne);border-radius:12px;padding:11px 14px;outline:none}
.suivi-form input:focus{border-color:var(--foret)}
.suivi-erreur{margin-top:12px;background:var(--corail-pale);color:var(--corail-fonce);border-radius:10px;padding:10px 13px;font-size:13px;font-weight:600}
.suivi-resultat{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--radius-lg);padding:22px;box-shadow:var(--ombre)}
.suivi-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:18px}
.suivi-num{font-size:20px;font-weight:800;color:var(--foret);font-family:monospace}
.suivi-tete .badge{position:static}
.suivi-annulee{background:var(--corail-pale);color:var(--corail-fonce);border-radius:10px;padding:12px;font-weight:600}
.stepper{display:flex;justify-content:space-between;gap:6px;margin:6px 0 22px;position:relative}
.stepper::before{content:"";position:absolute;top:15px;left:8%;right:8%;height:3px;background:var(--ligne);z-index:0}
.step{display:flex;flex-direction:column;align-items:center;gap:7px;flex:1;position:relative;z-index:1}
.step-pastille{width:32px;height:32px;border-radius:50%;background:var(--ligne);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px}
.step.fait .step-pastille{background:var(--vert)}
.step-lib{font-size:11.5px;font-weight:700;color:var(--gris-clair);text-align:center}
.step.fait .step-lib{color:var(--foret)}
.suivi-detail{border-top:1px solid var(--ligne);padding-top:14px}
.suivi-detail h3{color:var(--foret);font-size:15px;margin-bottom:10px}
.suivi-ligne{display:flex;justify-content:space-between;font-size:14px;padding:5px 0;color:var(--gris)}
.suivi-ligne.total{border-top:1px solid var(--ligne);margin-top:6px;padding-top:10px;font-weight:800;color:var(--encre);font-size:16px}
.suivi-resultat .btn-wa{margin-top:16px;width:100%}
@media(max-width:760px){.suivi-grille{grid-template-columns:1fr}}

/* bannière promo accueil */
.banniere-accueil{display:block;background:linear-gradient(100deg,var(--corail),var(--corail-fonce));color:#fff;text-decoration:none}
.banniere-in{max-width:var(--maxw);margin:0 auto;padding:12px 16px;display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;text-align:center}
.banniere-txt strong{font-size:15px;font-weight:800}
.banniere-txt span{font-size:13.5px;opacity:.95;margin-left:8px}
.banniere-btn{background:#fff;color:var(--corail-fonce);font-weight:800;font-size:13px;padding:8px 18px;border-radius:var(--rond);white-space:nowrap}
.banniere-accueil:hover .banniere-btn{transform:translateY(-1px)}
@media(max-width:600px){.banniere-txt span{display:block;margin:2px 0 0}}

/* pagination */
.pagination{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;align-items:center;margin:28px 0 4px}
.pagination a,.pagination .pg-actif{min-width:40px;height:40px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;font-weight:700;font-size:14px;border:1.5px solid var(--ligne);background:#fff;color:var(--foret);transition:all .15s}
.pagination a:hover{border-color:var(--menthe-vive);background:var(--menthe-pale)}
.pagination .pg-actif{background:var(--foret);color:var(--menthe-vive);border-color:var(--foret)}
.pagination .pg-fleche{font-weight:800}
.pagination .pg-ell{padding:0 4px;color:var(--gris-clair);font-weight:800}
@media(max-width:520px){.pagination .pg-fleche{width:100%;order:1}}

/* alerte retour en stock (fiche produit) */
.alerte-stock{background:var(--menthe-pale);border:1px solid var(--menthe);border-radius:var(--radius);padding:16px 18px;margin-top:8px}
.alerte-stock strong{color:var(--foret);display:block;font-size:15px}
.alerte-stock p{color:var(--gris);font-size:13.5px;margin:4px 0 10px}
.alerte-stock form{display:flex;gap:8px;flex-wrap:wrap}
.alerte-stock input{flex:1;min-width:180px;border:1.5px solid var(--ligne);border-radius:12px;padding:10px 14px;outline:none;background:#fff}
.alerte-stock input:focus{border-color:var(--foret)}
.alerte-stock-msg{font-size:13px;font-weight:600;margin-top:8px}
.alerte-stock-msg.ok{color:var(--vert)}
.alerte-stock-msg.erreur{color:var(--corail-fonce)}

/* ---------- zoom loupe + lightbox sur l'image produit (fiche produit) ---------- */
.produit-zoom-lens{position:absolute;pointer-events:none;width:150px;height:150px;border:2px solid var(--vert);border-radius:12px;background-repeat:no-repeat;box-shadow:0 10px 30px rgba(11,46,31,.28);opacity:0;transition:opacity .12s;z-index:5}
.produit-visuel.zoom-actif .produit-zoom-lens{opacity:1}
.zoom-icone{position:absolute;right:14px;bottom:14px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.85);color:var(--foret);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(11,46,31,.18);pointer-events:none;z-index:3}
@media(max-width:760px),(hover:none){.produit-zoom-lens{display:none}}

.lightbox{position:fixed;inset:0;z-index:200;visibility:hidden}
.lightbox.ouvert{visibility:visible}
.lightbox-fond{position:absolute;inset:0;background:rgba(8,28,19,.88);opacity:0;transition:opacity .25s;cursor:zoom-out}
.lightbox.ouvert .lightbox-fond{opacity:1}
.lightbox-corps{position:relative;height:100%;display:flex;align-items:center;justify-content:center;padding:50px;pointer-events:none}
.lightbox-corps img{max-width:min(880px,90vw);max-height:84vh;object-fit:contain;border-radius:16px;background:#fff;opacity:0;transform:scale(.96);transition:all .25s;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.lightbox.ouvert .lightbox-corps img{opacity:1;transform:scale(1)}
.lightbox-fermer,.lightbox-nav{position:absolute;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;display:flex;align-items:center;justify-content:center;transition:background .15s;pointer-events:auto}
.lightbox-fermer:hover,.lightbox-nav:hover{background:rgba(255,255,255,.28)}
.lightbox-fermer{top:16px;right:16px;width:42px;height:42px}
.lightbox-nav{top:50%;transform:translateY(-50%);width:46px;height:46px}
.lightbox-prev{left:16px}
.lightbox-suiv{right:16px}
@media(max-width:640px){.lightbox-corps{padding:16px}.lightbox-nav{width:38px;height:38px}}

/* ---------- barre de partage (fiche produit) ---------- */
.partage{display:flex;align-items:center;gap:9px;margin:16px 0;flex-wrap:wrap}
.partage-label{font-size:12.5px;font-weight:700;color:var(--gris)}
.partage a,.partage button{width:38px;height:38px;border-radius:50%;background:var(--menthe-pale);color:var(--foret);display:flex;align-items:center;justify-content:center;transition:background .15s,transform .15s}
.partage a svg,.partage button svg{width:17px;height:17px}
.partage a:hover,.partage button:hover{background:var(--menthe);transform:translateY(-2px)}

/* ---------- comparateur de produits ---------- */
.comparer{width:36px;height:36px;border-radius:var(--rond);background:rgba(255,255,255,.92);color:var(--gris-clair);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(11,46,31,.12);transition:transform .15s,color .15s}
.comparer:hover{transform:scale(1.1);color:var(--vert)}
.comparer.actif{color:var(--vert)}
.badge-comparer{position:absolute;top:-3px;right:-3px;background:var(--corail);color:#fff;font-size:10.5px;font-weight:700;min-width:19px;height:19px;border-radius:var(--rond);display:flex;align-items:center;justify-content:center;padding:0 5px;border:2px solid #fff}
.btn-comparer{flex:0 0 auto;background:#fff;border:1.5px solid var(--ligne);color:var(--gris)}
.btn-comparer.actif{color:var(--vert);border-color:var(--vert)}
.btn-comparer .coeur-txt{margin-left:6px}

.comparateur-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:20px;border-radius:var(--radius-lg);box-shadow:var(--ombre)}
.table-comparer{width:100%;border-collapse:collapse;background:#fff;min-width:560px}
.table-comparer th,.table-comparer td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--ligne);vertical-align:top;font-size:13.5px}
.table-comparer thead th{background:var(--menthe-pale);min-width:190px;position:relative}
.table-comparer thead th a{display:block;font-weight:700;color:var(--foret);font-size:13.5px;line-height:1.35;margin-top:8px}
.table-comparer thead th a:hover{color:var(--vert)}
.table-comparer tbody th{font-weight:700;color:var(--foret);white-space:nowrap;background:var(--creme);font-size:12.5px}
.comparateur-visuel{background:var(--menthe-pale);border-radius:12px;height:100px;display:flex;align-items:center;justify-content:center;padding:8px}
.comparateur-retirer{position:absolute;top:8px;right:8px;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.85);color:var(--gris);font-size:13px;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.comparateur-retirer:hover{background:var(--corail-pale);color:var(--corail-fonce)}
.comparateur-actions{display:flex;gap:8px;align-items:center}
.comparateur-actions .btn{padding:9px 14px;font-size:12.5px;border-radius:var(--rond)}
.comparateur-actions .mini-wa{width:38px;height:38px;flex-shrink:0;background:var(--wa);color:#fff;border-radius:var(--rond);display:flex;align-items:center;justify-content:center;transition:transform .15s}
.comparateur-actions .mini-wa:hover{transform:scale(1.06)}
.comparateur-actions .mini-wa svg{width:16px;height:16px}
@media(max-width:600px){.table-comparer thead th{min-width:150px}}

/* ---------- diaporama vitrine (accueil) ---------- */
.diaporama{position:relative;width:100%;aspect-ratio:16/6;max-height:480px;min-height:200px;overflow:hidden;background:var(--menthe-pale)}
.diaporama-piste{position:relative;width:100%;height:100%}
.diaporama-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .5s ease;z-index:1}
.diaporama-slide.actif{opacity:1;visibility:visible;z-index:2}
.diaporama-slide img{width:100%;height:100%;object-fit:cover;display:block}
.diaporama-slide a{display:block;width:100%;height:100%;position:relative}
.diaporama-texte{position:absolute;left:0;bottom:0;right:0;padding:26px 44px;background:linear-gradient(0deg,rgba(8,28,19,.72),rgba(8,28,19,.1) 65%,transparent);color:#fff;display:flex;flex-direction:column;gap:6px;max-width:600px;pointer-events:none}
.diaporama-texte strong{font-size:clamp(18px,2.6vw,28px);font-weight:800;letter-spacing:-.5px;line-height:1.2}
.diaporama-texte span{font-size:14px;opacity:.94}
.diaporama-btn{display:inline-block;margin-top:6px;background:#fff;color:var(--foret);font-weight:800;font-size:13px;padding:9px 18px;border-radius:var(--rond);width:fit-content}
.diaporama-fleche{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.85);color:var(--foret);display:flex;align-items:center;justify-content:center;z-index:5;transition:background .15s,transform .15s}
.diaporama-fleche:hover{background:#fff;transform:translateY(-50%) scale(1.06)}
.diaporama-prev{left:16px}
.diaporama-suiv{right:16px}
.diaporama-puces{position:absolute;bottom:16px;right:22px;display:flex;gap:7px;z-index:5}
.diaporama-puce{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.55);transition:background .15s,transform .15s}
.diaporama-puce:hover{background:rgba(255,255,255,.8)}
.diaporama-puce.actif{background:#fff;transform:scale(1.25)}
@media(max-width:640px){
  .diaporama{aspect-ratio:4/3;max-height:340px}
  .diaporama-texte{padding:18px 22px}
  .diaporama-fleche{width:36px;height:36px}
  .diaporama-fleche svg{width:18px;height:18px}
  .diaporama-puces{right:16px;bottom:12px}
}

/* ---------- connexion / inscription ---------- */
.auth-page{padding:12px 16px 60px;max-width:480px}
.auth-carte{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--radius-lg);padding:26px 24px;box-shadow:var(--ombre);margin-top:18px}
.auth-carte form,.espace-carte form{display:flex;flex-direction:column;gap:14px}
.auth-carte label,.espace-carte label{display:block;font-weight:700;font-size:13px;margin-bottom:6px;color:var(--foret)}
.auth-carte input,.espace-carte input{width:100%;border:1.5px solid var(--ligne);border-radius:12px;padding:12px 15px;outline:none;font-size:15px;font-family:inherit;box-sizing:border-box}
.auth-carte input:focus,.espace-carte input:focus{border-color:var(--vert)}
.auth-carte .btn,.espace-carte .btn{margin-top:4px}
.auth-msg{font-size:13.5px;font-weight:600;padding:10px 14px;border-radius:10px;margin:0}
.auth-msg.erreur{background:var(--corail-pale);color:var(--corail-fonce)}
.auth-msg.ok{background:var(--menthe-pale);color:var(--foret)}
.auth-alt{text-align:center;margin-top:16px;font-size:13.5px;color:var(--gris)}
.auth-alt a{color:var(--vert);font-weight:700}
.auth-champ-double{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.auth-suivi{margin-top:14px;color:var(--gris);font-size:13px;text-align:center}
.auth-suivi a{color:var(--vert);font-weight:700}
#compte-chargement{padding:50px 0;text-align:center;color:var(--gris-clair);font-weight:600}

.civilite-choix{display:flex;gap:20px}
.civilite-opt{display:flex;align-items:center;gap:6px;font-weight:600;font-size:14px;color:var(--encre);cursor:pointer}
.civilite-opt input{width:auto;accent-color:var(--vert)}

.champ-mdp{position:relative;display:flex;align-items:center}
.champ-mdp input{padding-right:86px}
.btn-montrer{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:var(--menthe-pale);color:var(--foret);font-size:11px;font-weight:800;padding:7px 11px;border-radius:8px;text-transform:uppercase;letter-spacing:.3px;transition:background .15s}
.btn-montrer:hover{background:var(--menthe)}

.case-option{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--gris);font-weight:500;line-height:1.5;cursor:pointer}
.case-option input{width:auto;margin-top:3px;flex-shrink:0;accent-color:var(--vert)}
.case-option a{color:var(--vert);font-weight:700;text-decoration:underline}
.case-obligatoire{color:var(--encre)}

@media(max-width:520px){
  .auth-champ-double{grid-template-columns:1fr}
}

/* ---------- mon espace (compte.php et mon-compte.php partagent ces classes) ---------- */
.espace{padding:12px 16px 44px;max-width:var(--maxw)}
.espace-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;max-width:520px;margin-top:6px}
.espace-form > div{flex:1;min-width:200px}
.espace-form .btn{flex-shrink:0}
.espace-intro{max-width:560px;color:var(--gris);font-size:15px;font-weight:500;margin-top:16px;background:var(--menthe-pale);border-radius:var(--radius-lg);padding:18px 20px}
.espace-cartes{display:grid;grid-template-columns:1fr;gap:16px;margin-top:22px}
.espace-cartes-1{grid-template-columns:1fr}
.espace-carte{border-radius:var(--radius-lg);padding:22px;position:relative;background:var(--blanc);border:1px solid var(--ligne);box-shadow:var(--ombre)}
.ec-tag{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1.2px;opacity:.8}
.fidelite{background:var(--foret);color:#fff;border:none}
.fidelite .ec-tag{color:var(--menthe-vive)}
.fid-points{font-size:15px;margin:10px 0 2px}
.fid-points b{font-size:38px;font-weight:800;letter-spacing:-1px;color:var(--menthe-vive)}
.fid-palier{font-size:13.5px;color:#CDE9D6}
.fid-barre{height:8px;background:rgba(255,255,255,.15);border-radius:var(--rond);overflow:hidden;margin:14px 0 8px}
.fid-barre span{display:block;height:100%;background:var(--menthe-vive);border-radius:var(--rond);transition:width .3s}
.fid-info{font-size:13px;color:#CDE9D6;font-weight:500}
.fid-recompense{background:rgba(191,239,201,.16);border:1px solid rgba(191,239,201,.3);border-radius:12px;padding:11px 14px;font-size:13.5px;margin-top:12px}
.fid-recompense code,.parr-code code{background:#fff;color:var(--foret);font-weight:800;padding:2px 9px;border-radius:6px;font-family:ui-monospace,monospace}
.parrainage{background:var(--blanc);border:1px solid var(--ligne);box-shadow:var(--ombre)}
.parrainage .ec-tag{color:var(--vert)}
.parrainage h3{font-size:18px;color:var(--foret);font-weight:800;letter-spacing:-.4px;margin:8px 0 6px}
.parrainage p{font-size:13.5px;color:var(--gris);font-weight:500}
.parr-code{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--menthe-pale);border-radius:12px;padding:12px 16px;margin:14px 0}
.parr-code span{font-size:12.5px;font-weight:700;color:var(--gris)}
.parr-code code{font-size:16px}
.parrainage .btn-wa{width:100%}
.espace-h2{font-size:20px;color:var(--foret);font-weight:800;letter-spacing:-.5px;margin:30px 0 14px}
.espace-h2 span{color:var(--gris-clair);font-size:14px}
.espace-historique{display:grid;grid-template-columns:1fr;gap:12px}
.hist-carte{background:var(--blanc);border:1px solid var(--ligne);border-radius:18px;padding:16px 18px}
.hist-tete{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.hist-num{font-weight:800;color:var(--foret);font-family:ui-monospace,monospace}
.hist-date{color:var(--gris-clair);font-size:13px}
.hist-lignes{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.hist-item{font-size:12.5px;background:var(--creme);border:1px solid var(--ligne);border-radius:var(--rond);padding:4px 11px;color:var(--gris);font-weight:600}
.hist-pied{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--ligne);padding-top:11px}
.hist-total{font-weight:800;color:var(--foret);font-size:16px}
.hist-reco{padding:9px 16px}
@media(min-width:760px){.espace-cartes{grid-template-columns:1fr 1fr}.espace-historique{grid-template-columns:1fr 1fr}.espace-cartes-1{grid-template-columns:1fr}}

/* ---------- mon-compte.php : profil + sécurité ---------- */
.profil-tete{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.compte-avatar-grand{flex-shrink:0;width:56px;height:56px;border-radius:50%;background:var(--foret);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800}
.profil-tete h3{font-size:17px;color:var(--foret);font-weight:800;margin:0 0 2px}
.profil-tete p{color:var(--gris);font-size:13.5px;margin:0}
.securite-carte h3{font-size:15px;color:var(--foret);font-weight:800;margin:0 0 14px}
.lien-deconnexion{display:block;width:100%;text-align:center;margin-top:16px;background:none;border:none;color:var(--gris);font-weight:700;font-size:13px;cursor:pointer;padding:8px}
.lien-deconnexion:hover{color:var(--corail-fonce)}

/* =====================================================================
   ACCUEIL v2 — grand bandeau (titre + recherche à gauche, photo à droite,
   carte promo défilante), bande de confiance en surimpression, marques.
   Inspiré des sites "vitrine" type oo2.fr. RTL : voir css/rtl.css.
   ===================================================================== */
.ah{position:relative;background:#F5F2EA}
.ah::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 70% at 18% 30%,rgba(143,227,166,.18),transparent 70%);pointer-events:none}
.ah-in{position:relative;max-width:var(--maxw);margin:0 auto;padding:46px 22px 112px}
.ah-texte{position:relative;z-index:2;max-width:600px}
.ah-pastille{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--ligne);color:var(--foret-3);font-size:12.5px;font-weight:700;padding:7px 15px;border-radius:var(--rond);box-shadow:0 4px 14px rgba(11,46,31,.06)}
.ah-pastille .point{width:7px;height:7px;border-radius:50%;background:var(--vert);box-shadow:0 0 0 4px rgba(21,154,82,.16)}
.ah-titre{margin:20px 0 14px;color:var(--foret);font-size:clamp(34px,3.7vw,50px);line-height:1.1;letter-spacing:-1.2px}
.ah-titre span{display:block}
/* contraste de graisse (normal / gras / normal), sans italique : plus sobre et pro */
.ah-titre .l1,.ah-titre .l3{font-weight:400}
.ah-titre .l2{font-weight:800;letter-spacing:-1.4px}
.ah-sous{font-size:17px;line-height:1.6;color:var(--gris);max-width:500px;font-weight:500;margin:0 0 24px}

.ah-recherche{position:relative;z-index:30;display:flex;align-items:center;gap:4px;background:#fff;border:1.5px solid var(--ligne);border-radius:18px;padding:7px 7px 7px 18px;box-shadow:0 18px 44px rgba(11,46,31,.13);transition:border-color .2s,box-shadow .2s}
.ah-recherche:focus-within{border-color:var(--vert);box-shadow:0 18px 48px rgba(21,154,82,.2)}
.ah-loupe{display:flex;color:var(--gris-clair);flex-shrink:0}
.ah-recherche input{flex:1;min-width:0;border:none;outline:none;background:transparent;padding:14px 10px;font-size:16.5px;color:var(--foret)}
.ah-recherche input::placeholder{color:var(--gris-clair)}
.ah-recherche input::-webkit-search-cancel-button{cursor:pointer}
.ah-recherche > button{display:inline-flex;align-items:center;gap:8px;flex-shrink:0;background:var(--foret);color:#fff;font-weight:700;font-size:15px;padding:14px 22px;border-radius:13px;transition:background .2s}
.ah-recherche > button:hover{background:var(--vert)}
.ah-recherche .recherche-suggestions{top:calc(100% + 10px)}

.ah-cartes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.ah-carte{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--ligne);border-radius:16px;padding:14px 16px;color:var(--foret);transition:transform .18s,box-shadow .18s,border-color .18s}
.ah-carte:hover{transform:translateY(-2px);box-shadow:var(--ombre-hover);border-color:var(--menthe-vive)}
.ah-carte-ico{flex:0 0 46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;color:#fff}
.ah-ico-vert{background:var(--vert)}
.ah-ico-corail{background:var(--corail)}
.ah-carte-txt{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.ah-carte-txt strong{font-size:15px;font-weight:800}
.ah-carte-txt small{font-size:13px;color:var(--vert);font-weight:700}

/* La photo reste dans une zone centrée de 1480 px max : sur grand écran (ou
   navigateur dézoomé), elle ne part plus coller au bord droit de la fenêtre. */
.ah-visuel{position:absolute;top:0;bottom:0;right:max(0px,calc((100% - 1480px) / 2));width:calc(min(100%,1480px) * .57)}
.ah-photo{position:absolute;inset:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34%);mask-image:linear-gradient(90deg,transparent 0,#000 34%)}
.ah-photo img{width:100%;height:100%;object-fit:cover;object-position:70% 22%;transform:scaleX(-1)} /* visage vers ~70 % de la largeur, quelle que soit la taille d'écran */
.ah-flottant{position:absolute;top:44px;right:7%;display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.92);color:var(--foret);font-size:13px;font-weight:700;padding:9px 15px;border-radius:var(--rond);box-shadow:0 10px 26px rgba(11,46,31,.14);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ah-flottant svg{color:var(--vert)}

.ah-promo{position:absolute;left:19%;bottom:92px;width:min(340px,62%);background:var(--foret);border-radius:20px;padding:12px 12px 10px;box-shadow:0 24px 54px rgba(11,46,31,.35)}
.ah-promo-piste{display:grid}
.ah-promo-slide{grid-area:1/1;display:flex;gap:14px;align-items:center;color:#fff;opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s}
.ah-promo-slide.actif{opacity:1;visibility:visible}
a.ah-promo-slide:hover .ah-promo-btn{text-decoration:underline}
.ah-promo-img{flex:0 0 84px;height:84px;border-radius:13px;overflow:hidden;background:var(--menthe-pale);display:flex;align-items:center;justify-content:center}
.ah-promo-img img{width:100%;height:100%;object-fit:cover;object-position:85% 50%} /* visuels du diaporama : sujet à droite */
.ah-promo-img-produit img,.ah-promo-img-produit svg{object-fit:contain;max-height:84px}
.ah-promo-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.ah-promo-tag{align-self:flex-start;background:var(--corail);color:#fff;font-size:10.5px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;padding:3px 9px;border-radius:6px;margin-bottom:2px}
.ah-promo-txt strong{font-size:15px;font-weight:800;line-height:1.25}
.ah-promo-desc{font-size:12.5px;color:#BFD9C8;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ah-promo-btn{font-size:13px;font-weight:700;color:var(--menthe-vive);margin-top:2px}
.ah-promo-puces{display:flex;gap:6px;justify-content:center;margin-top:11px}
.ah-promo-puces button{width:7px;height:7px;border-radius:99px;background:rgba(255,255,255,.3);transition:width .25s,background .25s;padding:0}
.ah-promo-puces button.actif{width:22px;background:var(--menthe-vive)}

.ah-confiance-wrap{position:relative;margin-top:-58px}
.ah-confiance{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#fff;border:1px solid var(--ligne);border-radius:22px;padding:18px 10px;box-shadow:0 18px 44px rgba(11,46,31,.10)}
.ah-confiance .item-confiance{padding:6px 16px;align-items:center}
.ah-confiance .item-confiance + .item-confiance{border-left:1px solid var(--ligne)}
.ah-confiance .item-confiance .ico{flex-basis:44px;height:44px;background:var(--menthe-pale);color:var(--vert)}
.ah-confiance .item-confiance h3{color:var(--foret);font-size:14px;font-weight:800}
.ah-confiance .item-confiance p{color:var(--gris);font-size:12.5px;line-height:1.45}

.ah-marques{padding:34px 0 8px}
.ah-marques-in{display:flex;align-items:center;gap:28px}
.ah-marques-label{flex:0 0 auto;display:flex;flex-direction:column;padding-right:28px;border-right:1px solid var(--ligne);line-height:1.3}
.ah-marques-label strong{font-size:19px;font-weight:800;color:var(--foret);letter-spacing:-.3px}
.ah-marques-label span{font-size:12.5px;color:var(--gris);font-weight:600}
.ah-marques .marquee-marques{flex:1;min-width:0}
.ah-marques .pilule-marque{background:#fff}

@media(min-width:1481px){
  /* zone photo ne touchant plus le bord : fondu aussi côté droit */
  .ah-photo{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34%,#000 86%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 34%,#000 86%,transparent 100%)}
}
@media(max-width:1100px){
  .ah-texte{max-width:500px}
  .ah-visuel{width:54%}
  .ah-flottant{display:none}
}
@media(max-width:900px){
  .ah{min-height:0}
  .ah::before{background:radial-gradient(90% 50% at 20% 10%,rgba(143,227,166,.2),transparent 70%)}
  .ah-in{padding:34px 16px 24px}
  .ah-texte{max-width:none}
  .ah-titre{font-size:clamp(30px,7.6vw,42px);margin:18px 0 12px;letter-spacing:-.8px}
  .ah-sous{font-size:15.5px;margin-bottom:20px}
  .ah-recherche{padding:5px 5px 5px 14px;border-radius:16px}
  .ah-recherche input{padding:12px 6px;font-size:16px}
  .ah-recherche > button{padding:13px 15px}
  .ah-btn-txt{display:none}
  .ah-cartes{gap:10px}
  .ah-carte{padding:12px;gap:11px;border-radius:14px}
  .ah-carte-ico{flex-basis:40px;height:40px;border-radius:11px}
  .ah-carte-txt strong{font-size:14px}
  .ah-carte-txt small{font-size:12px}
  .ah-visuel{position:relative;right:auto;width:auto;height:min(92vw,400px);margin:4px 16px 0}
  .ah-photo{border-radius:24px;-webkit-mask-image:none;mask-image:none}
  .ah-photo img{object-position:50% 20%}
  .ah-flottant{display:inline-flex;top:14px;right:14px;font-size:12px;padding:7px 12px}
  .ah-promo{left:12px;right:12px;width:auto;bottom:-56px}
  .ah-confiance-wrap{margin-top:0;padding-top:80px}
  .ah-confiance{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:14px;padding:14px 4px}
  .ah-confiance .item-confiance{padding:4px 10px;align-items:flex-start}
  .ah-confiance .item-confiance:nth-child(3){border-left:none}
  .ah-confiance .item-confiance .ico{flex-basis:38px;height:38px}
  .ah-marques{padding-top:26px}
  .ah-marques-in{flex-direction:column;align-items:stretch;gap:12px}
  .ah-marques-label{padding-right:0;border-right:none;text-align:center}
  /* accueil : la grande barre du bandeau remplace celle de l'en-tête tant
     qu'elle est à l'écran (évite deux barres empilées sur téléphone) ;
     l'en-tête la réaffiche dès qu'on a défilé plus bas (js : initPromoAccueil). */
  body[data-page="accueil"]:not(.ah-rech-cachee) .entete .recherche{display:none}
}
@media(max-width:420px){
  .ah-carte{flex-direction:column;align-items:flex-start;gap:8px}
  .ah-promo-img{flex-basis:76px;height:76px}
  .ah-promo-txt strong{font-size:14.5px}
  .ah-confiance .item-confiance{flex-direction:column;gap:6px}
}
@media (prefers-reduced-motion:reduce){.ah-promo-slide{transition:none}}


/* =====================================================================
   MÉGA-MENUS de la barre de navigation (ordinateur ≥ 1280 px) — voir
   inc/mega-menu.php et initMegaMenu() dans js/app.js. Les panneaux sont
   positionnés par rapport à .entete-bas (centrés sous la barre).
   ===================================================================== */
.nav-mega-lien{display:flex!important;align-items:center;gap:5px}
.nav-mega-lien .chevron{transition:transform .2s;opacity:.7}
.nav-mega.ouvert > .nav-mega-lien{background:rgba(14,59,46,.08)}
.nav-mega.ouvert > .nav-mega-lien.actif{background:var(--parachou-green)}
.nav-mega.ouvert > .nav-mega-lien.promo-lien{background:var(--corail-pale)}
.nav-mega.ouvert .chevron{transform:rotate(180deg)}

.mega{position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%,10px);width:min(1080px,calc(100vw - 48px));display:grid;grid-template-columns:270px minmax(0,1fr);gap:30px;background:#fff;border:1px solid var(--ligne);border-radius:24px;box-shadow:0 32px 80px rgba(11,46,31,.20),0 4px 14px rgba(11,46,31,.06);padding:18px 30px 18px 18px;z-index:80;opacity:0;visibility:hidden;transition:opacity .18s,transform .22s,visibility .18s;text-align:start}
.mega-etroit{width:min(900px,calc(100vw - 48px))}
.mega::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
.nav-mega.ouvert > .mega{opacity:1;visibility:visible;transform:translate(-50%,0)}

.mega-carte{position:relative;background:var(--foret);color:#fff;border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:10px;overflow:hidden;min-height:300px}
.mega-carte::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-90px;bottom:-110px;background:rgba(143,227,166,.12);pointer-events:none}
.mega-carte-visuel{height:150px;border-radius:13px;overflow:hidden;background:#fff;margin-bottom:4px}
.mega-carte-visuel img{width:100%;height:100%;object-fit:cover}
.mega-carte-ico{width:56px;height:56px;border-radius:16px;background:rgba(143,227,166,.16);color:var(--menthe-vive);display:flex;align-items:center;justify-content:center;margin:6px 0 8px}
.mega-carte-ico svg{width:28px;height:28px}
.mega-carte strong{font-size:21px;font-weight:800;line-height:1.2;letter-spacing:-.4px}
.mega-carte p{font-size:13.5px;line-height:1.55;color:#C9E4D3;margin:0;font-weight:500}
.nav-principale .mega-carte .mega-carte-btn{margin-top:auto;position:relative;z-index:1;display:block;text-align:center;background:var(--menthe-vive);color:var(--foret);font-weight:800;font-size:14px;padding:12px 16px;border-radius:12px;white-space:normal;transition:background .2s,transform .2s}
.nav-principale .mega-carte .mega-carte-btn:hover{background:#fff;transform:translateY(-1px)}
.mega-carte-corail{background:linear-gradient(160deg,#FF6A46,var(--corail-fonce))}
.mega-carte-corail::after{background:rgba(255,255,255,.12)}
.mega-carte-corail p{color:#FFE3DA}
.nav-principale .mega-carte-corail .mega-carte-btn{background:#fff;color:var(--corail-fonce)}
.nav-principale .mega-carte-corail .mega-carte-btn:hover{background:var(--corail-pale)}
.mega-chiffre{font-size:64px;font-weight:800;line-height:.95;letter-spacing:-3px;margin:8px 0 6px}
.mega-chiffre small{display:block;font-size:14px;font-weight:700;letter-spacing:0;opacity:.85;margin-bottom:4px}

.mega-corps{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:30px;padding:14px 0 6px}
.mega-corps-1{grid-template-columns:minmax(0,1fr)}
.mega-col{min-width:0}
.mega-col + .mega-col{border-inline-start:1px solid var(--ligne);padding-inline-start:26px}
.mega-titre{font-size:11.5px;font-weight:800;letter-spacing:1.3px;text-transform:uppercase;color:var(--vert);margin:0 0 12px}
.mega-liste{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.mega-liste-2{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}
.nav-principale .mega-liste a{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:12px;color:var(--encre);font-weight:700;font-size:14.5px;line-height:1.3;white-space:normal;background:none}
.nav-principale .mega-liste a:hover{background:var(--menthe-pale);color:var(--foret)}
.mega-ico{flex:0 0 38px;height:38px;border-radius:11px;background:var(--menthe-pale);color:var(--vert);display:flex;align-items:center;justify-content:center;transition:background .18s,color .18s}
.nav-principale .mega-liste a:hover .mega-ico{background:var(--vert);color:#fff}
.mega-ico-plein{background:var(--foret);color:var(--menthe-vive)}
.mega-ico-corail{background:var(--corail-pale);color:var(--corail-fonce)}
.nav-principale .mega-liste a:hover .mega-ico-corail{background:var(--corail);color:#fff}
.mega-ico-wa{background:#E3F8EC;color:var(--wa-fonce)}
.nav-principale .mega-liste a:hover .mega-ico-wa{background:var(--wa);color:#fff}
.mega-txt{display:flex;flex-direction:column;min-width:0}
.mega-txt small{font-size:12.5px;font-weight:500;color:var(--gris);margin-top:1px}
.mega-nom{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13.5px}
.mega-txt small b{color:var(--foret);font-weight:800}
.mega-txt small s{color:var(--gris-clair)}
.mega-txt small em{font-style:normal;font-weight:800;color:var(--corail-fonce)}
.mega-vignette{flex:0 0 56px;height:56px;border-radius:12px;background:var(--menthe-pale);display:flex;align-items:center;justify-content:center;overflow:hidden;padding:4px}
.mega-vignette img,.mega-vignette svg{max-width:100%;max-height:100%;object-fit:contain}
.mega-produits-ligne .mega-nom{-webkit-line-clamp:1}
.mega-produits-ligne .mega-txt small{white-space:nowrap}
.mega-produits-ligne .mega-txt small em{margin-inline-start:4px;background:var(--corail-pale);padding:1px 7px;border-radius:99px}
.mega-produits .mega-txt small em.mega-eco{display:block;font-weight:700;font-size:12px}
.nav-principale .mega-marques a{font-weight:700;font-size:14px;padding:8px 10px;gap:10px}
.mega-point{width:9px;height:9px;border-radius:50%;flex-shrink:0;box-shadow:0 0 0 3px rgba(11,46,31,.05)}
.nav-principale .mega-liste a.mega-tout{color:var(--vert);font-weight:800;font-size:13.5px;margin-top:4px}

.mega-fermer{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--gris);transition:background .18s,color .18s}
.mega-fermer:hover{background:var(--menthe-pale);color:var(--foret)}

.nav-secondaire a.nav-cta{display:inline-flex;align-items:center;gap:7px;background:var(--foret);color:#fff;padding:9px 16px}
.nav-secondaire a.nav-cta:hover{background:var(--vert)}
.nav-secondaire a.nav-cta svg{width:17px;height:17px;color:var(--menthe-vive)}
.mega-bascule .mega{transition:none}
@media (prefers-reduced-motion:reduce){.mega{transition:none}}


/* =====================================================================
   CARTES PRODUIT — style vitrine épuré (inspiré de typology.com) :
   3 par ligne sur ordinateur et tablette, 2 sur téléphone ; grande tuile
   claire, produit centré, nom en gras puis « marque — prix ». Remplace
   l'ancienne carte (bordure, fond menthe, boutons toujours visibles).
   Balisage : carteProduit() (inc/fonctions.php) et carteProduitJS().
   ===================================================================== */
.grille-produits{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 12px}
@media(min-width:720px){.grille-produits{grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 20px}}
.carte-p{background:none;border:none;border-radius:0;overflow:visible}
.carte-p:hover{box-shadow:none;transform:none;border-color:transparent}
.carte-p .visuel{position:relative;height:auto;aspect-ratio:1/1.08;padding:0;background:#F3F1EC;border-radius:6px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.carte-p .visuel img{width:auto;height:auto;max-width:70%;max-height:76%;object-fit:contain;mix-blend-mode:multiply;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.carte-p .visuel > svg{width:58%;height:auto;max-height:70%;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.carte-p:hover .visuel img,.carte-p:hover .visuel > svg{transform:scale(1.05)}
.carte-p .badge{top:14px;left:14px;font-size:10.5px;letter-spacing:.7px;text-transform:uppercase;padding:5px 11px;box-shadow:none}
.carte-p .badge-best{background:#fff;color:var(--foret)}
.carte-p .badge-nouveau{background:var(--foret);color:#fff;border:none}
.carte-p-actions{top:12px;right:12px}
.carte-p .corps{padding:16px 2px 0;gap:6px;flex:1}
.carte-p h3{font-size:15.5px;font-weight:800;line-height:1.35;color:var(--encre);letter-spacing:-.2px;flex:0}
.carte-p h3 a{color:inherit}
.carte-p h3 a:hover{text-decoration:underline;text-underline-offset:3px}
.carte-p .carte-p-ligne{margin:0;font-size:14.5px;line-height:1.5;color:var(--gris);font-weight:500}
.carte-p .carte-p-ligne .marque{font-size:inherit;font-weight:500;text-transform:none;letter-spacing:0;color:var(--gris)}
.carte-p .carte-p-ligne .prix{font-size:15px;font-weight:800;color:var(--foret);letter-spacing:-.2px}
.carte-p .carte-p-ligne .prix-ancien{font-size:13px;margin-left:4px}
.carte-p .rupture{margin-top:2px}
.carte-p-rupture .visuel img,.carte-p-rupture .visuel > svg{opacity:.55}
.carte-p .boutons{position:absolute;left:12px;right:12px;bottom:12px;margin:0;z-index:3;display:flex;gap:8px;transition:opacity .25s,transform .25s}
.carte-p .ajout-suite{margin-inline-start:.3em}
.carte-p .boutons .btn{flex:1;gap:0;padding:12px 14px;font-size:13.5px;font-weight:700;border-radius:var(--rond);background:var(--foret);color:#fff;box-shadow:0 8px 20px rgba(11,46,31,.18)}
.carte-p .boutons .btn:hover{background:var(--vert)}
.carte-p .boutons .btn[disabled]{background:#9AA9A1;cursor:not-allowed;box-shadow:none}
.carte-p .boutons .mini-wa{flex:0 0 44px;height:44px;box-shadow:0 8px 20px rgba(37,211,102,.25)}
@media(hover:hover){
  .carte-p .boutons{opacity:0;transform:translateY(10px)}
  .carte-p:hover .boutons,.carte-p:focus-within .boutons{opacity:1;transform:none}
}
@media(max-width:719px){
  .carte-p .visuel{border-radius:4px}
  .carte-p .badge{top:8px;left:8px;font-size:9.5px;padding:4px 8px}
  .carte-p-actions{top:6px;right:6px;gap:4px}
  .carte-p-actions .coeur,.carte-p-actions .comparer{width:32px;height:32px}
  .carte-p .boutons{left:8px;right:8px;bottom:8px;gap:6px}
  .carte-p .boutons .btn{padding:9px 8px;font-size:12px}
  .carte-p .boutons .mini-wa{flex-basis:36px;height:36px}
  .carte-p .ajout-suite{display:none}
  .carte-p h3{font-size:14px}
  .carte-p .carte-p-ligne{font-size:13px}
  .carte-p .carte-p-ligne .prix{font-size:14px}
}