/*
Theme Name: Le Comptoir Gourmand
Theme URI: https://comptoir-gourmand.com
Author: Agence Pixsell
Description: Theme sur mesure reproduisant fidelement la maquette Le Comptoir Gourmand (epicerie fine, Dakar). Catalogue dynamique WooCommerce, commande par WhatsApp.
Version: 1.4.1
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GPL v2 or later
Text Domain: comptoir-gourmand
*/

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --gold:#C9A84C;--gold2:#E8C96A;--gold3:#F5E4A8;
  --gold-dim:rgba(201,168,76,0.12);--gold-glow:rgba(201,168,76,0.4);
  --black:#050503;--black2:#0A0908;--black3:#0F0E0A;
  --border:rgba(201,168,76,0.18);--border2:rgba(201,168,76,0.5);
  --text:rgba(248,240,210,0.85);--text-dim:rgba(248,240,210,0.35);
}
html{scroll-behavior:smooth}
body{font-family:'Rajdhani',sans-serif;background:var(--black);color:var(--text);overflow-x:hidden;cursor:none}
::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:var(--black2)}::-webkit-scrollbar-thumb{background:var(--gold)}

/* CURSOR */
.cursor,.cursor-ring{position:fixed;pointer-events:none;z-index:9999;transform:translate(-50%,-50%)}
.cursor{width:6px;height:6px;background:var(--gold);border-radius:50%;box-shadow:0 0 10px var(--gold),0 0 20px var(--gold-glow)}
.cursor-ring{width:28px;height:28px;border:1px solid var(--border2);border-radius:50%;z-index:9998;transition:transform 0.15s,border-color 0.15s}

/* SCANLINES */
body::before{content:'';position:fixed;inset:0;z-index:1000;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(201,168,76,0.015) 3px,rgba(201,168,76,0.015) 4px)}

/* GRID */
body::after{content:'';position:fixed;inset:0;z-index:998;pointer-events:none;
  background-image:linear-gradient(rgba(201,168,76,0.025) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,76,0.025) 1px,transparent 1px);
  background-size:80px 80px}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:500;height:64px;
  display:flex;align-items:center;justify-content:space-between;padding:0 2.5rem;
  background:rgba(5,5,3,0.94);border-bottom:1px solid var(--border);backdrop-filter:blur(20px)}
nav::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);animation:gline 4s ease-in-out infinite}
@keyframes gline{0%,100%{opacity:0.3}50%{opacity:1}}
.nav-logo{display:flex;align-items:center;gap:0.7rem;text-decoration:none}
.nav-hex{width:30px;height:30px;border:1px solid var(--border2);display:flex;align-items:center;justify-content:center;font-size:0.9rem;clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%)}
.nav-name{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:0.95rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold)}
.nav-name span{color:var(--text-dim);font-weight:300}
.nav-links{display:flex;gap:2rem;list-style:none}
.nav-links a{color:var(--text-dim);font-size:0.68rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;text-decoration:none;transition:color 0.2s;font-family:'Rajdhani',sans-serif}
.nav-links a:hover{color:var(--gold)}
.nav-right{display:flex;align-items:center;gap:1rem}
.nav-ping{display:flex;align-items:center;gap:0.5rem;font-family:'Share Tech Mono',monospace;font-size:0.6rem;color:var(--text-dim)}
.ping-dot{width:5px;height:5px;border-radius:50%;background:#39FF14;box-shadow:0 0 6px #39FF14;animation:blink 2s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0.2}}
.nav-cta{border:1px solid var(--border2);color:var(--gold);padding:0.45rem 1.2rem;font-size:0.68rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;text-decoration:none;font-family:'Rajdhani',sans-serif;transition:all 0.25s;position:relative;overflow:hidden}
.nav-cta::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(201,168,76,0.12),transparent);transform:translateX(-100%);transition:transform 0.4s}
.nav-cta:hover::after{transform:translateX(100%)}
.nav-cta:hover{box-shadow:0 0 18px var(--gold-glow)}

/* HERO */
.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:7rem 2rem 5rem;position:relative;overflow:hidden;background:var(--black2);text-align:center}
.hero-hex-bg{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='100'%3E%3Cpolygon points='28,2 54,17 54,50 28,65 2,50 2,17' fill='none' stroke='rgba(201,168,76,0.05)' stroke-width='1'/%3E%3Cpolygon points='28,52 54,67 54,100 28,115 2,100 2,67' fill='none' stroke='rgba(201,168,76,0.05)' stroke-width='1'/%3E%3C/svg%3E");background-size:56px 100px}
.hero-glow{position:absolute;width:800px;height:800px;border-radius:50%;background:radial-gradient(circle,rgba(201,168,76,0.04) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);animation:glowPulse 5s ease-in-out infinite}
@keyframes glowPulse{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:0.6}50%{transform:translate(-50%,-50%) scale(1.1);opacity:1}}
.hero-rings{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.hring{position:absolute;border-radius:50%;border:1px solid var(--border);animation:ringPulse 5s ease-in-out infinite}
.hring:nth-child(1){width:350px;height:350px}
.hring:nth-child(2){width:550px;height:550px;animation-delay:1s;border-color:rgba(201,168,76,0.1)}
.hring:nth-child(3){width:750px;height:750px;animation-delay:2s;border-color:rgba(201,168,76,0.06)}
@keyframes ringPulse{0%,100%{opacity:0.5;transform:scale(1)}50%{opacity:1;transform:scale(1.02)}}
.hero-particles{position:absolute;inset:0;overflow:hidden}
.ptcl{position:absolute;width:1px;background:linear-gradient(transparent,var(--gold),transparent);animation:ptclFall linear infinite;opacity:0}
@keyframes ptclFall{0%{transform:translateY(-200px);opacity:0}15%{opacity:0.8}85%{opacity:0.3}100%{transform:translateY(110vh);opacity:0}}

.hero-inner{position:relative;z-index:2;max-width:860px}
.hero-sys{font-family:'Share Tech Mono',monospace;font-size:0.6rem;letter-spacing:0.3em;color:rgba(201,168,76,0.5);margin-bottom:2rem;display:flex;align-items:center;justify-content:center;gap:1rem}
.hero-sys::before,.hero-sys::after{content:'';width:50px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.hero-sys::after{transform:scaleX(-1)}
.hero-icon{font-size:3.5rem;margin-bottom:0.8rem;filter:drop-shadow(0 0 25px var(--gold)) drop-shadow(0 0 50px rgba(201,168,76,0.3));animation:iconFloat 4s ease-in-out infinite}
@keyframes iconFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-8px) scale(1.05)}}
.hero-le{font-family:'Share Tech Mono',monospace;font-size:0.75rem;letter-spacing:0.6em;color:rgba(201,168,76,0.45);margin-bottom:0.1rem}
.hero-h1{font-family:'Cormorant Garamond',serif;font-size:clamp(5rem,11vw,9rem);font-weight:700;line-height:0.88;color:var(--gold);letter-spacing:0.04em;text-shadow:0 0 60px rgba(201,168,76,0.25),0 0 120px rgba(201,168,76,0.1);position:relative;margin-bottom:0.2rem}
.hero-h1::before{content:attr(data-t);position:absolute;inset:0;color:transparent;-webkit-text-stroke:1px rgba(201,168,76,0.15);transform:translate(4px,4px);z-index:-1}
.hero-h2{font-family:'Cormorant Garamond',serif;font-size:clamp(1.1rem,2.5vw,1.6rem);font-weight:300;letter-spacing:0.55em;color:rgba(201,168,76,0.5);text-transform:uppercase}
.hero-div{display:flex;align-items:center;justify-content:center;gap:1rem;margin:1.8rem 0}
.hdline{height:1px;width:90px}
.hdline-l{background:linear-gradient(90deg,transparent,var(--gold))}
.hdline-r{background:linear-gradient(90deg,var(--gold),transparent)}
.hddiamond{color:var(--gold);font-size:0.45rem;letter-spacing:0.4em}
.hero-tag{font-family:'Share Tech Mono',monospace;font-size:0.62rem;letter-spacing:0.18em;color:var(--text-dim);margin-bottom:2.5rem}
.hero-tag span{color:rgba(201,168,76,0.65)}
.hero-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* BUTTONS */
.btn{position:relative;padding:0.9rem 2.5rem;font-family:'Rajdhani',sans-serif;font-size:0.72rem;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;text-decoration:none;transition:all 0.3s;overflow:hidden;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.btn-gold{background:var(--gold);color:var(--black)}
.btn-gold:hover{background:var(--gold2);box-shadow:0 0 35px var(--gold-glow);transform:translateY(-2px)}
.btn-outline{background:transparent;color:var(--gold);border:1px solid var(--border2)}
.btn-outline::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,transparent 30%,rgba(201,168,76,0.1),transparent 70%);transform:translateX(-100%);transition:transform 0.45s}
.btn-outline:hover::before{transform:translateX(100%)}
.btn-outline:hover{box-shadow:0 0 25px var(--gold-glow);transform:translateY(-2px)}

/* HERO STATS */
.hero-stats{position:relative;z-index:2;margin-top:4rem;display:flex;border:1px solid var(--border);max-width:680px;width:100%;margin-left:auto;margin-right:auto;background:rgba(5,5,3,0.85)}
.hst{flex:1;padding:1.3rem 1rem;text-align:center;border-right:1px solid var(--border);position:relative}
.hst:last-child{border-right:none}
.hst::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:30px;height:2px;background:var(--gold);box-shadow:0 0 8px var(--gold-glow)}
.hst-n{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:700;color:var(--gold);line-height:1;text-shadow:0 0 15px rgba(201,168,76,0.4)}
.hst-l{font-family:'Share Tech Mono',monospace;font-size:0.5rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--text-dim);margin-top:0.3rem}

/* TICKER */
.ticker-wrap{background:var(--black3);border-top:1px solid var(--border);border-bottom:1px solid var(--border);overflow:hidden;position:relative;padding:0}
.ticker-wrap::before,.ticker-wrap::after{content:'';position:absolute;top:0;bottom:0;width:80px;z-index:2;pointer-events:none}
.ticker-wrap::before{left:0;background:linear-gradient(90deg,var(--black3),transparent)}
.ticker-wrap::after{right:0;background:linear-gradient(90deg,transparent,var(--black3))}
.ticker-inner{display:flex;animation:tick 25s linear infinite;white-space:nowrap}
.ticker-inner:hover{animation-play-state:paused}
.titem{display:flex;align-items:center;gap:0.6rem;padding:1rem 2.5rem;border-right:1px solid var(--border);flex-shrink:0}
.titem-ico{font-size:0.9rem}
.titem-txt{font-family:'Rajdhani',sans-serif;font-size:0.7rem;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-dim)}
.titem-txt b{color:var(--gold)}
@keyframes tick{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* SECTIONS */
.sec{padding:6rem 2rem}
.sec-inner{max-width:1280px;margin:0 auto}
.sec-head{text-align:center;margin-bottom:4rem}
.sec-eyebrow{font-family:'Share Tech Mono',monospace;font-size:0.58rem;letter-spacing:0.3em;color:rgba(201,168,76,0.55);margin-bottom:0.8rem}
.sec-title{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,4vw,3.2rem);font-weight:700;color:var(--gold);letter-spacing:0.06em;text-shadow:0 0 25px rgba(201,168,76,0.2);margin-bottom:0.5rem}
.sec-line{width:70px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:0.8rem auto}
.sec-sub{font-family:'Rajdhani',sans-serif;font-size:0.82rem;color:var(--text-dim);letter-spacing:0.08em;line-height:1.8;max-width:480px;margin:0 auto}

/* CAT TABS */
.cat-nav{display:flex;gap:0.4rem;flex-wrap:wrap;justify-content:center;margin-bottom:3rem}
.cat-btn{padding:0.45rem 1.2rem;background:transparent;border:1px solid var(--border);color:var(--text-dim);font-family:'Rajdhani',sans-serif;font-size:0.68rem;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;cursor:none;transition:all 0.2s;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.cat-btn.active,.cat-btn:hover{background:var(--gold);color:var(--black);border-color:var(--gold);box-shadow:0 0 18px var(--gold-glow)}

/* PRODUCT GRID */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:1px;background:var(--border);border:1px solid var(--border)}
.pcard{background:var(--black2);display:flex;flex-direction:column;position:relative;overflow:hidden;transition:background 0.3s;cursor:none}
.pcard::before,.pcard::after{content:'';position:absolute;width:14px;height:14px;opacity:0;transition:opacity 0.3s;z-index:3;pointer-events:none}
.pcard::before{top:0;left:0;border-top:1px solid var(--gold);border-left:1px solid var(--gold)}
.pcard::after{bottom:0;right:0;border-bottom:1px solid var(--gold);border-right:1px solid var(--gold)}
.pcard:hover{background:var(--black3)}
.pcard:hover::before,.pcard:hover::after{opacity:1}
.pcard-scan{position:absolute;top:-5%;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);z-index:4;opacity:0}
.pcard:hover .pcard-scan{animation:scanLine 0.9s ease-in forwards}
@keyframes scanLine{0%{top:-5%;opacity:1}100%{top:105%;opacity:0}}
.pcard-img-wrap{height:185px;overflow:hidden;position:relative}
.pcard-img-wrap::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,transparent 45%,rgba(5,5,3,0.95) 100%),linear-gradient(135deg,rgba(201,168,76,0.05),transparent 50%)}
.pcard-img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(0.55) saturate(0.75);transition:all 0.5s}
.pcard:hover .pcard-img{filter:brightness(0.78) saturate(1);transform:scale(1.07)}
.pcard-cat{position:absolute;top:0.7rem;left:0;background:var(--gold);color:var(--black);font-family:'Share Tech Mono',monospace;font-size:0.52rem;letter-spacing:0.12em;text-transform:uppercase;padding:0.22rem 0.8rem 0.22rem 0.5rem;clip-path:polygon(0 0,100% 0,calc(100% - 5px) 100%,0 100%);z-index:2}
.pcard-body{padding:0.9rem 1.1rem 1.2rem;flex:1;display:flex;flex-direction:column}
.pcard-ref{font-family:'Share Tech Mono',monospace;font-size:0.5rem;color:rgba(201,168,76,0.28);letter-spacing:0.1em;margin-bottom:0.25rem}
.pcard-name{font-family:'Cormorant Garamond',serif;font-size:1.05rem;font-weight:600;color:var(--text);margin-bottom:0.2rem;line-height:1.2}
.pcard-detail{font-family:'Rajdhani',sans-serif;font-size:0.68rem;color:var(--text-dim);letter-spacing:0.06em;margin-bottom:auto;padding-bottom:0.7rem}
.pcard-hr{height:1px;background:linear-gradient(90deg,rgba(201,168,76,0.2),transparent);margin-bottom:0.7rem}
.pcard-bot{display:flex;align-items:flex-end;justify-content:space-between}
.plabel{font-family:'Share Tech Mono',monospace;font-size:0.48rem;color:var(--text-dim);letter-spacing:0.12em;text-transform:uppercase;margin-bottom:0.12rem}
.pprice{font-family:'Cormorant Garamond',serif;font-size:1.4rem;font-weight:700;color:var(--gold);line-height:1;text-shadow:0 0 12px rgba(201,168,76,0.3)}
.pprice sub{font-size:0.6rem;font-family:'Rajdhani',sans-serif;font-weight:400;color:var(--text-dim);vertical-align:baseline}
.pcmd{background:transparent;border:1px solid var(--border);color:var(--gold);font-family:'Rajdhani',sans-serif;font-size:0.6rem;font-weight:700;letter-spacing:0.1em;padding:0.35rem 0.8rem;cursor:none;transition:all 0.2s;clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.pcmd:hover{background:var(--gold);color:var(--black)}

/* MARINE */
.marine-sec{background:var(--black3);border-top:1px solid var(--border);border-bottom:1px solid var(--border);position:relative;overflow:hidden}
.marine-sec::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,rgba(201,168,76,0.04) 0%,transparent 55%)}
.mgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);position:relative;z-index:1}
.mcol{background:var(--black2);padding:1.8rem}
.mcol-head{display:flex;align-items:center;gap:0.6rem;margin-bottom:1.3rem;padding-bottom:0.7rem;border-bottom:1px solid var(--border)}
.mcol-num{font-family:'Share Tech Mono',monospace;font-size:0.58rem;color:var(--gold);opacity:0.5;border:1px solid var(--border);padding:0.1rem 0.35rem}
.mcol-title{font-family:'Cormorant Garamond',serif;font-size:0.95rem;font-weight:600;color:var(--gold);letter-spacing:0.05em}
.mrow{display:flex;justify-content:space-between;align-items:center;padding:0.55rem 0;border-bottom:1px solid rgba(201,168,76,0.06);transition:padding 0.15s}
.mrow:last-child{border-bottom:none}
.mrow:hover{padding-left:0.4rem;background:rgba(201,168,76,0.025)}
.mrow-name{font-family:'Rajdhani',sans-serif;color:rgba(248,240,210,0.68);font-size:0.8rem;letter-spacing:0.03em}
.mrow-price{font-family:'Cormorant Garamond',serif;font-size:0.95rem;font-weight:600;color:var(--gold);white-space:nowrap}
.mtags{display:flex;flex-wrap:wrap;gap:0.3rem;margin-top:0.8rem}
.mtag{font-family:'Share Tech Mono',monospace;font-size:0.55rem;letter-spacing:0.06em;border:1px solid rgba(201,168,76,0.18);color:rgba(201,168,76,0.5);padding:0.18rem 0.5rem;transition:all 0.2s;cursor:default}
.mtag:hover{border-color:var(--gold);color:var(--gold);background:var(--gold-dim)}

/* CONTACT */
.contact-sec{background:var(--black2);border-top:1px solid var(--border);text-align:center;padding:6rem 2rem;position:relative;overflow:hidden}
.contact-sec::before{content:'';position:absolute;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(201,168,76,0.03),transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%)}
.cgrid{max-width:860px;margin:3rem auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);position:relative;z-index:1}
.ccard{background:var(--black3);padding:2.3rem 1.5rem;position:relative;overflow:hidden;transition:background 0.3s}
.ccard:hover{background:var(--black2)}
.ccard::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);transform:scaleX(0);transition:transform 0.35s}
.ccard:hover::after{transform:scaleX(1)}
.cico{font-size:1.6rem;margin-bottom:0.7rem}
.clabel{font-family:'Share Tech Mono',monospace;font-size:0.58rem;letter-spacing:0.2em;color:rgba(201,168,76,0.55);margin-bottom:0.5rem;text-transform:uppercase}
.cval{font-family:'Cormorant Garamond',serif;font-size:1.05rem;color:var(--text)}
.cval a{color:var(--gold);text-decoration:none;transition:text-shadow 0.2s}
.cval a:hover{text-shadow:0 0 12px var(--gold-glow)}

/* FOOTER */
footer{background:var(--black);border-top:1px solid var(--border);padding:2.5rem 2rem;text-align:center;position:relative}
footer::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.flogo{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:700;color:var(--gold);letter-spacing:0.12em;margin-bottom:0.3rem;text-shadow:0 0 18px rgba(201,168,76,0.25)}
.fsub{font-family:'Share Tech Mono',monospace;font-size:0.58rem;letter-spacing:0.3em;color:rgba(201,168,76,0.3);margin-bottom:1.5rem}
.fcopy{font-family:'Share Tech Mono',monospace;font-size:0.55rem;color:rgba(248,240,210,0.15);letter-spacing:0.08em}

/* Le hamburger n'existe que sous 900px (regle plus bas). Doit etre
   declare AVANT cette media query : a specificite egale, la regle qui
   apparait en dernier dans le fichier l'emporte, media query ou pas. */
.nav-burger{display:none;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  width:38px;height:34px;padding:0;background:transparent;border:1px solid var(--border2);
  cursor:pointer;transition:box-shadow 0.25s,border-color 0.25s;
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.nav-burger span{display:block;width:17px;height:1.5px;background:var(--gold);
  box-shadow:0 0 6px var(--gold-glow);transition:transform 0.3s ease,opacity 0.2s ease}
.nav-burger:hover,.nav-burger:focus-visible{box-shadow:0 0 18px var(--gold-glow);border-color:var(--gold)}
.nav-burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

@media(max-width:900px){
  nav{padding:0 1.2rem}.nav-links,.nav-cta{display:none}
  .nav-burger{display:flex}
  .nav-right{gap:0.75rem}
  .nav-ping{font-size:0.55rem;letter-spacing:0.08em}
  .mgrid{grid-template-columns:1fr}.cgrid{grid-template-columns:1fr}
  .hero-rings,.hero-particles{display:none}
}

/* Sur petit ecran, 4 colonnes forcent le bloc stats a deborder (chaque
   cellule refuse de descendre sous sa largeur de contenu minimale) et il
   n'est alors plus vraiment centre. Passage en grille 2x2, chaque cellule
   gagne assez de place pour son libelle sans jamais depasser l'ecran. */
@media(max-width:560px){
  .hero-stats{display:grid;grid-template-columns:repeat(2,1fr)}
  .hst{border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
  .hst:nth-child(2n){border-right:none}
  .hst:nth-child(n+3){border-bottom:none}
}

/* ============================================================
   AJOUTS THEME — non presents dans la maquette statique
   (panier WhatsApp, garde-fous tactile / accessibilite)
   ============================================================ */

/* Le curseur custom de la maquette est inutilisable au tactile :
   on le restaure uniquement sur peripherique a pointeur fin (souris). */
@media (hover:none),(pointer:coarse){
  body{cursor:auto}
  .cursor,.cursor-ring{display:none}
  .cat-btn,.pcmd,.pcard{cursor:pointer}
}
@media (hover:hover) and (pointer:fine){
  body{cursor:none}
}

/* Focus clavier visible (absent de la maquette, requis pour l'accessibilite) */
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* --- Bouton flottant panier --- */
.wa-fab{position:fixed;right:1.5rem;bottom:1.5rem;z-index:900;display:none;align-items:center;gap:0.6rem;
  background:var(--gold);color:var(--black);border:none;padding:0.85rem 1.4rem;
  font-family:'Rajdhani',sans-serif;font-size:0.72rem;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;
  box-shadow:0 0 30px var(--gold-glow);transition:all 0.25s;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.wa-fab.show{display:flex}
.wa-fab:hover{background:var(--gold2);transform:translateY(-2px);box-shadow:0 0 40px var(--gold-glow)}
.wa-fab-count{background:var(--black);color:var(--gold);font-family:'Share Tech Mono',monospace;font-size:0.62rem;
  min-width:19px;height:19px;display:flex;align-items:center;justify-content:center;border-radius:50%}

/* --- Panneau panier --- */
.wa-panel{position:fixed;inset:0;z-index:950;display:none;align-items:center;justify-content:center;padding:1.5rem;
  background:rgba(5,5,3,0.88);backdrop-filter:blur(6px)}
.wa-panel.show{display:flex}
.wa-box{background:var(--black2);border:1px solid var(--border2);max-width:520px;width:100%;max-height:82vh;
  display:flex;flex-direction:column;position:relative;
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)}
.wa-head{padding:1.4rem 1.6rem 1rem;border-bottom:1px solid var(--border);display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}
.wa-title{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:700;color:var(--gold);letter-spacing:0.05em;line-height:1.1}
.wa-eyebrow{font-family:'Share Tech Mono',monospace;font-size:0.55rem;letter-spacing:0.25em;color:rgba(201,168,76,0.5);margin-bottom:0.4rem}
.wa-close{background:transparent;border:1px solid var(--border);color:var(--gold);font-family:'Share Tech Mono',monospace;
  font-size:0.8rem;line-height:1;padding:0.35rem 0.6rem;transition:all 0.2s;flex-shrink:0}
.wa-close:hover{background:var(--gold);color:var(--black)}
.wa-items{overflow-y:auto;padding:0.6rem 1.6rem;flex:1}
.wa-item{display:flex;align-items:center;gap:0.9rem;padding:0.75rem 0;border-bottom:1px solid rgba(201,168,76,0.08)}
.wa-item:last-child{border-bottom:none}
.wa-item-info{flex:1;min-width:0}
.wa-item-name{font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:600;color:var(--text);line-height:1.2}
.wa-item-price{font-family:'Share Tech Mono',monospace;font-size:0.58rem;color:var(--text-dim);letter-spacing:0.08em;margin-top:0.15rem}
.wa-qty{display:flex;align-items:center;gap:0.5rem;flex-shrink:0}
.wa-qty button{background:transparent;border:1px solid var(--border);color:var(--gold);width:24px;height:24px;
  font-family:'Rajdhani',sans-serif;font-size:0.85rem;font-weight:700;line-height:1;transition:all 0.2s;padding:0}
.wa-qty button:hover{background:var(--gold);color:var(--black)}
.wa-qty-n{font-family:'Share Tech Mono',monospace;font-size:0.72rem;color:var(--gold);min-width:16px;text-align:center}
.wa-line-total{font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:700;color:var(--gold);white-space:nowrap;min-width:88px;text-align:right}
.wa-foot{padding:1.1rem 1.6rem 1.5rem;border-top:1px solid var(--border)}
.wa-total{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1.1rem}
.wa-total-l{font-family:'Share Tech Mono',monospace;font-size:0.6rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--text-dim)}
.wa-total-v{font-family:'Cormorant Garamond',serif;font-size:1.75rem;font-weight:700;color:var(--gold);line-height:1;
  text-shadow:0 0 15px rgba(201,168,76,0.35)}
.wa-send{display:block;width:100%;text-align:center;border:none}
.wa-empty{padding:2.5rem 1.6rem;text-align:center;font-family:'Rajdhani',sans-serif;font-size:0.85rem;color:var(--text-dim);letter-spacing:0.06em}
.wa-note{font-family:'Share Tech Mono',monospace;font-size:0.52rem;color:var(--text-dim);letter-spacing:0.08em;
  text-align:center;margin-top:0.8rem;line-height:1.6}

/* Etat "ajoute" du bouton produit */
.pcmd.added{background:var(--gold);color:var(--black)}

/* Pagination catalogue */
.pnav{display:flex;justify-content:center;gap:0.4rem;margin-top:2.5rem;flex-wrap:wrap}
.pnav .page-numbers{border:1px solid var(--border);color:var(--text-dim);padding:0.4rem 0.9rem;text-decoration:none;
  font-family:'Rajdhani',sans-serif;font-size:0.7rem;font-weight:700;letter-spacing:0.12em;transition:all 0.2s}
.pnav .page-numbers.current,.pnav .page-numbers:hover{background:var(--gold);color:var(--black);border-color:var(--gold)}

/* Grille vide (catalogue non encore rempli) */
.pgrid-empty{border:1px solid var(--border);padding:3.5rem 2rem;text-align:center;background:var(--black2)}
.pgrid-empty-t{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--gold);margin-bottom:0.5rem}
.pgrid-empty-s{font-family:'Rajdhani',sans-serif;font-size:0.8rem;color:var(--text-dim);letter-spacing:0.06em}

@media(max-width:900px){
  .wa-fab{right:1rem;bottom:1rem;padding:0.75rem 1.1rem;font-size:0.66rem}
  .wa-line-total{min-width:74px;font-size:0.9rem}
}

/* Animations decoratives seulement — ne jamais figer tout le site.
   (le ticker, les transitions et le panier restent actifs) */
@media (prefers-reduced-motion:reduce){
  .hero-glow,.hring,.ptcl,.hero-icon,.ping-dot,nav::after{animation:none}
  .ptcl{opacity:0.25}
}


/* ============================================================
   LISIBILITE — textes agrandis a la demande du client
   (les regles ci-dessous, placees en fin de fichier, l'emportent
   sur les tailles d'origine de la maquette a specificite egale)
   ============================================================ */

.hero-sys{font-size:0.72rem;letter-spacing:0.28em}
.hero-tag{font-size:0.75rem}
.hst-n{font-size:2.2rem}
.hst-l{font-size:0.62rem}
.sec-eyebrow{font-size:0.68rem}
.sec-sub{font-size:0.92rem}
.nav-links a{font-size:0.75rem}
.nav-ping{font-size:0.68rem}
.nav-cta{font-size:0.78rem}
.titem-txt{font-size:0.8rem}
.cat-btn{font-size:0.78rem;padding:0.5rem 1.35rem}
.pcard-ref{font-size:0.58rem}
.pcard-name{font-size:1.15rem}
.pcard-detail{font-size:0.78rem}
.plabel{font-size:0.58rem}
.pprice{font-size:1.55rem}
.pprice sub{font-size:0.68rem}
.pcmd{font-size:0.68rem;padding:0.4rem 0.9rem}
.mcol-title{font-size:1.05rem}
.mrow-name{font-size:0.88rem}
.mrow-price{font-size:1.05rem}
.mtag{font-size:0.62rem}
.clabel{font-size:0.66rem}
.cval{font-size:1.15rem}
.flogo{font-size:1.65rem}
.fsub{font-size:0.66rem}
.fcopy{font-size:0.62rem}
.wa-note{font-size:0.58rem}
.wa-total-l{font-size:0.68rem}
.wa-item-price{font-size:0.64rem}

@media(max-width:900px){
  .hero-tag{font-size:0.68rem}
  .sec-sub{font-size:0.85rem}
}

/* --- Formulaire nom / adresse (panier WhatsApp) --- */
.wa-form{padding:0.9rem 1.6rem 0.2rem;display:flex;flex-direction:column;gap:0.5rem;border-top:1px solid rgba(201,168,76,0.08)}
.wa-label{font-family:'Share Tech Mono',monospace;font-size:0.56rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--text-dim)}
.wa-input{background:var(--black);border:1px solid var(--border);color:var(--text);font-family:'Rajdhani',sans-serif;
  font-size:0.85rem;padding:0.55rem 0.7rem;width:100%;box-sizing:border-box;transition:border-color 0.2s}
.wa-input::placeholder{color:rgba(217,209,180,0.35)}
.wa-input:focus{outline:none;border-color:var(--gold)}
.wa-input.wa-error{border-color:#c0524a}
.wa-textarea{resize:vertical;min-height:52px;font-family:'Rajdhani',sans-serif}

/* ============================================================
   MENU MOBILE — hamburger + panneau plein ecran
   ============================================================ */

.nav-drawer{position:fixed;top:64px;left:0;right:0;bottom:0;z-index:490;display:none;
  background:rgba(5,5,3,0.985);backdrop-filter:blur(18px);overflow-y:auto;
  border-top:1px solid var(--border)}
.nav-drawer.open{display:block;animation:drawerIn 0.28s ease}
@keyframes drawerIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.nav-drawer::before{content:'';position:absolute;top:-8%;left:50%;transform:translateX(-50%);
  width:420px;height:420px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(201,168,76,0.07),transparent 70%)}
.drawer-inner{position:relative;padding:2rem 1.5rem 3rem;max-width:520px;margin:0 auto}

.drawer-eyebrow{font-family:'Share Tech Mono',monospace;font-size:0.56rem;letter-spacing:0.25em;
  text-transform:uppercase;color:rgba(201,168,76,0.5);margin-bottom:0.9rem}

.drawer-links{list-style:none;display:flex;flex-direction:column;margin-bottom:2rem}
.drawer-links a{display:flex;align-items:baseline;gap:0.9rem;text-decoration:none;
  font-family:'Cormorant Garamond',serif;font-size:1.55rem;font-weight:600;letter-spacing:0.03em;
  color:var(--text);padding:0.8rem 0;border-bottom:1px solid rgba(201,168,76,0.1);
  transition:color 0.25s ease,padding-left 0.25s ease}
.drawer-links a:hover,.drawer-links a:focus-visible{color:var(--gold);padding-left:0.5rem}
.drawer-links .dnum{font-family:'Share Tech Mono',monospace;font-size:0.55rem;
  color:rgba(201,168,76,0.45);letter-spacing:0.1em}

.drawer-div{display:flex;align-items:center;justify-content:center;gap:1rem;margin:0.5rem 0 1.8rem}
.drawer-div::before,.drawer-div::after{content:'';height:1px;flex:1;max-width:90px;
  background:linear-gradient(90deg,transparent,var(--border2),transparent)}
.drawer-diamond{font-size:0.5rem;color:rgba(201,168,76,0.55);letter-spacing:0.3em}

.drawer-contacts{display:flex;flex-direction:column;gap:0.6rem}
.drawer-tel{display:flex;align-items:center;justify-content:center;gap:0.6rem;
  border:1px solid var(--border2);color:var(--gold);text-decoration:none;
  font-family:'Rajdhani',sans-serif;font-size:0.85rem;font-weight:700;letter-spacing:0.1em;
  padding:0.75rem 1rem;transition:background 0.25s,color 0.25s,box-shadow 0.25s;
  clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px)}
.drawer-tel:hover,.drawer-tel:focus-visible{background:var(--gold);color:var(--black);box-shadow:0 0 20px var(--gold-glow)}
.drawer-wa{border-color:var(--gold);background:rgba(201,168,76,0.08)}

.drawer-foot{margin-top:2.5rem;text-align:center;font-family:'Share Tech Mono',monospace;
  font-size:0.5rem;letter-spacing:0.22em;color:rgba(201,168,76,0.35)}

/* Empeche le defilement de la page derriere le menu ouvert */
body.menu-ouvert{overflow:hidden}