/* English Compass AI — restrained, accessible navigation, October 2026. */
.ec-shell-header{
  height:74px;
  position:sticky;
  top:0;
  z-index:80;
  overflow:visible;
  background:rgba(255,255,255,.98);
  border-bottom:1px solid #dde9e6;
  box-shadow:0 3px 22px rgba(14,53,54,.045);
}
.ec-shell-header .ec-nav{
  height:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
}
.ec-shell-header .brand{
  flex:0 0 auto;
  font-size:22px;
  letter-spacing:-1.1px;
  white-space:nowrap;
  line-height:1.1;
}
.ec-shell-header .navlinks{
  display:flex;
  align-items:center;
  gap:3px;
  margin:0 0 0 auto;
  flex:0 1 auto;
}
.ec-shell-header .navlinks a{
  display:inline-flex;
  align-items:center;
  min-height:42px;
  padding:10px 12px;
  color:#37545b;
  border-radius:10px;
  font-size:13px;
  font-weight:700;
  text-decoration:none;
  white-space:nowrap;
  transition:color .15s ease,background .15s ease;
}
.ec-shell-header .navlinks a:hover,
.ec-shell-header .navlinks a[aria-current="page"]{
  background:#edf7f3;
  color:#0e6b62;
}
.ec-shell-header .navbuttons{
  display:flex;
  align-items:center;
  flex:0 0 auto;
  gap:10px;
  flex-wrap:nowrap;
}
.ec-shell-header .navbuttons #ec-nav-extra{display:none!important}
.ec-shell-header #nav-account{
  order:1;
  color:#26464c;
  background:transparent;
  border:1px solid transparent;
  font-size:13px;
  padding:10px 11px;
  font-weight:720;
  border-radius:12px;
  min-height:42px;
  white-space:nowrap;
}
.ec-shell-header #nav-account:hover{background:#f0f6f3}
.ec-shell-header .navbuttons .ec-language-switch{
  order:2;
  margin:0;
  height:36px;
  border:1px solid #d0e4dd;
  background:#f6faf8;
}
.ec-shell-header #nav-start{
  order:3;
  min-height:42px;
  border-radius:12px;
  padding:11px 17px;
  font-size:13px;
  white-space:nowrap;
  box-shadow:0 4px 13px rgba(19,119,110,.15);
}
.ec-shell-header .ec-menu-toggle{
  display:none;
  order:4;
  flex:none;
  position:relative;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  min-width:44px;
  min-height:44px;
  padding:0;
  border:1px solid #d7e5e1;
  background:#f8fbf9;
  color:#163d40;
  border-radius:12px;
  box-shadow:none;
  touch-action:manipulation;
}
.ec-shell-header .ec-menu-toggle:hover,
.ec-shell-header .ec-menu-toggle[aria-expanded="true"]{
  background:#eaf6f1;
  border-color:#b4d5c9;
}
.ec-menu-lines{display:flex;flex-direction:column;gap:4px;align-items:center}
.ec-menu-lines span{width:18px;height:2px;border-radius:2px;background:#315a5c;display:block}
.ec-shell-header .ec-mobile-panel{
  display:none;
  position:absolute;
  z-index:90;
  top:calc(100% + 8px);
  right:max(15px,calc((100vw - 1190px)/2 + 25px));
  width:min(372px,calc(100vw - 30px));
  max-height:min(78vh,590px);
  overflow:auto;
  padding:12px;
  background:#fff;
  border:1px solid #d7e8e2;
  border-radius:18px;
  box-shadow:0 21px 60px rgba(14,45,46,.16);
}
.ec-shell-header .ec-mobile-panel[hidden]{display:none!important}
.ec-shell-header .ec-mobile-panel a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  min-height:45px;
  padding:12px 14px;
  color:#294c4e;
  border-radius:11px;
  font-size:14px;
  font-weight:670;
  text-decoration:none;
}
.ec-shell-header .ec-mobile-panel a:hover,
.ec-shell-header .ec-mobile-panel a[aria-current="page"]{
  color:#0e6c62;
  background:#f1f8f5;
}
.ec-shell-header .ec-mobile-panel .ec-mobile-divider{height:1px;background:#e6eeea;margin:10px 3px}
.ec-shell-header .ec-mobile-panel .ec-mobile-primary{
  background:#147f78;
  color:white;
  min-height:48px;
  justify-content:center;
  text-align:center;
  font-weight:780;
  margin-top:6px;
}
.ec-shell-header .ec-mobile-panel .ec-mobile-primary:hover{background:#106a64;color:white}
.ec-shell-header .ec-mobile-panel .ec-mobile-secondary{font-weight:720}
.ec-shell-header .ec-menu-toggle:focus-visible,
.ec-shell-header .navlinks a:focus-visible,
.ec-shell-header .navbuttons button:focus-visible,
.ec-shell-header .ec-mobile-panel a:focus-visible{
  outline:3px solid #f0bd64;
  outline-offset:2px;
}
@media(max-width:1120px){
  .ec-shell-header .navlinks{display:none}
  .ec-shell-header .ec-menu-toggle{display:inline-flex}
}
@media(max-width:760px){
  .ec-shell-header{height:66px}
  .ec-shell-header .brand{font-size:20px}
  .ec-shell-header .ec-nav{gap:10px}
  .ec-shell-header .navbuttons{gap:8px}
  .ec-shell-header .navbuttons #nav-account,
  .ec-shell-header .navbuttons #nav-start{display:none!important}
  .ec-shell-header .navbuttons .ec-language-switch{height:34px}
  .ec-shell-header .navbuttons .ec-language-switch button{min-width:29px}
  .ec-shell-header .ec-mobile-panel{display:block}
}
@media(min-width:761px) and (max-width:1120px){
  .ec-shell-header .ec-mobile-panel{display:block}
}
@media(max-width:390px){
  .ec-shell-header .brand{font-size:18px;letter-spacing:-.9px}
  .ec-shell-header .ec-nav{gap:6px}
  .ec-shell-header .navbuttons{gap:6px}
  .ec-shell-header .ec-menu-toggle{width:40px;min-width:40px;height:42px}
}
@media(prefers-reduced-motion:reduce){
  .ec-shell-header .navlinks a{transition:none}
}