/* Mobile and tablet menu (2026-11-04). A file of its own because the edge cache keys
   assets by path and ignores ?ver=: style.css keeps its old mobile-menu rules and this
   file, loaded after it, overrides them. Products is an ordinary row; the products sit in
   short groups, two to a row, each with its line icon; Call and Quote stay pinned at the
   foot. Tablets below 1180px get this menu: the desktop nav wrapped there. */
.desktop-nav a{white-space:nowrap}
@media(max-width:1180px){.desktop-nav{display:none}.mobile-toggle{display:flex;align-items:center;justify-content:center}}
.mobile-menu{visibility:hidden;transition:transform 0.3s ease,visibility 0s linear 0.3s}
.mobile-menu.active{transform:translateX(0);visibility:visible;transition:transform 0.3s ease}
@media(max-width:1180px){.mobile-menu{display:block}}
@media(max-width:1180px){.mobile-menu{display:flex;flex-direction:column;overflow:hidden}}
.mobile-menu .mob-links{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
.mobile-menu .mob-links > a,.mobile-menu .sub-toggle{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--color-grey-light);padding:14px 24px;font-family:var(--font-heading);font-size:16px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--color-text-dark);border-left:0}
.mobile-menu .sub-toggle{position:relative;cursor:pointer}
.mobile-menu .sub-toggle::after{content:'';position:absolute;right:26px;top:50%;width:8px;height:8px;border-right:2px solid var(--color-primary);border-bottom:2px solid var(--color-primary);transform:translateY(-70%) rotate(45deg);transition:transform 0.2s ease}
.mobile-menu .sub-toggle.open{background:none;color:var(--color-primary);border-left:0;border-bottom-color:transparent}
.mobile-menu .sub-toggle.open::after{content:'';transform:translateY(-30%) rotate(-135deg)}
.mobile-menu .sub-menu{display:none;background:var(--color-bg);padding:4px 16px 14px;border-bottom:1px solid var(--color-grey-light)}
.mobile-menu .sub-toggle.open+.sub-menu{display:block}
.mobile-menu .mob-group{display:flex;align-items:center;gap:10px;font-family:var(--font-heading);font-size:13px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--color-text-dark);padding:16px 2px 8px}
.mobile-menu .mob-group::before{content:'';width:4px;height:16px;background:var(--color-primary)}
.mobile-menu .mob-group::after{content:'';flex:1;height:1px;background:#dcdcdc}
.mobile-menu .mob-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px}
.mobile-menu .mob-grid a{display:flex;align-items:center;gap:8px;line-height:1.2;text-align:left;padding:8px;min-width:0;font-size:14px;font-weight:500;color:var(--color-text-dark);background:var(--color-white);border:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6}
.mobile-menu .mob-soon{display:flex;align-items:center;gap:8px;line-height:1.2;padding:8px;min-width:0;font-family:var(--font-heading);font-size:14px;font-weight:500;color:#999;background:transparent;border:1px dashed #d6d6d6}
.mobile-menu .mob-grid .mob-soon img{flex:none;width:30px;height:24px;object-fit:contain;opacity:0.4}
.mobile-menu .mob-soon small{display:block;font-size:11px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase;color:var(--color-primary);margin-top:2px}
.mobile-menu .mob-grid img{flex:none;width:30px;height:24px;object-fit:contain;opacity:0.85}
.mobile-menu .mob-grid a:hover,.mobile-menu .mob-grid a:active{background:var(--color-white);border-color:var(--color-primary);color:var(--color-primary)}
.mobile-menu .mob-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--color-grey-light);background:var(--color-white)}
.mobile-menu .mob-actions a{margin:0;padding:13px 8px !important;text-align:center;font-size:14px;font-weight:700;border:0 !important;border-radius:0;letter-spacing:0.3px;text-transform:none}
.mobile-menu .mob-actions .mob-phone{color:var(--color-primary) !important;background:none;border:2px solid var(--color-primary) !important}
.mobile-menu .mob-actions .mob-cta{background:var(--color-primary);color:var(--color-white) !important}
.mobile-menu .mob-grid a:last-child{border-bottom:1px solid #e6e6e6}