/**
 * QMT Navigation — Header nav, desktop dropdowns, mobile menu, hamburger.
 * Enqueued by F2 after qmt-shared.css, so these rules override shared defaults.
 */

/* ============================================================
   CURRENT PAGE HIGHLIGHTING
   ============================================================ */
.qmt-nav__link.is-current,
.qmt-mobile-nav__link.is-current {
  color: var(--qmt-off-white);
}

.qmt-nav__link.is-current span::after {
  transform: scaleX(1);
}

.qmt-nav__link.is-current-parent,
.qmt-mobile-nav__link.is-current-parent,
.qmt-nav__toggle.is-current-parent,
.qmt-mobile-nav__toggle.is-current-parent {
  color: var(--qmt-off-white);
}

.qmt-nav__toggle.is-current-parent span::after {
  transform: scaleX(1);
}

/* ============================================================
   DESKTOP NAV — TOP-LEVEL LINKS WITH HOVER UNDERLINE
   ============================================================ */
.qmt-nav__item {
  position: relative;
}

.qmt-nav__item--has-sub {
  position: relative;
}

.qmt-nav__toggle,
.qmt-nav__link {
  font-family: var(--qmt-font-body);
  font-size: clamp(10px, 0.85vw, 12px);
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: none;
  border: none;
  padding: 10px clamp(8px, 1.1vw, 18px);
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  position: relative;
  white-space: nowrap;
  text-decoration: none;
  color: #CFCBC4;
  transition: color 0.25s var(--qmt-ease);
}

.qmt-nav__link {
  display: inline-flex;
}

/* Underline animation for top-level links and toggles */
.qmt-nav__toggle span::after,
.qmt-nav__link span::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  height: 2px;
  background-color: #D4B060;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.25s cubic-bezier(.2,.7,.2,1);
}

.qmt-nav__toggle:hover span::after,
.qmt-nav__toggle:focus-visible span::after,
.qmt-nav__link:hover span::after,
.qmt-nav__link:focus-visible span::after {
  transform: scaleX(1);
}

.qmt-nav__toggle:hover,
.qmt-nav__toggle:focus-visible,
.qmt-nav__link:hover,
.qmt-nav__link:focus-visible {
  color: #FFFFFF;
}

.qmt-nav__toggle:focus-visible,
.qmt-nav__link:focus-visible {
  outline: 2px solid var(--qmt-gold-light);
  outline-offset: 3px;
}

/* Toggle stays highlighted while dropdown is open */
.qmt-nav__item--has-sub.is-open .qmt-nav__toggle {
  color: #FFFFFF;
}

.qmt-nav__item--has-sub.is-open .qmt-nav__toggle span::after {
  transform: scaleX(1);
}

.qmt-nav__caret {
  flex-shrink: 0;
  transition: transform 0.25s var(--qmt-ease);
}

.qmt-nav__item--has-sub.is-open .qmt-nav__caret {
  transform: rotateZ(180deg);
}

/* Invisible hover bridge between trigger and panel */
.qmt-nav__item--has-sub::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 8px;
  pointer-events: none;
}

.qmt-nav__item--has-sub:hover::after,
.qmt-nav__item--has-sub.is-open::after {
  pointer-events: auto;
}

/* Submenu panel — dark card with subtle border */
.qmt-nav__sub {
  position: absolute;
  top: 100%;
  left: 0;
  background: #121214;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 10px;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition:
    opacity 0.18s var(--qmt-ease),
    visibility 0.18s var(--qmt-ease),
    transform 0.18s var(--qmt-ease);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
  z-index: 9010;
  backdrop-filter: none;
  list-style: none;
  padding-left: 0;
}

/* Wider panel for Products (two-column) */
.qmt-nav__sub.qmt-nav__sub--wide {
  min-width: 560px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  grid-auto-flow: row;
}

/* Single-column panels for Partners, Resources */
.qmt-nav__sub:not(.qmt-nav__sub--wide) {
  min-width: 320px;
}

/* Only show the submenu when is-open class is set (JS controls visibility) */
.qmt-nav__item--has-sub.is-open .qmt-nav__sub {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Submenu row items with icon and content */
.qmt-nav__sub-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  background-color: transparent;
  color: #F5F2ED;
  text-decoration: none;
  transition: background-color 0.25s var(--qmt-ease);
  grid-column: auto;
  position: relative;
}

.qmt-nav__sub--wide .qmt-nav__sub-link {
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

.qmt-nav__sub-link:hover,
.qmt-nav__sub-link:focus-visible {
  background-color: rgba(255, 255, 255, 0.05);
}

.qmt-nav__sub-link:focus-visible {
  outline: 2px solid var(--qmt-gold-light);
  outline-offset: -2px;
}

.qmt-nav__sub-link.is-current {
  background-color: rgba(255, 255, 255, 0.05);
}

/* Icon tile */
.qmt-nav__sub-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  transition: border-color 0.25s var(--qmt-ease), color 0.25s var(--qmt-ease);
}

.qmt-nav__sub-link:hover .qmt-nav__sub-icon,
.qmt-nav__sub-link:focus-visible .qmt-nav__sub-icon {
  border-color: rgba(212, 176, 96, 0.5);
  color: #D4B060;
}

.qmt-nav__sub-icon svg {
  width: 20px;
  height: 20px;
  stroke-width: 1.5px;
  color: #E2DED7;
}

.qmt-nav__sub-link:hover .qmt-nav__sub-icon svg,
.qmt-nav__sub-link:focus-visible .qmt-nav__sub-icon svg {
  color: #D4B060;
}

/* Content wrapper for title and description */
.qmt-nav__sub-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
}

.qmt-nav__sub-title {
  font-family: var(--qmt-font-body);
  font-size: 15px;
  font-weight: 600;
  display: block;
  color: #F5F2ED;
  margin: 0;
}

.qmt-nav__sub-desc {
  font-family: var(--qmt-font-body);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
  color: #A8A49C;
  display: block;
  margin: 0;
}

/* Arrow on hover (slides in on the right) */
.qmt-nav__sub-arrow {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity 0.25s var(--qmt-ease), transform 0.25s var(--qmt-ease);
}

.qmt-nav__sub-link:hover .qmt-nav__sub-arrow,
.qmt-nav__sub-link:focus-visible .qmt-nav__sub-arrow {
  opacity: 1;
  transform: translateX(0);
}

/* Footer row for Products panel */
.qmt-nav__sub-footer {
  grid-column: 1 / -1;
  display: flex;
  gap: 24px;
  padding: 10px 12px;
  margin-top: 0;
  position: relative;
}

.qmt-nav__sub-footer::before {
  content: '';
  position: absolute;
  top: -5px;
  left: -10px;
  right: -10px;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.06);
}

.qmt-nav__sub-footer-link {
  font-family: var(--qmt-font-body);
  font-size: 13px;
  font-weight: 400;
  color: #A8A49C;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: color 0.25s var(--qmt-ease);
}

.qmt-nav__sub-footer-link:hover,
.qmt-nav__sub-footer-link:focus-visible {
  color: #F5F2ED;
}

.qmt-nav__sub-footer-link:focus-visible {
  outline: 2px solid var(--qmt-gold-light);
  outline-offset: 2px;
}

/* ============================================================
   HAMBURGER — ICON ANIMATION & LABEL
   ============================================================ */
.qmt-hamburger__label {
  transition: opacity 0.3s var(--qmt-ease);
}

.qmt-hamburger.is-open .qmt-hamburger__label {
  opacity: 0;
}

.qmt-hamburger.is-open::after {
  content: 'Close';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-family: var(--qmt-font-body);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--qmt-text-dim);
}

.qmt-hamburger.is-open:hover::after {
  color: var(--qmt-gold-light);
}

/* Second bar animation for X shape */
.qmt-hamburger.is-open .qmt-hamburger__bar--short {
  opacity: 1;
  width: 100%;
  transform: translateY(-2.5px) rotate(-45deg);
}

/* ============================================================
   MOBILE NAV — ACCORDION MENUS
   ============================================================ */
.qmt-mobile-nav__item--has-sub {
  position: relative;
}

.qmt-mobile-nav__toggle {
  display: flex;
  align-items: baseline;
  gap: 16px;
  width: 100%;
  background: none;
  border: none;
  padding: 16px 0;
  cursor: pointer;
  position: relative;
  text-align: left;
  transition: transform 0.35s var(--qmt-ease);
  color: #E2DED7;
  font: inherit;
}

.qmt-mobile-nav__toggle.is-open {
  color: #D4B060;
}

@media (hover: hover) {
  .qmt-mobile-nav__toggle:hover {
    transform: translateX(6px);
  }
}

.qmt-mobile-nav__toggle:focus-visible {
  outline: 2px solid var(--qmt-gold-light);
  outline-offset: 3px;
}

.qmt-mobile-nav__caret {
  flex-shrink: 0;
  margin-left: auto;
  transition: transform 0.3s var(--qmt-ease);
}

.qmt-mobile-nav__item--has-sub.is-open .qmt-mobile-nav__toggle .qmt-mobile-nav__caret {
  transform: scaleY(-1);
}

/* Mobile submenu — stacked list */
.qmt-mobile-nav__sub {
  max-height: 0;
  overflow: hidden;
  visibility: hidden;
  transition:
    max-height 0.3s var(--qmt-ease),
    visibility 0.3s var(--qmt-ease),
    opacity 0.3s var(--qmt-ease);
  opacity: 0;
  list-style: none;
  margin: 0;
  padding-left: 0;
}

.qmt-mobile-nav__item--has-sub.is-open .qmt-mobile-nav__sub {
  max-height: 500px;
  visibility: visible;
  opacity: 1;
}

.qmt-mobile-nav__sub-link {
  display: block;
  padding: 16px 0 16px 16px;
  color: var(--qmt-text);
  text-decoration: none;
  font-family: var(--qmt-font-body);
  font-size: 16px;
  font-weight: 400;
  transition: color 0.3s var(--qmt-ease);
}

.qmt-mobile-nav__sub-link:hover {
  color: var(--qmt-off-white);
}

.qmt-mobile-nav__sub-link:focus-visible {
  outline: 2px solid var(--qmt-gold-light);
  outline-offset: 3px;
}

.qmt-mobile-nav__sub-link.is-current {
  color: var(--qmt-gold-light);
}

/* ============================================================
   MOBILE OVERLAY SCROLLING FIX
   ============================================================ */
.qmt-mobile-overlay__inner {
  height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.qmt-mobile-overlay__close {
  min-height: 44px;
}

.qmt-hamburger {
  min-height: 44px;
}

/* ============================================================
   MOBILE HAMBURGER POSITION FIX
   ============================================================ */
@media (max-width: 960px) {
  .qmt-hamburger {
    margin-left: auto;
  }
}

/* ============================================================
   MOBILE OVERLAY Z-INDEX FIX & IMPROVEMENTS
   ============================================================ */
.qmt-mobile-overlay {
  z-index: 9100;
  position: fixed;
  inset: 0;
  overflow: hidden;
  contain: paint;
}

/* Prevent horizontal overflow from watermark */
.qmt-overlay__watermark {
  right: 0;
  overflow: hidden;
}

/* ============================================================
   MOBILE NAV STAGGER DELAYS — UP TO 9 ITEMS
   ============================================================ */
.qmt-mobile-overlay.is-open .qmt-mobile-nav__item:nth-child(1) {
  transition-delay: 0.08s;
}

.qmt-mobile-overlay.is-open .qmt-mobile-nav__item:nth-child(2) {
  transition-delay: 0.13s;
}

.qmt-mobile-overlay.is-open .qmt-mobile-nav__item:nth-child(3) {
  transition-delay: 0.18s;
}

.qmt-mobile-overlay.is-open .qmt-mobile-nav__item:nth-child(4) {
  transition-delay: 0.23s;
}

.qmt-mobile-overlay.is-open .qmt-mobile-nav__item:nth-child(5) {
  transition-delay: 0.28s;
}

.qmt-mobile-overlay.is-open .qmt-mobile-nav__item:nth-child(6) {
  transition-delay: 0.33s;
}

.qmt-mobile-overlay.is-open .qmt-mobile-nav__item:nth-child(7) {
  transition-delay: 0.38s;
}

.qmt-mobile-overlay.is-open .qmt-mobile-nav__item:nth-child(8) {
  transition-delay: 0.43s;
}

.qmt-mobile-overlay.is-open .qmt-mobile-nav__item:nth-child(9) {
  transition-delay: 0.48s;
}

/* ============================================================
   MOBILE FORM/INPUT TAP TARGETS & FOCUS
   ============================================================ */
.qmt-form__input:focus-visible,
.qmt-support__input:focus-visible,
.qmt-support__select:focus-visible,
.qmt-support__textarea:focus-visible {
  outline: 2px solid #D4B060;
  outline-offset: 2px;
}

/* ============================================================
   REDUCED MOTION — DISABLE ANIMATIONS & TRANSITIONS
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }

  .qmt-rotation-ui__ring,
  .qmt-rotation-ui__logo,
  .qmt-chart-dot {
    animation: none !important;
  }

  /* Reduced motion only removes movement; open/closed state still applies. */
  .qmt-nav__sub,
  .qmt-mobile-nav__sub {
    transition: none !important;
    transform: none !important;
  }

  .qmt-nav__caret {
    transform: none;
  }

  .qmt-mobile-overlay {
    transition: none;
  }

  .qmt-hamburger__bar,
  .qmt-hamburger__label {
    transition: none;
  }

  .qmt-mobile-nav__item {
    transform: none;
    opacity: 1;
    transition: none;
  }

  .qmt-mobile-overlay__actions {
    transform: none;
    opacity: 1;
    transition: none;
  }
}

/* No divider pipes between top-level items (legacy rule in qmt-shared.css). */
.qmt-nav__list li + li .qmt-nav__link::before {
  display: none;
}

/* Arrow sits top-right in every panel, including the two-column Products grid. */
.qmt-nav__sub-link {
  padding-right: 36px;
}
.qmt-nav__sub-arrow {
  position: absolute;
  top: calc(50% - 8px);
  right: 12px;
}

/* Current page / current section underline must win over the base
   scaleX(0) rule declared later in this file. */
.qmt-header__nav .qmt-nav__link.is-current span::after,
.qmt-header__nav .qmt-nav__link.is-current-parent span::after,
.qmt-header__nav .qmt-nav__toggle.is-current-parent span::after {
  transform: scaleX(1);
}

/* Dropdown triggers share the link underline: give their label a
   positioning context and a full-width underline. */
.qmt-nav__toggle span,
.qmt-nav__link span {
  position: relative;
}
.qmt-nav__toggle span::after,
.qmt-nav__link span::after {
  width: 100%;
}

/* 0.0.20 account controls */
.qmt-header__actions{gap:10px}
.qmt-header__login{min-height:46px;box-sizing:border-box;padding:0 16px;gap:8px;font-size:11px;font-weight:500;letter-spacing:.12em;color:#E2DED7;border:1px solid rgba(255,255,255,.14);background:transparent}
.qmt-header__login .qmt-login__icon{width:12px;height:12px;opacity:.85}
.qmt-header__login:hover,.qmt-header__login:focus-visible{color:#D4B060;border-color:rgba(184,150,46,.45);background:rgba(184,150,46,.06)}
.qmt-header__account-mobile{display:none}
@media (max-width:1080px){.qmt-header__login .qmt-login__text{display:inline}.qmt-header__login{padding:0 12px;gap:6px;border-color:rgba(255,255,255,.14)}}
@media (max-width:960px){.qmt-header__account-mobile{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin-left:auto;margin-right:8px;color:#E2DED7;border:1px solid var(--qmt-border);border-radius:2px;text-decoration:none;transition:color .3s,border-color .3s}.qmt-header__account-mobile:hover{color:#D4B060;border-color:var(--qmt-border-gold)}.qmt-header__account-mobile + .qmt-hamburger{margin-left:0}.qmt-mobile-login{font-size:12px}}
.qmt-mobile-login{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;font-size:12px;font-weight:500;letter-spacing:.14em;color:#E2DED7;border:1px solid rgba(255,255,255,.14);border-radius:2px}
.qmt-mobile-login:hover{color:#D4B060;border-color:rgba(184,150,46,.45)}
@media (max-width:480px){.qmt-mobile-login{width:100%;box-sizing:border-box}}