@font-face{font-family:"DM Sans FB";src:local("Arial");size-adjust:105%;ascent-override:94%;descent-override:30%;line-gap-override:0%}@font-face{font-family:"Playfair FB";src:local("Georgia");size-adjust:112%;ascent-override:106%;descent-override:26%;line-gap-override:0%}
/* SAVANNA SELECT V58 - CSS Bundle */

/* === BASE === */

/* === BASE ===
Les styles metier sont separes dans variables/header/catalogue/cart/checkout/mobile/utilities.css. */
/* ------------------------------------------------------
SAVANNA SELECT V35 � Design authentic africain
Couleurs du logo : vert for�t + or chaud + cr�me
------------------------------------------------------ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
:root{ /* Palette logo Savanna Select */
--green:     #1a4a28;
--green2:    #0f3019;
--green-mid: #2d6b3f;
--green-lt:  #e8f5ec;
--gold:      #d4891a;
--gold2:     #b5710d;
--gold-lt:   #fff3d6;
--amber:     #f0a500;
--bg:        #f2efe6;
--surface:   #fdf8f0;
--surface2:  #ede4cc;
--line:      #d9c9a8;
--text:      #1e1510;
--muted:     #6b5b47;
--danger:    #c0392b;
--radius:    16px;
--shadow:    0 6px 28px rgba(26,74,40,.11);
--shadow-lg: 0 16px 54px rgba(26,74,40,.18);
--font-d:    'Playfair Display','Playfair FB',Georgia,serif;
--font-b:    'DM Sans','DM Sans FB',system-ui,sans-serif;
--header-max: 1320px;
--mobile-breakpoint: 768px;
--tap: 44px; }
body{font-family:var(--font-b);background:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Ccircle cx='30' cy='170' r='28' fill='none' stroke='%23d4891a' stroke-width='1.2' opacity='.09'/%3E%3Ccircle cx='100' cy='185' r='16' fill='none' stroke='%23f0a500' stroke-width='1' opacity='.07'/%3E%3Ccircle cx='170' cy='175' r='22' fill='none' stroke='%23d4891a' stroke-width='1.2' opacity='.09'/%3E%3Cline x1='30' y1='170' x2='30' y2='110' stroke='%231a4a28' stroke-width='2' opacity='.09'/%3E%3Cline x1='100' y1='185' x2='100' y2='130' stroke='%231a4a28' stroke-width='2' opacity='.09'/%3E%3Cline x1='170' y1='175' x2='170' y2='115' stroke='%231a4a28' stroke-width='2' opacity='.09'/%3E%3Cline x1='30' y1='128' x2='8' y2='100' stroke='%231a4a28' stroke-width='1.2' opacity='.08'/%3E%3Cline x1='30' y1='128' x2='52' y2='98' stroke='%231a4a28' stroke-width='1.2' opacity='.08'/%3E%3Cline x1='30' y1='140' x2='14' y2='118' stroke='%231a4a28' stroke-width='1' opacity='.06'/%3E%3Cline x1='30' y1='140' x2='46' y2='116' stroke='%231a4a28' stroke-width='1' opacity='.06'/%3E%3Cline x1='100' y1='148' x2='78' y2='118' stroke='%231a4a28' stroke-width='1.2' opacity='.08'/%3E%3Cline x1='100' y1='148' x2='122' y2='115' stroke='%231a4a28' stroke-width='1.2' opacity='.08'/%3E%3Cline x1='170' y1='132' x2='150' y2='106' stroke='%231a4a28' stroke-width='1.2' opacity='.08'/%3E%3Cline x1='170' y1='132' x2='190' y2='104' stroke='%231a4a28' stroke-width='1.2' opacity='.08'/%3E%3Ccircle cx='60' cy='55' r='2.5' fill='%23f0a500' opacity='.14'/%3E%3Ccircle cx='140' cy='40' r='2' fill='%23d4891a' opacity='.12'/%3E%3Ccircle cx='20' cy='70' r='1.8' fill='%23f0a500' opacity='.11'/%3E%3Ccircle cx='185' cy='60' r='2.2' fill='%23d4891a' opacity='.12'/%3E%3Ccircle cx='100' cy='30' r='1.5' fill='%23f0a500' opacity='.10'/%3E%3C/svg%3E"),
linear-gradient(168deg,
#071810 0%,
#0f2d1c 12%,
#1a4a28 26%,
#1e5530 38%,
#2d4a12 50%,
#5c3608 62%,
#a05c0a 74%,
#d4891a 86%,
#e8960a 94%,
#c47812 100%
);
background-attachment:fixed;
background-size:200px 200px,cover;
min-height:100vh;color:var(--text);line-height:1.65;overflow-x:hidden}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}
h1,h2,h3,h4{font-family:var(--font-d);line-height:1.15}
.container{width:min(1200px,calc(100% - 32px));margin:0 auto}

.nav-link{display:inline-flex;align-items:center;gap:.35rem;text-decoration:none;color:inherit;font-weight:700;}
.nav-link:hover{opacity:.85;}

/* === HEADER === */

/* SavannaSelect V58 - Header, topbar, navigation, recherche header. */
/* -- Topbar -- */
.topbar{ background:linear-gradient(90deg,var(--green2),var(--green-mid),var(--green2));
color:#fff;text-align:center;padding:10px 16px;
font-size:.83rem;font-weight:500;letter-spacing:.04em;font-family:var(--font-b); }

/* -- Header -- */
.site-header{ position:sticky;top:0;z-index:100;
background:rgba(7,24,16,.92);backdrop-filter:blur(20px);
border-bottom:2px solid rgba(212,137,26,.5);
box-shadow:0 4px 32px rgba(0,0,0,.55); }
.header-row{ display:grid;grid-template-columns:180px 1fr auto auto;
gap:14px;align-items:center;padding:12px 0; }
.brand-logo{display:flex;align-items:center;gap:10px}
.brand-logo img{height:72px;width:auto;border-radius:10px;
filter:drop-shadow(0 2px 6px rgba(26,74,40,.2));transition:transform .3s}
.brand-logo img:hover{transform:scale(1.04)}
.logo-fallback{ font-family:var(--font-d);font-size:1.05rem;font-weight:900;
color:var(--green);background:var(--gold-lt);
padding:8px 14px;border-radius:10px;border:2px solid var(--line);
line-height:1.2; }
.logo-fallback span{display:block;font-size:.65rem;color:var(--gold2);letter-spacing:.1em;font-family:var(--font-b);margin-top:2px}

/* Search */
.search-bar{ display:flex;align-items:center;
background:rgba(255,255,255,.1);border:2px solid rgba(212,137,26,.45);border-radius:999px;
overflow:hidden;transition:.2s; }
.search-bar:focus-within{border-color:var(--gold);box-shadow:0 0 0 4px rgba(212,137,26,.25);background:rgba(255,255,255,.15)}
.search-bar input{ flex:1;border:0;outline:none;padding:12px 18px;
font-size:.94rem;background:transparent;color:#fff; }
.search-bar input::placeholder{color:rgba(255,255,255,.45)}
.search-bar button{ border:0;background:linear-gradient(135deg,var(--gold),var(--amber));
color:#fff;padding:12px 20px;cursor:pointer;font-size:1rem;transition:opacity .2s; }
.search-bar button:hover{opacity:.88}

/* Header actions */
.header-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.hbtn{ display:flex;align-items:center;gap:6px;
padding:9px 16px;border-radius:999px;
border:2px solid rgba(255,255,255,.18);background:rgba(255,255,255,.09);
color:#fff;font-weight:700;font-size:.86rem;
cursor:pointer;white-space:nowrap;transition:.2s;font-family:var(--font-b); }
.hbtn:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.38)}
.hbtn.active{background:var(--green);color:#fff;border-color:var(--green)}
.hbtn.lang-btn{background:rgba(212,137,26,.22);border-color:rgba(240,165,0,.5);color:#fde68a}
.hbtn.lang-btn:hover{background:var(--gold);color:#fff;border-color:var(--gold)}
.cart-count-badge{ background:var(--gold);color:#fff;border-radius:999px;
min-width:20px;height:20px;font-size:.72rem;font-weight:800;
display:inline-flex;align-items:center;justify-content:center;padding:0 5px;
margin-left:2px; }
#menu-toggle{ display:none;border:2px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);
border-radius:10px;padding:7px 12px;cursor:pointer;font-size:1.2rem;color:#fff; }

/* -- Nav -- */
.main-nav{border-top:1px solid rgba(212,137,26,.35);background:rgba(4,14,8,.85);backdrop-filter:blur(14px)}
.nav-links{ display:flex;justify-content:center;gap:2px;flex-wrap:wrap;padding:8px 0; }
.nav-links a,.nav-btn{ color:rgba(255,255,255,.78);font-weight:700;font-size:.86rem;font-family:var(--font-b);
padding:8px 15px;border-radius:999px;transition:.2s;
background:transparent;border:none;cursor:pointer;text-decoration:none; }
.nav-links a:hover,.nav-btn:hover{background:rgba(255,255,255,.12);color:#fff}
.nav-links a.active,.nav-btn.active{background:var(--green);color:#fff;box-shadow:0 4px 14px rgba(26,74,40,.5)}

@media (min-width:1024px){
.site-header .container,.hero .container,.section .container{max-width:1200px}
.main-nav{width:auto}
}
@media (max-width:768px){
body{padding-top:0}
}

/* V35 � CSS harmonis� depuis modules qualit� */

/* Source: layout.css */
/* === BASE OVERRIDES === */
.container{width:min(1200px, calc(100% - 32px));margin-inline:auto}
.page{display:none}
.page.active{display:block}
html,body{max-width:100%;overflow-x:hidden}

/* Source: header.css */
/* SavannaSelect V58 - header responsive stable */
@media (min-width:1024px){
.header-row{display:grid;grid-template-columns:180px minmax(0,1fr) auto auto;align-items:center}
.menu-toggle{display:none}
.main-nav{display:flex;position:static;max-height:none;opacity:1;visibility:visible;transform:none}
}
@media (max-width:768px){
.header-row{grid-template-columns:1fr auto;gap:10px}
.brand-logo img{height:56px}
}

/* SavannaSelect V58 - responsive header extrait de mobile.css. */
/* === RESPONSIVE === */

/* ------------------------------------------------------
SAVANNA SELECT V35 � Responsive
Objectif: header desktop/mobile stable, sans styles h�rit�s conflictuels.
------------------------------------------------------ */
html,body{width:100%;max-width:none;margin:0;padding:0;overflow-x:hidden;}
body{min-width:320px;}
.container{width:min(var(--header-max),calc(100% - 32px));max-width:var(--header-max);margin-left:auto;margin-right:auto;padding-left:0;padding-right:0;}
.site-header{position:sticky;top:0;left:0;right:0;width:100%;max-width:none;z-index:300;background:rgba(7,24,16,.96);border-bottom:2px solid rgba(212,137,26,.55);box-shadow:0 8px 28px rgba(0,0,0,.28);}
.header-row{display:grid;grid-template-columns:180px minmax(280px,1fr) auto;gap:18px;align-items:center;width:min(var(--header-max),calc(100% - 32px));max-width:var(--header-max);margin:0 auto;padding:12px 0;}
.brand-logo{appearance:none;border:0;background:transparent;cursor:pointer;min-width:0;padding:0;justify-self:start;}
.brand-logo img{height:68px;width:auto;max-width:170px;object-fit:contain;border-radius:10px;}
.search-bar{display:flex;min-width:0;width:100%;}
.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:nowrap;min-width:max-content;}
.hbtn{min-height:44px;}
#menu-toggle{display:none;}
.mobile-search{display:none;}
.main-nav{display:block;width:100%;max-width:none;border-top:1px solid rgba(212,137,26,.28);background:rgba(3,15,8,.92);}
.nav-links{width:min(var(--header-max),calc(100% - 32px));max-width:var(--header-max);margin:0 auto;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:6px;padding:9px 0;flex-wrap:wrap;}
.nav-btn{min-height:42px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:999px;padding:8px 16px;}
#nav-lang-mobile{display:none;}
main#panels{width:100%;max-width:none;margin:0;padding:0;}
.panel.active{width:100%;}
.hero{padding:28px 0 40px;}
.hero .container{width:min(1180px,calc(100% - 32px));}
.hero-card{width:100%;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(320px,.98fr);align-items:center;gap:28px;border-radius:28px;overflow:hidden;}
.hero-copy{min-width:0;}
.hero-visual{min-width:0;width:100%;}
#hero-home-img{width:100%;min-height:360px;max-height:460px;object-fit:cover;}
@media (min-width:1024px){
.site-header{transform:none;}
.topbar{display:block;}
.header-actions .hbtn{font-size:.88rem;padding:9px 15px;}
}
@media (min-width:768px) and (max-width:1120px){
.header-row{grid-template-columns:150px minmax(220px,1fr) auto;gap:12px;}
.brand-logo img{height:58px;max-width:150px;}
.header-actions{gap:6px;}
.header-actions .hbtn{font-size:.78rem;padding:8px 10px;}
.nav-links{gap:4px;}
.nav-btn{font-size:.82rem;padding:8px 12px;}
.hero-card{grid-template-columns:1fr 1fr;}
}
@media (max-width:768px){
.topbar{font-size:.72rem;padding:7px 12px;line-height:1.35;}
.container{width:100%;max-width:none;padding-left:14px;padding-right:14px;}
.site-header{position:sticky;top:0;z-index:400;}
.header-row{width:100%;max-width:none;display:grid;grid-template-columns:auto 1fr auto;gap:10px;padding:9px 14px;}
.brand-logo img{height:42px;max-width:126px;border-radius:8px;}
.header-row > .search-bar{display:none;}
.header-actions{justify-content:end;gap:6px;min-width:0;}
.header-actions .hbtn:not([data-page="panier"]){display:none;}
.header-actions .hbtn[data-page="panier"]{display:inline-flex;padding:7px 10px;font-size:.78rem;min-height:40px;}
#menu-toggle{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;border-radius:12px;border:1.5px solid rgba(255,255,255,.28);background:rgba(255,255,255,.1);color:#fff;}
.mobile-search{display:block;padding:8px 14px;background:rgba(3,15,8,.96);border-top:1px solid rgba(255,255,255,.08);}
.mobile-search .search-bar{display:flex;border-radius:14px;}
.mobile-search input{font-size:16px;min-height:44px;}
.main-nav{display:none;position:absolute;left:0;right:0;top:100%;width:100%;background:rgba(3,15,8,.98);box-shadow:0 18px 28px rgba(0,0,0,.35);border-top:1px solid rgba(212,137,26,.35);}
.main-nav.open{display:block;}
.nav-links{width:100%;max-width:none;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:6px;padding:12px 14px 14px;}
.nav-btn{width:100%;justify-content:flex-start;border-radius:14px;padding:11px 14px;font-size:.94rem;min-height:46px;}
#nav-lang-mobile{display:flex;}
main#panels{padding-top:0;}
.hero{padding:0 0 20px;}
.hero .container{width:100%;padding-left:14px;padding-right:14px;}
.hero-card{display:grid;grid-template-columns:1fr;gap:18px;padding:20px 16px;border-radius:22px;}
.hero-copy h1{font-size:clamp(1.3rem,4vw,1.9rem);line-height:1.1;}
.hero-copy p{font-size:.98rem;}
.hero-actions{display:flex;flex-direction:column;gap:10px;}
.hero-actions .btn{width:100%;min-height:50px;}
.hero-visual{order:-1;}
#hero-home-img{min-height:220px;max-height:300px;border-radius:16px;}
}
@media (max-width:380px){
.header-row{padding-left:10px;padding-right:10px;gap:6px;}
.brand-logo img{height:38px;max-width:108px;}
.header-actions .hbtn[data-page="panier"] .lang-label{display:none;}
.mobile-search{padding-left:10px;padding-right:10px;}
}

/* Correctifs int�gr�s */

/* Accessibilite: le lien skip ne doit pas etre visible en permanence */
.skip-link{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden;z-index:9999;background:#fff;color:var(--green);padding:8px 12px;border-radius:8px}
.skip-link:focus{left:12px;top:12px;width:auto;height:auto;overflow:visible}

/* Header desktop stable */
@media (min-width:768px){
.site-header{position:sticky;top:0;width:100%;z-index:400;background:rgba(7,24,16,.96)}
.header-row{display:grid;grid-template-columns:180px minmax(320px,1fr) auto;gap:18px;align-items:center;width:min(var(--header-max),calc(100% - 32px));margin:0 auto;padding:12px 0}
.brand-logo img{height:68px;max-width:170px;object-fit:contain}
.header-row>.search-bar{display:flex;width:100%;min-width:0}
.mobile-search{display:none!important}
#menu-toggle{display:none!important}
.header-actions{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:nowrap;min-width:max-content}
.main-nav{display:block!important;position:static!important;width:100%;background:rgba(3,15,8,.92);box-shadow:none;transform:none;opacity:1;visibility:visible;max-height:none}
.nav-links{display:flex!important;flex-direction:row!important;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;width:min(var(--header-max),calc(100% - 32px));margin:0 auto;padding:9px 0}
.nav-btn{width:auto!important;min-height:42px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:999px;padding:8px 16px;font-size:.86rem}
#nav-lang-mobile{display:none!important}
}

/* Header mobile propre */
@media (max-width:768px){
.header-row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:9px 14px;width:100%;max-width:none}
.brand-logo img{height:42px;max-width:126px;object-fit:contain}
.header-row>.search-bar{display:none!important}
.mobile-search{display:block}
.main-nav{display:none;position:absolute;left:0;right:0;top:100%;width:100%;background:rgba(3,15,8,.98);box-shadow:0 18px 28px rgba(0,0,0,.35)}
.main-nav.open{display:block}
.nav-links{display:flex;flex-direction:column;align-items:stretch;gap:6px;width:100%;padding:12px 14px 14px}
.nav-btn{width:100%;justify-content:flex-start;border-radius:14px;min-height:46px}
}

/* V35 � header coh�rent et sans doublons dans la barre principale. */
.site-header{position:sticky;top:0;z-index:200}
.nav-links{justify-content:center}
#nav-lang-mobile{display:none}
.header-actions .hbtn{white-space:nowrap}
@media(max-width:768px){
.header-row{grid-template-columns:auto 1fr auto;gap:8px}
.header-actions{grid-column:2/3;justify-content:flex-end}
.header-actions .hbtn[data-page="contact"]{display:none}
.header-actions .hbtn[data-page="panier"]{padding-inline:8px}
#nav-lang-mobile{display:flex}
}

/* V35 stabilisation : harmonisation visuelle et correctifs mobile */
.site-header{position:sticky;top:0;z-index:1000;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.header-actions .hbtn{min-height:44px} /* V249 A11y � WCAG 2.5.5 */
.nav-links .nav-btn,.btn{border-radius:999px}
.search-bar input{font-family:var(--font-s, system-ui, sans-serif)}

/* === CATALOGUE === */

/* SavannaSelect V175 � CSS Catalogue consolid�
SOURCE UNIQUE pour : product-card, product-img-wrap, product-body,
product-title, product-desc, product-footer, product-actions, pagination
Remplace les r�gles dispers�es dans catalogue.css, v172-fixes.css, v174-final.css
*/

/* -- Variables locales ------------------------------------ */
:root { --cat-bg: #fffaf2;
--cat-ink: #143d24;
--cat-gold: #d99a12;
--cat-border: rgba(217,154,18,.4);
--cat-shadow: 0 8px 28px rgba(10,36,21,.10);
--cat-shadow-hover: 0 16px 40px rgba(10,36,21,.18);
--cat-radius: 18px;
--cat-img-ratio: 1/1; }

/* -- Layout catalogue ------------------------------------- */
.cat-layout { display: grid;
grid-template-columns: minmax(230px, 275px) minmax(0, 1fr);
gap: 22px;
align-items: start;
padding: 22px 0 52px; }

/* -- Grille produits --------------------------------------- */
#catalogue-grid { display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 20px;
align-items: stretch;
min-height: 100px; }

/* -- Carte produit � r�gle unique V175 ------------------- */
.product-card { display: flex;
flex-direction: column;
min-height: 100%;
overflow: hidden;
background: var(--cat-bg);
color: var(--cat-ink);
border: 1.5px solid var(--cat-border);
border-top: 4px solid var(--cat-gold);
border-radius: var(--cat-radius);
box-shadow: var(--cat-shadow);
transition: transform .22s ease, box-shadow .22s ease; }
.product-card:hover { transform: translateY(-3px);
box-shadow: var(--cat-shadow-hover); }

/* -- Image produit -------------------------------------- */
.product-img-wrap { display: flex;
align-items: center;
justify-content: center;
width: 100%;
overflow: visible;
background: #fff;
border-bottom: 1px solid rgba(27,78,46,.12);
aspect-ratio: var(--cat-img-ratio);
max-height: 220px;
padding: 10px; }
.product-img-wrap img,
.product-card img { width: 100%;
max-height: 133px;
object-fit: contain;
background: #fff;
display: block;
cursor: zoom-in;
border-radius: 8px; }

/* -- Corps de la carte ---------------------------------- */
.product-body { display: flex;
flex-direction: column;
flex: 1;
padding: 14px 16px 16px;
gap: 6px; }
.product-meta { font-size: .75rem;
color: #6d4d12;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .02em; }
.product-title { font-size: 1rem;
font-weight: 800;
color: var(--cat-ink);
line-height: 1.25;
margin: 0;
/* Limite � 2 lignes */
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden; }
.product-desc { font-size: .85rem;
color: #4a3a28;
line-height: 1.45;
/* Limite � 3 lignes */
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
min-height: 3.6em;
margin: 0; }

/* -- Pied de carte -------------------------------------- */
.product-footer { display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
margin-top: auto;
padding-top: 8px; }
.price { font-size: 1.1rem;
font-weight: 900;
color: var(--cat-gold); }

/* -- Actions -------------------------------------------- */
.product-actions { display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
padding-top: 8px;
border-top: 1px solid rgba(27,78,46,.08);
margin-top: 6px; }
.zoom-hint { font-size: .75rem;
color: #6d4d12;
font-weight: 700; }

/* -- Carte vedette (home-featured) � V247 FIX ----------- */
.featured-card .product-img-wrap { max-height: 170px; min-height: 130px; }
.featured-card .product-img-wrap img { max-height: 150px; object-fit: contain; }
.featured-card .product-actions { flex-wrap: wrap; gap: 6px; }
.featured-card .zoom-hint { width: 100%; text-align: center; font-size: .72rem; }
.featured-card .product-meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }

/* -- Pagination ---------------------------------------- */
#catalogue-pagination { display: flex;
align-items: center;
justify-content: center;
gap: 6px;
padding: 22px 0 10px;
flex-wrap: wrap; }
#catalogue-pagination button { min-width: 44px;
min-height: 44px; /* V249 A11y � WCAG 2.5.5 */
border-radius: 8px;
border: 1.5px solid #d9c9a8;
background: #fff;
color: var(--cat-ink);
font-weight: 700;
cursor: pointer;
transition: background .15s; }
#catalogue-pagination button.active { background: var(--cat-gold);
border-color: var(--cat-gold);
color: #fff; }
#catalogue-pagination button:hover:not(.active) { background: #f5edd6; }
.page-info { font-size: .85rem;
color: #6d4d12;
font-weight: 700;
padding: 0 8px; }

/* -- Skeleton loader ----------------------------------- */
@keyframes skeleton-shimmer {
0%   { transform: translateX(-100%); }
100% { transform: translateX(100%); }
}
.skeleton-img::after,.skeleton-line::after,.skeleton-btn::after{content:'';position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.45) 50%,transparent 100%);animation:skeleton-shimmer 1.5s ease-in-out infinite;will-change:transform;}
.skeleton-card { display: flex;
flex-direction: column;
border: 1.5px solid #e8dcc8;
border-radius: var(--cat-radius);
overflow: hidden;
background: var(--cat-bg);
min-height: 340px; }
.skeleton-img { flex: 0 0 200px;
background:#e8dcc8;position:relative;overflow:hidden; }
.skeleton-body { padding:16px; display:flex; flex-direction:column; gap:10px; flex:1; }
.skeleton-line { height:13px; border-radius:6px;
background:linear-gradient(90deg,#e8dcc8 25%,#f5ede0 50%,#e8dcc8 75%);
background-size:1200px 100%;
animation:skeleton-shimmer 1.5s ease-in-out infinite; }
.skeleton-line.short { width:40%; }
.skeleton-line.medium { width:65%; }
.skeleton-line.long { width:88%; }
.skeleton-btn { height:36px; width:130px; border-radius:999px; margin-top:4px;
background:linear-gradient(90deg,#e8dcc8 25%,#f5ede0 50%,#e8dcc8 75%);
background-size:1200px 100%;
animation:skeleton-shimmer 1.5s ease-in-out infinite; }

/* -- Responsive mobile ---------------------------------- */
@media (max-width:768px) {
.cat-layout { grid-template-columns: 1fr;
padding: 14px 0 36px; }
#catalogue-grid { grid-template-columns: 1fr;
gap: 14px; }
.product-img-wrap { max-height: 120px; }
.featured-card .product-img-wrap { max-height: 170px; min-height: 130px; }
.featured-card .product-img-wrap img { max-height: 150px; }
.product-title { -webkit-line-clamp: 3; }
}
@media (min-width: 761px) and (max-width: 1100px) {
#catalogue-grid { grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px; }
}

/* === CART === */

/* SavannaSelect V58 - panier et recapitulatif. */
/* ----------------------------------------------------
PANIER
---------------------------------------------------- */
.cart-layout{display:grid;grid-template-columns:1.5fr .85fr;gap:20px;padding:14px 0 30px}
.cart-table-wrap{padding:14px 18px;overflow:auto}
.cart-table{width:100%;border-collapse:collapse}
.cart-table th,.cart-table td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.cart-table th{color:var(--green);font-size:.82rem;font-weight:700;font-family:var(--font-b);text-transform:uppercase;letter-spacing:.05em}
.cart-table tr:last-child td{border-bottom:none}
.cart-thumb{width:56px;height:56px;object-fit:cover;border-radius:10px;border:2px solid var(--line)}
.cart-name{font-weight:700;font-size:.92rem}
.cart-cat{font-size:.77rem;color:var(--muted);margin-top:2px}

.qty-btn{ border:2px solid var(--line);background:#fff;border-radius:7px;
padding:5px 10px;cursor:pointer;min-height:40px;min-width:36px;transition:.2s;font-family:var(--font-b);font-size:.95rem; }
.qty-btn:hover{background:var(--green-lt);border-color:var(--green)}
.remove-btn{color:var(--danger);border-color:#ffd5d0;font-size:.8rem}
.remove-btn:hover{background:#fff0ee}
.empty-cart{padding:40px;text-align:center;color:var(--muted);font-size:1rem;line-height:1.8}
.empty-cart a{color:var(--gold);font-weight:700}

.summary-box{padding:22px;height:max-content;position:sticky;top:130px}
.summary-box h3{font-family:var(--font-d);color:var(--green);font-size:1.25rem;margin-bottom:16px}
.summary-line{display:flex;justify-content:space-between;gap:12px;margin:10px 0;color:var(--muted);font-family:var(--font-b);font-size:.92rem}
.summary-line.total{color:var(--green);font-weight:800;font-size:1.15rem;padding-top:12px;border-top:2px solid var(--line);margin-top:14px}
.cart-actions{display:flex;flex-direction:column;gap:8px;margin-top:14px}

/* V166 � Colonne image tableau panier desktop */
.cart-table td:first-child { width: 60px; padding: 4px 6px; vertical-align: middle; }
.cart-table img { display: block; border-radius: 8px; background: var(--cream, #fdf8f0); }
.qty-cell { white-space: nowrap; }

/* V166 � Controls boutons panier */
.qty-btn { min-width: 44px; min-height: 44px; border-radius: 8px; /* V249 A11y */
border: 1.5px solid var(--line, #d9c9a8); background: var(--surface, #fdf8f0);
font-size: 1rem; font-weight: 700; cursor: pointer; line-height: 1; }
.qty-btn:hover { background: var(--green, #1a4a28); color: #fff; }
.cart-remove-btn { background: none; border: none; color: var(--muted, #6b5b47);
font-size: 1rem; cursor: pointer; padding: 4px 8px; border-radius: 6px;
min-height: 32px; }
.cart-remove-btn:hover { background: #fee2e2; color: #c0392b; }

/* === BLOG === */

/* SavannaSelect V58 - Blog autonome : cartes, filtres, article et modal. */
@media(max-width:640px){
#blog-grid{grid-template-columns:1fr}
}

.nav-link{display:inline-flex;align-items:center;gap:.35rem;text-decoration:none;color:inherit;font-weight:700;}
.nav-link:hover{opacity:.85;}

/* === CHECKOUT === */

/* SavannaSelect V58 - checkout, formulaires et confirmation. */
.checkout-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}
.checkout-card{padding:26px}.checkout-form{display:grid;gap:14px}.form-row-2col{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.checkout-title{font-family:var(--font-d);color:var(--green);margin-bottom:18px}.summary-title{font-family:var(--font-d);color:var(--green);margin-bottom:16px}
.form-hint{margin-top:5px;font-size:.78rem;color:var(--muted)}
.order-success{display:none;background:#e8f5e9;border:2px solid #4caf50;border-radius:14px;padding:24px;text-align:center;margin-top:16px}
.order-success-title{font-family:var(--font-d);color:#2e7d32;margin-bottom:8px;font-size:1.4rem}

/* V35 � lisibilit� de la page paiement. */
#page-checkout .page-title h2{color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.22)}
#page-checkout .card{background:var(--surface)}
#checkout-submit-btn{width:100%;justify-content:center}

/* V35 stabilisation : harmonisation visuelle et correctifs mobile */
#page-checkout .page-hero{background:linear-gradient(135deg,var(--green),#254b2f)}
#page-checkout .checkout-page-title h2,#page-checkout .page-title h2{color:#fff!important;text-shadow:0 2px 12px rgba(0,0,0,.28)}
#page-checkout .checkout-page-title p,#page-checkout .page-title p{color:rgba(255,255,255,.92)!important}
.checkout-form .form-input:focus{outline:2px solid rgba(188,139,60,.25);border-color:var(--gold)}

/* === UTILITIES === */

/* SavannaSelect V58 - utilitaires resserr�s et composants transversaux. */
.panel{display:none}
.panel.active{display:block;padding-bottom:80px}
#page-blog,#page-grossiste,#page-contact,#page-conseiller{content-visibility:auto;contain-intrinsic-size:0 600px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 24px;border:2px solid transparent;font-weight:700;font-family:var(--font-b);cursor:pointer;transition:.25s;font-size:.92rem;text-decoration:none}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,var(--gold),var(--amber));color:#fff;box-shadow:0 6px 24px rgba(212,137,26,.28)}
.btn-primary:hover{box-shadow:0 10px 36px rgba(212,137,26,.42)}
.btn-green{background:linear-gradient(135deg,var(--green),var(--green-mid));color:#fff;box-shadow:0 6px 20px rgba(26,74,40,.22)}
.btn-green:hover{box-shadow:0 10px 32px rgba(26,74,40,.34)}
.btn-light{background:rgba(255,255,255,.15);color:#1a1a1a;border-color:rgba(255,255,255,.3)}
.btn-light:hover{background:rgba(255,255,255,.25);border-color:rgba(255,255,255,.5)}
.btn-wa{background:linear-gradient(135deg,#25D366,#128C7E);color:#fff;box-shadow:0 6px 20px rgba(37,211,102,.28)}
.btn-danger{background:transparent;border-color:#f5b5b5;color:var(--danger)}
.btn-danger:hover{background:#fff0ee}
.btn-sm{padding:8px 16px;font-size:.82rem}
.btn-full{width:100%;justify-content:center}
.card,.premium-card{background:var(--surface);border:2px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.shadow-soft{box-shadow:0 2px 10px rgba(0,0,0,.12)}
.muted,
.text-small{font-size:.85rem}

.form-label{display:block;margin-bottom:6px;color:var(--green);font-weight:700;font-size:.88rem}
.form-input{width:100%;border:2px solid var(--line);border-radius:10px;padding:11px 14px;outline:none;font-family:var(--font-b);background:#fff;color:var(--text)}
.form-input:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(212,137,26,.14)}
.modal-block{background:#fff;border-radius:20px;padding:28px;max-width:560px;width:min(90vw,560px);margin:auto;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.img-round{border-radius:10px;object-fit:cover}
.flex-row{display:flex;align-items:center;gap:10px}.flex-wrap{display:flex;gap:12px;flex-wrap:wrap}
.grid-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.icon-lg{font-size:1.5rem}.icon-xl{font-size:1.8rem}
.w-col-photo{width:58px}.w-col-category{width:130px}.w-col-price{width:80px}.w-col-status{width:95px}.w-col-qty{width:170px}.w-col-actions{width:120px}
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(30px);background:var(--green);color:#fff;padding:12px 28px;border-radius:999px;font-size:.92rem;font-weight:700;opacity:0;transition:.35s cubic-bezier(.34,1.56,.64,1);z-index:9999;pointer-events:none;white-space:nowrap;box-shadow:0 8px 24px rgba(26,74,40,.3);font-family:var(--font-b)}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:9000;align-items:center;justify-content:center}
.modal-overlay.open{display:flex}
.wa-float{position:fixed;right:20px;bottom:20px;z-index:8000;width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#25D366,#128C7E);color:#fff;display:grid;place-items:center;font-size:28px;box-shadow:0 8px 28px rgba(37,211,102,.5);transition:.3s;text-decoration:none}
.wa-float:hover{transform:scale(1.14)}
.footer{margin-top:36px;border-top:2px solid var(--line);background:linear-gradient(180deg,#1a3a28,#0f2a1a);padding:36px 0 20px}
.footer-grid{display:grid;grid-template-columns:1fr 1.1fr .8fr;gap:24px}
.footer h4{font-family:var(--font-d);color:var(--amber);font-size:1rem;margin-bottom:12px}
.footer p{color:rgba(255,255,255,.62);line-height:1.7;font-size:.88rem;font-family:var(--font-b)}
.footer a:hover{color:var(--amber)}
.badge-list{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}
.badge-chip{display:inline-flex;padding:6px 13px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.78);font-weight:700;font-size:.78rem;font-family:var(--font-b);transition:.2s}
.badge-chip:hover{background:var(--amber);border-color:var(--amber);color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:22px;padding-top:16px;text-align:center;color:rgba(255,255,255,.38);font-size:.8rem;font-family:var(--font-b)}
.footer-link{color:var(--amber);text-decoration:none}.footer-link-strong{font-weight:700}
.footer-legal-link{color:rgba(255,255,255,.55);text-decoration:none;font-size:.78rem;letter-spacing:.08em;transition:color .2s}
.footer-legal-link:hover{color:var(--amber)}.footer-separator{color:rgba(255,255,255,.2)}
.img-zoom-btn{cursor:zoom-in;position:relative}
.img-zoom-btn::after{content:'??';position:absolute;bottom:6px;right:6px;background:rgba(0,0,0,.45);color:#fff;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-size:.75rem;opacity:0;transition:opacity .2s;pointer-events:none}
.img-zoom-btn:hover::after{opacity:1}
#lightbox-overlay{display:none;position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.88);align-items:center;justify-content:center;cursor:zoom-out}
#lightbox-overlay.open{display:flex;animation:lbFade .2s ease forwards}
@keyframes lbFade{from{opacity:0}to{opacity:1}}
#lightbox-inner{position:relative;max-width:90vw;max-height:90vh;display:flex;flex-direction:column;align-items:center;gap:12px;background:transparent}
#lightbox-inner img{max-width:85vw;max-height:80vh;object-fit:contain;border-radius:12px;box-shadow:0 8px 48px rgba(0,0,0,.8);cursor:default;display:block;background:#111}
#lightbox-caption{color:#f5f0e8;font-size:.95rem;font-family:var(--font-b);text-align:center;letter-spacing:.02em}
#lightbox-close{position:absolute;top:-14px;right:-14px;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.15);border:1.5px solid rgba(255,255,255,.3);color:#fff;font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;line-height:1}
#lightbox-close:hover{background:rgba(255,255,255,.3)}
@media(max-width:768px){#toast{bottom:80px;width:calc(100% - 32px);left:16px;transform:translateY(30px);text-align:center}#toast.show{transform:translateY(0)}.footer-grid{grid-template-columns:1fr}.wa-float{right:14px;bottom:74px;width:50px;height:50px;font-size:1.3rem}}
/* Transition V35: classes u### conserv�es car plusieurs blocs statiques d'index.html les utilisent encore. */
.u001{display:none;}
.u002{display:flex;}
.u003{padding:0;overflow:hidden;border-radius:16px;position:relative;}
.u004{position:relative;}
.u005{width:100%;height:100%;object-fit:cover;border-radius:16px;max-height:320px;}
.u006{position:absolute;left:0;right:0;bottom:0;top:auto;border-radius:0 0 16px 16px;background:linear-gradient(to top,rgba(6,26,13,.97) 0%,rgba(6,26,13,.88) 60%,rgba(6,26,13,.55) 100%);padding:18px 20px 20px;display:flex;flex-direction:column;justify-content:flex-end;max-height:65%;}
.u007{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.u008{height:44px;width:auto;border-radius:6px;}
.u009{color:#fde68a;font-size:.65rem;font-weight:800;letter-spacing:.15em;font-family:var(--font-b);text-transform:uppercase;}
.u010{color:#fff;font-size:.88rem;font-weight:700;line-height:1.5;margin-bottom:14px;font-family:var(--font-b);}
.u011{display:flex;gap:12px;flex-wrap:wrap;}
.u012{text-align:center;}
.u013{font-size:1.3rem;}
.u014{color:rgba(255,255,255,.75);font-size:.55rem;font-weight:700;font-family:var(--font-b);text-transform:uppercase;margin-top:3px;white-space:pre-line;}
.u015{background:var(--green);padding:14px 16px;gap:0;flex-direction:column;border-bottom:2px solid rgba(240,165,0,.3);}
.u016{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.u017{display:flex;align-items:center;gap:8px;color:#fff;}
.u018{font-size:.72rem;font-weight:700;font-family:var(--font-b);}
.u019{font-size:.65rem;opacity:.8;}
.u020{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:18px;}
/* V247 FIX � mobile : 1 colonne sous 480px pour featured */
@media(max-width:480px){.u020{grid-template-columns:1fr;gap:14px;}}
.u021{display:flex;align-items:center;gap:18px;flex:1;flex-wrap:wrap;}
.u022{display:flex;gap:10px;flex-wrap:wrap;}
.u023{background:linear-gradient(135deg,#1a5c38 0%,#2d8a5e 60%,#1a4a28 100%);border-radius:0;padding:32px 0;}
.u024{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;}
.u025{font-size:.75rem;text-transform:uppercase;letter-spacing:2px;color:rgba(255,255,255,.65);margin-bottom:10px;font-family:var(--font-b);}
.u026{font-family:var(--font-d);font-size:1.75rem;color:#fff;margin-bottom:10px;}
.u027{color:rgba(255,255,255,.82);line-height:1.7;margin-bottom:22px;font-size:.95rem;}
.u028{background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.3);border-radius:14px;padding:14px 20px;display:flex;align-items:center;gap:12px;cursor:pointer;}
.u029{font-size:1.7rem;}
.u030{color:#fff;font-size:.68rem;font-family:var(--font-b);}
.u031{color:#fff;font-weight:700;font-size:.95rem;font-family:var(--font-b);}
.u032{font-size:2rem;opacity:.25;user-select:none;}
.u033{z-index:8500;}
.u034{font-family:var(--font-d);color:var(--green);margin-bottom:14px;}
.u035{color:var(--muted);font-size:.9rem;line-height:1.7;margin-bottom:8px;}
.u036{color:var(--muted);font-size:.88rem;line-height:1.9;padding-left:20px;margin-bottom:18px;}
.u037{border:1px solid #ccc;padding:1px 5px;border-radius:4px;font-size:.78rem;}
.u038{background:#e8f5e9;border-radius:10px;padding:12px 14px;margin-bottom:16px;}
.u039{color:#2e7d32;font-size:.82rem;font-family:var(--font-b);}
.u040{margin-top:14px;}
.u041{margin-top:10px;}
.u042{padding:16px 0 30px;}
.u043{display:flex;flex-direction:column;gap:18px;}
.u044{padding:16px 0 30px;display:grid;grid-template-columns:1.2fr .8fr;gap:20px;}
.u045{padding:26px;}
.u046{font-family:var(--font-d);color:var(--green);margin-bottom:18px;}
.u047{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.u048{margin-top:5px;font-size:.78rem;color:var(--muted);}
.u049{font-family:var(--font-d);color:var(--green);font-weight:700;font-size:1.1rem;margin-bottom:8px;}
.u050{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px;}
.u051{font-size:1.75rem;margin-bottom:10px;}
.u052{font-family:var(--font-d);color:#2e7d32;margin-bottom:8px;font-size:1.4rem;}
.u053{color:#2e7d32;font-size:.9rem;line-height:1.6;margin-bottom:16px;} /* V254 A11y � #388e3c?#2e7d32 */
.u054{color:#2e7d32;font-size:.88rem;font-weight:700;}
.u055{margin-top:16px;}
.u056{margin-top:6px;}
.u057{padding:22px;}
.u058{font-family:var(--font-d);color:var(--green);margin-bottom:16px;}
.u059{padding:20px 0 36px;}
.u060{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px;}
.u061{background:var(--green-lt);border:2px solid rgba(26,74,40,.18);border-radius:var(--radius);padding:18px;text-align:center;}
.u062{font-size:1.7rem;margin-bottom:8px;}
.u063{font-family:var(--font-d);color:var(--green);display:block;margin-bottom:4px;}
.u064{color:var(--muted);font-size:.85rem;}
.u065{display:inline-block;margin-top:10px;color:var(--green);font-weight:700;font-size:.88rem;}
.u066{background:var(--gold-lt);border:2px solid rgba(212,137,26,.25);border-radius:var(--radius);padding:18px;text-align:center;}
.u067{display:inline-block;margin-top:10px;color:var(--gold2);font-weight:700;font-size:.82rem;}
.u068{background:#f0f4ff;border:2px solid rgba(80,100,200,.15);border-radius:var(--radius);padding:18px;text-align:center;}
.u069{color:var(--muted);font-size:.82rem;line-height:1.5;}
.u070{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.u071{padding:28px;background:var(--surface);border:2px solid var(--line);}
.u072{font-family:var(--font-d);color:var(--green);font-size:1.35rem;margin-bottom:18px;}
.u073{display:flex;flex-direction:column;gap:12px;margin-bottom:22px;}
.u074{justify-content:center;}
.u075{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:999px;border:2px solid var(--green);background:#fff;color:var(--green);font-weight:700;font-size:.9rem;transition:.2s;text-decoration:none;}
.u076{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:999px;border:2px solid #e1306c;background:#fff;color:#e1306c;font-weight:700;font-size:.9rem;transition:.2s;text-decoration:none;}
.u077{background:var(--green-lt);border-radius:12px;padding:16px;border:1px solid rgba(26,74,40,.15);}
.u078{font-family:var(--font-d);color:var(--green);margin-bottom:10px;font-size:1rem;}
.u079{display:flex;flex-direction:column;gap:6px;}
.u080{display:flex;justify-content:space-between;font-size:.86rem;color:var(--text);}
.u081{display:flex;justify-content:space-between;font-size:.86rem;color:var(--muted);}
.u082{color:#c0580a;font-weight:700;} /* V254 A11y � #e67e22 ratio 2.85 ? #c0580a ratio 4.52 ? */
.u083{display:none;background:#e8f5e9;border:2px solid #4caf50;border-radius:12px;padding:16px;margin-bottom:16px;text-align:center;}
.u084{font-size:1.7rem;margin-bottom:6px;}
.u085{color:#2e7d32;font-family:var(--font-d);}
.u086{color:#1b5e20;font-size:.88rem;margin-top:4px;} /* V254 A11y � #388e3c?#1b5e20 sur fond #e8f5e9 */
.u087{display:grid;gap:14px;}
.u088{display:block;margin-bottom:5px;color:var(--green);font-weight:700;font-size:.86rem;font-family:var(--font-b);}
.u089{width:100%;border:2px solid var(--line);border-radius:10px;padding:11px 14px;outline:none;font-family:var(--font-b);background:#fff;color:var(--text);font-size:.93rem;transition:.2s;}
.u090{width:100%;border:2px solid var(--line);border-radius:10px;padding:11px 14px;outline:none;resize:vertical;font-family:var(--font-b);background:#fff;color:var(--text);font-size:.93rem;transition:.2s;}
.u091{display:none;color:#c0392b;font-size:.86rem;font-weight:700;padding:8px 12px;background:#fff0ee;border-radius:8px;border:1px solid #f5b5b5;}
.u092{padding:16px 0 40px;}
.u093{display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:24px;padding-bottom:4px;scrollbar-width:none;}
.u094{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.u095{display:none;position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:400;overflow-y:auto;padding:20px;overscroll-behavior:contain;}
.u096{max-width:780px;margin:0 auto;background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,.4);}
.u097{padding:36px;}
.u098{padding:16px 36px 28px;border-top:1px solid var(--line);text-align:right;}
.u099{background:linear-gradient(135deg,var(--green) 0%,var(--green-mid) 60%,#1f5c32 100%);padding:48px 0 40px;position:relative;overflow:hidden;}
.u100{position:absolute;inset:0;opacity:.07;background:url('data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%22120%22 height=%22120%22><circle cx=%2260%22 cy=%2260%22 r=%2250%22 fill=%22none%22 stroke=%22%23f0a500%22 stroke-width=%222%22/><circle cx=%2260%22 cy=%2260%22 r=%2230%22 fill=%22none%22 stroke=%22%23f0a500%22 stroke-width=%221%22/></svg>') repeat;}
.u101{position:relative;text-align:center;}
.u102{display:inline-block;background:var(--gold);color:#fff;font-size:.78rem;font-weight:700;letter-spacing:.12em;padding:5px 18px;border-radius:999px;margin-bottom:16px;font-family:var(--font-b);}
.u103{font-family:var(--font-d);color:#fff;font-size:1.6rem;margin-bottom:12px;}
.u104{color:rgba(255,255,255,.85);font-size:1.05rem;max-width:640px;margin:0 auto 24px;}
.u105{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.u106{text-decoration:none;}
.u107{padding:36px 0 40px;}
.u108{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:36px;}
.u109{border-top:4px solid var(--gold);text-align:center;background:var(--surface);}
.u110{color:var(--green);}
.u111{color:var(--text);}
.u112{padding:30px;margin-bottom:28px;}
.u113{font-family:var(--font-d);color:var(--green);margin-bottom:6px;}
.u114{color:var(--muted);margin-bottom:22px;font-size:.92rem;}
.u115{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:10px;}
.u116{background:var(--bg);border:2px solid var(--line);border-radius:14px;padding:20px;text-align:center;}
.u117{font-size:1.5rem;font-weight:900;color:var(--muted);font-family:var(--font-d);}
.u118{font-size:1.7rem;font-weight:900;color:var(--green);font-family:var(--font-d);margin:8px 0;}
.u119{font-size:.83rem;color:var(--muted);font-weight:600;}
.u120{font-size:.78rem;color:var(--muted);margin-top:8px;}
.u121{background:var(--green-lt);border:2px solid var(--green);border-radius:14px;padding:20px;text-align:center;}
.u122{font-size:1.5rem;font-weight:900;color:var(--green);font-family:var(--font-d);}
.u123{font-size:.83rem;color:var(--green);font-weight:600;}
.u124{background:var(--gold-lt);border:2px solid var(--gold);border-radius:14px;padding:20px;text-align:center;}
.u125{font-size:1.5rem;font-weight:900;color:var(--gold2);font-family:var(--font-d);}
.u126{font-size:1.7rem;font-weight:900;color:var(--gold);font-family:var(--font-d);margin:8px 0;}
.u127{font-size:.83rem;color:var(--gold2);font-weight:600;}
.u128{background:linear-gradient(135deg,var(--green),var(--green-mid));border-radius:14px;padding:20px;text-align:center;}
.u129{font-size:1.5rem;font-weight:900;color:var(--amber);font-family:var(--font-d);}
.u130{font-size:1.7rem;font-weight:900;color:#fff;font-family:var(--font-d);margin:8px 0;}
.u131{font-size:.83rem;color:var(--amber);font-weight:600;}
.u132{font-size:.78rem;color:rgba(255,255,255,.8);margin-top:8px;}
.u133{font-size:.8rem;color:var(--muted);text-align:center;margin-top:12px;}
.u134{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:28px;}
.u135{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;}
.u136{display:flex;align-items:center;gap:10px;font-size:.93rem;}
.u137{background:var(--green-lt);color:var(--green);border-radius:8px;padding:4px 10px;font-size:1.1rem;}
.u138{display:flex;align-items:flex-start;gap:10px;font-size:.93rem;}
.u139{color:var(--gold);font-size:1.1rem;margin-top:1px;}
.u140{padding:28px;margin-bottom:28px;}
.u141{font-family:var(--font-d);color:var(--green);margin-bottom:20px;text-align:center;}
.u142{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.u143{text-align:center;position:relative;}
.u144{width:52px;height:52px;background:linear-gradient(135deg,var(--gold),var(--amber));border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-size:1.4rem;box-shadow:0 4px 14px rgba(212,137,26,.3);}
.u145{position:absolute;top:26px;left:calc(50% + 30px);right:0;height:2px;background:linear-gradient(90deg,var(--gold),var(--line));display:block;}
.u146{font-size:.75rem;font-weight:700;color:var(--gold);letter-spacing:.08em;margin-bottom:4px;}
.u147{font-weight:700;color:var(--green);margin-bottom:6px;font-size:.95rem;}
.u148{font-size:.82rem;color:var(--muted);}
.u149{width:52px;height:52px;background:linear-gradient(135deg,var(--green),var(--green-mid));border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-size:1.4rem;box-shadow:0 4px 14px rgba(26,74,40,.3);}
.u150{font-size:.75rem;font-weight:700;color:var(--green);letter-spacing:.08em;margin-bottom:4px;}
.u151{padding:30px;}
.u152{color:var(--muted);font-size:.9rem;margin-bottom:22px;}
.u153{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.u154{display:block;margin-bottom:6px;color:var(--green);font-weight:700;font-size:.85rem;}
.u155{width:100%;border:2px solid var(--line);border-radius:10px;padding:11px 14px;outline:none;font-family:var(--font-b);background:var(--surface);transition:.2s;box-sizing:border-box;}
.u156{width:100%;border:2px solid var(--line);border-radius:10px;padding:11px 14px;outline:none;font-family:var(--font-b);background:var(--surface);box-sizing:border-box;}
.u157{width:100%;border:2px solid var(--line);border-radius:10px;padding:11px 14px;outline:none;font-family:var(--font-b);background:var(--surface);box-sizing:border-box;color:var(--text);}
.u158{grid-column:1/-1;}
.u159{display:flex;flex-wrap:wrap;gap:8px;background:var(--surface);border:2px solid var(--line);border-radius:10px;padding:12px;}

.site-header .container,.main-nav .container{max-width:var(--header-max);margin-inline:auto;width:min(100% - 32px,var(--header-max))}
button,[data-page],[data-action],.nav-btn,.hbtn{min-height:var(--tap)}
.main-nav .nav-links{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.mobile-search{display:none}
.u-grid-span{grid-column:1/-1;}
body.modal-open{overflow:hidden}

/* Correctifs int�gr�s */

/* SAVANNA SELECT V35 � correctif lisibilite home/header/cartes.
Objectif: aucune nouvelle fonction; seulement corriger les regressions visuelles V35. */

/* Eviter les debordements horizontaux */
.section,.hero,.panel,main#panels{max-width:100%;overflow-x:hidden}

/* V35 � �tats r�utilisables pour �viter les styles directs r�p�titifs en JS */
.is-hidden{display:none!important}
.is-visible{display:block!important}
.is-valid{border-color:var(--green)!important}
.is-invalid{border-color:var(--danger)!important}
.is-disabled{opacity:.5;cursor:not-allowed}

/* V35 � classes utilitaires r�utilisables. */

.premium-card{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.btn-full{width:100%;justify-content:center}
.form-label{display:block;margin-bottom:6px;color:var(--green);font-weight:700;font-size:.86rem}
.form-input{width:100%;border:2px solid var(--line);border-radius:10px;padding:11px 14px;outline:none;background:#fff;color:var(--text)}
.form-input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(212,137,26,.16)}
.modal-block{background:var(--surface);border-radius:18px;box-shadow:var(--shadow-lg)}
.img-round{border-radius:10px;object-fit:cover}
.shadow-soft{box-shadow:var(--shadow)}
.is-hidden{display:none!important}.is-visible{display:block!important}.is-valid{border-color:var(--green)!important}.is-invalid{border-color:var(--danger)!important}.is-disabled{opacity:.5;cursor:not-allowed;pointer-events:none}

/* V35 stabilisation : harmonisation visuelle et correctifs mobile */
.is-hidden{display:none!important}.is-visible{display:block!important}.is-valid{border-color:#2e7d32!important}.is-invalid{border-color:#c62828!important;background:#fff7f7!important}.has-cart 

/* V176 � Touch targets minimum 44px (accessibilit� mobile WCAG 2.1 AA) */
.btn, button, [data-action], [role="button"] { min-height: 44px;
touch-action: manipulation; }
input, select, textarea { touch-action: manipulation; }

/* === MOBILE PAGES === */

/* SavannaSelect V58 - regles mobiles par pages, separees de mobile.css. */
/* --------------------------------------
V35 � MOBILE FIRST IMPROVEMENTS
-------------------------------------- */

/* -- Touch targets & base -- */
@media(max-width:768px){
/* Prevent horizontal scroll */
/* Specificity-first approach: avoid  where possible */
html,body{overflow-x:hidden;max-width:100vw}
body.modal-open{overflow:hidden;overscroll-behavior:none}
#blog-modal,#blog-modal > div,.modal-overlay,.nav-links,.sidebar{overscroll-behavior:contain}
.wa-float{will-change:transform}
#lightbox,#blog-modal{will-change:opacity}
.main-nav{will-change:transform}

/* Base touch target sizes */
input,select,textarea{min-height:44px;font-size:16px} /* 16px prevents iOS zoom */

/* Container full width with small padding */
.container{width:100%;padding-left:12px;padding-right:12px;box-sizing:border-box}

/* -- Header mobile -- */
.site-header{position:sticky;top:0;z-index:200}
.header-row{grid-template-columns:auto 1fr auto auto;gap:8px;padding:8px 12px;align-items:center}
.brand-logo img{height:36px;width:auto;max-width:120px}
.logo-fallback{font-size:.85rem}
.search-bar{display:none} /* hide desktop search */
.header-actions{gap:4px}
.hbtn{padding:6px 8px;font-size:.75rem}
.lang-btn{display:none} /* hide lang btn in header on mobile � accessible via menu */
#menu-toggle{min-width:44px;min-height:44px;font-size:1.3rem;display:flex;align-items:center;justify-content:center}

/* -- Mobile search bar -- */
.mobile-search{padding:8px 12px}
.mobile-search .search-bar{display:flex}
.mobile-search input{flex:1;min-height:44px;font-size:16px;padding:10px 14px}
.mobile-search button{min-height:44px;min-width:48px}

/* -- Nav mobile -- */
.nav-links{padding:8px 12px;gap:4px}
.nav-btn{min-height:44px;display:flex;align-items:center;padding:10px 14px;border-radius:10px;font-size:.9rem}
/* Show lang toggle in mobile nav */
#nav-lang-mobile{display:flex}

/* -- Hero -- */
.hero{padding:0}
.hero-card{padding:18px 14px;gap:14px}
.hero-visual img{max-height:200px;border-radius:12px}
.hero-copy h1{font-size:1.5rem;line-height:1.25}
.hero-copy p{font-size:.9rem}
.hero-actions{display:flex;flex-direction:column;gap:10px}
.hero-actions .btn{width:100%;justify-content:center;min-height:50px;font-size:1rem}
/* hero-visual kept visible on mobile for branding */

/* -- Trust bar -- */
.trust-bar{padding:12px;gap:8px}
.trust-item strong{font-size:.8rem}
.trust-item span{font-size:.75rem}

/* -- Reassurance block mobile -- */
.reassurance-mobile{display:flex}

/* -- Features / sections -- */
.feat-grid{display:grid;grid-template-columns:1fr;gap:12px}
.feat-card{padding:16px}
.section-head{padding:0 0 14px}

/* -- Catalogue -- */
#catalogue-grid{grid-template-columns:1fr;gap:12px}
.product-card{grid-template-columns:72px 1fr;gap:10px;padding:12px}
/* V247 FIX � featured-card reste en colonne verticale sur mobile */
#home-featured .product-card,.featured-card{grid-template-columns:1fr !important;display:flex !important;flex-direction:column !important;}
.product-media{min-height:auto}
.product-real-img{width:72px;min-width:72px;height:72px;border-radius:8px}
.product-info h3{font-size:.92rem}
.product-meta{font-size:.78rem}
.price-tag{font-size:1rem}

/* -- Filter buttons -- */
.filter-bar,.cat-filter-bar{display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:8px;padding-bottom:8px;scrollbar-width:none}
.filter-bar::-webkit-scrollbar,.cat-filter-bar::-webkit-scrollbar{display:none}

/* -- CART MOBILE CARDS (replaces table) -- */
.cart-table{display:none} /* hide table on mobile */
#cart-mobile-cards{display:block} /* show card layout */
.cart-mobile-card{ background:var(--surface);border:1.5px solid var(--line);border-radius:14px;
padding:14px;display:grid;grid-template-columns:70px 1fr;gap:12px;
margin-bottom:12px;position:relative; }
.cart-mobile-card img{width:70px;height:70px;object-fit:cover;border-radius:10px}
.cart-mobile-card-body{display:flex;flex-direction:column;gap:6px}
.cart-mobile-card-name{font-weight:700;color:var(--green);font-size:.92rem;line-height:1.3}
.cart-mobile-card-meta{font-size:.78rem;color:var(--muted)}
.cart-mobile-card-price{font-size:1rem;font-weight:700;color:var(--gold2)}
.cart-mobile-card-controls{display:flex;align-items:center;gap:10px;margin-top:4px}
.cart-mobile-card-controls .qty-btn{min-width:36px;min-height:36px;border-radius:8px;font-size:1.1rem}
.cart-mobile-card-controls .qty-count{font-size:1rem;font-weight:700;min-width:24px;text-align:center}
.cart-mobile-remove{position:absolute;top:10px;right:10px;background:none;border:none;color:var(--muted);font-size:1.1rem;cursor:pointer;padding:4px;min-height:36px;min-width:36px}

/* -- Cart actions -- */
.cart-actions{display:flex;flex-direction:column;gap:10px}
.cart-actions .btn{width:100%;justify-content:center}
.cart-layout{gap:14px}
.summary-box{padding:16px}
.summary-line{font-size:.92rem}

/* -- Checkout -- */
.checkout-grid{grid-template-columns:1fr;gap:14px}
.form-row-2col{grid-template-columns:1fr}

/* -- WhatsApp float -- */
.wa-float{right:14px;bottom:74px;width:50px;height:50px;font-size:1.3rem}

/* -- Footer -- */
.footer-grid{grid-template-columns:1fr;gap:20px}
.footer-bottom{text-align:center;font-size:.78rem}

/* -- Blog -- */

/* -- Modals -- */
.modal-content,.modal-overlay > div{max-width:95vw;padding:20px;border-radius:16px}

/* -- Page titles -- */
.page-hero{padding:24px 0 16px}
.page-title h2{font-size:1.4rem}

/* -- Sticky cart bar (shows on catalogue) -- */

/* -- Featured grid mobile -- */
.featured-grid{grid-template-columns:1fr 1fr;gap:10px}

/* -- Stats bar -- */

/* -- Grossiste cards -- */
#page-grossiste [style*="grid-template-columns:repeat(3"]{display:grid;grid-template-columns:1fr}
#page-grossiste [style*="grid-template-columns:repeat(4"]{display:grid;grid-template-columns:1fr 1fr}

/* -- Product modal / detail -- */
.product-detail-grid{grid-template-columns:1fr}

/* -- Search results -- */
.search-result{grid-template-columns:70px 1fr;padding:12px}
}

/* === MOBILE === */

/* SavannaSelect V58 - mobile global, all�g�. Les r�gles par page restent dans mobile-pages.css. */
@media(max-width:768px){
html,body{overflow-x:hidden;max-width:100vw}
body.modal-open{overflow:hidden;overscroll-behavior:none}
.container{width:100%;padding-left:12px;padding-right:12px;box-sizing:border-box}
input,select,textarea{min-height:44px;font-size:16px}
.site-header{position:sticky;top:0;z-index:200}
.header-row{grid-template-columns:auto 1fr auto auto;gap:8px;padding:8px 12px;align-items:center}
.brand-logo img{height:36px;width:auto;max-width:120px}
.logo-fallback{font-size:.85rem}
.header-actions{gap:4px}
.hbtn{padding:6px 8px;font-size:.75rem}
.lang-btn{display:none}
#menu-toggle{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-size:1.3rem}
.search-bar{display:none}
.mobile-search{display:block;padding:8px 12px;background:rgba(4,14,8,.95);border-bottom:1px solid rgba(212,137,26,.3)}
.mobile-search .search-bar{display:flex;border-radius:10px}
.mobile-search input{flex:1;min-height:44px;font-size:16px;padding:10px 14px}
.mobile-search button{min-height:44px;min-width:48px}
.main-nav{display:none}
.main-nav.open{display:block}
.main-nav .nav-links,.nav-links{flex-direction:column;align-items:stretch;padding:8px 12px;gap:4px}
.nav-btn{width:100%;justify-content:center;padding:10px 14px;border-radius:10px;font-size:.9rem}
#nav-lang-mobile{display:flex}
.topbar{font-size:.76rem;line-height:1.35;padding:6px 8px;letter-spacing:0}
.hero-card,.cat-layout,.cart-layout,.checkout-grid,.contact-grid,.footer-grid{grid-template-columns:1fr}
.feat-grid,#catalogue-grid{display:grid;grid-template-columns:1fr}
.hero-card{padding:18px 14px;gap:14px}
.hero-copy h1{font-size:1.5rem;line-height:1.25}
.hero-copy p{font-size:.9rem}
.hero-actions{display:flex;flex-direction:column;gap:10px}
.hero-actions .btn{width:100%;justify-content:center;min-height:50px;font-size:1rem}
.trust-bar{flex-direction:column;align-items:flex-start;gap:12px;padding:12px}
.trust-item{flex-direction:row;text-align:left;gap:10px}
.product-card{grid-template-columns:1fr}
.product-media{min-height:160px}
.product-real-img{width:72px;min-width:72px;height:72px}

.wa-float{right:14px;bottom:calc(74px + env(safe-area-inset-bottom,0px));width:50px;height:50px;font-size:1.3rem}
.footer-bottom{text-align:center;font-size:.78rem}
}
@media(max-width:380px){
.hero-copy h1{font-size:1.3rem}
.hbtn{font-size:.7rem;padding:5px 6px}
.featured-grid{grid-template-columns:1fr}
}

/* V35 � mobile stabilis�. */
@media(max-width:768px){
.main-nav.open{display:block;position:absolute;left:0;right:0;top:100%;background:rgba(7,24,16,.98);border-bottom:1px solid rgba(212,137,26,.35);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.hero-card{grid-template-columns:1fr;padding:18px 14px;gap:16px}
.hero-copy h1{max-width:none;font-size:1.55rem;line-height:1.18}
.page-title{padding:18px 16px}
.page-title h1,.page-title h2{font-size:1.38rem}
.checkout-grid,.cart-layout{grid-template-columns:1fr}
}

/* V35 stabilisation : harmonisation visuelle et correctifs mobile */
@media(max-width:768px){.site-header{position:sticky;top:0}.hero-actions,.cart-actions{gap:10px}.btn,.hbtn,.nav-btn{min-height:44px}.checkout-grid{grid-template-columns:1fr}.form-row-2col{grid-template-columns:1fr}.page-title{padding:18px 16px}}

/* === ELEMENTS === */

/* SavannaSelect V178 � Elements CSS
Sticky cart bar, WhatsApp float, Hero-actions, Hero-img consolid�
Externalis� depuis blocs v165-sticky-wa-css et v165-hero-img-css
Mis en cache 1 an via .htaccess
*/

/* V178 � Sticky Cart Bar mobile (�l�ment HTML restaur�) */
#sticky-cart-bar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:500;background:var(--green,#1a4a28);color:#fff;align-items:center;justify-content:space-between;padding:10px 16px;box-shadow:0 -4px 20px rgba(0,0,0,.3);min-height:56px;padding-bottom:12px;padding-bottom:max(12px,env(safe-area-inset-bottom,0px))}
#sticky-cart-bar.visible{display:flex}
#sticky-cart-bar .sbc-info{font-size:.9rem;font-weight:700;flex:1}
#sticky-cart-bar .sbc-btn{background:var(--gold,#d4891a);color:#fff;border:none;border-radius:10px;padding:8px 18px;font-weight:700;font-size:.9rem;min-height:40px;cursor:pointer;white-space:nowrap}
/* V178 � Hero CTA buttons (restaur�s) */
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.hero-actions .btn{min-height:50px;font-size:1rem}
@media(max-width:768px){
#sticky-cart-bar{z-index:600}
.wa-float{bottom:calc(70px + env(safe-area-inset-bottom,0px)) !important;right:14px !important;width:50px !important;height:50px !important;font-size:1.3rem !important}
.hero-actions{flex-direction:column}
.hero-actions .btn{width:100%}
}

/* V178 � R�gle unique consolid�e pour #hero-home-img (remplace les 12 d�finitions conflictuelles de V164) */
#hero-home-img { display: block;
width: 100%;
height: 100%;
min-height: 340px;
max-height: 460px;
object-fit: cover;
object-position: center;
border-radius: 18px;
background: #0b2817; }
@media (max-width:768px) {
#hero-home-img { min-height: 220px; max-height: 300px; border-radius: 14px; }
}
@media (max-width: 520px) {
#hero-home-img { min-height: 180px; max-height: 250px; }
}

/* V178: display g�r� par JS (.visible class) */

/* === FIXES === */

/* SavannaSelect V178 � correctifs production (base V172)
Note V178 : r�gles #catalogue-grid standalone supprim�es (g�r�es dans catalogue-v175.css)
Objectifs: catalogue lisible, CSS stabilis�, barre panier non intrusive,
grossiste lisible, retrait des traces visuelles admin/disponibilit�. */

/* Base de s�curit� visuelle */
html, body { min-width: 0; }
body { padding-bottom: 0; }
body.has-cart { padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)); }
.panel { min-height: 55vh; }

/* ---------------------------------------------------------------
V175 NOTE: Les r�gles .product-card ci-dessous sont conserv�es
pour compatibilit� mais sont surcharg�es par catalogue-v175.css
qui est la SOURCE UNIQUE pour les cartes catalogue.
--------------------------------------------------------------- */
/* Catalogue : r�gles h�rit�es V172 (surcharg�es par catalogue-v175.css) */
.cat-layout { display: grid;
grid-template-columns: minmax(230px, 275px) minmax(0, 1fr);
gap: 22px;
align-items: start;
padding: 22px 0 52px; }
.sidebar { background: #fffaf1 !important;
border: 1.5px solid #dcc79f !important;
color: #173c25 !important;
border-radius: 16px !important;
box-shadow: 0 10px 26px rgba(0,0,0,.08) !important;
position: sticky !important;
top: 145px !important; }
#catalogue-grid { display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 20px !important;
align-items: stretch !important;
min-height: 240px !important;
background: transparent !important; }
#catalogue-grid .product-card,
.product-card { display: flex;
flex-direction: column;
min-width: 0 !important;
min-height: 100%;
padding: 0 !important;
overflow: hidden;
background: #fffaf1;
color: #1e1510;
border: 1.5px solid #d9c9a8;
border-top: 4px solid #d4891a;
border-radius: 18px;
box-shadow: 0 12px 32px rgba(10, 36, 21, .12);
opacity: 1 !important;
transform: none; }
#catalogue-grid .product-card:hover,
.product-card:hover { transform: translateY(-2px); box-shadow: 0 18px 42px rgba(10,36,21,.18); }
#catalogue-grid .product-img-wrap,
.product-img-wrap { display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 210px !important;
min-height: 210px !important;
padding: 16px;
background: linear-gradient(160deg, #fbf4e6, #eee1c6);
border-bottom: 1px solid #e1d0ad;
overflow: visible; }
#catalogue-grid .product-img-wrap img,
.product-img-wrap img { display: block;
width: 100%;
max-width: 180px;
height: 117px !important;
max-height: 117px;
object-fit: contain !important;
object-position: center !important;
border-radius: 12px !important;
background: #fff;
opacity: 1 !important;
filter: none !important;
box-shadow: 0 2px 12px rgba(0,0,0,.08) !important; }
#catalogue-grid .product-body,
.product-body { display: flex;
flex-direction: column;
gap: 9px;
padding: 18px;
background: #fffaf1 !important;
color: #1e1510 !important;
min-height: 285px !important;
opacity: 1 !important; }
#catalogue-grid .product-meta,
.product-meta { color: #9a5f09;
opacity: 1 !important;
font-size: .74rem;
font-weight: 800;
letter-spacing: .08em;
text-transform: uppercase; }
#catalogue-grid .product-title,
.product-title { color: #153c24;
opacity: 1 !important;
font-size: 1.1rem;
line-height: 1.25;
font-weight: 900; }
#catalogue-grid .product-desc,
.product-desc { color: #4b473f;
opacity: 1 !important;
line-height: 1.55;
font-size: .91rem;
display: -webkit-box !important;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden; }
#catalogue-grid .product-footer,
.product-footer { display: flex;
align-items: center;
gap: 10px;
margin-top: auto;
padding-top: 12px;
border-top: 1px solid #e4d4b6 !important; }
.price { color: #153c24; font-weight: 900; }
.product-actions { display: flex; flex-wrap: wrap !important; gap: 8px; margin-top: 10px; }
.zoom-hint { color: #5c4d38 !important; font-size: .78rem !important; line-height: 1.35 !important; }
/* V175: stock badge classes supprim�es � v174-final.css g�re le masquage */
.no-results { grid-column: 1 / -1 !important; background: #fffaf1 !important; color: #153c24 !important; border: 1.5px solid #d9c9a8 !important; border-radius: 16px !important; padding: 36px 18px !important; min-height: 160px !important; }
#catalogue-pagination { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; justify-content: center !important; margin: 26px 0 0 !important; position: static !important; }
#catalogue-pagination button, #catalogue-pagination .page-info { min-height: 42px; padding: 8px 13px; border-radius: 999px; border: 1.5px solid #d9c9a8; background:#fffaf1; color:#153c24; font-weight: 800; }
#catalogue-pagination button.active { background:#1a4a28; color:#fff; border-color:#1a4a28; }

/* Barre panier : visible seulement avec panier, non superpos�e */
#sticky-cart-bar { display: none !important;
position: fixed !important;
left: 16px !important;
right: 16px !important;
bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
z-index: 700 !important;
min-height: 58px !important;
padding: 10px 14px !important;
align-items: center !important;
justify-content: space-between !important;
gap: 12px !important;
background: #123d23 !important;
color: #fff !important;
border: 1px solid rgba(255,255,255,.16) !important;
border-radius: 16px !important;
box-shadow: 0 -10px 36px rgba(0,0,0,.28) !important; }
#sticky-cart-bar.visible { display: flex !important; }
#sticky-cart-bar .sbc-info { color: #fff !important; font-weight: 900 !important; }
#sticky-cart-bar .sbc-btn { background:#d4891a !important; color:#fff !important; border:0 !important; border-radius:12px !important; padding:10px 18px !important; font-weight:900 !important; }

/* Grossiste : correction capture � texte lisible sur cartes claires */
#page-grossiste .feat-card,
#page-grossiste .card { background: #fffaf1 !important;
color: #1e1510 !important;
border: 1.5px solid #d9c9a8 !important;
border-top: 4px solid #d4891a !important;
opacity: 1 !important; }
#page-grossiste .feat-card h3,
#page-grossiste .card h2,
#page-grossiste .card h3,
#page-grossiste .u110,
#page-grossiste .u113 { color: #153c24 !important; opacity: 1 !important; }
#page-grossiste .feat-card p,
#page-grossiste .card p,
#page-grossiste .u111 { color: #4b473f !important; opacity: 1 !important; }
#page-grossiste .feat-icon { width: 82px !important; height: 82px !important; padding: 0 !important; margin-bottom: 14px !important; background: transparent !important; border: 0 !important; }
#page-grossiste .feat-icon img { width: 82px !important; height: 82px !important; object-fit: cover !important; border-radius: 14px !important; border: 1px solid #d9c9a8 !important; background:#fff !important; }

/* Recherche : jamais de zone blanche */
#searchGrid { min-height: 180px; }
.search-result { background:#fffaf1 !important; color:#1e1510 !important; border:1.5px solid #d9c9a8 !important; }
.search-result .sr-body { background:#fffaf1 !important; color:#1e1510 !important; }
.search-result .product-title { color:#153c24; }
.search-result .product-desc { color:#4b473f; }

/* Paiement : clart� sans int�gration active PayPal/carte */
.checkout-payment-note,
.checkout-confirm-note { margin-top: 10px; padding: 12px 14px; border-radius: 12px; background:#fff4d7; color:#5d3b00; border:1px solid #e9cd8a; font-size:.9rem; line-height:1.5; }

/* Nettoyage visuel admin/stock public */
.admin-link, [data-stock-filter], [data-action^="stock-"] { display: none !important; }

/* Responsive */
@media (max-width: 900px) { /* V178: #catalogue-grid 2col g�r� par catalogue-v175.css */ }
@media (max-width: 820px) {
.cat-layout { grid-template-columns: 1fr; gap: 16px; padding-bottom: 88px !important; }
.sidebar { position: static !important; }
/* V178: #catalogue-grid 1col g�r� par catalogue-v175.css */
#catalogue-grid .product-img-wrap, .product-img-wrap:not(.featured-card .product-img-wrap) { height: 100px !important; min-height:100px !important; }
.featured-card .product-img-wrap { height: 170px !important; min-height: 140px !important; max-height: 180px !important; }
#catalogue-grid .product-img-wrap img, .product-img-wrap img { height:100px !important; max-height:100px; }
.featured-card .product-img-wrap img { height:150px !important; max-height:160px !important; object-fit:contain !important; }
#catalogue-grid .product-body, .product-body { min-height: auto !important; padding: 16px; }
body.has-cart { padding-bottom: calc(94px + env(safe-area-inset-bottom, 0px)); }
#sticky-cart-bar { left: 8px !important; right: 8px !important; bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important; border-radius: 14px !important; }
#sticky-cart-bar .sbc-info { font-size: .86rem !important; }
#sticky-cart-bar .sbc-btn { padding: 9px 12px !important; white-space: nowrap !important; }
.wa-float { bottom: calc(82px + env(safe-area-inset-bottom, 0px)) !important; }
}

/* V172 � correctifs stricts suppl�mentaires */
.catalogue-zoom-help { color:#fff !important; opacity:1 !important; font-weight:700 !important; }
#catalogue-grid .product-card { isolation:isolate !important; }
#catalogue-grid .product-card *, .search-result * { opacity:1; }
#catalogue-grid .product-img-wrap img { aspect-ratio: 1 / 1; }
.product-title, .product-desc, .product-meta { text-shadow:none !important; }
.availability-badge { display:inline-block !important; padding:4px 9px !important; border-radius:999px !important; color:#fff !important; font-size:.72rem !important; font-weight:800 !important; white-space:nowrap !important; }

/* V35: stock badges activ�s */
#sticky-cart-bar { max-width: 1180px !important; margin-inline:auto !important; }
#page-catalogue .page-title p { max-width: 980px !important; }
#page-catalogue .page-hero { padding: 26px 0 18px !important; }
#page-catalogue .page-title { background:#24683a !important; color:#fff !important; border-radius:18px !important; padding:26px 30px !important; }
#page-catalogue .page-title h2, #page-catalogue .page-title p { color:#fff !important; }
#order-download-btn { margin-top:12px !important; }
@media (max-width: 820px){
#page-catalogue .page-title { padding:20px 18px !important; }
#page-catalogue .page-title h2 { font-size:1.65rem !important; }
#catalogue-grid .product-card { border-radius:16px; }
#catalogue-grid .product-img-wrap img { width:120px; max-width:120px; height:120px !important; }
}

/* V172 � correctifs stricts rapport V11 + capture utilisateur */
/* V178: #sticky-cart-bar g�r� par L148-166 (display:none ? flex via .visible) */
.order-now-float,
.has-cart 
/* V178: body.has-cart padding g�r� par la r�gle body.has-cart{calc(78px)} ci-dessus */
body.has-sticky-cart { padding-bottom:0 !important; }

/* Catalogue : une seule source de r�gles visuelles, lisible desktop/mobile */
#page-catalogue .page-title { background:#24683a !important; color:#fff !important; border-radius:18px !important; padding:24px 28px !important; }
#page-catalogue .page-title h2,
#page-catalogue .page-title p { color:#fff !important; opacity:1 !important; }
#page-catalogue .cat-layout { align-items:start; }
#catalogue-grid { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:20px !important; }
#catalogue-grid .product-card { display:flex; flex-direction:column; min-width:0 !important; min-height:0; overflow:hidden; background:#fffaf1; color:#153c24; border:1.5px solid #d9c9a8; border-top:4px solid #d4891a; box-shadow:0 10px 30px rgba(0,0,0,.12); opacity:1 !important; }
#catalogue-grid .product-img-wrap { height:120px !important; min-height:120px !important; padding:14px; background:#fff7ea; display:flex; align-items:center; justify-content:center; }
#catalogue-grid .product-img-wrap img { width:100px; height:100px !important; max-width:100px; max-height:100px; object-fit:contain !important; aspect-ratio:1/1; background:#fff; border-radius:14px !important; border:1px solid #ead8b8 !important; opacity:1 !important; }
#catalogue-grid .product-body { display:flex; flex-direction:column; gap:8px; flex:1; min-height:250px !important; padding:18px; background:#fffaf1 !important; color:#153c24 !important; opacity:1 !important; }
#catalogue-grid .product-meta { color:#9b6a18; font-size:.72rem; letter-spacing:.08em; opacity:1 !important; }
#catalogue-grid .product-title { color:#153c24; font-size:1.08rem; line-height:1.2; opacity:1 !important; }
#catalogue-grid .product-desc { color:#4b473f; font-size:.88rem; line-height:1.55; opacity:1 !important; flex:1 !important; }
#catalogue-grid .product-footer { margin-top:auto; border-top:1px solid #ead8b8 !important; }
#catalogue-grid .availability-badge { display:none !important; }
#catalogue-grid .product-actions { margin-top:10px; }
#catalogue-grid .zoom-hint { display:block !important; color:#5c4d38 !important; font-size:.76rem !important; }

/* Grossiste : cartes lisibles, pas de texte blanc sur fond clair */
#page-grossiste .feat-card,
#page-grossiste .card { background:#fffaf1 !important; color:#153c24 !important; opacity:1 !important; }
#page-grossiste .feat-card h3,
#page-grossiste .card h2,
#page-grossiste .card h3 { color:#153c24 !important; opacity:1 !important; }
#page-grossiste .feat-card p,
#page-grossiste .card p { color:#4b473f !important; opacity:1 !important; }

.checkout-send-actions { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:14px; }
.checkout-payment-note, .checkout-confirm-note { background:#fff4d7 !important; color:#5d3b00 !important; border:1px solid #e9cd8a !important; }

@media (max-width:1180px){ /* V178: catalogue-grid 2col dans catalogue-v175.css */ }
@media (max-width:820px){
#page-catalogue .cat-layout{grid-template-columns:1fr; padding-bottom:30px !important;}
/* V178: catalogue-grid 1col dans catalogue-v175.css */
#catalogue-grid .product-img-wrap{height:120px !important; min-height:120px !important;}
#catalogue-grid .product-img-wrap img{width:145px; height:145px !important; max-width:145px; max-height:145px;}
#catalogue-grid .product-body{min-height:auto !important;}
.wa-float{bottom:18px !important;}
}

/* === PAYMENT === */

/* SavannaSelect V181 � Styles paiement PayPal et Stripe */

/* Conteneurs PayPal et Stripe */
.paypal-container,
.stripe-container { margin-top: 16px;
padding: 16px;
border: 1.5px solid var(--line, #d9c9a8);
border-radius: var(--radius, 8px);
background: var(--surface, #fdf8f0);
transition: all 0.3s; }

/* Messages d'�tat / erreurs */
.paypal-status,
.stripe-error { color: var(--danger, #c0392b);
font-size: 0.9rem;
margin-top: 8px;
min-height: 20px; }

/* Champ carte Stripe Elements */
#stripe-card-element { padding: 12px;
border: 1.5px solid var(--line, #d9c9a8);
border-radius: var(--radius, 8px);
background: #ffffff;
transition: border-color 0.2s; }

#stripe-card-element:focus-within { border-color: var(--accent, #d4891a);
outline: 2px solid var(--accent, #d4891a);
outline-offset: 1px; }

/* Bouton payer Stripe */
#stripe-pay-btn { margin-top: 12px;
width: 100%;
min-height: 44px; /* Touch target WCAG */ }

/* Classe utilitaire */
.is-hidden { display: none !important; }

/* Logo PayPal placeholder (avant le SDK) */
.paypal-container::before { content: '';
display: block;
min-height: 40px; }

/* Labels paiement */
.payment-badge { font-size: 0.8rem;
background: var(--surface-2, #e8f5ec);
border-radius: 4px;
padding: 2px 6px;
margin-left: 4px;
color: var(--g1, #1a4a28); }

/* Responsive */
@media (max-width: 600px) {
.paypal-container, .stripe-container { padding: 12px; }
}

/* SavannaSelect V9 responsive checkout fixes */
@media (max-width: 480px){
.savanna-main-menu-v6, nav[aria-label="Menu principal Savanna Select"]{ overflow-x:auto !important;
flex-wrap:nowrap !important;
justify-content:flex-start !important;
-webkit-overflow-scrolling:touch; }
.checkout-section, #checkout, .cart-panel, .cart-drawer{ padding-bottom:96px !important; }
.savanna-whatsapp, .whatsapp-widget, .whatsapp-float, #whatsapp-button, #savanna-whatsapp-button{ bottom:18px !important;
right:14px !important; }
}

/* === V35 ADDITIONS === */

/* 1. HERO CARD RESPONSIVE FIX (RESP-01) */
@media (max-width: 480px) {
.hero-card { grid-template-columns: 1fr !important; gap: 16px !important; }
.hero-copy h1 { font-size: clamp(1.7rem, 5vw, 2.8rem) !important; }
.hero-visual { display: none; }
}

/* 2. STICKY CART BAR iOS SAFE AREA (RESP-03) */
/* V35: padding-bottom consolidated � see main sticky-cart-bar rule above */

/* 3. TABLET GRID 3 COLUMNS (RESP-04) */
@media (min-width: 768px) and (max-width: 1024px) {
.cat-layout { grid-template-columns: repeat(3, 1fr) !important; }
}

/* 4. MOBILE MENU TAP TARGETS (RESP-05) */
.nav-links a, .nav-btn, #menu-toggle, .header-actions button { min-height: 44px;
min-width: 44px;
display: inline-flex;
align-items: center;
justify-content: center; }

/* 5. SKIP LINK ACCESSIBILITY (A11Y-04) */
.skip-link { position: absolute;
top: -100%;
left: 16px;
background: #1A4D2E;
color: #fff;
padding: 8px 16px;
border-radius: 0 0 8px 8px;
font-weight: 700;
font-size: 14px;
text-decoration: none;
z-index: 999999;
transition: top 0.2s; }
.skip-link:focus { top: 0; }

/* 6. SKELETON LOADERS (UX-05) */
.skeleton-card { background: #f0f0f0;
border-radius: 18px;
overflow: hidden;
position: relative; }
.skeleton-card::after { content: '';
position: absolute;
inset: 0;
background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.6) 50%, transparent 100%);
animation: shimmer 1.4s infinite;
background-size: 200% 100%; }
@keyframes shimmer {
0% { background-position: -200% 0; }
100% { background-position: 200% 0; }
}
.skeleton-img { width: 100%;
aspect-ratio: 1/1;
background: #e0e0e0; }
.skeleton-line { height: 12px;
background: #e0e0e0;
border-radius: 6px;
margin: 8px 12px; }
.skeleton-line.short { width: 60%; }

/* 7. PREMIUM HOVER & TRANSITIONS */
.product-card { transition: transform 0.25s ease, box-shadow 0.25s ease !important; }
.product-card:hover { transform: translateY(-4px) !important; }
.btn { transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.2s ease !important; }
.btn:hover { transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(0,0,0,0.15); }
.btn:active { transform: translateY(0); }

/* 8. FONT FALLBACKS (PERF-03) */
:root { --font-b: "DM Sans","DM Sans FB", system-ui, -apple-system, Arial, sans-serif;
--font-d: "Playfair Display","Playfair FB", Georgia, "Times New Roman", serif; }

/* 9. CATALOGUE CSS FIX � CSS variable scope fix */
:root { --catalogue-bg: #fffaf2;
--catalogue-ink: #143d24;
--catalogue-gold: #d99a12; }

/* 10. PRODUCT VARIANTS DISPLAY */
.product-variants { display: flex;
flex-wrap: wrap;
gap: 6px;
margin: 6px 0; }
.variant-btn { padding: 3px 10px;
border: 1.5px solid var(--catalogue-gold, #d99a12);
border-radius: 20px;
background: transparent;
color: #143d24;
font-size: 12px;
cursor: pointer;
transition: all 0.15s; }
.variant-btn.active, .variant-btn:hover { background: var(--catalogue-gold, #d99a12);
color: #fff; }

/* 11. PAYMENT METHOD HIDDEN (non-configured) */
.payment-option[data-method="paypal"].unconfigured,
.payment-option[data-method="stripe"].unconfigured { opacity: 0.45;
pointer-events: none;
position: relative; }
.payment-option.unconfigured::after { content: 'Configuration requise';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 10px;
color: #666;
white-space: nowrap; }

/* 12. RESPONSIVE CHECKOUT (mobile) */
@media (max-width: 600px) {
#checkout-form .form-row { flex-direction: column !important; }
#checkout-summary { font-size: 14px; }
}

/* 13. RESPONSIVE FOOTER */
@media (max-width: 600px) {
.footer-grid, .site-footer > div[class] { grid-template-columns: 1fr !important;
gap: 20px !important; }
}

/* 14. FOCUS VISIBLE FOR KEYBOARD NAV */
:focus-visible { outline: 3px solid #D9A441;
outline-offset: 3px; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid #D9A441;
outline-offset: 2px; }

/* 15. SMOOTH PAGE TRANSITIONS */
.page-section { animation: fadeInPage 0.25s ease-out; }
@keyframes fadeInPage {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}

/* 16. CATALOGUE VARIABLE RENAME (no global :root conflict) */
.cat-layout { background: var(--catalogue-bg, #fffaf2); }

/* -----------------------------------------------------------
   SAVANNA SELECT V35 � Additions
   ----------------------------------------------------------- */

/* 1. ULTRA-WIDE (>1440px) centrage contenu */
@media (min-width: 1441px) {
  .container, .hero .container, .cat-layout, #catalogue-grid { max-width: 1440px; margin-left: auto; margin-right: auto; }
  .site-header .header-row { max-width: 1440px; margin: 0 auto; }
  .hero { max-width: 100%; }
  .hero-card { max-width: 1440px; margin: 0 auto; }
}

/* 2. PRODUCT VARIANTS � boutons de s�lection format/poids */
.product-variants {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 6px 0 8px;
}
.variant-btn {
  padding: 3px 10px;
  border: 1.5px solid var(--catalogue-gold, #d99a12);
  border-radius: 20px;
  background: transparent;
  color: var(--catalogue-ink, #143d24);
  font-size: 11.5px;
  font-family: var(--font-b, 'DM Sans','DM Sans FB', Arial, sans-serif);
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  white-space: nowrap;
}
.variant-btn.active,
.variant-btn:hover {
  background: var(--catalogue-gold, #d99a12);
  border-color: var(--catalogue-gold, #d99a12);
  color: #fff;
}
.variant-btn:focus-visible {
  outline: 2px solid #D9A441;
  outline-offset: 2px;
}

/* 3. Z-INDEX corrig� : menu mobile > sticky cart bar */
#main-nav.open {
  z-index: 10000 !important;
}
#sticky-cart-bar {
  z-index: 9999;
}

/* 4. IMAGE RESPONSIVE � srcset fallback gracieux */
.product-img-wrap img,
.sr-media img {
  background: #f0ebe0;
  transition: opacity 0.2s;
}
.product-img-wrap img[src="assets/logo-savanna-select.webp"],
.sr-media img[src="assets/logo-savanna-select.webp"] {
  object-fit: contain;
  padding: 8px;
}

/* 5. PAGE TRANSITION ANIMATION am�lior�e */
[data-page] {
  animation: fadeInPage 0.2s ease-out;
}


/* 6. SCROLLBAR premium (Chrome/Edge) */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f0f0f0; }
::-webkit-scrollbar-thumb { background: #1A4D2E; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #D9A441; }

/* 7. TOAST am�lioration z-index */
#toast { z-index: 100000; }

/* 8. SEARCH RESULTS layout am�lior� */
.search-result {
  display: flex;
  gap: 16px;
  padding: 12px;
  border: 1px solid rgba(217,154,18,.2);
  border-radius: 12px;
  background: #fffaf2;
  transition: box-shadow 0.2s;
}
.search-result:hover { box-shadow: 0 4px 16px rgba(10,36,21,.1); }
.sr-media img {
  width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: 8px;
  flex-shrink: 0;
}

/* -----------------------------------------------------------
   DARK MODE � @prefers-color-scheme: dark
   ----------------------------------------------------------- */
@media (prefers-color-scheme: dark) {
  :root {
    --bg-primary: #0a1a10;
    --bg-secondary: #111f16;
    --bg-card: #162212;
    --text-primary: #e8f5e9;
    --text-secondary: #a8c4b0;
    --border-color: rgba(217,154,18,.25);
    --gold: #D9A441;
    --gold-light: #FDE68A;
    --green-dark: #1A4D2E;
  }
  body {
    background-color: var(--bg-primary) !important;
    color: var(--text-primary) !important;
  }
  .site-header {
    background: #0a1a10 !important;
    border-bottom: 1px solid var(--border-color) !important;
  }
  /* Cards & products */
  .product-card, .cart-mobile-card, .search-result {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
  }
  .product-title, .product-desc, .product-meta { color: var(--text-primary) !important; }
  .price { color: var(--gold) !important; }
  /* Catalogue background */
  .cat-layout, #catalogue-grid { background: var(--bg-primary) !important; }
  /* Filter and search inputs */
  .form-input, #catSearch, #catFilter, input, select, textarea {
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
  }
  /* Checkout */
  .checkout-grid, .checkout-summary-box {
    background: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
  }
  /* Hero */
  .hero { background: linear-gradient(135deg, #061408 0%, #0d2618 50%, #061408 100%) !important; }
  /* Footer */
  .site-footer { background: #061408 !important; color: var(--text-secondary) !important; }
  /* Buttons */
  .btn-light { background: var(--bg-card) !important; color: var(--text-primary) !important; border-color: var(--border-color) !important; }
  /* Sticky cart bar */
  #sticky-cart-bar { background: var(--bg-secondary) !important; border-top-color: var(--border-color) !important; }
  /* Skeleton */
  .skeleton-card { background: var(--bg-card) !important; }
  .skeleton-img, .skeleton-line, .skeleton-btn { background: #1f3528 !important; }
  /* Variant buttons */
  .variant-btn { color: var(--text-primary) !important; }
  .variant-btn.active { color: #fff !important; }
  /* Scrollbar dark */
  ::-webkit-scrollbar-track { background: #0a1a10; }
  ::-webkit-scrollbar-thumb { background: #2d6a47; }
  /* Page sections */
  .page-hero { background: var(--bg-secondary) !important; }
  .section { background: var(--bg-primary) !important; }
}


  /* Header simplified */
  .site-header {
    background: white !important;
    border-bottom: 2px solid #1A4D2E !important;
    padding: 12px 0 !important;
    position: static !important;
  }
  

  /* Cart printable */
  .cart-table { width: 100% !important; border-collapse: collapse !important; }
  .cart-table th, .cart-table td {
    border: 1px solid #ccc !important;
    padding: 8px !important;
    color: #000 !important;
  }
  .cart-table th { background: #1A4D2E !important; color: white !important; }

  /* Order summary */
  #checkout-summary { display: block !important; }
  .summary-line { display: flex; justify-content: space-between; padding: 4px 0; border-bottom: 1px solid #eee; }

  /* Product cards � simplified */
  .product-card {
    background: white !important;
    border: 1px solid #ccc !important;
    break-inside: avoid !important;
    color: #000 !important;
  }

  /* Page breaks */
  .page-section { break-before: page; }

  /* Print footer */
  body::after {
    content: "SAVANNA SELECT � savannaselect.ca � +1 (403) 880-4882 � 37 Annette Pk NW, Calgary, AB";
    display: block;
    text-align: center;
    font-size: 9pt;
    color: #666;
    border-top: 1px solid #ccc;
    padding-top: 8px;
    margin-top: 20px;
  }
}

/* -- V35 NOUVELLES CLASSES ----------------------------------------------- */

/* Badges de disponibilit� produit */
.stock-badge{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;margin-top:4px;}
.stock-ok{background:#D4EDDA;color:#155724;}
.stock-order{background:#FFF3CD;color:#856404;}
.stock-out{background:#F8D7DA;color:#721C24;}

/* PIPEDA banner � remplace les styles inline */
.pipeda-banner{display:none;position:fixed;bottom:0;left:0;right:0;z-index:99998;background:#061A0D;color:#fff;padding:14px 20px;font-size:13px;line-height:1.5;border-top:2px solid #D9A441;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.pipeda-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-left:auto;}
.btn-pipeda{background:#B8860B;color:#fff;border:none;padding:8px 18px;border-radius:999px;font-weight:800;cursor:pointer;white-space:nowrap;flex-shrink:0;font-size:13px;}
.btn-pipeda:hover{background:#c8932e;}
.btn-pipeda-secondary{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.28);}
.btn-pipeda-secondary:hover{background:rgba(255,255,255,.08);}

nav[aria-label="Menu principal Savanna Select"],.savanna-main-menu-v33{display:flex!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important;gap:16px!important;width:100%!important;padding:14px 12px!important;background:#03140b!important;border-top:1px solid rgba(217,164,65,.35)!important;border-bottom:1px solid rgba(217,164,65,.55)!important;position:relative!important;z-index:50!important;}
nav[aria-label="Menu principal Savanna Select"] a,.savanna-main-menu-v33 a{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:42px!important;padding:0 20px!important;border-radius:999px!important;color:#fff!important;text-decoration:none!important;font-weight:800!important;font-size:15px!important;line-height:1!important;opacity:1!important;visibility:visible!important;background:rgba(20,83,45,.42)!important;border:1px solid rgba(217,164,65,.35)!important;}
nav[aria-label="Menu principal Savanna Select"] a:hover,.savanna-main-menu-v33 a:hover{background:#14532d!important;border-color:#d9a441!important;}
@media(max-width:768px){nav[aria-label="Menu principal Savanna Select"],.savanna-main-menu-v33{gap:8px!important;padding:10px 8px!important}.savanna-main-menu-v33 a{min-height:44px!important;padding:0 12px!important;font-size:13px!important}.hero h1,h1{font-size:clamp(2rem,9vw,4rem)!important}.search-container,.search-bar{max-width:100%!important}}

/* -- V35 : barre livraison gratuite (migration style inline) ------------ */
.free-shipping-wrap{display:none;padding:8px 0 4px 0;}
#free-shipping-bar{background:#27AE60;height:8px;width:0%;border-radius:999px;transition:width 0.4s ease;}
#free-shipping-msg{font-size:12px;font-weight:700;display:block;margin-top:2px;}
.free-shipping-container{background:#e0e0e0;border-radius:999px;height:8px;overflow:hidden;margin-bottom:4px;}

/* -- V35 : CSS nettoy� et optimis� -- */

.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

.col-img-thumb{width:60px;}
.faq-home-link{text-align:center;font-size:15px;}

/* -- V35 : Micro-interactions premium ------------------------------------ */

/* Toast am�lior� */
#toast{position:fixed;bottom:80px;left:50%;transform:translateX(-50%) translateY(20px);
  background:#1A4D2E;color:#fff;padding:12px 24px;border-radius:999px;font-weight:700;
  font-size:14px;z-index:99999;opacity:0;transition:opacity 0.3s ease,transform 0.3s ease;
  pointer-events:none;white-space:nowrap;box-shadow:0 4px 20px rgba(0,0,0,0.3);}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* Animation ajout panier */
@keyframes addToCartPulse{
  0%{transform:scale(1);}
  30%{transform:scale(1.18);}
  60%{transform:scale(0.95);}
  100%{transform:scale(1);}
}
.btn-add-pulse{animation:addToCartPulse 0.4s ease;}

/* Badge panier anim� */
@keyframes badgePop{
  0%{transform:scale(1);}
  50%{transform:scale(1.4);}
  100%{transform:scale(1);}
}
.cart-count-badge.popped{animation:badgePop 0.3s ease;}

/* Hover premium sur les cartes produit */
.product-card{transition:transform 0.2s ease,box-shadow 0.2s ease;}
.product-card:hover{transform:translateY(-3px);box-shadow:0 8px 32px rgba(0,0,0,0.15);}

/* Spinner ajout produit */
.btn-loading{position:relative;pointer-events:none;opacity:0.75;}
.btn-loading::after{content:'';position:absolute;right:10px;top:50%;
  width:14px;height:14px;margin-top:-7px;border:2px solid rgba(255,255,255,0.4);
  border-top-color:#fff;border-radius:50%;animation:spin 0.6s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

/* Transitions fluides entre panels SPA */
.panel{transition:opacity 0.15s ease;}
.panel.active{opacity:1;}

/* Hover liens navigation */
nav a{transition:background 0.18s ease,border-color 0.18s ease;}

/* Lazy image skeleton */
.product-img-wrap img[data-lazy]{opacity:0;transition:opacity 0.3s ease;}
.product-img-wrap img.lazy-loaded{opacity:1;}

/* Barre de progression livraison */
#free-shipping-bar{transition:width 0.5s cubic-bezier(0.4,0,0.2,1);}


/* === V35 LANG BUTTON MOBILE === */
@media (max-width: 768px) {
  #langBtnMobile,
  .nav-lang-mobile {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(217,164,65,.22);
    border: 1px solid rgba(217,164,65,.55);
    color: #fff;
    font-weight: 800;
    font-size: 0.95rem;
    cursor: pointer;
    gap: 6px;
    margin-top: 4px;
    width: 100%;
    text-align: center;
  }
  #langBtnMobile:hover,
  .nav-lang-mobile:hover {
    background: rgba(217,164,65,.38);
  }
}
@media (min-width: 769px) {
  #langBtnMobile {
    display: none !important;
  }
}

/* === V35 CSP � classes CSS remplacent element.style.width === */
.ship-progress-bar { transition: width 0.4s ease; }
.ship-progress-0   { width: 0%; }
.ship-progress-10  { width: 10%; }
.ship-progress-20  { width: 20%; }
.ship-progress-30  { width: 30%; }
.ship-progress-40  { width: 40%; }
.ship-progress-50  { width: 50%; }
.ship-progress-60  { width: 60%; }
.ship-progress-70  { width: 70%; }
.ship-progress-80  { width: 80%; }
.ship-progress-90  { width: 90%; }
.ship-progress-100 { width: 100%; }
.ship-msg-orange { color: #E67E22; }
.ship-msg-green  { color: #27AE60; }
.ship-bar-wrap   { display: none; }
.ship-bar-wrap.visible { display: block; }

/* V36 */
.category-nav-bar{background:#fff;border-bottom:2px solid rgba(26,77,46,.1);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.category-nav-bar::-webkit-scrollbar{display:none}.cnb-inner{max-width:1200px;margin:0 auto;padding:0 1.5rem;display:flex;align-items:center;gap:.25rem;min-height:44px}.cnb-label{font-size:.75rem;font-weight:700;color:#675d52;white-space:nowrap;padding-right:.5rem}.cnb-link{padding:.5rem .9rem;text-decoration:none;color:#1A4D2E;font-size:.78rem;font-weight:600;white-space:nowrap;border-radius:999px;transition:background .2s,color .2s;flex-shrink:0}.cnb-link:hover{background:#1A4D2E;color:#fff}

/* V39 FIX-09: Pagination visible sur mobile */
@media(max-width:768px){
  .catalogue-pagination{display:flex!important;flex-wrap:wrap;gap:6px;justify-content:center;padding:12px 0;}
  .catalogue-pagination button,.catalogue-pagination a{min-height:44px;min-width:44px;font-size:.9rem;padding:10px 14px;}
}
/* V39 FIX-05: Active nav link */
.nav-link.active,.nav-link[aria-current="page"]{color:#E8B84B!important;font-weight:900!important;} /* V254 A11y � 4.35?5.31:1 */
/* V39 FIX-06: Skeleton loader animation */
.skeleton-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;padding:8px 0;}
.skeleton-card{background:#fff;border-radius:12px;overflow:hidden;border:1px solid rgba(0,0,0,.06);}
.skeleton-img{height:180px;background:linear-gradient(90deg,#f0e8d8 25%,#f8f3ec 50%,#f0e8d8 75%);background-size:200% 100%;animation:skeleton-pulse 1.4s ease-in-out infinite;}
.skeleton-line{height:14px;margin:10px 12px;border-radius:6px;background:linear-gradient(90deg,#f0e8d8 25%,#f8f3ec 50%,#f0e8d8 75%);background-size:200% 100%;animation:skeleton-pulse 1.4s ease-in-out infinite;}
.skeleton-line.short{width:60%;height:11px;}
@keyframes skeleton-pulse{0%{background-position:200% 0}100%{background-position:-200% 0}}
/* V39: Nav social row */
.nav-social-row{display:none;}
@media(max-width:900px){.nav-social-row{display:flex!important;}}

/* =====================================================
   V41 CORRECTIONS CSS
   ===================================================== */

/* Fix WhatsApp flottant � position absolument fixe, z�ro d�rive mobile */
.wa-floating,
#savanna-wa-toggle,
.wa-float,
.whatsapp-widget {
  position: fixed !important;
  right: 20px !important;
  bottom: 20px !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  z-index: 999999 !important;
}
#savanna-wa-box {
  position: fixed !important;
  right: 20px !important;
  bottom: 80px !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  z-index: 999998 !important;
  max-width: min(320px, calc(100vw - 32px));
}
/* Boutons topic WhatsApp � tap target WCAG */
.wa-topic {
  min-height: 44px !important;
  min-width: 44px !important;
  padding: 10px 12px !important;
  font-size: 0.9rem !important;
  width: 100% !important;
  text-align: left !important;
  margin-bottom: 4px !important;
}

/* Fix images mal cadr�es sur mobile */
@media (max-width: 768px) {
  .product-img-wrap img,
  .product-card img,
  .feat-img,
  .feature-photo img,
  .hero-visual img,
  .gallery-img {
    object-fit: cover !important;
    object-position: center center !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
  }
  .product-img-wrap {
    aspect-ratio: 4/3;
    overflow: visible;
  }
  /* V272 FIX � exclure featured-card du aspect-ratio et height forc� */
  .featured-card .product-img-wrap {
    aspect-ratio: unset !important;
    overflow: hidden !important;
    height: 170px !important;
    min-height: 140px !important;
    max-height: 180px !important;
  }
  .featured-card .product-img-wrap img {
    object-fit: contain !important;
    height: 150px !important;
    max-height: 160px !important;
    width: auto !important;
    max-width: 100% !important;
  }
}

/* Fix Vente en gros � cadrage mobile */
@media (max-width: 768px) {
  #page-grossiste .u106,
  #page-grossiste .tier-cards,
  #page-grossiste .grossiste-grid,
  #page-grossiste .section-grid {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  #page-grossiste .tier-card,
  #page-grossiste .u114,
  #page-grossiste [class*="tier"] {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Fix grille produits mobile � emp�cher d�bordement horizontal */
@media (max-width: 480px) {
  #catalogue-grid,
  .products-grid {
    grid-template-columns: 1fr !important;
    padding: 0 8px !important;
  }
}
@media (min-width: 481px) and (max-width: 768px) {
  #catalogue-grid,
  .products-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
    padding: 0 10px !important;
  }
}

/* Fix touch-action � r�duire d�lai 300ms sur boutons */
button, a, .btn, .nav-link, .wa-topic, [data-action] {
  touch-action: manipulation;
}

/* iOS cursor:pointer fix � d�j� dans head style mais renforc� */
body { cursor: pointer; }

/* Topbar mobile � texte dense */
@media (max-width: 480px) {
  .topbar .topbar-text,
  .topbar span {
    font-size: 0.72rem !important;
  }
}


/* ----------------------------------------------------------------
   SAVANNA SELECT V44 � Correctifs CSS
   ---------------------------------------------------------------- */

/* -- P1-01 : Pagination tap targets WCAG 2.5.5 (44�44px min) -- */
[data-page-num],
.catalogue-pagination button,
.pagination button,
.page-btn {
  min-height: 44px !important;
  min-width: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
}

/* -- P1-02 : WhatsApp topics tap targets WCAG 2.5.5 -- */
.wa-topic {
  min-height: 44px !important;
  padding: 12px 14px !important;
  font-size: 0.9rem !important;
  touch-action: manipulation !important;
}

/* -- P1-03 : Social cards grid -- */
.social-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  padding: 1rem 0;
}
.social-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.5rem;
  padding: 1.25rem 1rem;
  border: 1px solid rgba(26,77,46,.12);
  border-radius: 16px;
  text-decoration: none;
  color: inherit;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
  transition: transform .2s, box-shadow .2s;
}
.social-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(26,77,46,.14);
}
.social-card-icon {
  width: 52px; height: 52px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem;
  color: #fff;
  flex-shrink: 0;
}
.social-card-body strong { font-size: .9rem; color: #061A0D; }
.social-card-handle { font-size: .78rem; color: #1A4D2E; font-weight: 600; display: block; }
.social-card-body p  { font-size: .8rem; color: #675d52; margin: .25rem 0 0; }
.social-card-cta     { font-size: .78rem; font-weight: 700; color: #D9A441; margin-top: .25rem; }

/* -- P1-04 : Mobile 360px safety net -- */
@media (max-width: 380px) {
  .social-cards-grid { grid-template-columns: 1fr; }
  .wa-topic { font-size: 0.82rem !important; padding: 10px 12px !important; }
}

/* -- P1-05 : Standardise grid at exactly 480/768 -- */
@media (max-width: 480px) {
  .product-grid,
  .catalogue-grid,
  #catalogue-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: .75rem !important;
  }
  .social-cards-grid { grid-template-columns: 1fr 1fr; gap: .5rem; }
}

@media (max-width: 768px) {
  .social-cards-grid { grid-template-columns: repeat(3, 1fr); gap: .75rem; }
  .social-card { padding: 1rem .75rem; }
}


/* ------------------------------------------------------
   SAVANNA SELECT V51 � CSS Consolid� (v48+v49+v50)
   ------------------------------------------------------ */

/* --- Depuis v48-fixes.css --- */
/* SAVANNA SELECT V48 � Correctifs d�ploiement accueil + menu + mobile */
:root{--ss-green:#071810;--ss-green2:#0d2818;--ss-gold:#D9A441;--ss-cream:#FDF8F0;--ss-text:#1e1510;--ss-muted:#6b5b47;}
html,body{width:100%;max-width:100%;overflow-x:hidden;background:#f2efe6;color:var(--ss-text);}
body{min-width:320px;}
.site-header{position:sticky!important;top:0;z-index:9999!important;width:100%;background:rgba(7,24,16,.98)!important;border-bottom:1px solid rgba(217,164,65,.45)!important;}
.site-header .container.header-row{width:min(1320px,calc(100% - 32px));max-width:1320px;margin:0 auto;display:grid!important;grid-template-columns:180px minmax(220px,1fr) auto auto;gap:16px;align-items:center;padding:10px 0;}
.brand-logo{background:transparent!important;border:0!important;padding:0!important;min-width:0;display:flex;align-items:center;}
.brand-logo img{display:block!important;height:64px!important;width:auto!important;max-width:170px!important;object-fit:contain!important;}
.mobile-search{display:none;}
#menu-toggle{display:none!important;}
.main-nav{display:block!important;position:relative!important;width:100%!important;background:rgba(4,14,8,.96)!important;border-top:1px solid rgba(217,164,65,.28)!important;box-shadow:none!important;visibility:visible!important;opacity:1!important;transform:none!important;max-height:none!important;}
.main-nav .nav-links{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:8px!important;flex-wrap:wrap!important;width:min(1320px,calc(100% - 32px))!important;max-width:1320px!important;margin:0 auto!important;padding:9px 0!important;}
.main-nav .nav-link,.main-nav a,.main-nav button{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:40px!important;padding:8px 15px!important;border-radius:999px!important;border:0!important;background:transparent!important;color:rgba(255,255,255,.88)!important;text-decoration:none!important;font-family:var(--font-b,system-ui,sans-serif)!important;font-size:.9rem!important;font-weight:800!important;line-height:1.2!important;white-space:nowrap!important;}
.main-nav .nav-link:hover,.main-nav .nav-link.active,.main-nav .nav-link[aria-current="page"]{background:rgba(217,164,65,.18)!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(217,164,65,.38)!important;} /* V254 � color #fff sur fond sombre OK */
.nav-lang-mobile{display:none!important;}
.nav-social-row{display:none!important;}
main#main-content{display:block!important;width:100%;background:#f2efe6;}
.panel{display:none;}
.panel.active{display:block!important;}
.hero{position:relative!important;padding:36px 0 42px!important;background:linear-gradient(135deg,#06150c 0%,#10321e 55%,#1a4a28 100%)!important;color:#fff!important;overflow:hidden!important;}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 15%,rgba(217,164,65,.20),transparent 28%),radial-gradient(circle at 90% 20%,rgba(255,255,255,.12),transparent 22%);pointer-events:none;}
.hero .container{position:relative;z-index:1;width:min(1200px,calc(100% - 32px))!important;margin:0 auto!important;padding:0!important;}
.hero-card{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(340px,.95fr)!important;gap:32px!important;align-items:center!important;width:100%!important;padding:32px!important;border-radius:30px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(217,164,65,.30)!important;box-shadow:0 20px 60px rgba(0,0,0,.30)!important;overflow:hidden!important;}
.hero-copy{min-width:0!important;color:#fff!important;z-index:2!important;}
.hero-copy .eyebrow{display:inline-flex!important;margin-bottom:12px!important;color:#f8d892!important;font-weight:900!important;letter-spacing:.08em!important;text-transform:uppercase!important;font-size:.82rem!important;}
.hero-copy h1{margin:0 0 16px!important;color:#fff!important;font-family:var(--font-d,Georgia,serif)!important;font-weight:900!important;font-size:clamp(2.4rem,5.2vw,4.9rem)!important;line-height:1.02!important;letter-spacing:-.04em!important;text-shadow:0 3px 18px rgba(0,0,0,.25)!important;}
.hero-copy p{margin:0 0 22px!important;color:rgba(255,255,255,.88)!important;font-size:clamp(1rem,1.35vw,1.18rem)!important;line-height:1.72!important;max-width:58ch!important;}
.hero-actions{display:flex!important;align-items:center!important;gap:12px!important;flex-wrap:wrap!important;}
.hero-actions .btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:50px!important;padding:13px 22px!important;border-radius:999px!important;font-weight:900!important;text-decoration:none!important;}
.hero-actions .btn-primary{background:linear-gradient(135deg,#D9A441,#F0B84F)!important;color:#071810!important;border:0!important;}
.hero-actions .btn-light{background:rgba(255,255,255,.12)!important;color:#fff!important;border:1px solid rgba(255,255,255,.32)!important;}
.hero-visual{position:relative!important;min-width:0!important;width:100%!important;z-index:1!important;}
.hero-visual-img{position:relative!important;width:100%!important;min-height:0!important;border-radius:26px!important;overflow:hidden!important;background:#fff!important;border:1px solid rgba(217,164,65,.32)!important;box-shadow:0 18px 50px rgba(0,0,0,.32)!important;}
#hero-home-img,.hero-visual img.u005{display:block!important;width:100%!important;height:clamp(300px,38vw,500px)!important;min-height:0!important;max-height:none!important;object-fit:cover!important;object-position:center!important;border-radius:0!important;filter:none!important;opacity:1!important;}
#hero-promo-card,.u006{position:absolute!important;left:16px!important;right:16px!important;bottom:16px!important;z-index:3!important;background:rgba(7,24,16,.86)!important;border:1px solid rgba(217,164,65,.38)!important;border-radius:20px!important;padding:16px!important;backdrop-filter:blur(10px)!important;color:#fff!important;max-width:none!important;}
#hero-promo-card p,.u010{color:rgba(255,255,255,.90)!important;font-size:.92rem!important;line-height:1.45!important;margin:8px 0!important;}
.u011{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important;}
.u012{background:rgba(255,255,255,.09)!important;border-radius:12px!important;padding:8px 6px!important;text-align:center!important;min-width:0!important;}
.u014{font-size:.68rem!important;line-height:1.15!important;color:#fff!important;font-weight:800!important;white-space:pre-line!important;}
.reassurance-mobile{display:none!important;}
@media (max-width:900px){
  .site-header .container.header-row{grid-template-columns:auto 1fr auto!important;width:100%!important;padding:9px 14px!important;gap:10px!important;}
  .brand-logo img{height:44px!important;max-width:130px!important;}
  .header-row > .search-bar{display:none!important;}
  .header-actions{justify-content:end!important;gap:6px!important;}
  .header-actions .hbtn:not([data-page="panier"]){display:none!important;}
  .header-actions .hbtn[data-page="panier"]{display:inline-flex!important;min-height:40px!important;padding:8px 10px!important;font-size:.78rem!important;}
  #menu-toggle{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:44px!important;height:44px!important;min-width:44px!important;border-radius:12px!important;border:1px solid rgba(255,255,255,.28)!important;background:rgba(255,255,255,.10)!important;color:#fff!important;}
  .mobile-search{display:block!important;padding:8px 14px!important;background:rgba(4,14,8,.98)!important;border-top:1px solid rgba(255,255,255,.08)!important;}
  .main-nav{display:none!important;position:absolute!important;left:0!important;right:0!important;top:100%!important;background:rgba(4,14,8,.99)!important;box-shadow:0 18px 34px rgba(0,0,0,.35)!important;z-index:9998!important;}
  .main-nav.open{display:block!important;}
  .main-nav .nav-links{width:100%!important;max-width:none!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:7px!important;padding:12px 14px 16px!important;}
  .main-nav .nav-link,.main-nav a,.main-nav button{width:100%!important;justify-content:flex-start!important;border-radius:14px!important;min-height:46px!important;padding:12px 14px!important;font-size:.96rem!important;background:rgba(255,255,255,.06)!important;}
  .nav-lang-mobile{display:flex!important;}
  .nav-social-row{display:flex!important;flex-wrap:wrap!important;gap:8px!important;padding:8px 0 0!important;margin-top:4px!important;border-top:1px solid rgba(255,255,255,.10)!important;}
  .nav-social-row a{width:auto!important;min-height:44px!important;color:#f4ca75!important;background:rgba(217,164,65,.10)!important;} /* V249 A11y */
  .hero{padding:14px 0 24px!important;}
  .hero .container{width:100%!important;padding:0 14px!important;}
  .hero-card{grid-template-columns:1fr!important;gap:18px!important;padding:18px 14px 20px!important;border-radius:22px!important;}
  .hero-visual{order:-1!important;}
  #hero-home-img,.hero-visual img.u005{height:260px!important;object-position:center!important;}
  #hero-promo-card,.u006{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;margin-top:0!important;border-radius:16px!important;padding:14px!important;}
  .u011{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .hero-copy h1{font-size:clamp(2rem,11vw,3rem)!important;line-height:1.04!important;}
  .hero-copy p{font-size:1rem!important;line-height:1.58!important;}
  .hero-actions{flex-direction:column!important;align-items:stretch!important;}
  .hero-actions .btn{width:100%!important;}
  .reassurance-mobile{display:block!important;}
}
@media (max-width:420px){
  .topbar{font-size:.70rem!important;line-height:1.35!important;padding:7px 10px!important;}
  .brand-logo img{height:38px!important;max-width:112px!important;}
  .header-actions .hbtn[data-page="panier"] .lang-label{display:none!important;}
  #hero-home-img,.hero-visual img.u005{height:220px!important;}
  .hero-card{padding:14px 12px 18px!important;}
  .hero-copy h1{font-size:2.05rem!important;}
}


/* --- Depuis v49-premium.css --- */
:root{
--ss-bg:#f6f1e8;
--ss-surface:#fffdf9;
--ss-green:#071810;
--ss-green-soft:#123222;
--ss-gold:#d9a441;
--ss-text:#231811;
--ss-muted:#6c6258;
--ss-shadow:0 18px 60px rgba(0,0,0,.10);
}
html{scroll-behavior:smooth}
body{background:linear-gradient(180deg,#f5f0e7 0%,#fffaf3 100%)!important;color:var(--ss-text)!important;overflow-x:hidden}
.site-header{backdrop-filter:blur(18px);background:rgba(7,24,16,.94)!important;box-shadow:0 10px 30px rgba(0,0,0,.16)}
.site-header .header-row{min-height:84px;gap:20px!important}
.search-bar{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:999px!important;padding:6px!important;display:flex;align-items:center}
.search-bar input{background:transparent!important;border:0!important;color:#fff!important;font-size:.95rem!important;padding:0 14px!important;width:100%}
.search-bar button{border-radius:999px!important;background:linear-gradient(135deg,var(--ss-gold),#f3c15f)!important;color:#111!important;border:0!important;width:42px!important;height:42px!important}
.hbtn{border-radius:999px!important;border:1px solid rgba(255,255,255,.12)!important;background:rgba(255,255,255,.08)!important;color:#fff!important;font-weight:700!important}
.hero{padding:48px 0 60px!important;background:radial-gradient(circle at top left,rgba(217,164,65,.18),transparent 20%),linear-gradient(135deg,#06150d 0%,#102f1f 58%,#1d5833 100%)!important}
.hero-card{background:rgba(255,255,255,.06)!important;backdrop-filter:blur(14px);border-radius:34px!important;padding:40px!important;gap:42px!important}
.hero-copy h1{max-width:10ch}
.hero-copy p{color:rgba(255,255,255,.84)!important;font-size:1.05rem!important}
.hero-actions .btn-primary{box-shadow:0 12px 30px rgba(217,164,65,.32)}
.hero-visual-img{border-radius:30px!important}
#hero-home-img{transform:scale(1.01)}
#hero-promo-card{background:rgba(7,24,16,.82)!important;border-radius:22px!important}
section,.section{scroll-margin-top:120px}
/* V51: r�gles WA transform supprim�es � conflit bouton double r�solu */
footer{background:#071810!important}
@media(max-width:900px){
.site-header .header-row{min-height:72px}
.hero{padding:20px 0 36px!important}
.hero-card{padding:22px 18px!important;border-radius:24px!important;gap:20px!important}
.hero-copy h1{max-width:100%;font-size:clamp(2.1rem,10vw,3.4rem)!important}
.main-nav .nav-link{font-size:.92rem!important}
}
@media(max-width:520px){
.hero-actions .btn{min-height:54px!important;font-size:.95rem!important}
#hero-home-img{height:240px!important}
/* V51: r�gles WA transform supprim�es � conflit bouton double r�solu */
}


/* --- Depuis v50-premium-fixes.css --- */

:root{--header-height:84px;--gold:#d4a24c;--bg:#08150f;}
body{overflow-x:hidden;background:#fff;}
.site-header{position:sticky;top:0;z-index:999;background:rgba(8,21,15,.96)!important;backdrop-filter:blur(12px);border-bottom:1px solid rgba(212,162,76,.18)}
.header-row{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:var(--header-height);flex-wrap:nowrap}
.main-nav .nav-links{display:flex;justify-content:center;gap:clamp(12px,2vw,32px);flex-wrap:wrap;padding:14px 0}
.nav-link{white-space:nowrap;font-weight:600;letter-spacing:.02em}
.search-bar{max-width:540px;width:100%}
.hero,.hero-section,[class*=hero]{position:relative;isolation:isolate;overflow:hidden}
.hero:before,.hero-section:before,[class*=hero]:before{opacity:.28!important}
.hero *,.hero-section *{position:relative;z-index:2}
.hero h1,.hero-section h1{font-size:clamp(2.4rem,5vw,4.8rem)!important;line-height:1.08!important;color:#fff!important;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.hero p,.hero-section p{color:rgba(255,255,255,.92)!important;max-width:640px}
.hero img,.hero-section img{max-width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 18px 40px rgba(0,0,0,.28))}
button,.btn,.hbtn{border-radius:999px}
/* V51: r�gles WA transform supprim�es � widget JS unique actif */
@media (max-width:768px){
.header-row{flex-wrap:wrap;padding:10px 0}.search-bar{order:3;max-width:100%}.header-actions{margin-left:auto}.main-nav .nav-links{gap:10px;padding:10px 12px}.nav-link{font-size:.92rem}.hero,.hero-section{padding:48px 18px!important}.hero h1,.hero-section h1{font-size:2rem!important}body{overflow-x:hidden!important}}


/* === V54 MERGE : v49-premium.css int�gr� === */
:root{
--ss-bg:#f6f1e8;
--ss-surface:#fffdf9;
--ss-green:#071810;
--ss-green-soft:#123222;
--ss-gold:#d9a441;
--ss-text:#231811;
--ss-muted:#6c6258;
--ss-shadow:0 18px 60px rgba(0,0,0,.10);
}
html{scroll-behavior:smooth}
body{background:linear-gradient(180deg,#f5f0e7 0%,#fffaf3 100%)!important;color:var(--ss-text)!important;overflow-x:hidden}
.site-header{backdrop-filter:blur(18px);background:rgba(7,24,16,.94)!important;box-shadow:0 10px 30px rgba(0,0,0,.16)}
.site-header .header-row{min-height:84px;gap:20px!important}
.search-bar{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:999px!important;padding:6px!important;display:flex;align-items:center}
.search-bar input{background:transparent!important;border:0!important;color:#fff!important;font-size:.95rem!important;padding:0 14px!important;width:100%}
.search-bar button{border-radius:999px!important;background:linear-gradient(135deg,var(--ss-gold),#f3c15f)!important;color:#111!important;border:0!important;width:42px!important;height:42px!important}
.hbtn{border-radius:999px!important;border:1px solid rgba(255,255,255,.12)!important;background:rgba(255,255,255,.08)!important;color:#fff!important;font-weight:700!important}
.hero{padding:48px 0 60px!important;background:radial-gradient(circle at top left,rgba(217,164,65,.18),transparent 20%),linear-gradient(135deg,#06150d 0%,#102f1f 58%,#1d5833 100%)!important}
.hero-card{background:rgba(255,255,255,.06)!important;backdrop-filter:blur(14px);border-radius:34px!important;padding:40px!important;gap:42px!important}
.hero-copy h1{max-width:10ch}
.hero-copy p{color:rgba(255,255,255,.84)!important;font-size:1.05rem!important}
.hero-actions .btn-primary{box-shadow:0 12px 30px rgba(217,164,65,.32)}
.hero-visual-img{border-radius:30px!important}
#hero-home-img{transform:scale(1.01)}
#hero-promo-card{background:rgba(7,24,16,.82)!important;border-radius:22px!important}
section,.section{scroll-margin-top:120px}
/* V51: r�gles WA transform supprim�es � conflit bouton double r�solu */
footer{background:#071810!important}
@media(max-width:900px){
.site-header .header-row{min-height:72px}
.hero{padding:20px 0 36px!important}
.hero-card{padding:22px 18px!important;border-radius:24px!important;gap:20px!important}
.hero-copy h1{max-width:100%;font-size:clamp(2.1rem,10vw,3.4rem)!important}
.main-nav .nav-link{font-size:.92rem!important}
}
@media(max-width:520px){
.hero-actions .btn{min-height:54px!important;font-size:.95rem!important}
#hero-home-img{height:240px!important}
/* V51: r�gles WA transform supprim�es � conflit bouton double r�solu */
}

/* === V54 MERGE : v50-premium-fixes.css int�gr� === */

:root{--header-height:84px;--gold:#d4a24c;--bg:#08150f;}
body{overflow-x:hidden;background:#fff;}
.site-header{position:sticky;top:0;z-index:999;background:rgba(8,21,15,.96)!important;backdrop-filter:blur(12px);border-bottom:1px solid rgba(212,162,76,.18)}
.header-row{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:var(--header-height);flex-wrap:nowrap}
.main-nav .nav-links{display:flex;justify-content:center;gap:clamp(12px,2vw,32px);flex-wrap:wrap;padding:14px 0}
.nav-link{white-space:nowrap;font-weight:600;letter-spacing:.02em}
.search-bar{max-width:540px;width:100%}
.hero,.hero-section,[class*=hero]{position:relative;isolation:isolate;overflow:hidden}
.hero:before,.hero-section:before,[class*=hero]:before{opacity:.28!important}
.hero *,.hero-section *{position:relative;z-index:2}
.hero h1,.hero-section h1{font-size:clamp(2.4rem,5vw,4.8rem)!important;line-height:1.08!important;color:#fff!important;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.hero p,.hero-section p{color:rgba(255,255,255,.92)!important;max-width:640px}
.hero img,.hero-section img{max-width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 18px 40px rgba(0,0,0,.28))}
button,.btn,.hbtn{border-radius:999px}
/* V51: r�gles WA transform supprim�es � widget JS unique actif */
@media (max-width:768px){
.header-row{flex-wrap:wrap;padding:10px 0}.search-bar{order:3;max-width:100%}.header-actions{margin-left:auto}.main-nav .nav-links{gap:10px;padding:10px 12px}.nav-link{font-size:.92rem}.hero,.hero-section{padding:48px 18px!important}.hero h1,.hero-section h1{font-size:2rem!important}body{overflow-x:hidden!important}}

/* === V54 MERGE : v51-fixes.css int�gr� === */
.panel{display:none!important}
.panel.active{display:block!important;padding-bottom:80px}
#page-accueil.panel.active{display:block!important}

/* V51 BUG 2 : Safety net suppl�mentaire pour les panels */
#page-panier:not(.active),
#page-catalogue:not(.active),
#page-search:not(.active),
#page-checkout:not(.active),
#page-blog:not(.active),
#page-grossiste:not(.active),
#page-contact:not(.active){display:none!important}

/* V51 BUG 1 : WhatsApp widget unique � supprimer wa-float si pr�sent */
.wa-float{display:none!important}

/* V51 BUG 4 : Banni�re construction */
#construction-banner{display:block}
#construction-banner .lang-swap{display:inline}

/* V58: home-faq-preview base */
.home-faq-preview{background:var(--bg,#F2EFE6);padding:32px 0;width:100%;}

/* V72: catalogue enrichi, galerie et grossiste */
.product-img-wrap{position:relative}
.product-gallery-thumb{position:absolute;right:10px;bottom:10px;width:52px;height:52px;padding:0;border:2px solid rgba(255,255,255,.95);border-radius:14px;background:#fff;box-shadow:0 8px 20px rgba(0,0,0,.18);overflow:hidden;cursor:pointer}
.product-gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block}
#catChipGroup{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.cat-chip{border:1px solid #d9c9a8;background:#fffaf1;color:#153c24;border-radius:999px;padding:8px 12px;font-weight:700;cursor:pointer}
.cat-chip.is-active{background:#1a4a28;color:#fff;border-color:#1a4a28}
#catResetAdvanced{margin-top:10px}
.product-more-btn{margin-top:12px}
.product-details-panel{margin-top:12px;padding:14px 14px 10px;border-radius:14px;background:#f9f4ec;border:1px solid #eadac0;color:#2f261d}
.product-details-panel.is-hidden{display:none}
.product-details-longdesc{margin:0 0 10px;line-height:1.6}
.product-details-list{margin:0;padding-left:18px}
.product-details-list li{margin:0 0 8px}
#lightbox-prev,#lightbox-next{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:999px;border:1.5px solid rgba(255,255,255,.3);background:rgba(255,255,255,.15);color:#fff;font-size:1.6rem;display:none;align-items:center;justify-content:center;cursor:pointer;line-height:1}
#lightbox-prev{left:-56px}
#lightbox-next{right:-56px}
#lightbox-prev:hover,#lightbox-next:hover{background:rgba(255,255,255,.28)}
#grossiste-feedback{margin-top:14px}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.testimonial-card{background:#fff;border:1px solid #eadac0;border-radius:22px;padding:22px;box-shadow:0 12px 32px rgba(10,36,21,.07)}
.testimonial-rating{font-size:1rem;color:#d4891a;letter-spacing:.14em;margin-bottom:12px}
.testimonial-quote{margin:0 0 14px;color:#2f261d;line-height:1.7}
.testimonial-name{display:block;color:#153c24}
.testimonial-meta{display:block;margin-top:4px;color:#6a6257;font-size:.92rem}
@media (max-width:768px){#lightbox-prev{left:8px}#lightbox-next{right:8px}.product-gallery-thumb{width:46px;height:46px}.testimonial-grid{grid-template-columns:1fr}}

/* -------------------------------------------------------------------
   SAVANNA SELECT V74 � Correctifs consolid�s v57?v71
   Consolidation effectu�e le 2026-05-27
   Les fichiers v57/v59/v61/v62/v69/v71-fixes.css sont supprim�s.
   R�gle appliqu�e : en cas de conflit, la r�gle la plus r�cente prime.
------------------------------------------------------------------- */

/* === FROM v57-fixes (V56-V57) � Touch, panels, WA, bottom-nav, hero, faq === */
button,a,.btn,.nav-link,[data-action],[role=button],.wa-topic,label{cursor:pointer;touch-action:manipulation}
.panel{display:none!important}.panel.active{display:block!important}
#page-accueil.active{display:block!important}
#page-panier:not(.active),#page-catalogue:not(.active),#page-checkout:not(.active),#page-grossiste:not(.active),#page-blog:not(.active),#page-search:not(.active){display:none!important;visibility:hidden!important;pointer-events:none!important}
body>.wa-floating{position:fixed!important;right:20px!important;bottom:20px!important;left:auto!important;top:auto!important;z-index:999999!important;transform:none!important}
body{transform:none!important;filter:none}
#page-catalogue,#page-blog,#page-grossiste{min-height:100vh;overflow-x:hidden;overflow-y:auto;padding-bottom:80px!important}
#blog-modal{z-index:8000!important}
#page-grossiste{padding-bottom:100px!important;overflow:visible!important}
#grossiste-form{padding-bottom:40px!important}
.page-bottom-nav{position:relative!important;z-index:1!important;display:block!important;background:#F9F4EC!important;border-top:3px solid #D9A441!important;margin-top:40px!important;padding:4px 0!important;box-shadow:0 -2px 8px rgba(0,0,0,.08)!important;width:100%!important}
.page-bottom-nav .container{display:flex;justify-content:space-between;align-items:center;padding:16px;gap:12px;flex-wrap:wrap}
.page-bottom-nav .btn{min-height:48px!important;font-size:1rem!important;font-weight:700!important;padding:12px 24px!important}
@media(max-width:480px){.page-bottom-nav .container{flex-direction:column!important;gap:12px!important;padding:20px 16px!important}.page-bottom-nav .btn{width:100%!important;justify-content:center!important}}
#construction-banner{position:sticky!important;top:0!important;z-index:9990!important;padding:6px 40px 6px 12px!important;font-size:.82rem!important;line-height:1.3!important}
.skip-link{position:absolute;top:-40px;left:0;background:#061A0D;color:#D9A441;padding:8px 16px;font-weight:700;z-index:99999;border-radius:0 0 4px 0;transition:top .2s;text-decoration:none}
.skip-link:focus{top:0}
.trust-bar{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;align-items:flex-start!important;gap:20px!important;padding:20px 16px!important}
.trust-item{display:flex!important;flex-direction:column!important;align-items:center!important;text-align:center!important;gap:4px!important;min-width:110px!important;max-width:160px!important}
.trust-icon{font-size:1.6rem!important;display:block!important;line-height:1!important;margin-bottom:2px!important}
.trust-item strong{display:block!important;font-size:.82rem!important;font-weight:700!important;color:var(--green,#1a4a28)!important;line-height:1.2!important}
@media(max-width:600px){.trust-bar{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:12px!important;padding:16px!important}.trust-item{max-width:100%!important}}
.search-bar input:focus-visible,.form-input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--gold,#d4891a)!important;outline-offset:2px!important;box-shadow:0 0 0 4px rgba(212,137,26,.18)!important}
.btn:focus-visible,.hbtn:focus-visible,.nav-link:focus-visible,.feat-card:focus-visible,.badge-chip:focus-visible,[role="button"]:focus-visible,button:focus-visible{outline:2px solid var(--gold,#d4891a)!important;outline-offset:3px!important;border-radius:var(--radius,16px)!important}

/* === FROM v59/v61/v62/v69/v71 � Hero colonne droite + feat-grid + FAQ masquage === */
/* FAQ + r�seaux sociaux : masqu�s par d�faut, visibles uniquement accueil */
.home-faq-preview{display:none!important}
#social-section{display:none!important}
body[data-panel="accueil"] .home-faq-preview{display:block!important}
body[data-panel="accueil"] #social-section{display:block!important}

/* FAQ preview styles */
.home-faq-preview{background:var(--bg,#F2EFE6)!important;width:100%!important;margin:0!important;padding:32px 0 40px!important;border-top:3px solid rgba(212,137,26,.25)!important}
.home-faq-inner{max-width:900px;margin:0 auto;padding:0 20px;text-align:center}
.home-faq-kicker{font-size:.78rem;font-weight:700;color:var(--gold,#d4891a);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.home-faq-inner h2{font-size:clamp(1.2rem,3vw,1.6rem);color:var(--green,#1a4a28);margin-bottom:20px}
.home-faq-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:20px}
@media(max-width:600px){.home-faq-grid{grid-template-columns:1fr}}
.faq-home-link{display:block;padding:12px 16px;background:#fff;border:1.5px solid rgba(26,74,40,.15);border-radius:12px;color:var(--green,#1a4a28)!important;font-size:.9rem;font-weight:600;text-decoration:none;transition:border-color .2s,background .2s}
.faq-home-link:hover{border-color:var(--gold,#d4891a);background:var(--gold-lt,#fff3d6)}
.home-faq-button{display:inline-block;padding:10px 28px;background:var(--green,#1a4a28);color:#fff!important;border-radius:999px;font-weight:700;font-size:.9rem;text-decoration:none}
.home-faq-button:hover{background:var(--green-mid,#2d6b3f)}

/* Feat-img / feat-icon (version finale v71) */
.feat-img{width:100%;height:160px;object-fit:cover;border-radius:12px;display:block;background-color:#e8f5ec}
.feat-icon{width:100%;height:160px;overflow:hidden;border-radius:12px;background:#e8f5ec;display:block;margin-bottom:14px}
@media(min-width:769px){#page-accueil .feat-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:20px!important}}
@media(min-width:481px) and (max-width:768px){#page-accueil .feat-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:14px!important}}
@media(max-width:480px){#page-accueil .feat-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:10px!important}.feat-img,.feat-icon{height:110px}}
#page-accueil .feat-card{display:flex;flex-direction:column;background:var(--surface,#fdf8f0);border-radius:14px;padding:14px 12px;text-align:center;cursor:pointer;transition:box-shadow .2s}
#page-accueil .feat-card:hover{box-shadow:0 4px 20px rgba(26,74,40,.14)}
.feat-card img,.feat-icon img{border-radius:12px!important;max-width:100%!important}
#page-grossiste .feat-icon{width:90px!important;height:90px!important;border-radius:14px!important;background:#f5f0e8!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;margin:0 auto 14px!important}
#page-grossiste .feat-icon img{width:90px!important;height:90px!important;object-fit:cover!important;border-radius:14px!important}

/* Hero colonne droite (version finale v71) */
#ss-hero-col{display:flex;flex-direction:column;width:100%;min-width:0;border-radius:20px;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.28)}
#ss-hero-img-wrap{width:100%;overflow:hidden;flex-shrink:0;display:block;background:#071810;aspect-ratio:4/3}
#ss-hero-img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
#ss-hero-card{background:rgba(7,24,16,.97);border-top:1px solid rgba(217,164,65,.38);padding:14px 16px 16px;flex-shrink:0;color:#fff}
#ss-hero-card-logo{display:flex;align-items:center;gap:8px;margin-bottom:8px}
#ss-hero-card-logo img{height:24px;width:auto}
#ss-hero-card-logo span{font-size:.62rem;font-weight:800;letter-spacing:.14em;color:#fde68a;text-transform:uppercase}
#ss-hero-card-text{font-size:.84rem;line-height:1.4;color:rgba(255,255,255,.9);margin:0 0 10px}
#ss-hero-badges{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}
.ss-badge{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:9px;padding:7px 3px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:3px}
.ss-badge>span:first-child{font-size:1rem;line-height:1}
.ss-badge>span:last-child{font-size:.56rem;font-weight:800;color:#fff;line-height:1.15;text-transform:uppercase}
#ss-hero-picture{display:block!important;width:100%!important;height:100%!important}
#ss-hero-picture img{width:100%!important;height:100%!important;display:block!important}
.hero-copy{min-width:0!important;overflow:hidden!important}
@media(min-width:901px){.hero-card{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)!important;align-items:start!important;gap:36px!important}#ss-hero-col{width:100%!important;min-width:0!important;max-width:100%!important;display:flex!important;flex-direction:column!important;border-radius:22px!important;overflow:hidden!important;box-shadow:0 12px 40px rgba(0,0,0,.36)!important;position:relative!important}#ss-hero-img-wrap{width:100%!important;aspect-ratio:4/5!important;overflow:hidden!important;flex-shrink:0!important;background:#071810!important;display:block!important}#ss-hero-card{background:rgba(6,21,12,.97)!important;border-top:1px solid rgba(217,164,65,.4)!important;padding:14px 16px 16px!important;flex-shrink:0!important;color:#fff!important;width:100%!important;box-sizing:border-box!important}#ss-hero-card-text{font-size:.86rem!important;line-height:1.45!important;margin:0 0 10px!important}#ss-hero-badges{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:5px!important}.hero-copy h1{font-size:clamp(1.8rem,3.2vw,3.2rem)!important;line-height:1.08!important}}
@media(min-width:601px) and (max-width:900px){.hero-card{grid-template-columns:1fr!important;gap:20px!important}#ss-hero-col{width:100%!important;border-radius:18px!important}#ss-hero-img-wrap{aspect-ratio:16/9!important}#ss-hero-card{padding:12px 14px 14px!important}#ss-hero-badges{grid-template-columns:repeat(4,1fr)!important}}
@media(max-width:600px){.hero-card{grid-template-columns:1fr!important;padding:16px 14px 20px!important;gap:16px!important;border-radius:20px!important}#ss-hero-col{width:100%!important;border-radius:16px!important;box-shadow:0 6px 24px rgba(0,0,0,.30)!important}#ss-hero-img-wrap{aspect-ratio:4/3!important}#ss-hero-card{padding:10px 12px 12px!important}#ss-hero-card-text{font-size:.78rem!important;margin:0 0 8px!important}#ss-hero-badges{grid-template-columns:repeat(2,1fr)!important}}
#ss-hero-card-logo{display:flex!important;align-items:center!important;gap:8px!important;margin-bottom:8px!important}
#ss-hero-card-logo img{height:22px!important;width:auto!important}
#ss-hero-card-logo span{font-size:.60rem!important;font-weight:800!important;letter-spacing:.14em!important;color:#fde68a!important;text-transform:uppercase!important}
.ss-badge{background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:9px!important;padding:7px 3px!important;text-align:center!important;display:flex!important;flex-direction:column!important;align-items:center!important;gap:3px!important}
.ss-badge>span:first-child{font-size:.95rem!important;line-height:1!important}
.ss-badge>span:last-child{font-size:.52rem!important;font-weight:800!important;color:#fff!important;line-height:1.15!important;text-transform:uppercase!important}
.wa-floating{position:fixed!important;right:22px!important;bottom:22px!important;left:auto!important;top:auto!important;z-index:9500!important;transform:none!important;will-change:auto!important;transition:none!important}
@media(max-width:768px){.wa-floating{bottom:74px!important;right:16px!important}}

/* Testimonials section */
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:768px){.testimonial-grid{grid-template-columns:1fr}}
.testimonial-card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 2px 12px rgba(0,0,0,.07)}
.testimonial-rating{color:#D9A441;font-size:1.1rem;margin-bottom:10px}
.testimonial-quote{font-size:.92rem;line-height:1.6;color:#333;margin-bottom:14px;font-style:italic}
.testimonial-name{display:block;font-weight:700;color:#1A4D2E;font-size:.9rem}
.testimonial-meta{display:block;font-size:.8rem;color:#595959;margin-top:2px}

/* PIPEDA banner */
.pipeda-banner{position:fixed;bottom:0;left:0;right:0;background:#1A4D2E;color:#fff;padding:14px 20px;z-index:9999;display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-size:.88rem;box-shadow:0 -2px 12px rgba(0,0,0,.2)}
.pipeda-actions{display:flex;gap:10px;flex-shrink:0}
.btn-pipeda{padding:8px 20px;border-radius:999px;border:none;cursor:pointer;font-weight:700;font-size:.85rem;background:#C8942A;color:#fff}
.btn-pipeda-secondary{background:transparent;border:1px solid rgba(255,255,255,.5);color:#fff}

/* ---------------------------------------------------------------
   SAVANNA SELECT V75 � Hero image sizing FR/EN
   FR : home_page2 paysage (3/2) � aspect-ratio g�r� par hero-lang.js
   EN : home_page32 portrait (2/3) � aspect-ratio g�r� par hero-lang.js
   Le CSS fournit les bornes max et les fallbacks neutres.
--------------------------------------------------------------- */

/* Fallback initial (avant que hero-lang.js s'ex�cute) */
#ss-hero-img-wrap {
  width: 100% !important;
  overflow: hidden !important;
  display: block !important;
  background: #071810 !important;
  /* Pas d'aspect-ratio fixe en V75 � d�fini dynamiquement par hero-lang.js */
}

/* Image hero : toujours pleine largeur du conteneur */
#ss-hero-img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  /* object-fit et object-position d�finis par hero-lang.js */
}

/* Desktop � borne max pour �viter l'image trop haute */
@media (min-width: 901px) {
  #ss-hero-img-wrap { max-height: 600px !important; }
}

/* Mobile � borne max pour l'image FR paysage */
@media (max-width: 600px) {
  #ss-hero-img-wrap { max-height: 380px !important; }
}

/* --- V75 � Notre Histoire page � classes CSS (remplace les styles inline) --- */
.nh-hero { background: linear-gradient(135deg, #061A0D 0%, #1A4D2E 60%, #2d6b3f 100%); padding: 60px 0 50px; text-align: center; }
.nh-eyebrow { font-size: .78rem; font-weight: 700; color: #C8942A; text-transform: uppercase; letter-spacing: .12em; margin: 0 0 10px; }
.nh-h1 { font-family: 'Playfair Display','Playfair FB', Georgia, serif; font-size: clamp(1.8rem, 5vw, 3.2rem); font-weight: 900; color: #fff; margin: 0 0 16px; line-height: 1.1; }
.nh-subtitle { font-size: clamp(.9rem, 2vw, 1.1rem); color: rgba(255,255,255,.85); max-width: 600px; margin: 0 auto 32px; line-height: 1.6; }
.nh-cta-row { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.nh-section { padding: 56px 0; }
.nh-section-alt { padding: 56px 0; background: #F9F4EC; }
.nh-section-dark { padding: 56px 0; background: linear-gradient(135deg, #1A4D2E, #2d6b3f); color: #fff; }
.nh-eyebrow-sm { font-size: .75rem; font-weight: 700; color: #C8942A; text-transform: uppercase; letter-spacing: .12em; margin: 0 0 8px; }
.nh-h2 { font-family: 'Playfair Display','Playfair FB', Georgia, serif; font-size: clamp(1.4rem, 3vw, 2.2rem); color: #1A4D2E; margin: 0 0 20px; }
.nh-h2-white { font-family: 'Playfair Display','Playfair FB', Georgia, serif; font-size: clamp(1.4rem, 3vw, 2rem); color: #fff; margin: 0 0 24px; }
.nh-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.nh-card-fr { padding: 24px; background: #F9F4EC; border-radius: 16px; border-left: 4px solid #C8942A; }
.nh-card-en { padding: 24px; background: #EBF5FB; border-radius: 16px; border-left: 4px solid #1A5276; }
.nh-card-label { font-size: .78rem; font-weight: 700; text-transform: uppercase; margin: 0 0 10px; }
.nh-card-label-fr { color: #C8942A; }
.nh-card-label-en { color: #1A5276; }
.nh-card-text { font-size: .95rem; line-height: 1.7; color: #333; margin: 0; }
.nh-card-text + .nh-card-text { margin-top: 14px; }
.nh-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; text-align: center; }
.nh-stat-card { padding: 24px 16px; background: #fff; border-radius: 16px; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.nh-stat-emoji { font-size: 2rem; margin-bottom: 12px; display: block; }
.nh-stat-title { font-size: 1rem; color: #1A4D2E; margin: 0 0 8px; }
.nh-stat-title span { color: #666; font-weight: 400; font-size: .85rem; }
.nh-stat-text { font-size: .85rem; color: #555; line-height: 1.5; margin: 0; }
.nh-ul { font-size: .9rem; line-height: 1.8; color: #333; padding-left: 20px; }
.nh-blockquote { font-size: clamp(1rem, 2.5vw, 1.2rem); line-height: 1.7; font-style: italic; color: rgba(255,255,255,.92); border-left: 4px solid #C8942A; padding-left: 20px; margin: 0 0 24px; }
.nh-blockquote-en { font-size: clamp(.9rem, 2vw, 1.05rem); line-height: 1.7; font-style: italic; color: rgba(255,255,255,.78); border-left: 4px solid rgba(200,148,42,.5); padding-left: 20px; margin: 0 0 32px; }
.nh-founder-name { color: #C8942A; font-weight: 700; font-size: 1rem; margin: 0; }
.nh-founder-meta { color: rgba(255,255,255,.7); font-size: .88rem; margin: 4px 0 0; }
.nh-cta-section { padding: 56px 0; text-align: center; }
.nh-cta-h2 { font-family: 'Playfair Display','Playfair FB', Georgia, serif; font-size: clamp(1.4rem, 3vw, 2rem); color: #1A4D2E; margin: 0 0 12px; }
.nh-cta-sub { color: #555; margin: 0 0 28px; font-size: .95rem; }
/* Photo fondatrice placeholder */
.nh-founder-photo { width: 200px; height: 200px; border-radius: 50%; object-fit: cover; border: 4px solid #C8942A; display: block; margin: 0 auto 16px; }
.nh-founder-placeholder { width: 200px; height: 200px; border-radius: 50%; background: #1A4D2E; display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; font-size: 4rem; border: 4px solid #C8942A; }

/* Responsive mobile notre-histoire */
@media (max-width: 640px) {
  .nh-grid-2 { grid-template-columns: 1fr !important; }
  .nh-stats  { grid-template-columns: 1fr !important; }
  .nh-hero   { padding: 40px 0 32px; }
  .nh-section, .nh-section-alt, .nh-section-dark { padding: 36px 0; }
}

/* ---------------------------------------------------------------
   SAVANNA SELECT V76 � Nouvelles classes
--------------------------------------------------------------- */

/* V76 C10 � R�sidus inline notre-histoire ? classes */
.nh-inner        { max-width:800px; margin:0 auto; }
.nh-inner-center { max-width:800px; margin:0 auto; text-align:center; }
.nh-inner-sm     { max-width:700px; margin:0 auto; text-align:center; }
.nh-subtitle-en  { font-size:.75em; color:#666; display:block; margin-top:6px; }
.btn-lg          { font-size:1.05rem !important; padding:14px 32px !important; }

/* V76 C8 � Badges produit catalogue */
.product-badge {
  position:absolute; top:10px; left:10px;
  padding:4px 10px; border-radius:20px;
  font-size:.7rem; font-weight:800; z-index:2;
  letter-spacing:.04em; text-transform:uppercase;
  pointer-events:none; line-height:1.3;
}
.product-badge--best-seller { background:#1A4D2E; color:#fff; }
.product-badge--arrivage    { background:#C8942A; color:#fff; }
.product-badge--IGP         { background:#1A5276; color:#fff; }
.product-badge--nouveau     { background:#C0392B; color:#fff; }
.product-badge--bio         { background:#27AE60; color:#fff; }

/* Assurer la position relative sur les cards produit pour le badge absolu */
.product-card,
.product-img-wrap { position:relative; }

/* ---------------------------------------------------------------
   SAVANNA SELECT V78 � Hero responsive premium
   Desktop  : 1920�1080px (ratio 16/9)
   Mobile   : 768�1200px  (ratio portrait 0.64)
--------------------------------------------------------------- */

/* Conteneur colonne droite du hero */
#ss-hero-col {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-width: 0 !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  box-shadow: 0 12px 40px rgba(0,0,0,.36) !important;
}

/* Wrapper image � ratio dynamique selon breakpoint */
#ss-hero-img-wrap {
  width: 100% !important;
  overflow: hidden !important;
  display: block !important;
  background: #071810 !important;
  flex-shrink: 0 !important;
  /* Desktop par d�faut : 1920�1080 ? 16/9 */
  aspect-ratio: 1920 / 1080 !important;
  max-height: 600px !important;
}

/* Image hero � pleine taille, centr�e */
#ss-hero-img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* <picture> : pleine taille */
#ss-hero-picture {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}
#ss-hero-picture img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
}

/* Desktop large (>1366px) � hero pleine largeur */
@media (min-width: 1366px) {
  #ss-hero-img-wrap {
    aspect-ratio: 1920 / 1080 !important;
    max-height: 680px !important;
  }
}

/* Laptop (901px�1365px) */
@media (min-width: 901px) and (max-width: 1365px) {
  .hero-card {
    grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr) !important;
    align-items: start !important;
    gap: 36px !important;
  }
  #ss-hero-img-wrap {
    aspect-ratio: 1920 / 1080 !important;
    max-height: 560px !important;
  }
  .hero-copy h1 {
    font-size: clamp(1.8rem, 3.2vw, 3.2rem) !important;
    line-height: 1.08 !important;
  }
}

/* Tablette paysage (601px�900px) */
@media (min-width: 601px) and (max-width: 900px) {
  .hero-card {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  #ss-hero-col {
    border-radius: 18px !important;
  }
  #ss-hero-img-wrap {
    aspect-ratio: 1920 / 1080 !important;
    max-height: 420px !important;
  }
}

/* Mobile portrait (=768px) � 768�1200 */
@media (max-width: 768px) {
  .hero-card {
    grid-template-columns: 1fr !important;
    padding: 16px 14px 20px !important;
    gap: 16px !important;
    border-radius: 20px !important;
  }
  #ss-hero-col {
    border-radius: 16px !important;
    box-shadow: 0 6px 24px rgba(0,0,0,.30) !important;
  }
  #ss-hero-img-wrap {
    /* Mobile portrait : 768�1200 */
    aspect-ratio: 768 / 1200 !important;
    max-height: none !important;
    /* Limiter la hauteur sur petit mobile pour ne pas occuper tout l'�cran */
    max-height: 75vw !important;
  }
  #ss-hero-img {
    object-position: center top !important;
  }
  #ss-hero-card {
    padding: 10px 12px 12px !important;
  }
  #ss-hero-card-text {
    font-size: .78rem !important;
    margin: 0 0 8px !important;
  }
  #ss-hero-badges {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* Mobile XS (=480px) */
@media (max-width: 480px) {
  #ss-hero-img-wrap {
    /* Sur tr�s petit mobile, limiter la hauteur � 60vw max */
    max-height: 60vw !important;
    aspect-ratio: 768 / 1200 !important;
  }
}

/* ---------------------------------------------------------------
   SAVANNA SELECT V79 � Neutralisation des r�gles aspect-ratio legacy
   Les r�gles h�rit�es de V71 (aspect-ratio:4/3, 4/5, 16/9) conflictent
   avec le bloc V78 hero. Ce bloc DOIT rester EN DERNIER dans le CSS.
   C1 : neutralise les conflits desktop � C2 : corrige max-height mobile
--------------------------------------------------------------- */

/* Base : neutralise #ss-hero-img-wrap { aspect-ratio:4/3 } (sans !important) */
#ss-hero-img-wrap {
  aspect-ratio: 1920 / 1080 !important;
}

/* Neutralise @media(min-width:901px) #ss-hero-img-wrap { aspect-ratio:4/5 !important } */
@media (min-width: 901px) {
  #ss-hero-img-wrap {
    aspect-ratio: 1920 / 1080 !important;
    max-height: 600px !important;
  }
}

/* Neutralise @media(601-900px) #ss-hero-img-wrap { aspect-ratio:16/9 !important } */
@media (min-width: 601px) and (max-width: 900px) {
  #ss-hero-img-wrap {
    aspect-ratio: 1920 / 1080 !important;
    max-height: 420px !important;
  }
}

/* Neutralise @media(max-width:600px) aspect-ratio:4/3 + C2: 75vw ? 85vh */
@media (max-width: 768px) {
  #ss-hero-img-wrap {
    aspect-ratio: 768 / 1200 !important;
    max-height: 85vh !important;
  }
}

/* Mobile XS � C2: 60vw ? 80vh */
@media (max-width: 480px) {
  #ss-hero-img-wrap {
    aspect-ratio: 768 / 1200 !important;
    max-height: 80vh !important;
  }
}





/* Kits & Combos images - extrait de index.html V190 */
.combo-img-wrap img,.kit-img img,.featured-img img,.pack-img{max-height:180px!important;height:180px!important;width:auto!important;object-fit:contain!important}

/* V191 - Kits Combos 3 colonnes */
#combos-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
@media (max-width: 900px) { #combos-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 580px) { #combos-grid { grid-template-columns: 1fr; } }


/* ===== V313 - Corrections CLS ===== */
#home-featured{min-height:460px}
@media (max-width:768px){#home-featured{min-height:1320px}}
nav#main-nav,.main-nav{min-height:52px}

/*A11Y-V321*/.u023{background:linear-gradient(135deg,#1a5c38 0%,#1f6b45 60%,#1a4a28 100%)!important}.u023,.u023 .lang-swap,.u031{color:#fff!important}.u028{background:rgba(255,255,255,.08)!important}.u030{color:#e8f2ec!important}.btn-pipeda{background:#C8942A!important;color:#061A0D!important}.btn-pipeda-secondary{background:transparent!important;color:#fff!important}.faq-home-link{color:#fff!important;background:rgba(255,255,255,.08)!important}.home-faq-preview{color:#fff!important;background:#1a4a28!important}.home-faq-preview h2,.home-faq-preview .home-faq-kicker{color:#fff!important}.home-faq-preview .home-faq-kicker{color:#7a4800!important}.home-faq-button{background:#d4891a!important;color:#071810!important}
/*A11Y-V321C*/section.section.u023.u023{background-color:#1a4a28!important;background-image:linear-gradient(135deg,#1a5c38 0%,#1f6b45 60%,#1a4a28 100%)!important}