/* Menu LE STAR : typographie et dimensions isolées des styles de contenu. */
#mainNav.commerce-nav{position:relative;background:#292929;border-bottom:3px solid var(--orange,#ff6a00);z-index:40}
#mainNav.commerce-nav .nav-inner{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:space-between;height:56px;min-height:0;gap:0;max-width:1800px}
#mainNav.commerce-nav .nav-inner>a,#mainNav.commerce-nav .nav-item>button{display:flex;align-items:center;justify-content:center;gap:8px;height:56px;min-width:0;margin:0;padding:0 clamp(8px,1.05vw,20px);border:0;border-radius:0;background:transparent;color:#fff;font-family:Arial,Helvetica,sans-serif!important;font-size:clamp(11px,.87vw,16px)!important;font-weight:700!important;line-height:1.25!important;letter-spacing:.15px;text-decoration:none;white-space:nowrap!important;cursor:pointer;transition:background .18s,color .18s}
#mainNav.commerce-nav .nav-inner>a span,#mainNav.commerce-nav .nav-item>button span{font-family:inherit!important;font-size:inherit!important;line-height:inherit!important;white-space:inherit!important}
#mainNav.commerce-nav .nav-home{flex:0 0 48px;padding:0!important}
#mainNav.commerce-nav .commerce-menu{position:static;display:flex;align-items:stretch;min-width:0}
#mainNav.commerce-nav .nav-inner>a:hover,#mainNav.commerce-nav .nav-item>button:hover,#mainNav.commerce-nav .commerce-menu.open>button{background:#191919;color:#ff8c31}
#mainNav.commerce-nav .menu-chevron{opacity:.7;transition:transform .18s}
#mainNav.commerce-nav .commerce-menu.open .menu-chevron{transform:rotate(180deg)}
#mainNav.commerce-nav .commerce-mega{position:absolute;top:100%;left:50%;right:auto;transform:translateX(-50%);display:none;opacity:1;visibility:visible;width:calc(100% - 64px);max-width:1640px;max-height:min(650px,72vh);overflow-y:auto;padding:0;background:#fff;color:#222;border:1px solid #e5e1db;border-top:3px solid var(--orange,#ff6a00);border-radius:0 0 12px 12px;box-shadow:0 18px 40px #0003;transition:none;z-index:100}
#mainNav.commerce-nav .commerce-menu.open>.commerce-mega{display:block}
#mainNav.commerce-nav .mega-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 26px;border-bottom:1px solid #ece7df;background:#faf8f4}
#mainNav.commerce-nav .mega-heading strong{font-family:Arial,Helvetica,sans-serif;font-size:18px;line-height:1.2;font-weight:700}
#mainNav.commerce-nav .mega-heading>a{font-size:13px!important;font-weight:600!important;color:#b64c00;padding:0;border:0;text-decoration:none;background:transparent}
#mainNav.commerce-nav .mega-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 26px;padding:24px 26px 28px}
#mainNav.commerce-nav .mega-family{min-width:0;padding:0 0 14px;border-bottom:1px solid #eee9e2}
#mainNav.commerce-nav a.mega-title{
 display:block;
 font-family:Arial,Helvetica,sans-serif!important;
 font-size:14px!important;
 font-weight:700!important;
 line-height:0.65!important;
 letter-spacing:.1px;
 color:#242424;
 padding:0 0 2px;
 border:0;
 text-decoration:none;
 background:transparent;
 overflow-wrap:normal;
}
#mainNav.commerce-nav a.mega-sub{display:block;font-family:Arial,Helvetica,sans-serif!important;font-size:13px!important;font-weight:400!important;line-height:1.4!important;letter-spacing:0;color:#6a625a;padding:4px 0;border:0;text-decoration:none;background:transparent}
#mainNav.commerce-nav a.mega-title span,#mainNav.commerce-nav a.mega-sub span{font-family:inherit!important;font-size:inherit!important;line-height:inherit!important;font-weight:inherit!important}
#mainNav.commerce-nav a.mega-title:hover,#mainNav.commerce-nav a.mega-sub:hover{color:#d35b00;background:transparent;text-decoration:underline;text-underline-offset:3px}
#mainNav.commerce-nav a:focus-visible,#mainNav.commerce-nav button:focus-visible{outline:2px solid #ff8c31;outline-offset:-3px}
@media(min-width:1181px){#mainNav.commerce-nav{display:block}}
@media(max-width:1350px) and (min-width:1181px){#mainNav.commerce-nav .nav-inner{width:98%}#mainNav.commerce-nav .nav-inner>a,#mainNav.commerce-nav .nav-item>button{font-size:medium!important;padding:0 7px;letter-spacing:0}#mainNav.commerce-nav .nav-home{flex-basis:34px}}
@media(max-width:1180px){#mainNav.commerce-nav{display:none}#mainNav.commerce-nav.open{display:block}#mainNav.commerce-nav .nav-inner{display:flex;flex-direction:column;align-items:stretch;width:100%;height:auto;padding:5px 12px}#mainNav.commerce-nav .nav-inner>a,#mainNav.commerce-nav .nav-item>button{width:100%;height:46px;padding:0 14px;justify-content:flex-start;font-size:13px!important;white-space:normal!important;border-bottom:1px solid #ffffff12}#mainNav.commerce-nav .commerce-menu{display:block;width:100%}#mainNav.commerce-nav .nav-item>button{justify-content:space-between}#mainNav.commerce-nav .nav-home{flex:auto}#mainNav.commerce-nav .commerce-mega{position:static;transform:none;width:100%;max-height:60vh;border-radius:8px;margin:0 0 10px;box-shadow:none}#mainNav.commerce-nav .mega-heading{padding:15px;align-items:flex-start}#mainNav.commerce-nav .mega-heading strong{font-size:16px}#mainNav.commerce-nav .mega-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:18px 15px}#mainNav.commerce-nav a.mega-title{font-size:14px!important}#mainNav.commerce-nav a.mega-sub{font-size:12px!important}}
@media(max-width:420px){#mainNav.commerce-nav .mega-grid{grid-template-columns:1fr 1fr;gap:14px 12px}#mainNav.commerce-nav .mega-heading>a{font-size:11px!important}}

/* Les sous-catégories se superposent au contenu sans déplacer les titres. */
@media(min-width:901px){
 #mainNav.commerce-nav .commerce-mega{overflow:visible;max-height:none}
 #mainNav.commerce-nav .commerce-menu:hover>.commerce-mega{display:block}
 #mainNav.commerce-nav .mega-family{position:relative;padding-bottom:0}
 #mainNav.commerce-nav .mega-submenu{display:none;position:absolute;top:100%;left:0;width:max(100%,240px);max-width:min(360px,85vw);max-height:55vh;overflow:auto;background:#fff;padding:12px 18px;border-top:3px solid var(--orange);box-shadow:0 12px 28px #0003;z-index:110}
 #mainNav.commerce-nav .mega-family:nth-child(4n)>.mega-submenu{left:auto;right:0}
 #mainNav.commerce-nav .mega-family:hover>.mega-submenu,#mainNav.commerce-nav .mega-family:focus-within>.mega-submenu{display:block}
 #mainNav.commerce-nav .mega-family:has(.mega-submenu)>.mega-title::after{content:' ▾';color:var(--orange)}
}

/* Contact & services : fond assorti au menu, texte blanc. */
#mainNav.commerce-nav .nav-inner>a[href="index.php?page=contact"]{background:#292929!important;color:#fff!important}
#mainNav.commerce-nav .nav-inner>a[href="index.php?page=contact"]:hover{background:#191919!important;color:#fff!important}