/* ═══════════════════════════════════════════════════════════
   ONIVA SHOP v6 ULTIMATE — DESIGN SYSTEM
   Typographie: Poppins (display) + DM Sans (body)
   Palette: Noir profond + Or #D4A017 + Vert #1B5E20
   8 saisons Mali officielles
   Animations: CSS3 premium, jamais cheap
   WCAG AA · Mobile-first · Touch 48px+
═══════════════════════════════════════════════════════════ */


/* ── DARK MODE AUTO (system preference) ── */
@media(prefers-color-scheme:light){
  body:not(.force-dark):not(.s-rm):not(.s-tb):not(.s-ma):not(.s-h):not(.s-r):not(.s-f):not(.s-sf){
    --ink:#F4F7F4;--ink2:#EAF0EA;--ink3:#DDE8DD;
    --surf:rgba(0,0,0,.04);--surf2:rgba(0,0,0,.02);--surf3:rgba(0,0,0,.06);
    --line:rgba(0,0,0,.08);--line2:rgba(0,0,0,.04);
    --txt:#1A2E1A;--txt2:rgba(26,46,26,.72);--txt3:rgba(26,46,26,.45);--mute:rgba(26,46,26,.28);
  }
  body:not(.force-dark):not(.s-rm):not(.s-tb):not(.s-ma):not(.s-h):not(.s-r):not(.s-f):not(.s-sf){
    background:#F4F7F4;color:#1A2E1A;
  }
}
/* Force dark toggle */
body.force-dark{background:#080C08!important;color:#E8EDE8!important}\n/* ── FORCE LIGHT MODE ────────────────────────────────────── */\nbody.force-light{\n  background:#F4F7F4!important;color:#1A2E1A!important;\n}\nbody.force-light .nav-bar,body.force-light header,body.force-light .top-bar,\nbody.force-light .sticky-bar{background:#fff!important;border-color:rgba(0,0,0,.1)!important}\nbody.force-light .card,body.force-light .prod-card,body.force-light .p-card,\nbody.force-light .modal,body.force-light .drawer,body.force-light .panel{\n  background:#fff!important;border-color:rgba(0,0,0,.1)!important;color:#1A2E1A!important}\nbody.force-light .section,body.force-light section,body.force-light main{\n  background:#F4F7F4!important}\nbody.force-light h1,body.force-light h2,body.force-light h3,\nbody.force-light h4,body.force-light p,body.force-light span,\nbody.force-light label{color:#1A2E1A!important}\n/* Touch-action sur dm-btn pour eviter zoom mobile */\n.dm-btn{touch-action:manipulation!important;-webkit-tap-highlight-color:transparent!important}\n

/* ── RESET ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth;font-size:16px;-webkit-text-size-adjust:100%;height:100%}
body{font-family:'DM Sans',system-ui,sans-serif;background:#080C08;color:#E8EDE8;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6;min-height:100%}
::selection{background:rgba(212,160,23,.3);color:#fff}
::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:#0D120D}::-webkit-scrollbar-thumb{background:#2E7D32;border-radius:2px}
a{text-decoration:none;color:inherit}img{max-width:100%;display:block;height:auto}
button,input,select,textarea{font-family:'DM Sans',sans-serif}
button{cursor:pointer;border:none;background:none}
input,select,textarea{outline:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.1ms!important;animation-iteration-count:1!important}}

/* ── TOKENS ── */
:root{
  /* Brand */
  --grn:#1B5E20; --grn2:#2E7D32; --grn3:#388E3C; --grn4:#43A047;
  --grn-faint:rgba(27,94,32,.12); --grn-glass:rgba(27,94,32,.06);
  --gold:#D4A017; --gold2:#E8B824; --gold3:#F5C842; --gold4:#FFE680;
  --gold-faint:rgba(212,160,23,.14); --gold-glass:rgba(212,160,23,.07);
  /* Neutrals */
  --ink:#080C08; --ink2:#0D120D; --ink3:#141A14;
  --surf:#1A201A; --surf2:#202820; --surf3:#2A342A;
  --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.04);
  --txt:#E8EDE8; --txt2:rgba(232,237,232,.72); --txt3:rgba(232,237,232,.45); --mute:rgba(232,237,232,.28);
  /* Functional */
  --wa:#25D366; --wad:#1DAE56;
  --red:#EF5350; --blue:#42A5F5;
  /* Shadows */
  --sh1:0 2px 8px rgba(0,0,0,.4);
  --sh2:0 4px 20px rgba(0,0,0,.5);
  --sh3:0 8px 40px rgba(0,0,0,.6);
  --sh4:0 20px 60px rgba(0,0,0,.7);
  --sh-gold:0 4px 24px rgba(212,160,23,.28);
  --sh-grn:0 4px 20px rgba(27,94,32,.4);
  /* Radii */
  --r2:4px; --r4:8px; --r6:12px; --r8:16px; --r10:20px; --r12:24px; --rfull:9999px;
  /* Timing */
  --ease:cubic-bezier(.4,0,.2,1); --easeOut:cubic-bezier(0,0,.2,1); --spring:cubic-bezier(.34,1.56,.64,1);
  --t1:.12s; --t2:.22s; --t3:.35s; --t4:.5s;
  /* Typography */
  --display:'Poppins',sans-serif;
  /* Season vars (default: Hivernage) */
  --sb:#04101E; --sb2:#071828; --sb3:#0A2038;
  --sa:#3B8ED4; --sa2:#64AAEE; --sa3:#A0CCFF;
  --stext:#D8EEFF; --stext2:rgba(216,238,255,.68); --stext3:rgba(216,238,255,.38);
  --sline:rgba(59,142,212,.2); --stag:rgba(59,142,212,.16); --stagc:#64AAEE;
  --sgrad:linear-gradient(135deg,#04101E 0%,#071828 60%,#0A2038 100%);
  --scta:linear-gradient(135deg,#3B8ED4,#64AAEE);
}

/* ══════════════════════════════════════════════════
   SAISON THEMES — 8 SAISONS MALI OFFICIELLES
══════════════════════════════════════════════════ */

/* 1. HIVERNAGE (Juin–Sep) — pluies, bleu nuit, glassmorphisme */
.s-h{--sb:#04101E;--sb2:#071828;--sb3:#0A2038;--sa:#3B8ED4;--sa2:#64AAEE;--sa3:#A0CCFF;--stext:#D8EEFF;--stext2:rgba(216,238,255,.68);--stext3:rgba(216,238,255,.38);--sline:rgba(59,142,212,.2);--stag:rgba(59,142,212,.16);--stagc:#64AAEE;--sgrad:linear-gradient(135deg,#04101E,#071828 60%,#0A2038);--scta:linear-gradient(135deg,#3B8ED4,#64AAEE)}

/* 2. RENTRÉE (Sep–Oct) — ocre, bois, école */
.s-r{--sb:#130D00;--sb2:#1E1400;--sb3:#291B00;--sa:#C8900A;--sa2:#E0A820;--sa3:#F5C842;--stext:#FFF3D0;--stext2:rgba(255,243,208,.7);--stext3:rgba(255,243,208,.4);--sline:rgba(200,144,10,.22);--stag:rgba(200,144,10,.16);--stagc:#E0A820;--sgrad:linear-gradient(135deg,#130D00,#1E1400 60%,#291B00);--scta:linear-gradient(135deg,#C8900A,#E0A820)}

/* 3. FÊTES FIN D'ANNÉE (Déc–Jan) — noir & or, particules */
.s-f{--sb:#050505;--sb2:#0A0A0A;--sb3:#0F0F0F;--sa:#C8900A;--sa2:#E8B824;--sa3:#F5C842;--stext:#FFF8E0;--stext2:rgba(255,248,224,.72);--stext3:rgba(255,248,224,.40);--sline:rgba(212,160,23,.2);--stag:rgba(212,160,23,.15);--stagc:#E8B824;--sgrad:linear-gradient(135deg,#050505,#0A0A0A 60%,#0F0F0F);--scta:linear-gradient(90deg,#C8900A,#E8B824,#F5C842,#C8900A);background-size:200% auto}

/* 4. RAMADAN (Korité/Aïd el-Fitr — dates variables) — orange chaud, lanternes */
.s-rm{--sb:#150800;--sb2:#1E0E00;--sb3:#281500;--sa:#D06010;--sa2:#E88030;--sa3:#FFBA70;--stext:#FFECD8;--stext2:rgba(255,236,216,.7);--stext3:rgba(255,236,216,.4);--sline:rgba(208,96,16,.22);--stag:rgba(208,96,16,.16);--stagc:#E88030;--sgrad:linear-gradient(135deg,#150800,#1E0E00 60%,#281500);--scta:linear-gradient(135deg,#D06010,#E88030)}

/* 5. TABASKI (Aïd el-Adha — dates variables) — vert profond, mouton, sacrifice */
.s-tb{--sb:#001A08;--sb2:#002810;--sb3:#003618;--sa:#28A055;--sa2:#45C070;--sa3:#80E0A0;--stext:#D0FFE4;--stext2:rgba(208,255,228,.7);--stext3:rgba(208,255,228,.4);--sline:rgba(40,160,85,.22);--stag:rgba(40,160,85,.16);--stagc:#45C070;--sgrad:linear-gradient(135deg,#001A08,#002810 60%,#003618);--scta:linear-gradient(135deg,#28A055,#45C070)}

/* 6. MAOULOUD (Naissance+Baptême du Prophète — variables) — violet mystic, étoiles */
.s-ma{--sb:#0C0620;--sb2:#120930;--sb3:#180C42;--sa:#7B5AE0;--sa2:#9E80F5;--sa3:#C4ADFF;--stext:#EDE8FF;--stext2:rgba(237,232,255,.68);--stext3:rgba(237,232,255,.38);--sline:rgba(123,90,224,.22);--stag:rgba(123,90,224,.16);--stagc:#9E80F5;--sgrad:linear-gradient(135deg,#0C0620,#120930 60%,#180C42);--scta:linear-gradient(135deg,#7B5AE0,#9E80F5)}

/* 7. SAISON FROIDE (Nov–Fév) — brume dorée, nébleux, confort */
.s-sf{--sb:#0A0810;--sb2:#100E18;--sb3:#181420;--sa:#8B7CC0;--sa2:#B0A0E0;--sa3:#D4CCFF;--stext:#F0EEFF;--stext2:rgba(240,238,255,.7);--stext3:rgba(240,238,255,.4);--sline:rgba(139,124,192,.2);--stag:rgba(139,124,192,.15);--stagc:#B0A0E0;--sgrad:linear-gradient(135deg,#0A0810,#100E18 60%,#181420);--scta:linear-gradient(135deg,#8B7CC0,#B0A0E0)}

/* 8. SAISON CHAUDE (Mar–Mai) — ciel bleu clair, fraîcheur, brise */
.s-sc{--sb:#EAF6FF;--sb2:#D8EEFF;--sb3:#C4E4FF;--sa:#0068B8;--sa2:#2890E0;--sa3:#60B8F0;--stext:#001830;--stext2:rgba(0,24,48,.7);--stext3:rgba(0,24,48,.45);--sline:rgba(0,104,184,.16);--stag:rgba(0,104,184,.12);--stagc:#0068B8;--sgrad:linear-gradient(135deg,#EAF6FF,#D8EEFF 60%,#C4E4FF);--scta:linear-gradient(135deg,#0068B8,#2890E0)}

/* ── KEYFRAMES ── */
@keyframes fadeUp{0%{opacity:0;transform:translateY(28px)}100%{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}
@keyframes fadeScale{0%{opacity:0;transform:scale(.96)}100%{opacity:1;transform:scale(1)}}
@keyframes shimmer{0%{background-position:-400% center}100%{background-position:400% center}}
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes float{0%,100%{transform:translateY(0) rotate(0deg)}33%{transform:translateY(-8px) rotate(.5deg)}66%{transform:translateY(-4px) rotate(-.5deg)}}
@keyframes floatX{0%,100%{transform:translateX(0)}50%{transform:translateX(8px)}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.9)}}
@keyframes pulseGlow{0%,100%{box-shadow:0 0 0 0 rgba(212,160,23,.4)}60%{box-shadow:0 0 0 8px rgba(212,160,23,0)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes spinSlow{to{transform:rotate(360deg)}}
@keyframes waBounce{0%,100%{transform:scale(1) translateY(0)}40%{transform:scale(1.08) translateY(-3px)}70%{transform:scale(.97) translateY(1px)}}
/* Rain */
@keyframes rain{0%{transform:translateY(-20px) scaleY(.5);opacity:0}15%{opacity:.8}85%{opacity:.4}100%{transform:translateY(105vh) scaleY(1.3);opacity:0}}
@keyframes ripple{0%{transform:scale(0);opacity:.7}100%{transform:scale(5);opacity:0}}
@keyframes wave{0%,100%{transform:translateX(0) scaleY(1)}50%{transform:translateX(-2.5%) scaleY(1.04)}}
/* Particles */
@keyframes particle{0%{transform:translate(0,0) scale(1);opacity:0}10%{opacity:1}90%{opacity:.8}100%{transform:translate(var(--tx,30px),var(--ty,-120px)) scale(.2);opacity:0}}
@keyframes glow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.4)}}
@keyframes goldGlow{0%,100%{text-shadow:0 0 20px rgba(212,160,23,.3)}50%{text-shadow:0 0 40px rgba(212,160,23,.8),0 0 80px rgba(212,160,23,.3)}}
/* Lantern */
@keyframes lanternSway{0%,100%{transform:rotate(-5deg) translateY(0);filter:brightness(.9)}50%{transform:rotate(5deg) translateY(-8px);filter:brightness(1.1)}}
@keyframes lanternGlow{0%,100%{box-shadow:0 0 15px rgba(224,120,32,.3),0 0 50px rgba(224,120,32,.08)}50%{box-shadow:0 0 30px rgba(224,120,32,.6),0 0 80px rgba(224,120,32,.2)}}
@keyframes flicker{0%,95%,100%{opacity:1}96%{opacity:.7}97%{opacity:1}98%{opacity:.8}}
/* Stars */
@keyframes twinkle{0%,100%{opacity:.2;transform:scale(.8)}50%{opacity:1;transform:scale(1.3)}}
/* Sketch */
@keyframes draw{from{stroke-dashoffset:800;opacity:.3}to{stroke-dashoffset:0;opacity:1}}
/* Frost */
@keyframes frost{0%,100%{opacity:.15;transform:scale(1) rotate(0deg)}50%{opacity:.3;transform:scale(1.05) rotate(2deg)}}
/* Breeze */
@keyframes breeze{0%,100%{transform:translateX(0) translateY(0) rotate(0deg)}25%{transform:translateX(10px) translateY(-6px) rotate(1deg)}50%{transform:translateX(0) translateY(-10px) rotate(0deg)}75%{transform:translateX(-10px) translateY(-4px) rotate(-1deg)}}
/* Crescents */
@keyframes moonRise{from{transform:translateY(40px) rotate(-20deg);opacity:0}to{transform:translateY(0) rotate(0deg);opacity:1}}
/* Stars */
@keyframes starfield{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
/* Reveal */
@keyframes revealUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes revealLeft{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}
@keyframes countUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* ── LAYOUT ── */
.wrap{max-width:1360px;margin:0 auto;padding:0 24px}
.section{padding:80px 24px}
.section-sm{padding:56px 24px}
.section-xs{padding:40px 24px}

/* ══════════════════════════════════════════════
   SEASON SWITCHER
══════════════════════════════════════════════ */
.swb{background:#030503;border-bottom:1px solid rgba(255,255,255,.05);padding:7px 24px;position:relative;z-index:10}
.swb-in{max-width:1360px;margin:0 auto;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.swb-lbl{font-size:9px;font-weight:700;color:rgba(255,255,255,.3);letter-spacing:.14em;text-transform:uppercase;flex-shrink:0;margin-right:6px;white-space:nowrap}
.sbn{height:28px;padding:0 10px;border-radius:var(--rfull);border:1.5px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);color:rgba(255,255,255,.48);font-size:10.5px;font-weight:600;cursor:pointer;transition:all var(--t2) var(--ease);white-space:nowrap;display:flex;align-items:center;gap:4px;letter-spacing:.01em}
.sbn:hover{background:rgba(255,255,255,.09);color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.15)}
.sbn:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.sbn.on{background:var(--stag,rgba(212,160,23,.15));border-color:var(--stagc,rgba(212,160,23,.4));color:var(--stagc,#E8B824);font-weight:700}
.swb-auto{margin-left:auto;font-size:9px;color:rgba(255,255,255,.25);white-space:nowrap;flex-shrink:0}
.swb-auto b{color:var(--gold2)}

/* ══════════════════════════════════════════════
   TICKER
══════════════════════════════════════════════ */
.tkr{background:var(--grn2);height:32px;overflow:hidden;display:flex;align-items:center;position:relative}
.tkr::after{content:'';position:absolute;right:0;top:0;bottom:0;width:60px;background:linear-gradient(to left,var(--grn2),transparent);pointer-events:none;z-index:1}
.tkr-track{display:flex;animation:ticker 36s linear infinite;white-space:nowrap}
.tkr-track:hover{animation-play-state:paused}
.tkr-item{padding:0 32px;font-size:11.5px;font-weight:600;color:rgba(255,255,255,.88);display:flex;align-items:center;gap:12px;letter-spacing:.01em}
.tkr-dot{width:3px;height:3px;border-radius:50%;background:var(--gold2);flex-shrink:0;opacity:.7}

/* ══════════════════════════════════════════════
   NAVIGATION
══════════════════════════════════════════════ */
.nav{background:rgba(5,9,5,.92);backdrop-filter:blur(28px) saturate(180%);-webkit-backdrop-filter:blur(28px) saturate(180%);position:sticky;top:0;z-index:900;border-bottom:1px solid rgba(255,255,255,.06);transition:box-shadow var(--t3) var(--ease)}
.nav.scrolled{box-shadow:0 4px 32px rgba(0,0,0,.5)}
.nav-in{max-width:1360px;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:12px;height:66px}

/* Logo */
.logo{display:flex;align-items:center;gap:11px;flex-shrink:0;text-decoration:none;cursor:pointer}
.logo:focus-visible{outline:2px solid var(--gold2);outline-offset:3px;border-radius:var(--r4)}
.logo-emblem{width:44px;height:44px;border-radius:50%;border:2px solid var(--gold2);display:flex;align-items:center;justify-content:center;position:relative;flex-shrink:0;transition:border-color var(--t2) var(--ease)}
.logo-emblem svg{color:var(--grn3);transition:color var(--t2) var(--ease)}
.logo:hover .logo-emblem{border-color:var(--gold3)}
.logo-live{position:absolute;top:-1px;right:-1px;width:10px;height:10px;border-radius:50%;background:var(--gold2);border:2px solid rgba(5,9,5,.92)}
.logo-live::after{content:'';position:absolute;inset:-2px;border-radius:50%;background:var(--gold2);opacity:.4;animation:pulseGlow 2.4s ease-out infinite}
.logo-text .on{font-family:var(--display);font-size:19px;font-weight:900;color:#fff;letter-spacing:-.01em}
.logo-text .sh{font-family:var(--display);font-size:19px;font-weight:900;color:var(--gold2);letter-spacing:-.01em}
.logo-text .sl{display:block;font-size:7.5px;color:rgba(255,255,255,.32);letter-spacing:.12em;text-transform:uppercase;margin-top:1px}

/* Search */
.nav-srch{flex:1;max-width:420px;position:relative;margin:0 10px}
.nav-srch input{width:100%;height:44px;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.1);border-radius:var(--rfull);padding:0 16px 0 44px;font-size:13.5px;color:#fff;font-family:'DM Sans',sans-serif;transition:all var(--t2) var(--ease)}
.nav-srch input::placeholder{color:rgba(255,255,255,.38)}
.nav-srch input:focus{border-color:var(--gold2);background:rgba(255,255,255,.1);box-shadow:0 0 0 3px rgba(212,160,23,.14)}
.nav-srch-ico{position:absolute;left:14px;top:50%;transform:translateY(-50%);pointer-events:none;color:rgba(255,255,255,.4)}

/* Nav actions */
.nav-acts{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0}
.nbtn{height:44px;padding:0 16px;border-radius:var(--r6);font-size:13px;font-weight:700;display:flex;align-items:center;gap:6px;transition:all var(--t2) var(--ease);text-decoration:none;cursor:pointer;white-space:nowrap;letter-spacing:.01em}
.nbtn:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.nbtn-wa{background:var(--wa);color:#fff;box-shadow:0 3px 12px rgba(37,211,102,.25)}
.nbtn-wa:hover{background:var(--wad);transform:translateY(-1px);box-shadow:0 6px 20px rgba(37,211,102,.38)}
.nicon{width:44px;height:44px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--r6);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--t2) var(--ease);color:rgba(255,255,255,.72);text-decoration:none;position:relative;flex-shrink:0}
.nicon:hover{background:rgba(255,255,255,.12);color:#fff}
.nicon:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.cbadge{position:absolute;top:-4px;right:-4px;background:var(--gold2);color:#000;width:18px;height:18px;border-radius:50%;font-size:9px;font-weight:900;display:flex;align-items:center;justify-content:center;border:2px solid rgba(5,9,5,.92);font-family:var(--display)}
.spill{display:flex;align-items:center;gap:5px;background:var(--stag,rgba(212,160,23,.12));border:1px solid var(--sline,rgba(212,160,23,.2));border-radius:var(--rfull);padding:5px 13px;font-size:10.5px;font-weight:700;color:var(--stagc,var(--gold2));flex-shrink:0;transition:all var(--t3) var(--ease)}
.ham{display:none;width:44px;height:44px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--r6);flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;padding:0}
.ham span{display:block;width:18px;height:1.5px;background:#fff;border-radius:1px;transition:all var(--t2) var(--ease)}
.ham:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}

/* Category bar */
.catbar{background:var(--grn2)}
.catbar-in{max-width:1360px;margin:0 auto;padding:0 24px;display:flex;overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none;height:40px;align-items:center;gap:0}
.catbar-in::-webkit-scrollbar{display:none}
.cato{height:40px;padding:0 14px;font-size:12px;font-weight:600;color:rgba(255,255,255,.72);cursor:pointer;transition:all var(--t2) var(--ease);border-bottom:2.5px solid transparent;white-space:nowrap;background:none;letter-spacing:.01em}
.cato:hover,.cato.on{color:#fff;border-bottom-color:var(--gold2);background:rgba(255,255,255,.06)}
.cato:focus-visible{outline:2px solid var(--gold2);outline-offset:-2px}

/* Mobile menu */
.mmenu{display:none;position:fixed;inset:0;background:rgba(8,12,8,.98);backdrop-filter:blur(12px);z-index:2000;flex-direction:column;padding:72px 24px 32px;overflow-y:auto}
.mmenu.open{display:flex;animation:fadeIn var(--t3) var(--ease)}
.mm-close{position:absolute;top:13px;right:16px;width:44px;height:44px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:var(--r6);display:flex;align-items:center;justify-content:center;cursor:pointer;color:rgba(255,255,255,.7);font-size:18px;transition:all var(--t2) var(--ease)}
.mm-close:hover{background:rgba(255,255,255,.14);color:#fff}
.mm-section{font-size:9px;font-weight:700;color:rgba(255,255,255,.28);letter-spacing:.14em;text-transform:uppercase;padding:20px 0 8px;margin-top:8px;border-top:1px solid rgba(255,255,255,.06)}
.mm-section:first-child{border-top:none;padding-top:0;margin-top:0}
.mmenu a{color:rgba(255,255,255,.75);font-size:15px;font-weight:500;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.05);display:flex;align-items:center;gap:10px;min-height:48px;transition:color var(--t2) var(--ease)}
.mmenu a:hover{color:var(--gold2)}
.mm-gold{color:var(--gold2)!important;font-weight:700!important}

/* ══════════════════════════════════════════════
   HERO — SEASON ADAPTIVE
══════════════════════════════════════════════ */
.hero{position:relative;min-height:min(90vh,780px);display:flex;align-items:center;overflow:hidden;background:var(--sgrad,linear-gradient(135deg,#04101E,#071828 60%,#0A2038));transition:background var(--t4) var(--ease)}
/* subtle radial glow top-right */
.hero::before{content:'';position:absolute;top:-20%;right:-10%;width:60%;height:80%;background:radial-gradient(ellipse,rgba(var(--sa-raw,59,142,212),.08) 0%,transparent 70%);pointer-events:none;z-index:0}
/* bottom fade */
.hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:120px;background:linear-gradient(to bottom,transparent,var(--sb,#04101E));pointer-events:none;z-index:5}

/* grid texture */
.hero-grid{position:absolute;inset:0;pointer-events:none;z-index:1;background-image:linear-gradient(rgba(255,255,255,.024) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.024) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black 40%,transparent 100%)}
.s-sc .hero-grid{background-image:linear-gradient(rgba(0,80,160,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(0,80,160,.05) 1px,transparent 1px)}

/* ── animation layers ── */
.anim{position:absolute;inset:0;pointer-events:none;z-index:2}
/* Rain drops */
.rdrop{position:absolute;border-radius:2px;top:-60px;animation:rain linear infinite}
.rdrop:nth-child(1){left:4%;width:1.5px;height:55px;animation-duration:1.3s;opacity:.75}
.rdrop:nth-child(2){left:11%;width:1px;height:75px;animation-duration:1.65s;animation-delay:.22s;opacity:.55}
.rdrop:nth-child(3){left:19%;width:1.5px;height:48px;animation-duration:1.1s;animation-delay:.82s;opacity:.8}
.rdrop:nth-child(4){left:28%;width:1px;height:68px;animation-duration:1.52s;animation-delay:.38s;opacity:.6}
.rdrop:nth-child(5){left:37%;width:1.5px;height:50px;animation-duration:1.22s;animation-delay:1.1s;opacity:.7}
.rdrop:nth-child(6){left:46%;width:1px;height:78px;animation-duration:1.72s;animation-delay:.08s;opacity:.5}
.rdrop:nth-child(7){left:55%;width:1.5px;height:58px;animation-duration:1.42s;animation-delay:.6s;opacity:.85}
.rdrop:nth-child(8){left:64%;width:1px;height:45px;animation-duration:1.05s;animation-delay:.28s;opacity:.6}
.rdrop:nth-child(9){left:73%;width:1.5px;height:85px;animation-duration:1.82s;animation-delay:.95s;opacity:.5}
.rdrop:nth-child(10){left:81%;width:1px;height:52px;animation-duration:1.32s;animation-delay:.48s;opacity:.78}
.rdrop:nth-child(11){left:89%;width:1.5px;height:65px;animation-duration:1.55s;animation-delay:1.25s;opacity:.6}
.rdrop:nth-child(12){left:96%;width:1px;height:48px;animation-duration:1.18s;animation-delay:.72s;opacity:.72}
.rdrop{background:linear-gradient(to bottom,transparent,rgba(100,170,238,.7),rgba(140,200,255,.3))}
.wave-layer{position:absolute;bottom:-30px;left:-6%;right:-6%;pointer-events:none;z-index:3}
.wave-s{height:160px;border-radius:50% 50% 0 0/35% 35% 0 0;animation:wave ease-in-out infinite}
.wave-s:nth-child(1){background:rgba(59,142,212,.06);animation-duration:5s}
.wave-s:nth-child(2){background:rgba(100,170,238,.04);border-radius:45% 55% 0 0/30% 30% 0 0;animation-duration:7.5s;animation-direction:reverse;margin-top:-40px}
/* Canvas */
#festC{position:absolute;inset:0;z-index:2;pointer-events:none;will-change:transform}
/* Lanterns */
.lantern{position:absolute;pointer-events:none}
.lantern-body{width:26px;height:42px;border-radius:28% 28% 45% 45%;background:linear-gradient(to bottom,rgba(224,120,32,.85),rgba(240,160,64,.55));animation:lanternSway 4.2s ease-in-out infinite,lanternGlow 3.5s ease-in-out infinite,flicker 8s ease-in-out infinite}
.lantern-string{width:1.5px;height:18px;background:rgba(224,120,32,.45);margin:0 auto}
.lantern-base{width:10px;height:5px;border-radius:50%;background:rgba(255,190,80,.35);margin:0 auto}
/* Stars */
.star{position:absolute;border-radius:50%;background:#fff;pointer-events:none;animation:twinkle ease-in-out infinite}
/* Geo (Rentrée) */
.geo{position:absolute;pointer-events:none}
/* Frost (Saison froide) */
.frost-flake{position:absolute;pointer-events:none;animation:frost ease-in-out infinite,breezeFloat ease-in-out infinite}
/* Breeze bubbles (Chaleur) */
.bubble{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(0,104,184,.1),transparent);animation:breeze ease-in-out infinite;pointer-events:none}

/* ── Hero content ── */
.hero-in{position:relative;z-index:6;max-width:1360px;margin:0 auto;padding:88px 24px;display:grid;grid-template-columns:1fr 460px;gap:64px;align-items:center;width:100%}

/* Eyebrow */
.eyebrow{display:inline-flex;align-items:center;gap:8px;background:var(--stag,rgba(212,160,23,.1));border:1px solid var(--sline,rgba(212,160,23,.18));border-radius:var(--rfull);padding:6px 15px;margin-bottom:22px;animation:fadeScale var(--t4) var(--ease) both;transition:all var(--t3) var(--ease)}
.edot{width:7px;height:7px;border-radius:50%;background:var(--sa,var(--gold2));animation:pulse 2.2s ease-in-out infinite;flex-shrink:0}
.elbl{font-size:10px;font-weight:700;color:var(--stagc,var(--gold2));letter-spacing:.12em;text-transform:uppercase}

/* H1 */
.hero-h1{font-family:var(--display);font-size:clamp(30px,4.8vw,66px);font-weight:900;line-height:1.06;letter-spacing:-.03em;color:var(--stext,#E8EDE8);margin-bottom:18px;animation:fadeUp var(--t4) var(--ease) .08s both;transition:color var(--t3) var(--ease)}
.hero-h1 .acc{background:linear-gradient(90deg,var(--sa,var(--gold)),var(--sa2,var(--gold2)),var(--sa3,var(--gold3)),var(--sa,var(--gold)));background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 4.5s linear infinite}
.s-f .hero-h1 .acc{animation:shimmer 3s linear infinite,goldGlow 2.8s ease-in-out infinite}

/* Paragraph */
.hero-p{font-size:15.5px;color:var(--stext2,rgba(232,237,232,.72));line-height:1.75;max-width:480px;margin-bottom:30px;font-weight:400;animation:fadeUp var(--t4) var(--ease) .16s both;transition:color var(--t3) var(--ease)}
.hero-p strong{color:var(--stext,.#E8EDE8);font-weight:700}

/* CTAs */
.hero-ctas{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:36px;animation:fadeUp var(--t4) var(--ease) .24s both}
.btn{display:inline-flex;align-items:center;gap:8px;min-height:50px;padding:13px 26px;border-radius:var(--r6);font-size:14px;font-weight:700;cursor:pointer;border:none;font-family:'DM Sans',sans-serif;transition:transform var(--t2) var(--spring),box-shadow var(--t2) var(--ease),opacity var(--t2) var(--ease);text-decoration:none;white-space:nowrap;letter-spacing:.01em;position:relative;overflow:hidden}
.btn::after{content:'';position:absolute;inset:0;background:rgba(255,255,255,0);transition:background var(--t2) var(--ease)}
.btn:hover::after{background:rgba(255,255,255,.08)}
.btn:active{transform:scale(.96)!important}
.btn:focus-visible{outline:3px solid var(--gold2);outline-offset:2px}
.btn-s{background:var(--scta,linear-gradient(135deg,var(--gold),var(--gold2)));color:#000;box-shadow:0 4px 18px rgba(0,0,0,.3);font-weight:800}
.btn-s:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(0,0,0,.4)}
.s-f .btn-s{background:linear-gradient(90deg,#C8900A,#E8B824,#F5C842,#C8900A);background-size:200% auto;animation:shimmer 3s linear infinite}
.btn-wa{background:linear-gradient(135deg,var(--wa),var(--wad));color:#fff;box-shadow:0 4px 16px rgba(37,211,102,.25)}
.btn-wa:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(37,211,102,.4)}
.btn-ghost{background:rgba(255,255,255,.07);color:var(--stext,#E8EDE8);border:1.5px solid var(--sline,rgba(255,255,255,.14));backdrop-filter:blur(8px)}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.s-sc .btn-ghost{color:var(--stext)}
.btn-grn{background:linear-gradient(135deg,var(--grn),var(--grn2));color:#fff;box-shadow:var(--sh-grn)}
.btn-grn:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(27,94,32,.5)}

/* Trust row */
.trust-row{display:flex;flex-wrap:wrap;gap:18px;animation:fadeUp var(--t4) var(--ease) .32s both}
.trust-item{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--stext3,rgba(232,237,232,.45));font-weight:500;transition:color var(--t3) var(--ease)}
.trust-dot{width:4px;height:4px;border-radius:50%;background:var(--sa,var(--gold2));flex-shrink:0;transition:background var(--t3) var(--ease)}

/* Hero right panel */
.hero-right{animation:fadeUp var(--t4) var(--ease) .18s both;position:relative}
.h-panel{background:rgba(255,255,255,.04);border:1px solid var(--sline,rgba(255,255,255,.1));border-radius:var(--r10);padding:22px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);position:relative;overflow:hidden;transition:border-color var(--t3) var(--ease)}
.h-panel::before{content:'';position:absolute;top:0;left:18%;right:18%;height:1px;background:linear-gradient(90deg,transparent,var(--sa2,rgba(255,255,255,.3)),transparent);pointer-events:none}
.s-sc .h-panel{background:rgba(255,255,255,.75);border-color:rgba(0,104,184,.14);box-shadow:0 8px 32px rgba(0,80,160,.1)}
.p-lbl{font-size:9.5px;font-weight:700;color:var(--stext3,rgba(255,255,255,.45));letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px;display:flex;align-items:center;gap:7px}
.p-lbl-dot{width:5px;height:5px;border-radius:50%;background:var(--sa,var(--gold2));animation:pulse 1.9s ease-in-out infinite;flex-shrink:0}
/* Mini grid */
.mgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mc{background:rgba(255,255,255,.04);border:1px solid var(--sline,rgba(255,255,255,.07));border-radius:var(--r6);padding:13px 11px;cursor:pointer;transition:all var(--t2) var(--ease);position:relative;animation:revealUp .5s var(--ease) both}
.mc:nth-child(1){animation-delay:.05s}.mc:nth-child(2){animation-delay:.1s}.mc:nth-child(3){animation-delay:.15s}.mc:nth-child(4){animation-delay:.2s}
.mc:hover{border-color:var(--sa,rgba(255,255,255,.18));transform:translateY(-3px);background:rgba(255,255,255,.07)}
.s-sc .mc{background:rgba(255,255,255,.55);border-color:rgba(0,104,184,.1)}
.mc-b{position:absolute;top:5px;right:5px;background:var(--sa,var(--gold2));color:#000;border-radius:3px;padding:1.5px 5px;font-size:7px;font-weight:900;letter-spacing:.04em}
.mc-i{width:40px;height:40px;border-radius:9px;background:rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;font-size:19px;margin-bottom:8px;transition:background var(--t2) var(--ease)}
.mc:hover .mc-i{background:var(--stag,rgba(212,160,23,.18))}
.mc-n{font-size:10px;font-weight:700;color:var(--stext,#E8EDE8);line-height:1.3;margin-bottom:3px;transition:color var(--t3) var(--ease)}
.mc-p{font-size:12px;font-weight:800;color:var(--sa,var(--gold2));font-family:var(--display);transition:color var(--t3) var(--ease)}
.s-sc .mc-n{color:var(--stext)}.s-sc .mc-p{color:var(--sa)}
/* Panel footer */
.p-foot{margin-top:13px;padding-top:12px;border-top:1px solid var(--sline,rgba(255,255,255,.06));display:flex;align-items:center;justify-content:space-between;font-size:10px;color:var(--stext3,rgba(255,255,255,.35))}

/* Float chips */
.fchip{position:absolute;background:rgba(10,16,10,.9);border:1px solid rgba(255,255,255,.1);border-radius:var(--r6);padding:9px 12px;display:flex;align-items:center;gap:9px;box-shadow:var(--sh3);backdrop-filter:blur(12px);z-index:2;animation:float 5s ease-in-out infinite}
.fchip.fc1{top:-12px;right:-8px;animation-delay:0s}
.fchip.fc2{bottom:-12px;left:-8px;animation-delay:1.8s}
.s-sc .fchip{background:rgba(0,40,80,.85);border-color:rgba(0,104,184,.2)}
.fchip-n{font-size:16px;font-weight:900;color:var(--gold2);font-family:var(--display);line-height:1}
.fchip-l{font-size:8.5px;color:rgba(255,255,255,.5);margin-top:1px}

/* ══════════════════════════════════════════════
   TRUST BAR
══════════════════════════════════════════════ */
.tbar{border-bottom:1px solid rgba(255,255,255,.05);transition:background var(--t4) var(--ease)}
.s-h .tbar,.s-r .tbar,.s-f .tbar,.s-rm .tbar,.s-tb .tbar,.s-ma .tbar,.s-sf .tbar{background:rgba(255,255,255,.025)}
.s-sc .tbar{background:rgba(255,255,255,.75);border-bottom-color:rgba(0,104,184,.1)}
.tbar-in{max-width:1360px;margin:0 auto;display:flex;flex-wrap:wrap}
.tbi{flex:1;min-width:180px;display:flex;align-items:center;gap:11px;padding:16px 24px;border-right:1px solid rgba(255,255,255,.05);transition:background var(--t2) var(--ease)}
.tbi:last-child{border-right:none}
.tbi:hover{background:rgba(255,255,255,.03)}
.s-sc .tbi{border-right-color:rgba(0,104,184,.08)}
.tbi-ic{width:36px;height:36px;border-radius:var(--r4);background:var(--grn-glass);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0;transition:background var(--t2) var(--ease)}
.tbi:hover .tbi-ic{background:rgba(27,94,32,.2)}
.tbi-t{font-size:12.5px;font-weight:700;color:var(--txt);transition:color var(--t3) var(--ease)}
.tbi-s{font-size:10.5px;color:var(--txt3);margin-top:1px;transition:color var(--t3) var(--ease)}
.s-h .tbi-t,.s-r .tbi-t,.s-f .tbi-t,.s-rm .tbi-t,.s-tb .tbi-t,.s-ma .tbi-t,.s-sf .tbi-t{color:var(--stext,#E8EDE8)}
.s-h .tbi-s,.s-r .tbi-s,.s-f .tbi-s,.s-rm .tbi-s,.s-tb .tbi-s,.s-ma .tbi-s,.s-sf .tbi-s{color:var(--stext3,rgba(232,237,232,.4))}
.s-h .tbi-ic,.s-r .tbi-ic,.s-f .tbi-ic,.s-rm .tbi-ic,.s-tb .tbi-ic,.s-ma .tbi-ic,.s-sf .tbi-ic{background:var(--stag,rgba(212,160,23,.1))}

/* ══════════════════════════════════════════════
   COUNTERS
══════════════════════════════════════════════ */
.ctr-sec{padding:44px 24px;transition:background var(--t4) var(--ease)}
.s-h .ctr-sec{background:#030810}.s-r .ctr-sec{background:#0A0700}.s-f .ctr-sec{background:#030303}.s-rm .ctr-sec{background:#0A0400}.s-tb .ctr-sec{background:#001006}.s-ma .ctr-sec{background:#060312}.s-sf .ctr-sec{background:#060408}
.s-sc .ctr-sec{background:#C0DEFF}
.ctr-g{max-width:1360px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;border-radius:var(--r8);overflow:hidden;background:rgba(255,255,255,.06)}
.ctr-box{background:rgba(255,255,255,.03);padding:30px 20px;text-align:center;cursor:default;position:relative;overflow:hidden;transition:background var(--t2) var(--ease)}
.ctr-box::after{content:'';position:absolute;bottom:0;left:20%;right:20%;height:2px;background:linear-gradient(90deg,transparent,var(--sa,var(--gold2)),transparent);transform:scaleX(0);transition:transform var(--t3) var(--ease);transform-origin:center}
.ctr-box:hover{background:rgba(255,255,255,.06)}
.ctr-box:hover::after{transform:scaleX(1)}
.s-sc .ctr-box{background:rgba(0,104,184,.06)}.s-sc .ctr-box:hover{background:rgba(0,104,184,.1)}
.ctr-n{font-family:var(--display);font-size:38px;font-weight:900;color:var(--sa,var(--gold2));letter-spacing:-.03em;line-height:1;margin-bottom:6px;transition:color var(--t3) var(--ease)}
.ctr-l{font-size:11.5px;color:rgba(255,255,255,.5);font-weight:500;transition:color var(--t3) var(--ease)}
.s-sc .ctr-l{color:rgba(0,40,80,.55)}

/* ══════════════════════════════════════════════
   SECTION HEADERS
══════════════════════════════════════════════ */
.sec-h{text-align:center;margin-bottom:40px}
.sec-tag{display:inline-flex;align-items:center;gap:6px;border-radius:var(--rfull);padding:4px 14px;font-size:10px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;margin-bottom:12px;background:var(--stag,var(--grn-faint));color:var(--stagc,var(--grn3));border:1px solid var(--sline,rgba(27,94,32,.2));transition:all var(--t3) var(--ease)}
.sec-title{font-family:var(--display);font-size:clamp(21px,3vw,38px);font-weight:800;letter-spacing:-.025em;line-height:1.12;margin-bottom:12px;color:var(--txt);transition:color var(--t3) var(--ease)}
.s-h .sec-title,.s-r .sec-title,.s-f .sec-title,.s-rm .sec-title,.s-tb .sec-title,.s-ma .sec-title,.s-sf .sec-title{color:var(--stext,#E8EDE8)}
.sec-title .g{color:var(--grn3)}.sec-title .sa{color:var(--sa2,var(--gold2));transition:color var(--t3) var(--ease)}
.sec-sub{font-size:14px;color:var(--txt3);max-width:500px;margin:0 auto;line-height:1.72;transition:color var(--t3) var(--ease)}
.s-h .sec-sub,.s-r .sec-sub,.s-f .sec-sub,.s-rm .sec-sub,.s-tb .sec-sub,.s-ma .sec-sub,.s-sf .sec-sub{color:var(--stext3,rgba(232,237,232,.45))}

/* ══════════════════════════════════════════════
   SEASON PRODUCTS SECTION
══════════════════════════════════════════════ */
.sps{padding:64px 24px;transition:background var(--t4) var(--ease)}
.s-h .sps,.s-r .sps,.s-f .sps,.s-rm .sps,.s-tb .sps,.s-ma .sps,.s-sf .sps{background:var(--sb2)}
.s-sc .sps{background:#D8EEFF}

.sps-hd{display:flex;align-items:flex-start;gap:18px;margin-bottom:28px;flex-wrap:wrap}
.sps-ico{width:64px;height:64px;border-radius:var(--r8);background:var(--stag,rgba(212,160,23,.12));border:1px solid var(--sline,rgba(255,255,255,.08));display:flex;align-items:center;justify-content:center;font-size:30px;flex-shrink:0;animation:float 4.5s ease-in-out infinite;transition:all var(--t3) var(--ease)}
.sps-info{flex:1;min-width:200px}
.sps-tag2{display:inline-flex;align-items:center;gap:6px;background:var(--stag,rgba(212,160,23,.12));border:1px solid var(--sline,rgba(255,255,255,.08));border-radius:var(--rfull);padding:4px 12px;font-size:9.5px;font-weight:700;color:var(--stagc,var(--gold2));margin-bottom:8px;letter-spacing:.1em;text-transform:uppercase;transition:all var(--t3) var(--ease)}
.sps-title{font-family:var(--display);font-size:clamp(18px,2.5vw,30px);font-weight:900;color:var(--stext,#E8EDE8);line-height:1.1;letter-spacing:-.025em;margin-bottom:6px;transition:color var(--t3) var(--ease)}
.sps-title .a{color:var(--sa2,var(--gold2));transition:color var(--t3) var(--ease)}
.sps-desc{font-size:13px;color:var(--stext3,rgba(232,237,232,.5));line-height:1.68;max-width:520px;transition:color var(--t3) var(--ease)}
.sps-ct{background:var(--sa,var(--gold2));color:#000;border-radius:var(--r6);padding:12px 18px;text-align:center;flex-shrink:0;align-self:flex-start;font-weight:900;transition:all var(--t3) var(--ease)}
.sps-ct-n{font-family:var(--display);font-size:26px;display:block;line-height:1}
.sps-ct-l{font-size:9px;font-weight:700;display:block;margin-top:2px;opacity:.8}

/* ══════════════════════════════════════════════
   PRODUCT GRID
══════════════════════════════════════════════ */
.pg{display:grid;grid-template-columns:repeat(auto-fill,minmax(218px,1fr));gap:12px}
.pc{background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.07);border-radius:var(--r8);overflow:hidden;display:flex;flex-direction:column;transition:transform var(--t2) var(--spring),box-shadow var(--t3) var(--ease),border-color var(--t2) var(--ease);will-change:transform}
.pc:hover{transform:translateY(-6px);box-shadow:var(--sh4);border-color:var(--sa,rgba(255,255,255,.18))}
.s-sc .pc{background:rgba(255,255,255,.8);border-color:rgba(0,104,184,.1)}
.s-sc .pc:hover{box-shadow:0 14px 40px rgba(0,80,160,.18)}
/* Product image area */
.pc-img{height:172px;display:flex;align-items:center;justify-content:center;position:relative;border-bottom:1px solid rgba(255,255,255,.05);background:rgba(255,255,255,.02);overflow:hidden}
.pc-img::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 60%,var(--stag,transparent),transparent 70%);opacity:0;transition:opacity var(--t3) var(--ease)}
.pc:hover .pc-img::after{opacity:1}
.s-sc .pc-img{background:rgba(0,104,184,.04)}
.pc-iw{width:68px;height:68px;border-radius:var(--r6);background:rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;font-size:30px;transition:transform var(--t2) var(--spring),background var(--t2) var(--ease);position:relative;z-index:1}
.pc:hover .pc-iw{transform:scale(1.1);background:var(--stag,rgba(212,160,23,.16))}
.s-sc .pc-iw{background:rgba(0,104,184,.07)}
/* Badges */
.pc-bs{position:absolute;top:8px;left:8px;display:flex;flex-direction:column;gap:4px;z-index:2}
.pcb{border-radius:4px;padding:2px 7px;font-size:7.5px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;line-height:1.5}
.pcb-s{background:var(--sa,var(--gold2));color:#000}
.pcb-n{background:var(--grn2);color:#fff}.pcb-p{background:#C62828;color:#fff}.pcb-pro{background:#1565C0;color:#fff}
/* Fav */
.pc-fav{position:absolute;top:8px;right:8px;z-index:2;width:30px;height:30px;background:rgba(255,255,255,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;cursor:pointer;transition:all var(--t2) var(--ease);border:none;color:rgba(255,255,255,.55)}
.pc-fav:hover{background:rgba(229,57,53,.18);color:var(--red);transform:scale(1.12)}
.s-sc .pc-fav{background:rgba(0,0,0,.06);color:rgba(0,24,48,.45)}
.pc-fav:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
/* Body */
.pc-body{padding:14px;flex:1;display:flex;flex-direction:column}
.pc-cat{font-size:9px;font-weight:700;color:var(--sa,var(--grn3));text-transform:uppercase;letter-spacing:.09em;margin-bottom:4px;transition:color var(--t3) var(--ease)}
.pc-name{font-size:13.5px;font-weight:700;color:var(--stext,var(--txt));margin-bottom:4px;line-height:1.32;transition:color var(--t3) var(--ease)}
.s-sc .pc-name{color:var(--stext)}
.pc-desc{font-size:11px;color:var(--stext3,var(--txt3));line-height:1.6;margin-bottom:10px;flex:1;transition:color var(--t3) var(--ease)}
.pc-stars{display:flex;align-items:center;gap:5px;margin-bottom:10px}
.stars{color:var(--gold2);font-size:10px;letter-spacing:.4px}
.rc{font-size:10px;color:var(--stext3,var(--txt3))}
.pc-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:auto}
.pc-price{font-size:16px;font-weight:900;color:var(--sa,var(--grn));font-family:var(--display);line-height:1.1;transition:color var(--t3) var(--ease);white-space:nowrap;font-variant-numeric:tabular-nums}
.s-sc .pc-price{color:var(--grn)}
.pc-old{font-size:10px;color:var(--stext3,var(--mute));text-decoration:line-through;margin-top:2px}
.pc-btns{display:flex;gap:5px;flex-shrink:0}
.pbtn{width:35px;height:35px;border-radius:var(--r4);display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;transition:all var(--t2) var(--spring);font-size:16px}
.pbtn-add{background:var(--sa,var(--grn));color:#000;font-weight:900;font-size:18px}
.pbtn-add:hover{transform:scale(1.1)}
.pbtn-add:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.s-sc .pbtn-add{background:var(--grn);color:#fff}
.pbtn-wa{background:var(--wa);color:#fff;font-size:14px;text-decoration:none}
.pbtn-wa:hover{background:var(--wad);transform:scale(1.1)}
.pbtn-wa:focus-visible{outline:2px solid var(--wa);outline-offset:2px}

/* ══════════════════════════════════════════════
   CATEGORIES
══════════════════════════════════════════════ */
.cats-sec{transition:background var(--t4) var(--ease)}
.s-h .cats-sec,.s-r .cats-sec,.s-f .cats-sec,.s-rm .cats-sec,.s-tb .cats-sec,.s-ma .cats-sec,.s-sf .cats-sec{background:var(--sb)}
.s-sc .cats-sec{background:#EAF6FF}
.cats-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:10px}
.ccat{background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.07);border-radius:var(--r8);padding:20px 12px;text-align:center;cursor:pointer;transition:all var(--t2) var(--ease);display:block;position:relative;overflow:hidden}
.ccat::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--grn3),var(--gold2));transform:scaleX(0);transition:transform var(--t2) var(--ease);transform-origin:left}
.ccat:hover{border-color:var(--grn3);transform:translateY(-4px);box-shadow:var(--sh3)}.ccat:hover::after{transform:scaleX(1)}
.ccat:focus-visible{outline:3px solid var(--grn3);outline-offset:2px}
.s-h .ccat,.s-r .ccat,.s-f .ccat,.s-rm .ccat,.s-tb .ccat,.s-ma .ccat,.s-sf .ccat{background:rgba(255,255,255,.04);border-color:var(--sline,rgba(255,255,255,.08))}
.s-h .ccat:hover,.s-r .ccat:hover,.s-f .ccat:hover,.s-rm .ccat:hover,.s-tb .ccat:hover,.s-ma .ccat:hover,.s-sf .ccat:hover{border-color:var(--sa,rgba(255,255,255,.2));box-shadow:0 8px 30px rgba(0,0,0,.5)}
.s-sc .ccat{background:rgba(255,255,255,.7);border-color:rgba(0,104,184,.1)}
.cat-ico{width:48px;height:48px;border-radius:10px;background:var(--grn-glass);display:flex;align-items:center;justify-content:center;margin:0 auto 9px;font-size:22px;transition:all var(--t2) var(--ease)}
.ccat:hover .cat-ico{background:var(--grn2);transform:scale(1.08)}
.s-h .cat-ico,.s-r .cat-ico,.s-f .cat-ico,.s-rm .cat-ico,.s-tb .cat-ico,.s-ma .cat-ico,.s-sf .cat-ico{background:var(--stag,rgba(212,160,23,.1))}
.s-h .ccat:hover .cat-ico,.s-r .ccat:hover .cat-ico,.s-f .ccat:hover .cat-ico,.s-rm .ccat:hover .cat-ico,.s-tb .ccat:hover .cat-ico,.s-ma .ccat:hover .cat-ico,.s-sf .ccat:hover .cat-ico{background:var(--sa,var(--gold2))}
.cat-nm{font-size:11px;font-weight:700;color:var(--txt);line-height:1.3;transition:color var(--t3) var(--ease)}
.s-h .cat-nm,.s-r .cat-nm,.s-f .cat-nm,.s-rm .cat-nm,.s-tb .cat-nm,.s-ma .cat-nm,.s-sf .cat-nm{color:var(--stext,#E8EDE8)}
.cat-ct{font-size:9.5px;color:var(--txt3);margin-top:3px;transition:color var(--t3) var(--ease)}
.cat-sb{position:absolute;top:5px;right:5px;background:var(--sa,var(--gold2));color:#000;border-radius:3px;font-size:6.5px;font-weight:900;padding:2px 4px;letter-spacing:.05em;line-height:1.4}

/* ══════════════════════════════════════════════
   PROMO BANNER
══════════════════════════════════════════════ */
.promo-wrap{padding:0 24px 72px;transition:background var(--t4) var(--ease)}
.s-h .promo-wrap,.s-r .promo-wrap,.s-f .promo-wrap,.s-rm .promo-wrap,.s-tb .promo-wrap,.s-ma .promo-wrap,.s-sf .promo-wrap{background:var(--sb)}
.s-sc .promo-wrap{background:#EAF6FF}
.promo{max-width:1360px;margin:0 auto;border-radius:var(--r10);padding:52px 44px;display:flex;align-items:center;justify-content:space-between;gap:32px;overflow:hidden;position:relative}
.promo::before{content:'';position:absolute;right:-100px;top:-100px;width:320px;height:320px;background:radial-gradient(circle,rgba(255,255,255,.06),transparent 70%);border-radius:50%;pointer-events:none}
.s-h .promo{background:linear-gradient(135deg,#071428,#0D2050)}
.s-r .promo{background:linear-gradient(135deg,#1E1400,#3A2800)}
.s-f .promo{background:linear-gradient(135deg,#0D0800,#1E1200)}
.s-rm .promo{background:linear-gradient(135deg,#1E0E00,#3A1800)}
.s-tb .promo{background:linear-gradient(135deg,#001A08,#003018)}
.s-ma .promo{background:linear-gradient(135deg,#0C0620,#1A0E40)}
.s-sf .promo{background:linear-gradient(135deg,#0C0814,#18102A)}
.s-sc .promo{background:linear-gradient(135deg,#005090,#0070C0)}
.pb-ey{font-size:9.5px;font-weight:700;color:var(--sa3,rgba(255,255,255,.6));letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px}
.pb-h{font-family:var(--display);font-size:clamp(20px,2.8vw,36px);font-weight:900;color:#fff;line-height:1.08;letter-spacing:-.025em;margin-bottom:10px}
.pb-p{font-size:13.5px;color:rgba(255,255,255,.65);line-height:1.68;max-width:400px;margin-bottom:24px}
.promo-disc{background:linear-gradient(135deg,var(--sa,var(--gold)),var(--sa2,var(--gold2)));border-radius:50%;width:104px;height:104px;display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;box-shadow:var(--sh-gold);animation:float 4s ease-in-out infinite}
.pd-n{font-family:var(--display);font-size:32px;font-weight:900;color:#000;line-height:1}
.pd-off{font-size:8px;font-weight:900;color:#000;letter-spacing:.1em}

/* ══════════════════════════════════════════════
   REVIEWS
══════════════════════════════════════════════ */
.rev-sec{transition:background var(--t4) var(--ease)}
.s-h .rev-sec,.s-r .rev-sec,.s-f .rev-sec,.s-rm .rev-sec,.s-tb .rev-sec,.s-ma .rev-sec,.s-sf .rev-sec{background:var(--sb2)}
.s-sc .rev-sec{background:#F0F9FF}
.rev-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(265px,1fr));gap:12px}
.rv{background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.07);border-radius:var(--r8);padding:22px;transition:all var(--t2) var(--ease)}
.rv:hover{transform:translateY(-3px);box-shadow:var(--sh3);border-color:var(--grn4)}
.s-sc .rv{background:rgba(255,255,255,.8);border-color:rgba(0,104,184,.1)}
.rv-hd{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.rv-av{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:#fff;flex-shrink:0}
.rv-nm{font-size:13px;font-weight:700;color:var(--stext,var(--txt));transition:color var(--t3) var(--ease)}
.rv-loc{font-size:10px;color:var(--stext3,var(--txt3));margin-top:1px;transition:color var(--t3) var(--ease)}
.rv-stars{display:flex;gap:2px;margin-bottom:8px}
.rv-star{color:var(--gold2);font-size:13px}
.rv-txt{font-size:12.5px;color:var(--stext2,var(--txt2));line-height:1.7;transition:color var(--t3) var(--ease)}
.rv-prod{margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.06);font-size:9.5px;color:var(--sa2,var(--grn3));font-weight:700;transition:all var(--t3) var(--ease)}
.rv-check{display:inline-flex;align-items:center;gap:3px;background:var(--stag,var(--grn-glass));color:var(--stagc,var(--grn3));border-radius:4px;padding:2px 7px;font-size:8px;font-weight:700;margin-top:5px;transition:all var(--t3) var(--ease)}

/* ══════════════════════════════════════════════
   INFO SECTION
══════════════════════════════════════════════ */
.info-sec{transition:background var(--t4) var(--ease)}
.s-h .info-sec,.s-r .info-sec,.s-f .info-sec,.s-rm .info-sec,.s-tb .info-sec,.s-ma .info-sec,.s-sf .info-sec{background:var(--sb)}
.s-sc .info-sec{background:#DCF0FF}
.info-g{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.icard{background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.07);border-radius:var(--r8);padding:26px;transition:all var(--t3) var(--ease);margin-bottom:14px}
.icard:last-child{margin-bottom:0}
.s-sc .icard{background:rgba(255,255,255,.75);border-color:rgba(0,104,184,.1)}
.icard-t{font-size:14.5px;font-weight:800;color:var(--stext,var(--txt));margin-bottom:18px;display:flex;align-items:center;gap:8px;transition:color var(--t3) var(--ease)}
.irow{display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:13px;color:var(--stext2,var(--txt2));line-height:1.55;transition:color var(--t3) var(--ease)}
.irow:last-child{border-bottom:none}
.s-sc .irow{border-bottom-color:rgba(0,104,184,.07)}
.irow-ic{width:34px;height:34px;border-radius:var(--r4);background:var(--stag,var(--grn-glass));display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;transition:all var(--t3) var(--ease)}
.irow-lbl{font-size:9.5px;font-weight:700;color:var(--stext3,var(--txt3));text-transform:uppercase;letter-spacing:.08em;margin-bottom:2px;display:block;transition:color var(--t3) var(--ease)}
.irow a{color:var(--sa2,var(--grn3));font-weight:600;transition:color var(--t2) var(--ease)}
.irow a:hover{color:var(--gold2)}
.open-badge{display:inline-flex;align-items:center;gap:5px;border-radius:var(--rfull);padding:3px 10px;font-size:9.5px;font-weight:700;margin-top:4px}
.open-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.hrs{display:flex;flex-direction:column}
.hr-row{display:flex;justify-content:space-between;padding:5px 0;font-size:12px;border-bottom:1px solid rgba(255,255,255,.04)}
.hr-row:last-child{border-bottom:none}
.s-sc .hr-row{border-bottom-color:rgba(0,104,184,.06)}
.hr-d{color:var(--stext3,var(--txt3));transition:color var(--t3) var(--ease)}
.hr-v{font-weight:700;color:var(--stext,var(--txt));transition:color var(--t3) var(--ease)}
/* Social links */
.soc-row{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.soc-lnk{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--r4);padding:7px 13px;font-size:11.5px;font-weight:600;color:var(--stext2,rgba(232,237,232,.72));text-decoration:none;transition:all var(--t2) var(--ease)}
.soc-lnk:hover{background:var(--gold2);color:#000;border-color:transparent}
.soc-lnk:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.s-sc .soc-lnk{background:rgba(0,104,184,.06);border-color:rgba(0,104,184,.12);color:var(--stext)}
/* Map */
.map-wrap{border-radius:var(--r8);overflow:hidden;border:1.5px solid rgba(255,255,255,.08);width:100%;height:290px;position:relative;background:rgba(255,255,255,.03)}
.s-sc .map-wrap{border-color:rgba(0,104,184,.12);background:rgba(0,104,184,.04)}
.map-wrap iframe{width:100%;height:100%;border:0;display:block}
/* B2B Form */
.b2b{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:var(--r10);padding:26px;position:relative;overflow:hidden;margin-top:14px;transition:all var(--t3) var(--ease)}
.b2b::before{content:'';position:absolute;top:0;left:16%;right:16%;height:1px;background:linear-gradient(90deg,transparent,var(--sa2,var(--gold2)),transparent)}
.s-sc .b2b{background:rgba(255,255,255,.65);border-color:rgba(0,104,184,.12)}
.b2b-t{font-size:15px;font-weight:800;color:var(--stext,var(--txt));margin-bottom:3px;transition:color var(--t3) var(--ease)}
.b2b-s{font-size:11px;color:var(--stext3,var(--txt3));margin-bottom:20px;transition:color var(--t3) var(--ease)}
.frow2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.flbl{display:block;font-size:9.5px;font-weight:700;color:var(--stext3,var(--txt3));letter-spacing:.08em;text-transform:uppercase;margin-bottom:5px;transition:color var(--t3) var(--ease)}
.finput{width:100%;height:44px;background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.1);border-radius:var(--r4);padding:0 14px;font-size:13px;color:var(--stext,#E8EDE8);font-family:'DM Sans',sans-serif;transition:all var(--t2) var(--ease)}
.finput:focus{border-color:var(--sa2,var(--gold2));box-shadow:0 0 0 3px rgba(212,160,23,.1);background:rgba(255,255,255,.09)}
.finput::placeholder{color:var(--stext3,rgba(232,237,232,.3))}
.s-sc .finput{background:rgba(255,255,255,.5);border-color:rgba(0,104,184,.18);color:var(--stext)}
.s-sc .finput::placeholder{color:rgba(0,24,48,.35)}
select.finput{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='rgba(255,255,255,.4)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:18px;padding-right:36px}
select.finput option{background:#0A0808;color:#E8EDE8}
.b2b-perks{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:14px}
.b2b-perk{font-size:11px;color:var(--stext3,var(--txt3));display:flex;align-items:center;gap:6px;transition:color var(--t3) var(--ease)}

/* ══════════════════════════════════════════════
   FAQ
══════════════════════════════════════════════ */
.faq-sec{transition:background var(--t4) var(--ease)}
.s-h .faq-sec,.s-r .faq-sec,.s-f .faq-sec,.s-rm .faq-sec,.s-tb .faq-sec,.s-ma .faq-sec,.s-sf .faq-sec{background:var(--sb2)}
.s-sc .faq-sec{background:#E8F5FF}
.faq-wrap{max-width:740px;margin:0 auto}
.fqi{border:1.5px solid rgba(255,255,255,.07);border-radius:var(--r6);margin-bottom:8px;overflow:hidden;transition:border-color var(--t2) var(--ease)}
.fqi.open{border-color:var(--grn3)}
.s-h .fqi,.s-r .fqi,.s-f .fqi,.s-rm .fqi,.s-tb .fqi,.s-ma .fqi,.s-sf .fqi{border-color:var(--sline,rgba(255,255,255,.08))}
.s-h .fqi.open,.s-r .fqi.open,.s-f .fqi.open,.s-rm .fqi.open,.s-tb .fqi.open,.s-ma .fqi.open,.s-sf .fqi.open{border-color:var(--sa2,var(--gold2))}
.fq-btn{padding:15px 18px;display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;font-size:13.5px;font-weight:600;color:var(--stext,var(--txt));background:rgba(255,255,255,.03);transition:all var(--t2) var(--ease);min-height:52px;border:none;width:100%;text-align:left;font-family:'DM Sans',sans-serif;letter-spacing:.01em}
.fq-btn:hover{background:rgba(255,255,255,.06)}
.s-sc .fq-btn{background:rgba(255,255,255,.65);color:var(--stext)}
.s-sc .fq-btn:hover{background:rgba(255,255,255,.8)}
.fq-arr{color:var(--grn3);font-size:22px;transition:transform var(--t3) var(--ease);flex-shrink:0;font-weight:300;line-height:1}
.s-h .fq-arr,.s-r .fq-arr,.s-f .fq-arr,.s-rm .fq-arr,.s-tb .fq-arr,.s-ma .fq-arr,.s-sf .fq-arr{color:var(--sa2,var(--gold2))}
.fqi.open .fq-arr{transform:rotate(45deg)}
.fq-ans{max-height:0;overflow:hidden;transition:max-height var(--t3) var(--ease),padding var(--t2) var(--ease);background:rgba(255,255,255,.02);font-size:13px;color:var(--stext3,var(--txt3));line-height:1.78}
.fqi.open .fq-ans{max-height:250px;padding:14px 18px 16px}
.s-sc .fq-ans{background:rgba(255,255,255,.55);color:var(--stext2)}
.fq-btn:focus-visible{outline:2px solid var(--gold2);outline-offset:-2px}

/* ══════════════════════════════════════════════
   NEWSLETTER
══════════════════════════════════════════════ */
.nl-sec{padding:56px 24px;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06);transition:background var(--t4) var(--ease)}
.s-h .nl-sec,.s-r .nl-sec,.s-f .nl-sec,.s-rm .nl-sec,.s-tb .nl-sec,.s-ma .nl-sec,.s-sf .nl-sec{background:var(--sb);border-color:var(--sline,rgba(255,255,255,.06))}
.s-sc .nl-sec{background:#D0EEFF;border-color:rgba(0,104,184,.12)}
.nl-in{max-width:500px;margin:0 auto;text-align:center}
.nl-form{display:flex;gap:8px;margin-top:22px}
.nl-input{flex:1;height:50px;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.12);border-radius:var(--r6);padding:0 16px;font-size:14px;color:#fff;font-family:'DM Sans',sans-serif;transition:all var(--t2) var(--ease)}
.nl-input:focus{border-color:var(--gold2);box-shadow:0 0 0 3px rgba(212,160,23,.12);background:rgba(255,255,255,.1)}
.nl-input::placeholder{color:rgba(255,255,255,.35)}
.s-sc .nl-input{background:rgba(255,255,255,.6);border-color:rgba(0,104,184,.2);color:var(--stext)}
.s-sc .nl-input::placeholder{color:rgba(0,40,80,.4)}

/* ══════════════════════════════════════════════
   FOOTER
══════════════════════════════════════════════ */
footer{background:#030503;padding:56px 24px 24px;border-top:1px solid rgba(255,255,255,.05)}
.foot-in{max-width:1360px;margin:0 auto}
.foot-g{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr 1.4fr;gap:36px;margin-bottom:44px}
.fb-l{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.fb-ring{width:36px;height:36px;border-radius:50%;border:2px solid var(--gold2);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.fb-br{font-family:var(--display);font-size:18px;font-weight:900}
.fb-br .on{color:#fff}.fb-br .sh{color:var(--gold2)}
.fb-sl{font-size:9.5px;color:rgba(255,255,255,.28);font-style:italic;margin-bottom:12px;letter-spacing:.04em}
.fb-d{font-size:12px;color:rgba(255,255,255,.38);line-height:1.76;margin-bottom:16px}
.socials{display:flex;gap:7px}
.soc{width:36px;height:36px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:var(--r4);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--t2) var(--ease);text-decoration:none;color:rgba(255,255,255,.6)}
.soc:hover{background:var(--grn2);transform:translateY(-2px);color:#fff;border-color:var(--grn2)}
.soc:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.fc h4{font-size:9.5px;font-weight:700;color:rgba(255,255,255,.45);text-transform:uppercase;letter-spacing:.12em;margin-bottom:14px}
.fc a{display:block;font-size:12.5px;color:rgba(255,255,255,.38);margin-bottom:9px;transition:color var(--t2) var(--ease)}
.fc a:hover{color:var(--gold2)}
.fc a:focus-visible{color:var(--gold2);outline:1px solid var(--gold2);outline-offset:2px}
.fc-c p{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:rgba(255,255,255,.38);margin-bottom:8px;line-height:1.55}
.foot-bot{padding-top:22px;border-top:1px solid rgba(255,255,255,.06);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.foot-bot p{font-size:11.5px;color:rgba(255,255,255,.25)}
.foot-bot a{color:var(--gold2)}
.foot-bot a:focus-visible{outline:1px solid var(--gold2);outline-offset:2px}
.pcs{display:flex;gap:5px;flex-wrap:wrap}
.pch{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:4px;padding:3px 8px;font-size:9px;color:rgba(255,255,255,.38);font-weight:600;letter-spacing:.03em}
.pch.ok{color:#66BB6A;border-color:rgba(46,125,50,.32)}

/* ══════════════════════════════════════════════
   SKIP + TOAST + WA FLOAT
══════════════════════════════════════════════ */
.skip{position:absolute;top:-100%;left:24px;background:var(--grn);color:#fff;padding:10px 18px;border-radius:0 0 var(--r4) var(--r4);font-size:14px;font-weight:700;z-index:9999;transition:top var(--t2) var(--ease);text-decoration:none}
.skip:focus{top:0}
.wa-float{position:fixed;bottom:22px;right:22px;z-index:990;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.wa-tip{background:rgba(255,255,255,.96);border:1px solid rgba(0,0,0,.08);border-radius:var(--r6);padding:8px 13px;font-size:11.5px;font-weight:600;color:#1A1A1A;white-space:nowrap;box-shadow:var(--sh3);opacity:0;transform:translateX(6px);transition:all var(--t2) var(--ease);pointer-events:none}
.wa-float:hover .wa-tip{opacity:1;transform:translateX(0)}
.wa-fab{width:56px;height:56px;background:var(--wa);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 24px rgba(37,211,102,.38);animation:waBounce 3.5s ease-in-out infinite;text-decoration:none;color:#fff;border:none;transition:transform var(--t2) var(--ease),box-shadow var(--t2) var(--ease)}
.wa-fab:hover{transform:scale(1.08)!important;animation:none;box-shadow:0 10px 32px rgba(37,211,102,.55)}
.wa-fab:focus-visible{outline:3px solid #fff;outline-offset:3px}
#toast{position:fixed;bottom:90px;right:22px;background:rgba(10,16,10,.96);border:1.5px solid var(--grn3);border-radius:var(--r6);padding:12px 16px;display:none;align-items:center;gap:10px;font-size:13px;font-weight:600;color:#E8EDE8;box-shadow:var(--sh4);z-index:989;min-width:210px;max-width:320px;animation:revealLeft var(--t2) var(--ease);backdrop-filter:blur(12px)}
#toast.err{border-color:var(--red)}

/* ══════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════ */
@media(max-width:1100px){.foot-g{grid-template-columns:1.2fr 1fr 1fr;gap:28px}}
@media(max-width:900px){
  .nav-srch,.spill{display:none}
  .ham{display:flex}
  .hero-in{grid-template-columns:1fr;gap:36px;padding:60px 24px}
  .hero-right{display:none}
  .ctr-g{grid-template-columns:repeat(2,1fr)}
  .info-g{grid-template-columns:1fr;gap:24px}
  .foot-g{grid-template-columns:1fr 1fr;gap:24px}
  .promo{flex-direction:column;padding:36px 24px;text-align:center}
  .pb-p{margin:0 auto 20px}
  .promo-disc{display:none}
  .sps-hd{flex-wrap:wrap}
  .sps-ct{display:none}
  .hero-h1{letter-spacing:-.02em}
}
@media(max-width:600px){
  .section,.section-sm{padding:52px 16px}
  .tbar .tbi{min-width:100%;border-right:none;border-bottom:1px solid rgba(255,255,255,.04)}
  .cats-g{grid-template-columns:repeat(3,1fr)}
  .pg{grid-template-columns:repeat(2,1fr);gap:10px}
  .hero-ctas,.nl-form{flex-direction:column}
  .btn{justify-content:center}
  .foot-g{grid-template-columns:1fr}
  .swb-in{gap:5px}
  .sbn{font-size:9.5px;padding:0 8px}
  .frow2{grid-template-columns:1fr}
  .b2b-perks{grid-template-columns:1fr}
  .rev-g{grid-template-columns:1fr}
}


/* LANGUE */
.lang-sel{display:flex;align-items:center;gap:3px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--rfull);padding:4px 6px;flex-shrink:0}
.lang-btn{height:26px;padding:0 8px;border-radius:20px;font-size:11px;font-weight:700;cursor:pointer;border:none;background:none;color:rgba(255,255,255,.55);font-family:'DM Sans',sans-serif;transition:all .2s;letter-spacing:.02em}
.lang-btn.on{background:var(--gold2);color:#000}
.lang-btn:hover:not(.on){color:#fff;background:rgba(255,255,255,.1)}
/* RTL pour arabe */
html[dir=rtl] .nav-in{flex-direction:row-reverse}
html[dir=rtl] .hero-in{direction:rtl}
html[dir=rtl] .foot-g{direction:rtl}
/* Dark mode toggle */
.dm-btn{width:36px;height:22px;border-radius:11px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.15);cursor:pointer;position:relative;transition:background .2s;flex-shrink:0}
.dm-btn::after{content:'';width:16px;height:16px;border-radius:50%;background:#fff;position:absolute;top:2px;left:2px;transition:transform .2s,background .2s}
.dm-btn.on{background:var(--gold2)}.dm-btn.on::after{transform:translateX(14px);background:#000}


/* PANIER DRAWER */
.cart-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:1800;backdrop-filter:blur(4px)}
.cart-overlay.open{display:block;animation:fadeIn .2s ease}
.cart-drawer{position:fixed;top:0;right:-100%;width:min(420px,100vw);height:100vh;background:#0D130D;border-left:1px solid rgba(255,255,255,.08);z-index:1900;display:flex;flex-direction:column;transition:right .35s cubic-bezier(.4,0,.2,1);overflow:hidden}
.cart-drawer.open{right:0}
.cart-head{display:flex;align-items:center;justify-content:space-between;padding:20px 20px 16px;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0}
.cart-head-t{font-family:'Poppins',sans-serif;font-size:18px;font-weight:900;color:#fff}
.cart-head-c{font-size:12px;color:rgba(255,255,255,.45);margin-top:2px}
.cart-close{width:36px;height:36px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:8px;color:rgba(255,255,255,.7);cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;font-weight:300}
.cart-items{flex:1;overflow-y:auto;padding:16px 20px;display:flex;flex-direction:column;gap:10px}
.cart-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:rgba(255,255,255,.35)}
.cart-empty-ico{font-size:52px;opacity:.5}
.cart-item{display:flex;gap:12px;align-items:flex-start;padding:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:10px;position:relative}
.cart-item-ico{width:52px;height:52px;border-radius:8px;background:rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}
.cart-item-info{flex:1;min-width:0}
.cart-item-name{font-size:12.5px;font-weight:700;color:#fff;line-height:1.3;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cart-item-price{font-size:14px;font-weight:900;color:var(--gold2);font-family:'Poppins',sans-serif}
.cart-item-qty{display:flex;align-items:center;gap:6px;margin-top:6px}
.ciq-btn{width:26px;height:26px;border-radius:5px;background:rgba(255,255,255,.08);border:none;color:#fff;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-weight:300;transition:background .15s}
.ciq-btn:hover{background:rgba(255,255,255,.16)}
.ciq-n{font-size:13px;font-weight:700;color:#fff;width:22px;text-align:center}
.cart-item-del{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;background:rgba(239,83,80,.12);border:none;color:#EF5350;cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center;transition:all .15s}
.cart-item-del:hover{background:rgba(239,83,80,.25)}
.cart-foot{padding:16px 20px;border-top:1px solid rgba(255,255,255,.08);flex-shrink:0;background:#0D130D}
.cart-total-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.cart-total-lbl{font-size:13px;color:rgba(255,255,255,.6);font-weight:600}
.cart-total-val{font-family:'Poppins',sans-serif;font-size:22px;font-weight:900;color:var(--gold2)}
.cart-order-btn{height:52px;width:100%;border-radius:10px;background:linear-gradient(135deg,#25D366,#1DAE56);color:#fff;font-size:15px;font-weight:800;border:none;cursor:pointer;font-family:'DM Sans',sans-serif;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .2s;margin-bottom:8px}
.cart-order-btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(37,211,102,.38)}
.cart-clear-btn{height:40px;width:100%;border-radius:8px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.5);font-size:12.5px;font-weight:600;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .15s}
.cart-clear-btn:hover{background:rgba(239,83,80,.1);color:#EF5350;border-color:rgba(239,83,80,.3)}


/* STICKY MOBILE BAR */
.sticky-mobile{display:none;position:fixed;bottom:0;left:0;right:0;z-index:800;background:rgba(8,12,8,.97);backdrop-filter:blur(16px);border-top:1px solid rgba(255,255,255,.1);padding:10px 16px;gap:10px;align-items:center;transform:translateY(100%);transition:transform .3s cubic-bezier(.4,0,.2,1)}
.sticky-mobile.visible{transform:translateY(0)}
@media(max-width:768px){.sticky-mobile{display:flex}.wa-float{bottom:84px}}
.sm-wa{flex:1;height:48px;border-radius:10px;background:linear-gradient(135deg,#25D366,#1DAE56);color:#fff;font-size:14px;font-weight:800;border:none;cursor:pointer;font-family:'DM Sans',sans-serif;display:flex;align-items:center;justify-content:center;gap:7px;text-decoration:none}
.sm-cart{width:48px;height:48px;border-radius:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#fff;font-size:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative;flex-shrink:0}
/* Scroll to top */
.scroll-top{position:fixed;bottom:88px;left:20px;width:42px;height:42px;border-radius:50%;background:rgba(27,94,32,.85);border:1px solid rgba(27,94,32,.5);color:#fff;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(8px);transition:all .25s;z-index:700;backdrop-filter:blur(8px)}
.scroll-top.visible{opacity:1;transform:translateY(0)}
.scroll-top:hover{background:var(--grn2);transform:translateY(-2px)}
/* Timer urgence */
.urgency-timer{display:inline-flex;align-items:center;gap:8px;background:rgba(239,83,80,.12);border:1px solid rgba(239,83,80,.28);border-radius:var(--rfull);padding:6px 14px;font-size:12px;font-weight:700;color:#EF5350;margin-bottom:16px;transition:all .3s}
.urgency-timer.hidden{display:none}
.timer-val{font-family:'Poppins',sans-serif;font-size:14px;font-weight:900;letter-spacing:.05em}
/* Meilleures ventes section */
.bestsellers-sec{padding:64px 24px;transition:background .8s}
.sh .bestsellers-sec,.sr .bestsellers-sec,.sf .bestsellers-sec,.sm .bestsellers-sec{background:var(--sb)}
.sc .bestsellers-sec{background:#EAF6FF}
/* Comparateur */
.compare-bar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:810;background:#0A160A;border-top:2px solid var(--gold2);padding:12px 20px;flex-wrap:wrap;align-items:center;gap:10px;transform:translateY(100%);transition:transform .3s}
.compare-bar.open{display:flex;transform:translateY(0)}
@media(max-width:768px){.compare-bar{bottom:68px}}
.compare-items{display:flex;gap:8px;flex:1;flex-wrap:wrap}
.compare-chip{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:6px;padding:6px 10px;font-size:11.5px;font-weight:600;color:#fff}
.compare-chip button{background:none;border:none;color:rgba(255,255,255,.5);cursor:pointer;font-size:16px;padding:0;line-height:1;margin-left:4px;transition:color .15s}
.compare-chip button:hover{color:#EF5350}
.compare-go{height:40px;padding:0 20px;border-radius:8px;background:linear-gradient(135deg,var(--gold),var(--gold2));color:#000;font-size:13px;font-weight:800;border:none;cursor:pointer;font-family:'DM Sans',sans-serif;white-space:nowrap;flex-shrink:0}
/* Fidélité badge */
.loyalty-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(212,160,23,.12);border:1px solid rgba(212,160,23,.25);border-radius:var(--rfull);padding:5px 14px;font-size:11px;font-weight:700;color:var(--gold2)}
.loyalty-stars{color:var(--gold2);letter-spacing:1px}


/* MODAL COMPARATEUR */
.compare-modal{display:none;position:fixed;inset:0;z-index:2100;background:rgba(0,0,0,.85);backdrop-filter:blur(10px);overflow-y:auto;padding:24px}
.compare-modal.open{display:block;animation:fadeIn .2s ease}
.compare-modal-in{max-width:860px;margin:0 auto;background:#0D130D;border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:hidden}
.compare-modal-hd{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid rgba(255,255,255,.08)}
.compare-modal-hd h3{font-family:'Poppins',sans-serif;font-size:17px;font-weight:900;color:#fff}
.compare-table{width:100%;border-collapse:collapse}
.compare-table th,.compare-table td{padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.06);font-size:13px;vertical-align:top}
.compare-table th{background:rgba(255,255,255,.04);font-weight:700;color:var(--gold2);font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.compare-table th:first-child,.compare-table td:first-child{color:rgba(255,255,255,.45);font-weight:600;font-size:11.5px;width:30%;background:rgba(255,255,255,.02)}
.compare-table td{color:rgba(232,237,232,.72)}
.compare-table tr:last-child td{border-bottom:none}

/* ADMIN ONIVA SHOP */
#adminPanel{display:none;position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.88);backdrop-filter:blur(10px);overflow-y:auto}
.adm-in{max-width:880px;margin:0 auto;padding:24px;min-height:100vh}
.adm-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;padding:16px 20px;background:#0A120A;border:1px solid rgba(27,94,32,.4);border-radius:12px}
.adm-title{font-family:'Poppins',sans-serif;font-size:19px;font-weight:900;color:#fff}
.adm-title span{color:#E8B824}
.adm-close{width:36px;height:36px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:8px;cursor:pointer;color:#fff;font-size:18px;font-weight:300;display:flex;align-items:center;justify-content:center}
.adm-tabs{display:flex;gap:6px;margin-bottom:16px}
.adm-tab{padding:8px 16px;border-radius:6px;font-size:12px;font-weight:700;cursor:pointer;border:1.5px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:rgba(255,255,255,.6);transition:all .2s;font-family:'DM Sans',sans-serif}
.adm-tab.on{background:rgba(232,184,36,.15);border-color:rgba(232,184,36,.4);color:#E8B824}
.adm-sec{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:18px;margin-bottom:14px}
.adm-sec h3{font-size:11px;font-weight:700;color:#E8B824;text-transform:uppercase;letter-spacing:.11em;margin-bottom:14px}
.adm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:10px}
.adm-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:8px;padding:12px}
.adm-card-nm{font-size:11px;font-weight:700;color:#fff;margin-bottom:8px;line-height:1.3}
.adm-f{margin-bottom:7px}
.adm-lbl{display:block;font-size:9px;font-weight:700;color:rgba(255,255,255,.38);text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px}
.adm-inp{width:100%;height:33px;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.1);border-radius:6px;padding:0 10px;font-size:12px;color:#fff;font-family:'DM Sans',sans-serif}
.adm-inp:focus{border-color:#E8B824;outline:none;box-shadow:0 0 0 2px rgba(232,184,36,.1)}
.adm-save{height:30px;padding:0 14px;border-radius:6px;background:linear-gradient(135deg,#1B5E20,#2E7D32);color:#fff;font-size:11px;font-weight:700;cursor:pointer;border:none;font-family:'DM Sans',sans-serif;margin-top:5px;transition:all .2s}
.adm-save:hover{transform:translateY(-1px)}
.adm-add-g{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.adm-add-btn{height:44px;width:100%;border-radius:8px;background:linear-gradient(135deg,#D4A017,#E8B824);color:#000;font-size:14px;font-weight:800;cursor:pointer;border:none;font-family:'DM Sans',sans-serif;margin-top:12px;transition:all .2s}
.adm-add-btn:hover{transform:translateY(-1px)}
.adm-fb{display:none;padding:9px 13px;border-radius:6px;font-size:12px;font-weight:700;margin-top:8px}
.adm-fb.ok{background:rgba(102,187,106,.15);color:#66BB6A;border:1px solid rgba(102,187,106,.3)}
.adm-fb.err{background:rgba(239,83,80,.12);color:#EF5350;border:1px solid rgba(239,83,80,.3)}
.adm-ps{display:none}.adm-ps.on{display:block}
.adm-sel{appearance:none;cursor:pointer}
.adm-sel option{background:#0A120A;color:#fff}


/* ── ANIMATIONS PANIER (conversion) ── */
@keyframes cartBump{0%{transform:scale(1)}30%{transform:scale(1.35) rotate(-8deg)}60%{transform:scale(.9) rotate(4deg)}100%{transform:scale(1) rotate(0)}}
@keyframes badgePop{0%{transform:scale(0) rotate(-180deg);opacity:0}60%{transform:scale(1.4) rotate(10deg)}100%{transform:scale(1) rotate(0);opacity:1}}
@keyframes flyToCart{0%{transform:translate(0,0) scale(1);opacity:1}60%{opacity:.9}100%{transform:translate(var(--fly-x,200px),var(--fly-y,-300px)) scale(.2);opacity:0}}
@keyframes slideInRight{0%{transform:translateX(100%);opacity:0}100%{transform:translateX(0);opacity:1}}
@keyframes pulseGreen{0%,100%{box-shadow:0 4px 18px rgba(37,211,102,.35)}50%{box-shadow:0 4px 30px rgba(37,211,102,.7),0 0 0 4px rgba(37,211,102,.15)}}
@keyframes checkPop{0%{transform:scale(0);opacity:0}50%{transform:scale(1.3)}100%{transform:scale(1);opacity:1}}
@keyframes shimmerBtn{0%{background-position:-200% center}100%{background-position:200% center}}
@keyframes wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-3deg)}75%{transform:rotate(3deg)}}
@keyframes floatUp{0%{transform:translateY(8px);opacity:0}100%{transform:translateY(0);opacity:1}}

/* Icône panier qui bump quand on ajoute */
.cart-bump{animation:cartBump .5s cubic-bezier(.34,1.56,.64,1)}
/* Badge qui pop */
.cbadge.pop{animation:badgePop .45s cubic-bezier(.34,1.56,.64,1)}
/* Particule volante "+1" */
.fly-particle{position:fixed;z-index:2000;font-size:22px;font-weight:900;color:var(--gold2);pointer-events:none;font-family:'Poppins',sans-serif;animation:flyToCart .8s cubic-bezier(.4,0,.6,1) forwards;text-shadow:0 2px 8px rgba(0,0,0,.4)}
/* Bouton commander qui pulse dans le panier */
.cart-order-btn{position:relative;overflow:hidden;background:linear-gradient(135deg,#25D366,#1DAE56)!important;animation:pulseGreen 2.2s ease-in-out infinite}
.cart-order-btn::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);background-size:200% 100%;animation:shimmerBtn 2.8s linear infinite;pointer-events:none}
/* Item ajouté: highlight */
.cart-item.just-added{animation:slideInRight .4s cubic-bezier(.34,1.56,.64,1);border-color:rgba(37,211,102,.4)!important;background:rgba(37,211,102,.06)!important}
/* Mini check vert qui apparait */
.add-check{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:#25D366;color:#fff;font-size:11px;font-weight:900;animation:checkPop .4s cubic-bezier(.34,1.56,.64,1);flex-shrink:0}
/* Free shipping progress bar dans le panier */
.cart-shipping{background:rgba(37,211,102,.08);border:1px solid rgba(37,211,102,.2);border-radius:10px;padding:12px 14px;margin-bottom:14px;animation:floatUp .3s ease}
.cart-shipping-txt{font-size:11.5px;color:#66BB6A;font-weight:600;margin-bottom:8px;display:flex;align-items:center;gap:6px;line-height:1.4}
.cart-shipping-bar{height:6px;background:rgba(255,255,255,.1);border-radius:3px;overflow:hidden}
.cart-shipping-fill{height:100%;background:linear-gradient(90deg,#25D366,#43E883);border-radius:3px;transition:width .6s cubic-bezier(.34,1.56,.64,1)}
.cart-shipping.unlocked{background:rgba(37,211,102,.14);border-color:rgba(37,211,102,.4)}
.cart-shipping.unlocked .cart-shipping-txt{color:#43E883}
/* Trust signals sous le bouton commander */
.cart-trust{display:flex;justify-content:center;gap:14px;margin-top:10px;flex-wrap:wrap}
.cart-trust-item{display:flex;align-items:center;gap:4px;font-size:9.5px;color:rgba(255,255,255,.45);font-weight:500}
/* FAB cart bounce on add */
.wa-fab.attract{animation:wiggle .5s ease-in-out 2}
/* Sticky cart count badge anim */
#stickyCartN.pop{animation:badgePop .4s cubic-bezier(.34,1.56,.64,1)}


/* ── RESPONSIVE IMPECCABLE — TOUS SUPPORTS ── */
/* Large desktop */
@media(min-width:1400px){
  .hero-in{max-width:1320px}
  .wrap{max-width:1320px}
}
/* Tablette paysage */
@media(max-width:992px) and (min-width:769px){
  .hero-h1{font-size:clamp(28px,5vw,48px)}
  .pg{grid-template-columns:repeat(3,1fr)}
  .cats-g{grid-template-columns:repeat(4,1fr)}
}
/* Tablette portrait + grands mobiles */
@media(max-width:768px){
  .nav-srch{display:none}
  .lang-sel{padding:3px 4px}
  .lang-btn{height:24px;padding:0 7px;font-size:10.5px}
  .dm-btn{width:32px;height:20px}
  .hero-in{grid-template-columns:1fr;gap:32px;padding:48px 20px}
  .hero-right{display:none}
  .hero-h1{font-size:clamp(26px,7vw,40px);line-height:1.1}
  .hero-p{font-size:14.5px}
  .pg{grid-template-columns:repeat(2,1fr);gap:12px}
  .cats-g{grid-template-columns:repeat(3,1fr);gap:10px}
  .info-grid{grid-template-columns:1fr}
  .ctr-grid{grid-template-columns:repeat(2,1fr)}
  .rev-grid{grid-template-columns:1fr}
  .foot-g{grid-template-columns:1fr 1fr;gap:28px}
  .sec-title{font-size:clamp(22px,5vw,32px)}
  .cart-drawer{width:100%}
  .promo-flex{flex-direction:column;text-align:center;gap:20px}
  .b2b-grid{grid-template-columns:1fr}
}
/* Mobiles standards */
@media(max-width:600px){
  .wrap,.hero-in,.section{padding-left:16px;padding-right:16px}
  .nav-in{padding:0 14px;gap:8px;height:60px}
  .logo-text .on,.logo-text .sh{font-size:17px}
  .logo-emblem{width:38px;height:38px}
  .hero-h1{font-size:clamp(24px,8vw,34px)}
  .hero-ctas{flex-direction:column;width:100%}
  .hero-ctas .btn{width:100%;justify-content:center}
  .pg{grid-template-columns:repeat(2,1fr);gap:10px}
  .pc-img{height:120px}
  .pc-iw{font-size:38px}
  .pc-body{padding:12px}
  .pc-name{font-size:12.5px}
  .pc-price{font-size:15px}
  .cats-g{grid-template-columns:repeat(2,1fr)}
  .ctr-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .ctr-num{font-size:28px}
  .foot-g{grid-template-columns:1fr;gap:24px}
  .sec-h{margin-bottom:24px}
  .sec-tag{font-size:10px}
  .swb-in{gap:5px;padding:8px 14px}
  .sbn{font-size:11px;padding:7px 11px}
  .tkr-item{font-size:12px}
  .cart-item-name{max-width:140px}
}
/* Petits mobiles */
@media(max-width:480px){
  .nav-acts{gap:6px}
  .nbtn-wa span{display:none}
  .nbtn-wa{padding:0 12px}
  .lang-btn{padding:0 6px;font-size:10px}
  .hero-h1{font-size:clamp(22px,8.5vw,30px)}
  .hero-p{font-size:13.5px}
  .btn{font-size:14px;padding:13px 18px}
  .pg{gap:8px}
  .pc-img{height:110px}
  .sec-title{font-size:clamp(20px,6vw,26px)}
  .sec-sub{font-size:13px}
  .promo-title{font-size:22px}
  .cart-drawer{width:100%}
  .cart-head{padding:16px}
  .cart-items{padding:12px 14px}
  .cart-foot{padding:14px}
  .fly-particle{font-size:18px}
}
/* Très petits mobiles (Galaxy A0x, vieux Android) */
@media(max-width:380px){
  .nav-in{height:56px}
  .logo-text .sl{display:none}
  .lang-sel{display:none}
  .hero-h1{font-size:clamp(20px,9vw,26px)}
  .pg{grid-template-columns:1fr 1fr;gap:7px}
  .pc-img{height:100px}
  .pc-iw{font-size:32px}
  .pc-name{font-size:11.5px;line-height:1.3}
  .cats-g{grid-template-columns:1fr 1fr}
  .ctr-grid{grid-template-columns:1fr 1fr}
  .sbn small{display:none}
  .cart-item-ico{width:44px;height:44px;font-size:20px}
}
/* Mode paysage mobile */
@media(max-height:500px) and (orientation:landscape){
  .hero{min-height:auto;padding:40px 0}
  .hero-in{padding:30px 20px}
  .cart-drawer{width:min(380px,100vw)}
}
/* Écrans tactiles : zones de clic plus grandes */
@media(hover:none) and (pointer:coarse){
  .btn,.nbtn,.nicon,.cato,.sbn,.lang-btn,.pbtn{min-height:44px}
  .pbtn{min-width:44px}
  .ciq-btn{min-width:32px;min-height:32px}
}
/* Print */
@media print{
  .wa-float,.sticky-mobile,.scroll-top,.compare-bar,#cartDrawer,#cartOverlay,.swb,.tkr{display:none!important}
  body{background:#fff!important;color:#000!important}
}


/* ── PRIX : jamais coupé, jamais à la ligne ── */
.pc-price{white-space:nowrap!important;overflow:visible!important;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.pc-old{white-space:nowrap!important}
.pc-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:6px;margin-top:auto;flex-wrap:nowrap}
.pc-foot>div:first-child{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;justify-content:flex-end}
.pc-btns{display:flex;gap:5px;flex-shrink:0;flex-wrap:nowrap}
.cart-item-price{white-space:nowrap!important;font-variant-numeric:tabular-nums}
.cart-total-val{white-space:nowrap!important;font-variant-numeric:tabular-nums}
.price-main{white-space:nowrap!important;font-variant-numeric:tabular-nums}
.price-old{white-space:nowrap!important}
/* Sur très petit écran, réduire taille prix plutôt que couper */
@media(max-width:380px){
  .pc-price{font-size:14px}
  .pc-foot{gap:4px}
  .pbtn{width:32px;height:32px;font-size:15px}
  .pc-btns{gap:4px}
}
@media(max-width:340px){
  .pc-price{font-size:13px}
  .pbtn{width:30px;height:30px}
}


/* ── RAFFINEMENTS MISE EN PAGE PRO ── */
/* Cartes produit : hauteur uniforme, alignement parfait */
.pc{display:flex;flex-direction:column;height:100%}
.pc-body{display:flex;flex-direction:column;flex:1}
.pc-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em;line-height:1.3}
.pc-desc{margin-bottom:10px}
/* Grille produits : alignement régulier */
.pg{align-items:stretch}
/* Boutons d'action : taille tactile cohérente */
.pbtn-add{background:linear-gradient(135deg,var(--grn),var(--grn2));color:#fff;font-weight:700}
.pbtn-wa{background:var(--wa,#25D366);color:#fff;text-decoration:none}
/* Prix : hiérarchie visuelle claire */
.pc-foot>div:first-child{gap:1px}
/* Espacement vertical cohérent entre sections */
.section{padding-top:clamp(48px,7vw,80px);padding-bottom:clamp(48px,7vw,80px)}
/* Conteneur centré max-width cohérent */
.wrap,.hero-in{margin-left:auto;margin-right:auto}
/* Cartes catégorie : alignement texte */
.cat-card{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
/* Témoignages : hauteur uniforme */
.rev-card{display:flex;flex-direction:column;height:100%}
.rev-txt{flex:1}
/* Boutons CTA : padding cohérent, jamais de texte coupé */
.btn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Nav : alignement vertical parfait */
.nav-in{align-items:center}
.lang-sel{align-items:center}
/* Inputs : style cohérent */
input,select,textarea{font-family:'DM Sans',sans-serif}
/* Liens footer : espacement aéré */
.foot-col a{display:block;padding:3px 0}
/* Scrollbar discrète et élégante */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:rgba(0,0,0,.2)}
::-webkit-scrollbar-thumb{background:rgba(212,160,23,.4);border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:rgba(212,160,23,.6)}
/* Transitions douces partout */
a,button{transition:all .2s ease}
/* Images/emojis produits : centrage parfait */
.pc-iw{display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}
/* Badge saison active : alignement */
.cat-card .cat-badge{white-space:nowrap}
/* Empêcher tout débordement horizontal global */
body{overflow-x:hidden}
.wrap,.section,.hero{max-width:100vw}


/* ── FOOTER CARTE PRODUIT : PRIX TOUJOURS VISIBLE ── */
.pc-foot{display:flex;flex-direction:column;gap:10px;margin-top:auto;padding-top:12px}
.pc-price-row{display:flex;align-items:baseline;gap:8px;flex-wrap:nowrap;min-width:0;width:100%}
.pc-price{font-size:19px;font-weight:900;color:var(--sa,var(--grn));font-family:'Poppins',sans-serif;line-height:1;white-space:nowrap;font-variant-numeric:tabular-nums;flex-shrink:0}
.pc-old{font-size:12px;color:var(--stext3,var(--mute));text-decoration:line-through;white-space:nowrap;flex-shrink:0;font-variant-numeric:tabular-nums}
.pc-btns{display:flex;gap:7px;width:100%;flex-shrink:0}
.pbtn-add{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:42px;border-radius:11px;background:linear-gradient(135deg,var(--grn),var(--grn2));color:#fff;font-weight:800;font-size:14px;border:none;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .2s cubic-bezier(.34,1.56,.64,1);box-shadow:0 3px 12px rgba(27,94,32,.25)}
.pbtn-add:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(27,94,32,.4)}
.pbtn-add:active{transform:scale(.96)}
.pbtn-add .pbtn-ico{font-size:18px;font-weight:300;line-height:1}
.pbtn-wa{width:46px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:11px;background:var(--wa,#25D366);color:#fff;text-decoration:none;font-size:18px;flex-shrink:0;transition:all .2s cubic-bezier(.34,1.56,.64,1);box-shadow:0 3px 12px rgba(37,211,102,.25)}
.pbtn-wa:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(37,211,102,.45)}
.pbtn-wa:active{transform:scale(.96)}


/* ── ANIMATIONS PSYCHOLOGIQUES DE CONVERSION ── */
/* Hover carte : élévation + glow subtil (engagement) */
.pc{transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease,border-color .3s ease}
.pc:hover{transform:translateY(-6px);box-shadow:0 16px 40px rgba(0,0,0,.4),0 0 0 1px var(--sa,rgba(212,160,23,.3));z-index:2}
.pc:hover .pc-iw{transform:scale(1.12) rotate(-2deg)}
.pc-iw{transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
/* Pulse sur badge promo (urgence/attention) */
@keyframes promoPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.pcb-p{animation:promoPulse 2s ease-in-out infinite}
/* Shine effect au survol (premium feel) */
.pc-img{position:relative;overflow:hidden}
.pc-img::after{content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);transition:left .6s ease;pointer-events:none;z-index:1}
.pc:hover .pc-img::after{left:150%}
/* Compteur d'avis : effet "social proof" au survol */
.pc-rev{transition:color .2s}
.pc:hover .pc-rev{color:var(--gold2)}
/* Bouton favori : cœur qui bat */
@keyframes heartBeat{0%,100%{transform:scale(1)}25%{transform:scale(1.3)}50%{transform:scale(1.1)}75%{transform:scale(1.25)}}
.pc-fav.liked{animation:heartBeat .6s ease;color:#EF5350!important}
/* Apparition progressive des cartes au scroll (reveal) */
@keyframes cardReveal{0%{opacity:0;transform:translateY(24px)}100%{opacity:1;transform:translateY(0)}}
.pc{animation:cardReveal .5s cubic-bezier(.4,0,.2,1) backwards}
/* Effet ripple sur les boutons (feedback tactile) */
.pbtn-add,.btn{position:relative;overflow:hidden}
.ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.5);transform:scale(0);animation:rippleEffect .6s linear;pointer-events:none}
@keyframes rippleEffect{to{transform:scale(4);opacity:0}}
/* Stock faible : badge clignotant (rareté) */
@keyframes lowStock{0%,100%{opacity:1}50%{opacity:.5}}
.stock-low{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:700;color:#EF5350;animation:lowStock 1.5s ease-in-out infinite}
/* Nombre de personnes regardant (FOMO) */
.viewing-now{display:inline-flex;align-items:center;gap:5px;font-size:10px;color:var(--stext3,rgba(255,255,255,.5));margin-top:4px}
.viewing-dot{width:6px;height:6px;border-radius:50%;background:#43E883;animation:lowStock 2s ease-in-out infinite}
/* Toast amélioré avec slide + bounce */
@keyframes toastIn{0%{transform:translateX(120%) scale(.8);opacity:0}60%{transform:translateX(-8%) scale(1.02)}100%{transform:translateX(0) scale(1);opacity:1}}
#toast{animation:toastIn .45s cubic-bezier(.34,1.56,.64,1)}
/* CTA principal : respiration subtile (attire l'œil) */
@keyframes breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.015)}}
.hero-ctas .btn-wa{animation:breathe 3s ease-in-out infinite}
/* Hover sur prix : léger zoom (focalise l'attention) */
.pc:hover .pc-price{transform:scale(1.05);transition:transform .2s}
.pc-price{transform-origin:left center}


.sound-btn{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);cursor:pointer;font-size:15px;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}
.sound-btn:hover{background:rgba(255,255,255,.12);transform:scale(1.05)}
@media(max-width:480px){.sound-btn{width:30px;height:30px;font-size:13px}}
@media(max-width:380px){.sound-btn{display:none}}


/* ── LOGOS DE PAIEMENT ── */
.pay-badges{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;margin-top:14px}
.pay-logo{display:inline-flex;align-items:center;justify-content:center;text-align:center;min-width:54px;height:36px;padding:0 10px;border-radius:8px;font-size:10px;font-weight:800;color:#fff;line-height:1.05;font-family:'Poppins',sans-serif;letter-spacing:.02em;box-shadow:0 2px 8px rgba(0,0,0,.25);transition:transform .2s ease}
.pay-logo:hover{transform:translateY(-2px) scale(1.04)}
.pay-cash{font-size:11px}
.pay-soon{background:rgba(255,255,255,.06);border:1px dashed rgba(255,255,255,.2);color:rgba(255,255,255,.5);position:relative}
.pay-soon::after{content:'à venir';position:absolute;bottom:-7px;left:50%;transform:translateX(-50%);font-size:6.5px;color:var(--gold2);font-weight:600;white-space:nowrap}
@media(max-width:480px){.pay-logo{min-width:46px;height:32px;font-size:9px;padding:0 7px}}


/* ── LOGOS PAIEMENT OFFICIELS ── */
.pay-badges{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;margin-top:16px}
.pay-logo{display:inline-flex;align-items:center;gap:6px;height:42px;padding:0 12px;border-radius:10px;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.18);transition:transform .2s ease,box-shadow .2s ease;font-family:'Poppins',sans-serif}
.pay-logo:hover{transform:translateY(-3px);box-shadow:0 6px 18px rgba(0,0,0,.3)}
/* Orange Money - logo officiel: carré orange + texte */
.pay-om{background:#fff}
.pay-om-sq{background:#FF7900;color:#000;font-weight:800;font-size:10px;padding:4px 6px;border-radius:3px;text-transform:lowercase;letter-spacing:-.02em}
.pay-om-txt{color:#000;font-weight:700;font-size:12px}
/* Wave */
.pay-wave span{color:#0a0a0a;font-weight:800;font-size:13px}
/* Moov Money */
.pay-moov{flex-direction:column;gap:0;justify-content:center;line-height:1}
.pay-moov-txt{color:#005BAA;font-weight:900;font-size:14px;text-transform:lowercase}
.pay-moov-sub{color:#F7941E;font-weight:700;font-size:8px;text-transform:uppercase;letter-spacing:.05em}
/* Cash */
.pay-cash{background:linear-gradient(135deg,#2E7D32,#1B5E20)}
.pay-cash span{color:#fff;font-weight:700;font-size:10px;line-height:1.05}
/* Visa */
.pay-visa{background:#1A1F71;color:#fff;font-weight:900;font-size:15px;font-style:italic;letter-spacing:.06em}
/* Mastercard */
.pay-mc{background:#fff;padding:0 14px}
.pay-visa,.pay-mc{opacity:.92;position:relative}
.pay-visa::after,.pay-mc::after{content:'à venir';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);font-size:7px;color:var(--gold2);font-weight:600;white-space:nowrap}
/* Trust */
.pay-trust{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:center;margin-top:14px}
.pay-trust-item{font-size:11px;color:rgba(255,255,255,.55);font-weight:500}
@media(max-width:480px){.pay-logo{height:38px;padding:0 10px}.pay-om-txt,.pay-wave span{font-size:11px}}


/* ── INDICATEURS STOCK & DEMANDE ── */
.stock-ind{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;margin-top:6px;padding:3px 8px;border-radius:6px;line-height:1.2}
.si-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;animation:siPulse 1.8s ease-in-out infinite}
@keyframes siPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.85)}}
.stock-low{background:rgba(239,83,80,.12);color:#EF5350}
.stock-low .si-dot{background:#EF5350}
.stock-med{background:rgba(255,167,38,.12);color:#FFA726}
.stock-med .si-dot{background:#FFA726}
.stock-high{background:rgba(67,232,131,.12);color:#43E883}
.stock-high .si-dot{background:#43E883}
.stock-pre{background:rgba(99,102,241,.12);color:#818CF8}
.stock-pre .si-dot{background:#818CF8}
.demand-ind{font-size:10px;color:var(--gold2);font-weight:600;margin-top:4px}


/* ══ AMÉLIORATIONS DESIGN PREMIUM ══ */
/* Boutons: courbures douces et modernes + meilleure lisibilité */
.pbtn-add{border-radius:13px!important;font-weight:800!important;letter-spacing:.01em;font-size:14.5px!important}
.pbtn-wa{border-radius:13px!important}
.btn,.btn-wa,.cta,.adm-add-btn,.cart-order-btn{border-radius:14px!important;font-weight:700;letter-spacing:.01em}
.cato{border-radius:12px!important;font-weight:600}
/* Cartes produit: courbure plus douce, ombre raffinée */
.pc{border-radius:18px!important}
.pc-iw{border-radius:14px!important}
/* Lisibilité accrue: nom produit plus lisible */
.pc-name,.pc-title,.pc a{font-weight:700!important;letter-spacing:-.01em;line-height:1.3}
/* Prix plus visible */
.pc-price{font-size:20px!important;font-weight:900!important;letter-spacing:-.02em}
/* Meilleur contraste descriptions */
.pc-desc{color:rgba(255,255,255,.62)!important;font-size:11.5px!important;line-height:1.5!important}
/* Inputs admin: courbure moderne */
.adm-inp,.adm-sel,input,select,textarea{border-radius:11px!important}
/* Badges plus arrondis */
.pcb,.pcb-p,.pcb-t,.pcb-n{border-radius:8px!important;font-weight:700;letter-spacing:.02em}
/* Champ recherche */
.search-box,.srch,#searchInput{border-radius:14px!important}
/* Panier drawer */
.cart-item{border-radius:14px!important}
/* Focus visible accessibilité (lisibilité clavier) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2.5px solid var(--gold2);outline-offset:2px;border-radius:6px}
/* Boutons: micro-feedback tactile amélioré */
.pbtn-add:active,.btn:active,.cato:active{transform:scale(.97)}
/* Transitions douces partout */
.pc,.pbtn-add,.pbtn-wa,.cato,.btn{transition:all .25s cubic-bezier(.34,1.56,.64,1)}
/* Meilleure hiérarchie visuelle: catégorie en majuscule espacée */
.pc-cat{text-transform:uppercase;letter-spacing:.06em;font-size:9.5px!important;font-weight:700;opacity:.7}


/* ── LOGOS PAIEMENT OFFICIELS (images) ── */
.pay-badges{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;margin-top:16px}
.pay-logo-img{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:46px;min-width:62px;padding:6px 12px;border-radius:12px;background:#fff;box-shadow:0 3px 12px rgba(0,0,0,.18);transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease;overflow:hidden}
.pay-logo-img img{height:32px;width:auto;max-width:90px;object-fit:contain;display:block}
.pay-logo-img:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 8px 22px rgba(0,0,0,.32)}
/* Animation d'entrée en cascade */
@keyframes payIn{0%{opacity:0;transform:translateY(12px) scale(.9)}100%{opacity:1;transform:translateY(0) scale(1)}}
.pay-logo-img{animation:payIn .5s cubic-bezier(.34,1.56,.64,1) backwards}
.pay-logo-img:nth-child(1){animation-delay:.05s}
.pay-logo-img:nth-child(2){animation-delay:.12s}
.pay-logo-img:nth-child(3){animation-delay:.19s}
.pay-logo-img:nth-child(4){animation-delay:.26s}
.pay-logo-img:nth-child(5){animation-delay:.33s}
.pay-logo-img:nth-child(6){animation-delay:.40s}
/* Reflet brillant au survol */
.pay-logo-img::after{content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);transition:left .5s ease;pointer-events:none}
.pay-logo-img{position:relative}
.pay-logo-img:hover::after{left:150%}
.pay-cash-box{background:linear-gradient(135deg,#2E7D32,#1B5E20)}
.pay-cash-box span{color:#fff;font-weight:700;font-size:10px;line-height:1.05;font-family:'Poppins',sans-serif}
.pay-soon-box{opacity:.9;position:relative}
.pay-visa-txt{color:#1A1F71;font-weight:900;font-size:16px;font-style:italic;letter-spacing:.05em;font-family:'Poppins',sans-serif}
.pay-soon-box::before{content:'à venir';position:absolute;bottom:1px;left:50%;transform:translateX(-50%);font-size:6.5px;color:#999;font-weight:600;white-space:nowrap}
.pay-trust{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:center;margin-top:14px}
.pay-trust-item{font-size:11.5px;color:rgba(255,255,255,.6);font-weight:500}
@media(max-width:480px){.pay-logo-img{height:40px;min-width:54px;padding:5px 9px}.pay-logo-img img{height:26px}}


/* ── LOGO ONIVA OFFICIEL ── */
.logo-emblem-img{background:#fff!important;padding:3px;overflow:hidden}
.logo-emblem-img img{width:100%;height:100%;object-fit:contain;border-radius:inherit}


/* ── BANNIÈRE LIVRAISON ANIMÉE ── */
.deliv-banner{max-width:1200px;margin:24px auto;padding:0 16px}
.deliv-in{display:flex;align-items:center;gap:18px;background:linear-gradient(135deg,rgba(27,94,32,.15),rgba(212,160,23,.08));border:1px solid rgba(212,160,23,.2);border-radius:18px;padding:16px 22px;overflow:hidden;position:relative}
.deliv-road{position:relative;width:130px;height:60px;flex-shrink:0;overflow:hidden}
.deliv-rider{position:absolute;top:50%;left:-70px;transform:translateY(-50%);height:54px;width:auto;animation:ride 5s linear infinite;z-index:2}
@keyframes ride{0%{left:-70px;opacity:0}8%{opacity:1}92%{opacity:1}100%{left:100%;opacity:0}}
.deliv-line{position:absolute;bottom:8px;left:0;width:100%;height:3px;background:repeating-linear-gradient(90deg,var(--gold2) 0,var(--gold2) 12px,transparent 12px,transparent 24px);opacity:.4;animation:road 1s linear infinite}
@keyframes road{0%{background-position:0 0}100%{background-position:-24px 0}}
.deliv-txt{display:flex;flex-direction:column;gap:3px}
.deliv-txt strong{font-size:16px;color:var(--gold2);font-family:'Poppins',sans-serif;font-weight:700}
.deliv-txt span{font-size:12.5px;color:rgba(255,255,255,.65)}
@media(max-width:600px){.deliv-in{gap:12px;padding:14px 16px}.deliv-road{width:90px;height:48px}.deliv-rider{height:42px}.deliv-txt strong{font-size:14px}.deliv-txt span{font-size:11px}}
@media(prefers-reduced-motion:reduce){.deliv-rider,.deliv-line{animation:none}.deliv-rider{left:10px;opacity:1}}


/* Visa/Mastercard à venir — style discret grisé */
.pay-soon-box{opacity:.45!important;filter:grayscale(.6)}
.pay-soon-box:hover{opacity:.7!important;transform:none!important}
.pay-soon-box::before{content:'à venir';color:#888!important}


/* ── COMMENT COMMANDER ── */
.how-order{max-width:1100px;margin:50px auto;padding:0 16px}
.how-head{text-align:center;margin-bottom:32px}
.how-sub{font-size:13.5px;color:rgba(255,255,255,.6);margin-top:8px}
.how-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-bottom:28px}
.how-step{display:flex;align-items:flex-start;gap:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px 18px;transition:all .25s cubic-bezier(.34,1.56,.64,1)}
.how-step:hover{background:rgba(212,160,23,.07);border-color:rgba(212,160,23,.25);transform:translateY(-3px)}
.how-num{flex-shrink:0;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--grn),var(--grn2));color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;font-family:'Poppins',sans-serif;box-shadow:0 3px 10px rgba(27,94,32,.3)}
.how-step div{display:flex;flex-direction:column;gap:3px}
.how-step strong{font-size:14px;color:#fff;font-weight:700}
.how-step span{font-size:12px;color:rgba(255,255,255,.55);line-height:1.4}
.how-badges{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin-bottom:24px}
.how-badge{display:flex;align-items:flex-start;gap:14px;border-radius:16px;padding:18px 20px}
.how-badge-green{background:linear-gradient(135deg,rgba(67,232,131,.12),rgba(46,125,50,.08));border:1px solid rgba(67,232,131,.25)}
.how-badge-gold{background:linear-gradient(135deg,rgba(212,160,23,.12),rgba(232,184,36,.06));border:1px solid rgba(212,160,23,.25)}
.hb-ico{flex-shrink:0;font-size:24px;line-height:1}
.how-badge strong{display:block;font-size:14.5px;color:#fff;margin-bottom:4px;font-weight:700}
.how-badge span{font-size:12.5px;color:rgba(255,255,255,.65);line-height:1.5}
.how-proof{background:rgba(255,255,255,.03);border:1px dashed rgba(212,160,23,.3);border-radius:14px;padding:18px 20px;text-align:center}
.how-proof-title{display:block;font-size:13px;color:var(--gold2);font-weight:600;margin-bottom:12px}
.how-proof-items{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.hp-item{font-size:12.5px;color:rgba(255,255,255,.7);background:rgba(255,255,255,.05);padding:8px 14px;border-radius:9px;font-weight:500}
@media(max-width:600px){.how-steps{grid-template-columns:1fr}.how-order{margin:36px auto}}


/* ── CONFIRMATION DE COMMANDE ── */
.order-confirm{position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:9999;opacity:0;transition:opacity .3s ease;padding:20px}
.order-confirm.show{opacity:1}
.oc-box{background:linear-gradient(160deg,#1a2e1d,#0f1f12);border:1px solid rgba(212,160,23,.3);border-radius:22px;padding:32px 26px;max-width:400px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.5);transform:scale(.9);transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.order-confirm.show .oc-box{transform:scale(1)}
.oc-check{font-size:54px;margin-bottom:8px;animation:ocPop .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes ocPop{0%{transform:scale(0)}100%{transform:scale(1)}}
.oc-box h3{font-size:21px;color:var(--gold2);font-family:'Poppins',sans-serif;font-weight:800;margin-bottom:12px}
.oc-box p{font-size:13.5px;color:rgba(255,255,255,.75);line-height:1.6;margin-bottom:16px}
.oc-reassure{background:rgba(67,232,131,.1);border:1px solid rgba(67,232,131,.25);border-radius:12px;padding:12px 16px;font-size:12.5px;color:#43E883;line-height:1.5;margin-bottom:20px}
.oc-btn{width:100%;height:48px;border-radius:14px;background:linear-gradient(135deg,var(--grn),var(--grn2));color:#fff;font-weight:800;font-size:15px;border:none;cursor:pointer;font-family:'DM Sans',sans-serif;transition:transform .2s}
.oc-btn:hover{transform:translateY(-2px)}
.oc-btn:active{transform:scale(.97)}


.pay-more-link{display:inline-block;margin-top:12px;font-size:12.5px;color:var(--gold2);text-decoration:none;font-weight:600;transition:opacity .2s}
.pay-more-link:hover{opacity:.7;text-decoration:underline}

/* ══════════ MODALE CHECKOUT ══════════ */
.co-modal{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.75);backdrop-filter:blur(5px);display:none;align-items:flex-end;justify-content:center;opacity:0;transition:opacity .3s ease}
.co-modal.show{display:flex;opacity:1}
.co-box{background:#0f1f14;width:100%;max-width:540px;max-height:94vh;border-radius:24px 24px 0 0;overflow:hidden;display:flex;flex-direction:column;transform:translateY(100%);transition:transform .4s cubic-bezier(.34,1.4,.5,1);box-shadow:0 -8px 40px rgba(0,0,0,.5)}
.co-modal.show .co-box{transform:translateY(0)}
@media(min-width:560px){.co-modal{align-items:center}.co-box{border-radius:24px;max-height:90vh}.co-modal.show .co-box{transform:scale(1)}.co-box{transform:scale(.95)}}
.co-header{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0;background:linear-gradient(135deg,rgba(27,94,32,.3),transparent)}
.co-header h2{font-family:'Poppins',sans-serif;font-size:19px;font-weight:800;color:#fff}
.co-close{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);border:none;color:#fff;font-size:16px;cursor:pointer;transition:all .2s;flex-shrink:0}
.co-close:hover{background:rgba(255,255,255,.16);transform:rotate(90deg)}
.co-body{overflow-y:auto;padding:20px 22px;flex:1}
.co-summary{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px;margin-bottom:22px}
.co-sum-item{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;padding:6px 0;color:rgba(255,255,255,.8)}
.co-sum-item:not(:last-child){border-bottom:1px solid rgba(255,255,255,.05)}
.co-sum-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.co-sum-qty{color:var(--gold2);font-weight:600;flex-shrink:0}
.co-sum-price{font-weight:700;color:#fff;flex-shrink:0;font-variant-numeric:tabular-nums}
.co-sum-total{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding-top:12px;border-top:2px solid rgba(212,160,23,.3);font-size:15px}
.co-sum-total strong{color:var(--gold2);font-family:'Poppins',sans-serif;font-size:18px}
.co-sec-title{font-size:13px;font-weight:700;color:var(--gold2);text-transform:uppercase;letter-spacing:.05em;margin:18px 0 14px}
.co-field{margin-bottom:16px}
.co-field label{display:block;font-size:13px;font-weight:600;color:rgba(255,255,255,.85);margin-bottom:7px}
.req{color:#EF5350}
.co-field input,.co-field select,.co-field textarea{width:100%;height:48px;background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.12);border-radius:12px;padding:0 14px;color:#fff;font-size:15px;font-family:'DM Sans',sans-serif;transition:all .2s;outline:none}
.co-field textarea{height:auto;padding:12px 14px;resize:vertical;min-height:60px}
.co-field input:focus,.co-field select:focus,.co-field textarea:focus{border-color:var(--gold2);background:rgba(212,160,23,.06)}
.co-field input.valid,.co-field select.valid{border-color:#43E883}
.co-field input.invalid,.co-field select.invalid{border-color:#EF5350}
.co-field select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23E8B824' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
.co-tel-wrap{display:flex;gap:8px}
.co-tel-code{display:flex;align-items:center;padding:0 14px;background:rgba(212,160,23,.12);border:1.5px solid rgba(212,160,23,.3);border-radius:12px;color:var(--gold2);font-weight:700;font-size:15px;flex-shrink:0;white-space:nowrap}
.co-tel-wrap input{flex:1}
.co-err{display:block;font-size:11.5px;color:#EF5350;margin-top:5px;min-height:14px;font-weight:500}
.co-deliv-info{border-radius:12px;padding:14px 16px;margin:18px 0;font-size:13px;font-weight:600;line-height:1.5;display:none}
.co-deliv-info.show{display:block}
.co-deliv-free{background:rgba(67,232,131,.12);border:1px solid rgba(67,232,131,.3);color:#43E883}
.co-deliv-paid{background:rgba(255,167,38,.1);border:1px solid rgba(255,167,38,.3);color:#FFA726}
.co-deliv-progress{background:rgba(212,160,23,.1);border:1px solid rgba(212,160,23,.3);color:var(--gold2)}
.co-notice{background:rgba(255,255,255,.04);border:1px dashed rgba(255,255,255,.2);border-radius:12px;padding:14px 16px;font-size:12px;color:rgba(255,255,255,.65);line-height:1.55;margin-bottom:20px}
.co-actions{display:flex;flex-direction:column;gap:10px}
.co-btn{height:54px;border-radius:14px;border:none;font-size:15.5px;font-weight:800;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .25s cubic-bezier(.34,1.56,.64,1);display:flex;align-items:center;justify-content:center;gap:8px}
.co-btn:disabled{opacity:.4;cursor:not-allowed}
.co-btn-wa{background:linear-gradient(135deg,#25D366,#1da851);color:#fff}
.co-btn-wa:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(37,211,102,.4)}
.co-btn-email{background:rgba(255,255,255,.08);color:#fff;border:1.5px solid rgba(255,255,255,.15)}
.co-btn-email:not(:disabled):hover{background:rgba(255,255,255,.14);transform:translateY(-2px)}
.co-disabled-hint{text-align:center;font-size:11.5px;color:rgba(255,255,255,.45);margin-top:12px}
.co-disabled-hint.hidden{display:none}


/* ── BARRE DE TRI ── */
.sort-bar{display:flex;align-items:center;gap:10px;max-width:1200px;margin:0 auto 18px;padding:0 16px;justify-content:flex-end}
.sort-label{font-size:13px;color:rgba(255,255,255,.6);font-weight:500}
.sort-select{height:40px;background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.12);border-radius:11px;padding:0 36px 0 14px;color:#fff;font-size:13.5px;font-weight:600;cursor:pointer;font-family:'DM Sans',sans-serif;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23E8B824' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;transition:border-color .2s}
.sort-select:focus{outline:none;border-color:var(--gold2)}
@media(max-width:480px){.sort-bar{justify-content:space-between}.sort-select{flex:1;max-width:200px}}


/* ── BANNIÈRE HORS CONNEXION ── */
.offline-bar{position:fixed;top:0;left:0;right:0;z-index:10001;background:linear-gradient(135deg,#EF5350,#c62828);color:#fff;text-align:center;padding:0;font-size:13.5px;font-weight:600;transform:translateY(-100%);transition:transform .3s ease;box-shadow:0 2px 12px rgba(0,0,0,.3)}
.offline-bar.show{transform:translateY(0);padding:11px 16px}



/* Bouton méthode choisie mis en avant */
.co-btn-highlight{box-shadow:0 0 0 3px var(--gold2),0 8px 24px rgba(212,160,23,.3)!important;transform:translateY(-2px)}
.co-btn-highlight::after{content:'✓ Votre choix';position:absolute;top:-9px;right:10px;background:var(--gold2);color:#1a1a1a;font-size:9px;font-weight:800;padding:2px 8px;border-radius:10px}
.co-btn{position:relative}


/* ── RÉSUMÉ : lignes détaillées + livraison ── */
.co-sum-line{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;padding:7px 0;color:rgba(255,255,255,.75);border-top:1px solid rgba(255,255,255,.05)}
.co-sum-val{font-weight:600;color:#fff;flex-shrink:0;font-variant-numeric:tabular-nums}
.co-sum-pending .co-sum-val{color:rgba(255,255,255,.45);font-weight:500;font-style:italic;font-size:12px}
.co-ship-old{color:rgba(255,255,255,.4);font-weight:500;margin-right:6px}
.co-ship-free{color:#43E883;font-weight:800;letter-spacing:.02em}
.co-sum-note{font-size:11.5px;color:rgba(255,255,255,.55);margin-top:6px;line-height:1.45;padding:2px 0}


/* ── COPYRIGHT FOOTER ── */
.footer-copy{margin-top:24px;padding-top:18px;border-top:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center}
.footer-copy>span:first-child{font-size:12.5px;color:rgba(255,255,255,.5);font-weight:500}
.footer-copy-links{font-size:11.5px;color:rgba(255,255,255,.4)}
.footer-copy-links a{color:rgba(255,255,255,.55);text-decoration:none;transition:color .2s}
.footer-copy-links a:hover{color:var(--gold2)}


/* ── SÉLECTEUR WHATSAPP ── */
.wa-picker{position:fixed;inset:0;z-index:10002;background:rgba(0,0,0,.7);backdrop-filter:blur(5px);display:none;align-items:flex-end;justify-content:center;opacity:0;transition:opacity .3s;padding:0}
.wa-picker.show{display:flex;opacity:1}
.wa-picker-box{background:#0f1f14;width:100%;max-width:460px;border-radius:24px 24px 0 0;padding:26px 22px calc(26px + env(safe-area-inset-bottom));position:relative;transform:translateY(100%);transition:transform .4s cubic-bezier(.34,1.4,.5,1)}
.wa-picker.show .wa-picker-box{transform:translateY(0)}
@media(min-width:520px){.wa-picker{align-items:center}.wa-picker-box{border-radius:24px}.wa-picker.show .wa-picker-box{transform:scale(1)}.wa-picker-box{transform:scale(.95)}}
.wa-picker-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.08);border:none;color:#fff;font-size:15px;cursor:pointer}
.wa-picker-box h3{font-family:'Poppins',sans-serif;font-size:19px;font-weight:800;color:#fff;margin-bottom:8px;padding-right:30px}
.wa-picker-box>p{font-size:13px;color:rgba(255,255,255,.6);margin-bottom:20px;line-height:1.5}
.wa-pick-btn{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.12);border-radius:15px;padding:16px;margin-bottom:12px;text-decoration:none;transition:all .25s cubic-bezier(.34,1.56,.64,1);position:relative;min-height:44px}
.wa-pick-btn:hover{transform:translateY(-2px);border-color:#25D366;background:rgba(37,211,102,.08)}
.wa-pick-main{border-color:rgba(37,211,102,.4);background:rgba(37,211,102,.1)}
.wa-pick-ico{width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg,#25D366,#1da851);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.wa-pick-txt{display:flex;flex-direction:column;gap:2px;flex:1}
.wa-pick-txt strong{font-size:15px;color:#fff;font-weight:700}
.wa-pick-txt span{font-size:13px;color:rgba(255,255,255,.6)}
.wa-pick-badge{position:absolute;top:12px;right:12px;background:linear-gradient(135deg,var(--gold),var(--gold2));color:#1a1a1a;font-size:9.5px;font-weight:800;padding:3px 9px;border-radius:10px;text-transform:uppercase;letter-spacing:.02em}
.wa-pick-lastused::after{content:'Déjà utilisé';position:absolute;top:12px;right:12px;background:rgba(255,255,255,.15);color:#fff;font-size:9px;font-weight:700;padding:3px 8px;border-radius:10px}
.wa-pick-alt{margin-top:8px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);text-align:center}
.wa-pick-alt>span{display:block;font-size:12px;color:rgba(255,255,255,.5);margin-bottom:8px}
.wa-pick-email{display:inline-flex;align-items:center;gap:6px;color:var(--gold2);text-decoration:none;font-size:13.5px;font-weight:600;padding:8px 16px;border-radius:10px;background:rgba(212,160,23,.1);transition:all .2s}
.wa-pick-email:hover{background:rgba(212,160,23,.18)}


/* ── CODE PRODUIT ── */
.pc-code{font-size:9px;color:rgba(255,255,255,.35);font-family:'DM Sans',monospace;letter-spacing:.03em;margin-top:4px;font-weight:600}


/* ── CONTINUER MES ACHATS ── */
.cart-continue-btn{margin-top:16px;background:rgba(212,160,23,.12);border:1px solid rgba(212,160,23,.3);color:var(--gold2);font-weight:700;font-size:13px;padding:11px 20px;border-radius:11px;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .2s}
.cart-continue-btn:hover{background:rgba(212,160,23,.2)}
.cart-continue-link{width:100%;background:none;border:none;color:rgba(255,255,255,.6);font-size:13px;font-weight:600;padding:10px;cursor:pointer;font-family:'DM Sans',sans-serif;transition:color .2s;margin-bottom:6px}
.cart-continue-link:hover{color:var(--gold2)}


/* ── TABLEAU DE BORD ── */
.dash-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:18px}
.dash-card{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:14px}
.dash-card-wide{grid-column:1/-1}
.dash-ico{font-size:26px;flex-shrink:0}
.dash-card strong{display:block;font-size:22px;font-weight:800;color:var(--gold2);font-family:'Poppins',sans-serif;line-height:1}
.dash-card span{font-size:12px;color:rgba(255,255,255,.6)}
.dash-version{text-align:center;padding:14px;background:rgba(212,160,23,.06);border-radius:10px;display:flex;flex-direction:column;gap:3px}
.dash-version strong{color:var(--gold2);font-family:'Poppins',sans-serif;font-size:14px}
.dash-version span{font-size:11.5px;color:rgba(255,255,255,.5)}


/* ── JOURNAL ADMIN ── */
.alog-list{max-height:340px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}
.alog-item{display:flex;align-items:flex-start;gap:10px;background:rgba(255,255,255,.04);border-radius:9px;padding:10px 12px}
.alog-ico{font-size:16px;flex-shrink:0}
.alog-txt{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.alog-txt strong{font-size:13px;color:#fff}
.alog-txt span{font-size:11.5px;color:rgba(255,255,255,.6)}
.alog-date{font-size:10.5px!important;color:rgba(255,255,255,.4)!important}


/* ── PARAMÈTRES ── */
.set-group{margin-bottom:18px}
.set-group h4{font-size:13px;color:var(--gold2);margin-bottom:10px;font-family:'Poppins',sans-serif}
.set-field{margin-bottom:10px}
.set-field label{display:block;font-size:12px;color:rgba(255,255,255,.7);margin-bottom:4px}