/* More legible navigation on desktop, tablet and mobile. */
.navbar .navbar-inner { gap:24px; }
.navbar .navbar-brand { flex-shrink:0; }
.navbar .nav-menu { gap:22px; }
.navbar .nav-menu a { font-size:14px; font-weight:600; letter-spacing:.035em; line-height:1.5; white-space:nowrap; display:inline-flex; align-items:center; min-height:44px; }
.navbar .nav-menu .nav-cta { font-size:13px !important; padding:12px 22px !important; }
.navbar:not(.scrolled) .nav-menu a { color:#fff; }
.navbar.scrolled .nav-menu a, .product-page .navbar .nav-menu a { color:var(--black); }
.navbar .hamburger { display:none; border:0; background:transparent; align-items:center; justify-content:center; flex-direction:column; gap:6px; min-width:48px; min-height:48px; padding:10px; cursor:pointer; flex-shrink:0; }
.navbar .hamburger span { display:block; width:30px; height:3px; background:var(--black); }
.navbar:not(.scrolled) .hamburger span { background:#fff; }
.mobile-nav { display:none; position:fixed; inset:0; background:var(--white); z-index:999; flex-direction:column; padding:110px 32px 40px; overflow-y:auto; }
.mobile-nav.open { display:flex; }
.mobile-nav a { font-size:23px; font-weight:700; padding:18px 0; min-height:60px; border-bottom:1px solid var(--gray-border); display:flex; align-items:center; justify-content:space-between; }
.mobile-nav a svg { width:11px; flex-shrink:0; }
body:has(.mobile-nav.open) .navbar { background:var(--white); }
body:has(.mobile-nav.open) .navbar .hamburger span { background:var(--black); }
body:has(.mobile-nav.open) .navbar .logo-white { opacity:0; position:absolute; pointer-events:none; }
body:has(.mobile-nav.open) .navbar .logo-color { opacity:1; position:static; pointer-events:auto; }
@media (max-width:1280px) {
 .navbar .nav-menu { display:none; }
 .navbar .hamburger { display:flex; }
 .product-page .navbar .hamburger span { background:var(--black); }
}
@media (min-width:1281px) {
 .mobile-nav.open { display:none; }
}
@media (max-width:480px) {
 .navbar .container { padding-left:20px; padding-right:20px; }
 .navbar .navbar-brand img { height:44px !important; max-width:calc(100vw - 112px); object-fit:contain; }
 .mobile-nav { padding-left:24px; padding-right:24px; }
 .mobile-nav a { font-size:22px; }
}
