/* Approved unified navigation buttons and soft header separation. */
.header{border-bottom:1px solid #dce7df;box-shadow:0 8px 24px #143c2210}
.header .language{width:40px;height:40px;flex:0 0 40px;border:1px solid #dce6dd;border-radius:50%;padding:0;display:flex;align-items:center;justify-content:center;gap:0;line-height:1;font-size:13px;background:#fff}
.header .language span{display:none}
@media(min-width:801px){
 .header-inner{gap:24px;height:86px}
 .header nav.has-mega{gap:14px}
 .header nav.has-mega .nav-item{height:42px;gap:0;border:1px solid #dce6dd;border-radius:13px;background:#fff;transition:background .18s,border-color .18s}
 .header nav.has-mega .nav-item>a{padding:10px 0 10px 13px;line-height:20px;font-size:14px;border-radius:12px 0 0 12px}
 .header nav.has-mega .nav-item>a:after{display:none}
 .header nav.has-mega .nav-dropdown summary{width:32px;height:40px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:0 12px 12px 0;color:#07552d}
 .header nav.has-mega .nav-dropdown summary span{display:none}
 .header nav.has-mega .nav-dropdown summary:after{content:'';width:6px;height:6px;border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;transform:translateY(-2px) rotate(45deg)}
 .header nav.has-mega .nav-item:hover,.header nav.has-mega .nav-item:has(details[open]){background:#e6f5dc;border-color:#e6f5dc}
 .header nav.has-mega .nav-item:has(details[open])>a{background:transparent}
 .header nav.has-mega .nav-item:has(details[open]) summary:after{transform:translateY(2px) rotate(225deg)}
 .header-actions{gap:10px}
 .header .login{white-space:nowrap}
}
@media(min-width:801px) and (max-width:1180px){.header-inner{gap:14px}.header .wordmark{font-size:24px}.header nav.has-mega{gap:7px}.header nav.has-mega .nav-item>a{font-size:12px;padding-left:9px}.header nav.has-mega .nav-dropdown summary{width:25px}.header-actions{gap:7px}}
@media(min-width:801px) and (max-width:1000px){.header-inner{gap:10px}.header .wordmark{font-size:22px}.header nav.has-mega{gap:4px}.header nav.has-mega .nav-item>a{font-size:11px;padding-left:7px}.header nav.has-mega .nav-dropdown summary{width:20px}.header .language{width:34px;height:34px;flex-basis:34px;font-size:11px}.header .login{font-size:11px;padding:8px 12px}}
@media(max-width:800px){.header .language{width:34px;height:34px;flex-basis:34px;font-size:11px}}
@media(max-width:360px){.header .language{width:30px;height:30px;flex-basis:30px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.header nav.has-mega .nav-item{transition:none}}
/* Login uses the same lightweight hover feedback as order buttons. */
.header .login{transform:translate(0,0);transition:background-color .25s ease,transform .25s ease,box-shadow .25s ease}
.header .login:focus-visible{outline:3px solid #12833e;outline-offset:4px;background:#12833e;color:#fff}
@media(hover:hover) and (pointer:fine){.header .login:hover{background:#12833e;color:#fff;transform:translateY(-2px);box-shadow:0 9px 22px #16813e38}}
@media(prefers-reduced-motion:reduce){.header .login{transition:none;transform:none!important}}
/* Align desktop navigation with the homepage Quick Link container. */
@media(min-width:1101px){.header .header-inner.wrap{width:min(1514px,calc(100% - 72px))}}