/* ===== Nav dropdown: About > About Us / Insurance & Payment =====
   Loaded after styles.css. The trigger occupies exactly the box the old "About" link did
   (chevron is absolutely positioned outside it) and the panel is absolute, so opening
   or closing never reflows the header, nav, CTA, or page. */
.nav-item--has-sub { position: relative; }

.nav-dropdown-toggle {
  position: relative;
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: #7D8267;
  font-family: inherit;
  font-size: 0.98rem;
  font-weight: 700;
  line-height: normal;
  letter-spacing: inherit;
  text-transform: inherit;
  text-align: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
.nav-dropdown-toggle svg {
  position: absolute;
  top: 50%;
  left: calc(100% + 5px);
  width: 10px;
  height: 10px;
  margin-top: -5px;
  transition: transform 0.16s ease;
}
.nav-dropdown-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.nav-dropdown-toggle:focus { outline: none; }
.nav-dropdown-toggle:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; border-radius: 3px; }
.nav-dropdown-toggle:hover,
.nav-dropdown-toggle[aria-expanded="true"],
.is-current-parent > .nav-dropdown-toggle { color: #29252B; }

.home .nav-dropdown-toggle {
  color: #7D8267;
  font-size: clamp(0.9375rem, 0.2vw + 0.9rem, 1.0625rem);
  text-shadow: none;
}
.home .nav-dropdown-toggle svg { filter: none; }
.home .nav-dropdown-toggle:hover,
.home .nav-dropdown-toggle[aria-expanded="true"],
.home .is-current-parent > .nav-dropdown-toggle { color: #29252B; }

.nav-sub {
  list-style: none;
  margin: 0;
  padding: 0;
}
.nav-sub[hidden] { display: none !important; }
.nav-sub li { margin: 0; padding: 0; }
.site-nav .nav-list .nav-sub a {
  display: block;
  color: #29252B;
  font-size: 0.94rem;
  font-weight: 600;
  line-height: 1.3;
  text-decoration: none;
  text-shadow: none;
  white-space: nowrap;
}

@media (min-width: 981px) {
  .nav-sub {
    position: absolute;
    top: calc(100% + 14px);
    left: 50%;
    z-index: 60;
    min-width: 208px;
    padding: 6px;
    background: #F8F6F1;
    border: 1px solid rgba(41, 37, 43, 0.12);
    border-radius: 10px;
    box-shadow: 0 10px 28px rgba(41, 37, 43, 0.12);
    transform: translateX(-50%);
    animation: nav-sub-in 0.16s ease;
  }
  .site-nav .nav-list .nav-sub a {
    padding: 9px 12px;
    border-radius: 6px;
  }
  .site-nav .nav-list .nav-sub a:hover,
  .site-nav .nav-list .nav-sub a:focus-visible {
    background: rgba(125, 130, 103, 0.16);
    color: #29252B;
    outline: none;
  }
  .site-nav .nav-list .nav-sub a[aria-current="page"] {
    background: rgba(125, 130, 103, 0.16);
    box-shadow: inset 2px 0 0 #7D8267;
  }
}
@keyframes nav-sub-in {
  from { opacity: 0; transform: translate(-50%, 6px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}

@media (max-width: 980px) {
  .nav-dropdown-toggle svg { left: calc(100% + 6px); }
  .nav-sub {
    margin-top: 0.4rem;
    padding-left: 1rem;
    border-left: 1px solid rgba(125, 130, 103, 0.45);
  }
  .site-nav .nav-list .nav-sub a {
    font-weight: 500;
    padding: 0.6rem 0;
  }
  .site-nav .nav-list .nav-sub a[aria-current="page"] { color: #29252B; }
  .home .site-header.is-open .nav-dropdown-toggle {
    color: #7D8267;
    text-shadow: none;
  }
  .home .site-header.is-open .nav-dropdown-toggle[aria-expanded="true"],
  .home .site-header.is-open .is-current-parent > .nav-dropdown-toggle { color: #29252B; }
}

@media (prefers-reduced-motion: reduce) {
  .nav-sub { animation: none; }
  .nav-dropdown-toggle svg { transition: none; }
}
/* ===== End nav dropdown ===== */
