/* V17 — fixed mega menu alignment and larger boxed navigation */
:root{--v17-nav-box:rgba(255,255,255,.055);--v17-nav-border:rgba(255,255,255,.13)}

/* A clean two-row desktop header gives the larger menu enough room. */
.nav-wrap{
  height:auto!important;
  min-height:142px;
  padding:10px 0 11px;
  display:grid;
  grid-template-columns:minmax(320px,1fr) auto;
  grid-template-areas:"brand actions" "nav nav";
  align-items:center;
  column-gap:20px;
  row-gap:8px;
}
.brand{grid-area:brand;min-width:0!important}
.brand-seal{width:72px!important;height:72px!important;flex:0 0 72px}
.brand-copy strong{font-size:25px!important}
.brand-copy small.brand-lead{font-size:10px!important}
.brand-copy em{font-size:9px!important}
.nav-actions{grid-area:actions;justify-self:end}
.main-nav{
  grid-area:nav;
  width:100%;
  margin:0!important;
  justify-content:center!important;
  gap:7px!important;
  flex-wrap:nowrap;
}
.main-nav>a,.nav-dropdown-toggle{
  min-height:43px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:9px 12px!important;
  border:1px solid var(--v17-nav-border)!important;
  border-radius:10px!important;
  background:var(--v17-nav-box)!important;
  color:#eef4fa!important;
  font-size:14px!important;
  line-height:1.15;
  font-weight:850!important;
  white-space:nowrap;
  transition:background .2s,border-color .2s,color .2s,transform .2s;
}
.main-nav>a:hover,.main-nav>a:focus-visible,.nav-dropdown-toggle:hover,.nav-dropdown.open .nav-dropdown-toggle{
  background:rgba(217,154,49,.17)!important;
  border-color:rgba(242,193,98,.62)!important;
  color:#ffd889!important;
  transform:translateY(-1px);
}
.main-nav a.active:after{display:none!important}
.join-nav{
  background:#fff4df!important;
  color:#9a5b08!important;
  border-color:#fff4df!important;
  padding-inline:17px!important;
}
.join-nav:hover{background:#ffd992!important;color:#07162b!important;border-color:#ffd992!important}
.header-book{font-size:14px!important;min-height:52px!important;padding-inline:21px!important}

/* The menu is viewport-centred, never clipped by the Services button position. */
.service-mega .nav-submenu{
  position:fixed!important;
  top:var(--mega-top,158px)!important;
  left:50vw!important;
  right:auto!important;
  width:min(1040px,calc(100vw - 42px))!important;
  max-height:calc(100vh - var(--mega-top,158px) - 18px);
  overflow:auto;
  transform:translate(-50%,10px)!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
  padding:18px!important;
  border-radius:19px!important;
  border:1px solid #d8dbe2!important;
  border-top:5px solid #d39a37!important;
  box-shadow:0 28px 80px rgba(2,14,28,.32)!important;
  background:#fff!important;
  z-index:2500!important;
}
.service-mega:hover .nav-submenu,.service-mega:focus-within .nav-submenu,.service-mega.open .nav-submenu,.service-mega.pinned .nav-submenu{
  transform:translate(-50%,0)!important;
}
/* Reset the old rotated arrow pseudo-element that caused the vertical text. */
.service-mega .nav-submenu::before{
  content:"Main Practice Areas"!important;
  position:static!important;
  inset:auto!important;
  transform:none!important;
  width:auto!important;
  height:auto!important;
  background:transparent!important;
  border:0!important;
  display:block!important;
  grid-column:1/-1;
  color:#56677d!important;
  font-size:12px!important;
  line-height:1.2;
  font-weight:950!important;
  letter-spacing:.14em!important;
  text-transform:uppercase;
  padding:1px 4px 3px;
  margin:0!important;
}
body.lang-bn .service-mega .nav-submenu::before{content:"প্রধান প্র্যাকটিস এরিয়া"!important;letter-spacing:.04em!important}
.service-mega .nav-submenu button{
  width:100%;
  min-width:0;
  min-height:78px!important;
  padding:13px 15px!important;
  border-radius:14px!important;
  border:1px solid #e2e5eb!important;
  background:#f5f7fb!important;
  color:#102037!important;
  font-size:16px!important;
  line-height:1.25;
  font-weight:850!important;
  box-shadow:none;
  overflow:hidden;
}
.service-mega .nav-submenu button:hover,.service-mega .nav-submenu button:focus{
  background:#fffaf0!important;
  border-color:#dca84d!important;
  color:#7f5417!important;
  transform:translateY(-2px);
  box-shadow:0 10px 25px rgba(7,22,43,.1)!important;
}
.service-mega .nav-submenu button>span{min-width:0;display:flex;align-items:center;gap:12px}
.service-mega .nav-submenu button .mega-icon{width:44px!important;height:44px!important;flex:0 0 44px;margin:0!important}
.service-mega .nav-submenu button i:last-child{flex:0 0 auto}

/* Keep the menu spacious but switch cleanly to the mobile navigation before it becomes cramped. */
@media(max-width:1240px){
  .main-nav>a,.nav-dropdown-toggle{font-size:13px!important;padding-inline:9px!important}
  .brand-seal{width:66px!important;height:66px!important;flex-basis:66px}
  .brand-copy strong{font-size:23px!important}
}
@media(max-width:1120px){
  .nav-wrap{
    min-height:88px;
    padding:7px 0;
    display:flex;
    align-items:center;
  }
  .brand{grid-area:auto}.nav-actions{grid-area:auto;margin-left:auto}.nav-toggle{display:block!important;order:3;margin-left:4px!important}
  .main-nav{
    display:none;
    position:absolute;
    top:100%;left:0;right:0;
    width:100%;
    background:#07162b;
    padding:18px 20px 22px;
    flex-direction:column;
    align-items:stretch;
    gap:8px!important;
    border-top:1px solid rgba(255,255,255,.1);
    box-shadow:0 22px 45px rgba(0,0,0,.25);
  }
  .main-nav.open{display:flex}
  .main-nav>a,.nav-dropdown-toggle{width:100%;justify-content:space-between;font-size:15px!important;min-height:46px;padding:10px 13px!important}
  .nav-dropdown{width:100%;display:block}
  .service-mega .nav-submenu{
    position:static!important;
    top:auto!important;left:auto!important;
    width:100%!important;max-height:360px;
    transform:none!important;
    grid-template-columns:1fr!important;
    margin-top:8px;
    padding:10px!important;
    border:1px solid rgba(255,255,255,.15)!important;
    border-top:1px solid rgba(255,255,255,.15)!important;
    background:#102844!important;
    box-shadow:none!important;
    display:none;
  }
  .service-mega.open .nav-submenu,.service-mega.pinned .nav-submenu{display:grid}
  .service-mega .nav-submenu::before{display:none!important}
  .service-mega .nav-submenu button{min-height:62px!important;background:rgba(255,255,255,.07)!important;color:#fff!important;border-color:rgba(255,255,255,.12)!important;font-size:14px!important}
  .service-mega .nav-submenu button:hover{background:rgba(255,255,255,.13)!important;color:#ffd783!important}
}
@media(max-width:700px){
  .nav-wrap{min-height:132px!important;padding:8px 0 10px!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"brand toggle language" "book book book";gap:8px}
  .brand{grid-area:brand}.nav-toggle{grid-area:toggle;order:initial}.nav-actions{display:contents}.lang-switch{grid-area:language}.header-book{grid-area:book;width:100%;font-size:13px!important}
  .brand-seal{width:55px!important;height:55px!important;flex-basis:55px}.brand-copy strong{font-size:19px!important}.brand-copy small.brand-lead{font-size:8px!important}.brand-copy em{display:none}
}