/* Shared Home Service dropdown + mobile submenu */
.nav-item { position: relative; }
.nav-item > a,
.nav-item > .nav-trigger {
  display: flex; align-items: center; gap: 6px; padding: 22px 0;
  font-size: inherit; font-weight: 600; color: #fff; line-height: 2.22; text-transform: capitalize;
  background: none; border: 0; cursor: pointer; font-family: inherit;
}
.nav-item > a .caret,
.nav-item > .nav-trigger .caret {
  width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent;
  border-top: 5px solid currentColor; margin-top: 2px; transition: .25s;
}
.nav-item:hover > a .caret,
.nav-item:hover > .nav-trigger .caret,
.nav-item.is-open > a .caret,
.nav-item.is-open > .nav-trigger .caret { transform: rotate(180deg); }
.nav-item > a:hover,
.nav-item > a.active,
.nav-item > .nav-trigger:hover,
.nav-item > .nav-trigger.active { color: var(--base); }
.nav-dropdown {
  position: absolute; top: 100%; left: 0; min-width: 230px;
  background: #fff; padding: 10px 0; opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateY(8px); transition: .25s; z-index: 100;
  box-shadow: 0 16px 40px rgba(0,0,0,.18);
}
.nav-item.is-open .nav-dropdown {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0);
}
@media (hover: hover) and (pointer: fine) {
  .nav-item:hover .nav-dropdown {
    opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0);
  }
}
.nav-dropdown a {
  display: block; padding: 10px 18px !important; color: var(--primary) !important;
  font-size: 14px !important; font-weight: 600; line-height: 1.4 !important;
  text-transform: capitalize;
}
.nav-dropdown a:hover, .nav-dropdown a.active {
  background: var(--white2); color: var(--base) !important;
}
.mnav-group { border-bottom: 1px solid #333; }
.mnav-group > button, .mnav-group > a {
  width: 100%; display: flex; justify-content: space-between; align-items: center;
  padding: 12px 0; border: 0; background: none; color: #fff; font-weight: 600;
  font-size: 16px; text-align: left; cursor: pointer; font-family: inherit;
}
.mnav-group > button .caret {
  width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent;
  border-top: 5px solid currentColor; transition: .25s;
}
.mnav-group.open > button .caret { transform: rotate(180deg); }
.mnav-sub { display: none; padding: 0 0 10px 12px; }
.mnav-group.open .mnav-sub { display: block; }
.mnav-sub a {
  display: block; padding: 8px 0; border-bottom: 1px solid #333; font-weight: 500; color: rgba(255,255,255,.8); font-size: 14px;
}
