/* Design 04 « Pop & briques » : règles de la référence, limitées à la navigation. */
.shop-navigation { --navy:#102c4c;--navy2:#0b2240;--orange:#bf5014;--gold:#edab33;--blue:#1e6fa7;--muted:#68798e;--line:#e4e9f1;font-family:Inter,"Segoe UI",system-ui,-apple-system,sans-serif;font-size:14px;color:#102c4c;max-width:1320px;margin-inline:auto; }
.shop-navigation svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
.shop-navigation button{cursor:pointer}
.shop-navigation{background:white;border-radius:0 0 18px 18px;position:relative;min-width:0;overflow:visible;--hbg:white;--navbg:white;--navlink:var(--navy);--navhover:#f2f6fa;--navborder:#e4e9f0;--catIcon:#e9f2fa;--ctabg:#be4d11;--ctacolor:white;--ctaShadow:0 6px 16px #bd4f132b}
.shop-navigation .store-header{background:var(--hbg);padding:19px 32px 21px;display:flex;align-items:center;gap:29px;border-radius:0}
.shop-navigation .brand img{height:89px;width:132px;object-fit:contain;display:block;mix-blend-mode:multiply}
.shop-navigation .header-search{display:flex;align-items:center;height:55px;border:1px solid #d5dee8;border-radius:12px;background:#f7f9fb;min-width:0;flex:1;max-width:810px;overflow:hidden;transition:.2s}
.shop-navigation .header-search:focus-within{box-shadow:0 0 0 3px #2b80b117;border-color:#9bb9cf}
.shop-navigation .header-search select{border:0;background:transparent;height:100%;width:142px;color:#1b3d5c;padding:0 15px;outline:none;border-right:1px solid #dce5ec;font-size:13px}
.shop-navigation .header-search input{border:0;background:none;outline:0;flex:1;min-width:0;padding:0 17px;font-size:15px;color:var(--navy)}
.shop-navigation .header-search input::placeholder{color:#8190a2}
.shop-navigation .header-search button{border:0;background:none;color:#103759;padding:14px 17px;height:100%}
.shop-navigation .header-search button svg{width:24px;height:24px;stroke-width:2.2}
.shop-navigation .user-side{display:flex;align-items:center;justify-content:flex-end;gap:16px;font-size:13px;font-weight:800;white-space:nowrap;margin-left:auto}
.shop-navigation .user-side a{transition:.18s}
.shop-navigation .user-side a:hover{color:#bf5014}
.shop-navigation .user-side .basket{display:flex;align-items:center;gap:7px}
.shop-navigation .user-side svg{width:17px;height:17px}
.shop-navigation .num{min-width:25px;height:25px;background:#0c2c4d;border-radius:50%;color:white;display:grid;place-items:center;font-size:12px}
.shop-navigation .lang{padding-left:7px;display:flex;gap:8px}
.shop-navigation .lang span:last-child{color:#8591a1}
.shop-navigation .burger{display:none;border:1px solid #d7e1ec;background:#fff;border-radius:10px;width:42px;height:42px;align-items:center;justify-content:center;color:#123451}
.shop-navigation .nav-shell{background:var(--navbg);border-top:1px solid var(--navborder);border-bottom:1px solid var(--navborder);position:relative;z-index:5}
.shop-navigation .nav-inner{display:flex;align-items:center;gap:6px;min-height:73px;padding:9px 30px;max-width:1580px;margin:auto}
.shop-navigation .nav-products,.shop-navigation .nav-rest{display:flex;align-items:center;gap:4px}
.shop-navigation .nav-divider{width:1px;height:24px;background:#dce4eb;margin:0 10px}
.shop-navigation .nav-spacer{flex:1;min-width:4px}
.shop-navigation .nav-link{appearance:none;border:0;background:transparent;color:var(--navlink);display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border-radius:10px;font-size:14px;font-weight:800;white-space:nowrap;transition:.2s;position:relative}
.shop-navigation .nav-link:hover,.shop-navigation .nav-link:focus-visible{background:var(--navhover);outline:none}
.shop-navigation .nav-link svg{width:17px;height:17px}
.shop-navigation .nav-link .down{height:14px;width:14px;opacity:.65;transition:.2s}
.shop-navigation .nav-link[aria-expanded=true] .down{transform:rotate(180deg)}
.shop-navigation .nav-group{position:relative}
.shop-navigation .nav-group>.nav-link{width:100%}
.shop-navigation .nav-cta{background:var(--ctabg);color:var(--ctacolor);box-shadow:var(--ctaShadow);padding:13px 19px;border-radius:11px;margin-left:7px}
.shop-navigation .nav-cta:hover{background:#a53f0b;color:white;transform:translateY(-1px)}
.shop-navigation .nav-cta svg{height:15px;width:15px}
.shop-navigation .submenu{position:absolute;top:calc(100% + 16px);left:0;width:363px;z-index:100;background:white;border:1px solid #dce5ee;border-radius:17px;box-shadow:0 22px 55px #14355630;padding:17px;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-7px);transition:opacity .15s,transform .15s,visibility .15s}
.shop-navigation .nav-group.open .submenu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.shop-navigation .submenu::before{content:'';position:absolute;top:-20px;left:0;right:0;height:20px}
.shop-navigation .sub-title{font-size:11px;font-weight:900;color:#bf5014;letter-spacing:.13em;text-transform:uppercase;padding:3px 6px 11px}
.shop-navigation .sub-item{display:flex;align-items:center;gap:13px;padding:11px 10px;border-radius:10px;transition:.15s}
.shop-navigation .sub-item:hover{background:#f3f7fb}
.shop-navigation .sub-icon{display:grid;place-items:center;background:#eff5f9;color:#1b608c;border-radius:10px;flex:0 0 39px;height:39px}
.shop-navigation .sub-icon svg{width:20px;height:20px}
.shop-navigation .sub-item strong{font-size:13px;display:block}
.shop-navigation .sub-item small{font-size:11px;color:#75859a;display:block;margin-top:4px;line-height:1.35}
.shop-navigation .sub-foot{padding:14px 6px 2px;border-top:1px solid #edf1f5;margin-top:9px;font-size:11px;color:#8895a6}
.shop-navigation.style-3{--hbg:#fcfeff;--navbg:#cfdae0;--navborder:#cce4f1;--navhover:#cee7f5;--ctabg:#f07729;--ctaShadow:0 5px 0px #b95419}
.shop-navigation.style-3 .nav-shell{border-top:3px solid var(--navbg)}
.shop-navigation.style-3 .nav-inner{min-height:79px}
.shop-navigation.style-3 .nav-link{border-radius:12px}
.shop-navigation.style-3 .nav-products{gap:5px}
.shop-navigation.style-3 .nav-products .nav-link{background:#fff;border:1px solid #cce4f1;box-shadow:0 3px 0 #b7d4e5;padding:12px 14px}
.shop-navigation.style-3 .nav-products .nav-link:hover{transform:translateY(-2px);box-shadow:0 5px 0 #b7d4e5}
.shop-navigation.style-3 .nav-products .nav-link svg{color:#237ab0}
.shop-navigation.style-3 .nav-cta{border-radius:12px;border:1px solid #e96b1b}
.shop-navigation.style-3 .nav-cta:hover{background:#f5843c;box-shadow:0 6px 0 #b95419;color:white}
.shop-navigation.style-3 .nav-divider{background:#c0d9e7}
.shop-navigation.style-3 .brand::after{content:'';display:block;position:absolute;left:167px;top:28px;width:5px;height:5px;background:#f2ae3b;border-radius:2px;box-shadow:0 11px #f97316,11px 11px #1674ad,11px 0 #db3e23}
.shop-navigation .store-header{max-width:none;margin:0;border:0;display:flex;justify-content:initial;background:var(--hbg)}
.shop-navigation .header-search{width:auto;margin:0}.shop-navigation .header-search select{max-width:none;flex:none}.shop-navigation .header-search button{width:auto;font-size:inherit}
.shop-navigation .basket .num{order:2;min-width:25px;width:auto;height:25px;padding:0 5px;font-size:12px;background:#0c2c4d}.shop-navigation .basket .basket-label{order:1;display:inline;min-width:0;height:auto;padding:0;background:none;border-radius:0;color:inherit;font-size:13px}
.shop-navigation .lang{font-size:13px;color:#8591a1}.shop-navigation .lang a[aria-current]{color:#102c4c}.shop-navigation .lang a{font-weight:800}
.shop-navigation .nav-shell{display:block;gap:0;font-weight:400}.shop-navigation .nav-inner{justify-content:initial;flex-wrap:nowrap;font-size:14px;overflow:visible}
.shop-navigation .mobile-drawer{display:none}.shop-navigation .desktop-logout:empty{display:none}.shop-navigation .logout-link{font-size:11px}
.shop-navigation .nav-group.open>.nav-link{background:var(--navhover)}
.shop-navigation .submenu{translate:var(--submenu-shift,0px) 0;max-width:calc(100vw - 24px)}
.shop-navigation .submenu a:hover{color:#102c4c}
.shop-navigation:not(.navigation-ready) .nav-group:hover .submenu,.shop-navigation:not(.navigation-ready) .nav-group:focus-within .submenu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.shop-navigation :is(a,button,summary):focus-visible{outline:3px solid #237ab0;outline-offset:3px}
.shop-navigation .mobile-account{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:16px 10px 4px}
@media(max-width:1200px){
.shop-navigation .store-header{gap:15px;padding:15px 19px}.shop-navigation .brand img{height:80px;width:112px}.shop-navigation .user-side{gap:10px}.shop-navigation .user-side .account,.shop-navigation .user-side .lang{display:none}.shop-navigation .nav-inner{padding-left:12px;padding-right:12px;gap:2px}.shop-navigation .nav-link{padding:10px 11px;font-size:12px;gap:5px}.shop-navigation .nav-cta{padding:10px 12px}.shop-navigation .nav-divider{margin:0 4px}
}
@media(max-width:950px){.shop-navigation .nav-link{font-size:11px;padding:9px 8px}.shop-navigation .nav-link svg{width:14px}.shop-navigation.style-3 .nav-inner{min-height:66px}.shop-navigation .nav-divider{margin:0 2px}}
@media(max-width:740px){
.shop-navigation .store-header{padding:13px 15px 14px;gap:12px;flex-wrap:wrap}
.shop-navigation .brand img{height:69px;width:103px}
.shop-navigation .user-side{gap:12px}
.shop-navigation .user-side .account,.shop-navigation .user-side .lang,.shop-navigation .user-side .basket .basket-label{display:none}
.shop-navigation .burger{display:flex}
.shop-navigation .header-search{order:3;flex:0 0 100%;height:47px}
.shop-navigation .header-search select{width:134px;font-size:11px;padding-left:9px}
.shop-navigation .header-search input{font-size:12px;padding-left:10px}
.shop-navigation .header-search button{padding:10px}
.shop-navigation .nav-shell{display:none}
.shop-navigation .mobile-drawer{display:none;border-top:1px solid #e0e8f0;padding:12px;background:white;position:relative;z-index:8}
.shop-navigation .mobile-drawer.open{display:block}
.shop-navigation .mobile-item{width:100%;border:0;background:white;padding:13px 10px;display:flex;gap:11px;align-items:center;text-align:left;border-bottom:1px solid #eff2f6;color:#0d3654;font-weight:800}
.shop-navigation .mobile-item svg{width:17px;height:17px}
.shop-navigation details{border-bottom:1px solid #eff2f6;padding:3px 0}
.shop-navigation summary{padding:12px 10px;display:flex;gap:10px;align-items:center;font-weight:800;cursor:pointer}
.shop-navigation summary svg{width:17px}
.shop-navigation details .mobile-item{padding-left:39px;font-size:12px;color:#516980;font-weight:650}
.shop-navigation .mobile-item.sellmob{background:#c25419;color:white;border-radius:9px;margin-top:10px;justify-content:center}
.shop-navigation .user-side .basket .basket-label,.shop-navigation .desktop-logout{display:none}
.shop-navigation .header-search{width:100%;max-width:none}.shop-navigation .brand::after{display:none}
.shop-navigation .nav-shell{display:none}.shop-navigation .mobile-drawer{max-width:100%}
.shop-navigation .mobile-item.sellmob{background:#f07729;border:1px solid #e96b1b;box-shadow:0 5px 0 #b95419}
.shop-navigation .mobile-account .account,.shop-navigation .mobile-account .lang{display:flex}
.shop-navigation:not(.navigation-ready) .mobile-drawer{display:block}
.shop-navigation:not(.navigation-ready) .burger{display:none}
}
@media(min-width:741px) and (max-width:1200px){.shop-navigation .user-side .account,.shop-navigation .user-side .lang{display:flex}}
@media(prefers-reduced-motion:reduce){.shop-navigation *{transition:none!important;transform:none!important}}
