/* Reusable two-level navigation behavior for the global Tu Phat header. */
@media (min-width: 901px) {
  .dq-nav .dq-menu > li { position: relative; }
  .dq-nav .dq-menu > li > .sub-menu {
    position: absolute;
    top: calc(100% + 14px);
    left: 0;
    z-index: 90;
    display: grid;
    min-width: 260px;
    margin: 0;
    padding: 10px;
    list-style: none;
    border: 1px solid var(--dq-border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .14);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
  }
  .dq-nav .dq-menu > li:hover > .sub-menu,
  .dq-nav .dq-menu > li:focus-within > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  .dq-nav .sub-menu li { margin: 0; }
  .dq-nav .sub-menu a { display: block; padding: 9px 10px; border-radius: 8px; white-space: nowrap; }
  .dq-nav .sub-menu a:hover,
  .dq-nav .sub-menu a:focus-visible { background: var(--dq-primary-soft); color: var(--dq-primary); }
}

@media (max-width: 900px) {
  .dq-mobile-nav .sub-menu { margin: 8px 0 0 14px; padding: 0; list-style: none; }
  .dq-mobile-nav .sub-menu li { padding-left: 10px; border-left: 2px solid var(--dq-primary-border); }
}