/* Shared header styles, scoped to navigation only. */
.ma header{border-bottom:0!important;overflow:visible!important}
.ma header>.container{width:100%!important;max-width:none!important;box-sizing:border-box}
@media(min-width:768px){
.ma header>.container{position:relative;min-height:58px;padding:0 30px!important;display:flex;align-items:center}
.ma header #logo{position:absolute;left:clamp(16px,2.3vw,44px);top:0;bottom:0;display:flex;align-items:center;z-index:2}
.ma header #logo #logo-callus{display:flex;align-items:center;justify-content:center;min-width:58px;padding:0 8px!important;font-size:38px!important;line-height:1}
.ma header #logo #logo-callus .fa{font-size:1em!important;opacity:.35!important;margin:0!important}
.ma header #mobile-menu{float:none!important;width:100%!important;display:block!important;min-width:0}
.ma header #mobile-menu nav{position:relative;float:none!important;width:100%!important;height:58px;display:flex!important;align-items:stretch;justify-content:center;gap:0}
.ma header #mobile-menu nav>a{display:flex;align-items:center;justify-content:center;white-space:nowrap;box-sizing:border-box}
.ma header #mobile-menu nav>a.header-cart-icon{position:absolute!important;right:96px;top:0;bottom:0;display:flex;align-items:center;justify-content:center;min-width:82px;min-height:58px;height:auto!important;padding:0 40px 0 16px!important;margin:0!important;overflow:visible!important;transform:none!important}
.ma header #mobile-menu nav>a.header-cart-icon .fa-shopping-cart{font-size:23px;line-height:1;margin:0!important}
.ma header #mobile-menu nav>a.header-cart-icon .header-cart-count{position:absolute!important;top:8px!important;left:29px!important;right:auto!important;margin:0!important;z-index:2;display:flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:2px 4px;box-sizing:border-box;border-radius:10px;background:#65c6b8;color:#102527;font:700 11px/14px Quicksand,sans-serif}
.ma header #mobile-menu nav>a:nth-last-of-type(2){position:absolute;right:48px;top:0;bottom:0;width:44px;padding:0!important}
.ma header #mobile-menu nav>a:last-of-type{position:absolute;right:0;top:0;bottom:0;width:44px;padding:0!important}
}
@media(max-width:1100px) and (min-width:768px){.ma header #mobile-menu nav>a:not(.header-cart-icon){padding-left:7px!important;padding-right:7px!important;font-size:12px}.ma header #logo #logo-callus{min-width:42px;padding:0 3px!important}}
@media(max-width:767px){
.ma header>.container{display:flex;align-items:center;justify-content:space-between;min-height:60px;padding:0 12px!important}
.ma header #logo{display:flex;align-items:center;float:none;min-width:0}
.ma header #logo #logo-logo{display:block;float:none;flex:none;width:38px;height:38px;margin:0 10px 0 0!important}
.ma header #logo #logo-callus{display:flex;align-items:center;justify-content:center;flex:none;width:42px;height:42px;padding:0!important;margin:0;font-size:42px!important;line-height:1}
.ma header #logo #logo-callus .fa{font-size:1em!important;line-height:1;margin:0;opacity:.35!important}
.ma header .ma-mobile-header-actions{display:flex!important;align-items:center;gap:4px;margin-left:auto}
.ma header .ma-mobile-header-actions a{position:relative;display:flex;align-items:center;justify-content:center;float:none;width:40px;height:40px;padding:0;font-size:22px;line-height:1}
.ma header #mobile-menu.visible{z-index:5;background:linear-gradient(90deg,#162a2b 0%,#1b5759 46%,#162a2b 100%)}
}

/* Logo and WhatsApp should highlight across the entire header height. */
@media(min-width:768px){
.ma header #logo{align-self:stretch;align-items:stretch}
.ma header #logo #logo-logo,.ma header #logo #logo-callus{align-self:stretch;height:100%!important;min-height:58px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin-top:0!important;margin-bottom:0!important}
.ma header #logo #logo-logo{background-position:center center}
.ma header #logo #logo-callus:hover,.ma header #logo #logo-callus:focus,.ma header #logo #logo-logo:hover,.ma header #logo #logo-logo:focus{background-color:rgba(255,255,255,.1)}
}
@media(max-width:767px){
.ma header #logo{align-self:stretch;align-items:stretch}
.ma header #logo #logo-logo,.ma header #logo #logo-callus{align-self:stretch;height:auto!important;min-height:60px;margin-top:0!important;margin-bottom:0!important;box-sizing:border-box}
.ma header #logo #logo-logo{background-position:center center}
.ma header #logo #logo-logo:hover,.ma header #logo #logo-callus:hover,.ma header #logo #logo-logo:focus,.ma header #logo #logo-callus:focus{background-color:rgba(255,255,255,.1)}
}

/* WhatsApp: symmetric clickable area and slightly smaller centred glyph. */
.ma header #logo #logo-callus{padding-left:10px!important;padding-right:10px!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center;letter-spacing:0!important;font-size:33px!important}
.ma header #logo #logo-callus .fa{display:block!important;margin:0!important;font-size:1em!important;line-height:1!important;flex:none}
@media(max-width:767px){.ma header #logo #logo-callus{width:42px;padding-left:0!important;padding-right:0!important;font-size:35px!important}}