/* ============================================================
   TD GLOBAL — MOBILE / TABLET NAVIGATION
   One clean mobile drawer. Desktop mega-menu remains untouched.
   This file intentionally loads after the legacy responsive CSS.
   ============================================================ */

@media (max-width: 63.98rem) {
  /* ---------- Header bar ---------- */
  .header {
    position: fixed !important;
    top: max(0.55rem, env(safe-area-inset-top)) !important;
    inset-inline: clamp(0.55rem, 2.5vw, 1rem) !important;
    width: auto !important;
    min-height: 4.25rem !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 0.65rem !important;
    padding: 0.5rem 0.55rem 0.5rem 0.8rem !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    border-radius: 1rem !important;
    background: rgba(3,31,40,.96) !important;
    box-shadow: 0 .8rem 2.6rem rgba(0,17,23,.22) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    backdrop-filter: blur(16px) !important;
    color: #fff !important;
    z-index: 10030 !important;
    overflow: visible !important;
    transform: none !important;
  }

  html[dir="rtl"] .header { padding-inline: 0.55rem 0.8rem !important; }

  .header::before,
  .header::after,
  .header-mega-scrim { display: none !important; }

  .header.is-hidden { transform: none !important; pointer-events: auto !important; }

  .header-logo {
    position: relative !important;
    z-index: 10032 !important;
    width: clamp(6.65rem, 29vw, 8.45rem) !important;
    min-width: 0 !important;
    height: auto !important;
    padding: .25rem .15rem !important;
    justify-content: flex-start !important;
    box-shadow: none !important;
  }

  html[dir="rtl"] .header-logo { justify-content: flex-end !important; }

  .header-logo-inner {
    width: 100% !important;
    max-height: 2.55rem !important;
    object-fit: contain !important;
  }

  .header-nav {
    position: static !important;
    z-index: 10033 !important;
    display: flex !important;
    width: auto !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .42rem !important;
    margin: 0 !important;
    box-shadow: none !important;
  }

  .header-nav::after { display: none !important; }

  .header-mobile-language,
  .header-nav-toggle {
    position: relative !important;
    z-index: 10034 !important;
    width: 2.85rem !important;
    min-width: 2.85rem !important;
    height: 2.85rem !important;
    min-height: 2.85rem !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: .76rem !important;
    background: rgba(255,255,255,.055) !important;
    color: #fff !important;
  }

  .header-mobile-language {
    font: 750 .72rem/1 var(--ff-secondary, Arial, sans-serif) !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
  }

  .header-mobile-language:focus-visible,
  .header-nav-toggle:focus-visible {
    outline: 2px solid #fff !important;
    outline-offset: 2px !important;
    border-color: #ff6842 !important;
  }

  .header-nav-toggle { cursor: pointer !important; }

  /* Remove the legacy desktop corner-border hover decoration from the mobile hamburger. */
  .header-nav-toggle::before,
  .header-nav-toggle::after {
    content: none !important;
    display: none !important;
  }

  .header-nav-toggle-label {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  .header-nav-toggle-icon {
    position: relative !important;
    display: block !important;
    width: 1.18rem !important;
    height: .9rem !important;
    min-width: 0 !important;
    color: currentColor !important;
  }

  .header-nav-toggle-icon::before,
  .header-nav-toggle-icon::after {
    content: "" !important;
    position: absolute !important;
    inset-inline-start: 0 !important;
    width: 100% !important;
    height: 1.5px !important;
    border-radius: 99px !important;
    background: currentColor !important;
    transform-origin: center !important;
    transition: top .26s ease, transform .26s ease, width .26s ease !important;
  }

  .header-nav-toggle-icon::before { top: .15rem !important; }
  .header-nav-toggle-icon::after { top: .66rem !important; width: 72% !important; }
  .header-nav-toggle[aria-expanded="true"] .header-nav-toggle-icon::before { top: .42rem !important; transform: rotate(45deg) !important; }
  .header-nav-toggle[aria-expanded="true"] .header-nav-toggle-icon::after { top: .42rem !important; width: 100% !important; transform: rotate(-45deg) !important; }

  /* ---------- Drawer ---------- */
  .header-nav-wrapper {
    position: fixed !important;
    inset: 0 !important;
    z-index: 10020 !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 100svh !important;
    min-height: 100svh !important;
    max-height: 100svh !important;
    padding:
      calc(max(0px, env(safe-area-inset-top)) + 5.85rem)
      clamp(.95rem, 4vw, 1.5rem)
      calc(max(0px, env(safe-area-inset-bottom)) + 1.15rem) !important;
    overflow-x: clip !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-padding-top: 6.25rem !important;
    border: 0 !important;
    background:
      radial-gradient(circle at 88% 3%, rgba(255,90,47,.14), transparent 20rem),
      radial-gradient(circle at 0 100%, rgba(0,111,145,.17), transparent 25rem),
      linear-gradient(155deg, #031b23 0%, #052e39 55%, #031c24 100%) !important;
    color: #fff !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate3d(0,0,0) !important;
    translate: none !important;
    transition: opacity .22s ease, visibility .22s ease !important;
  }

  .header-nav-wrapper[inert] {
    display: block !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translate3d(0,-.7rem,0) !important;
  }

  html.td-mobile-nav-open .header,
  html.has-mobile-menu-open .header {
    background: rgba(3,31,40,.985) !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .header-nav-shell {
    width: min(100%, 40rem) !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    display: block !important;
  }

  /* ---------- Intro ---------- */
  .header-mobile-intro {
    margin: 0 !important;
    padding: .15rem 0 1rem !important;
    border-bottom: 1px solid rgba(255,255,255,.13) !important;
  }

  .header-mobile-eyebrow {
    display: block !important;
    margin-bottom: .42rem !important;
    color: #ff6842 !important;
    font: 750 .64rem/1 var(--ff-secondary, Arial, sans-serif) !important;
    letter-spacing: .11em !important;
  }

  .header-mobile-intro p {
    max-width: 25rem !important;
    margin: 0 !important;
    color: rgba(255,255,255,.68) !important;
    font: 500 clamp(.82rem, 2.8vw, .96rem)/1.45 var(--ff-secondary, Arial, sans-serif) !important;
  }

  html[dir="rtl"] .header-mobile-eyebrow { letter-spacing: 0 !important; }
  html[dir="rtl"] .header-mobile-intro p { line-height: 1.75 !important; }

  /* ---------- Main nav ---------- */
  .header-nav-body {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    gap: 0 !important;
  }

  .header-mobile-top-link,
  .header-mobile-accordion-toggle {
    width: 100% !important;
    min-height: 3.75rem !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 1.8rem !important;
    align-items: center !important;
    gap: .58rem !important;
    margin: 0 !important;
    padding: .82rem 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.13) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #fff !important;
    text-align: start !important;
    font-family: var(--ff-secondary, Arial, sans-serif) !important;
    font-size: clamp(1.08rem, 4.5vw, 1.35rem) !important;
    font-weight: 680 !important;
    line-height: 1.15 !important;
    letter-spacing: -.02em !important;
    text-decoration: none !important;
    text-transform: none !important;
    cursor: pointer !important;
  }

  html[dir="rtl"] .header-mobile-top-link,
  html[dir="rtl"] .header-mobile-accordion-toggle {
    letter-spacing: 0 !important;
    line-height: 1.55 !important;
  }

  .header-mobile-top-link[aria-current="page"],
  .header-mobile-sub-link[aria-current="page"] { color: #ff7655 !important; }

  .header-mobile-index { display: none !important; }

  .header-mobile-arrow {
    display: grid !important;
    place-items: center !important;
    width: 1.75rem !important;
    height: 1.75rem !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 50% !important;
    color: rgba(255,255,255,.74) !important;
    font-size: .72rem !important;
    flex: 0 0 auto !important;
  }

  .header-mobile-accordion { border: 0 !important; margin: 0 !important; padding: 0 !important; }

  .header-mobile-accordion-toggle svg {
    width: 1rem !important;
    height: 1rem !important;
    justify-self: center !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.5 !important;
    transition: transform .25s ease !important;
  }

  .header-mobile-accordion.is-open > .header-mobile-accordion-toggle svg { transform: rotate(180deg) !important; }

  .header-mobile-accordion-panel {
    max-height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    transform: translateY(-.25rem) !important;
    transition: max-height .34s cubic-bezier(.22,1,.36,1), opacity .18s ease, transform .25s ease !important;
  }

  .header-mobile-accordion.is-open > .header-mobile-accordion-panel {
    max-height: 46rem !important;
    opacity: 1 !important;
    transform: translateY(0) !important;
  }

  .header-mobile-accordion-inner {
    margin: .45rem 0 .6rem .65rem !important;
    padding: .05rem 0 .05rem .72rem !important;
    border-inline-start: 1px solid rgba(255,90,47,.48) !important;
    background: rgba(255,255,255,.018) !important;
  }

  html[dir="rtl"] .header-mobile-accordion-inner {
    margin: .45rem .65rem .6rem 0 !important;
    padding: .05rem .72rem .05rem 0 !important;
  }

  .header-mobile-sub-link {
    width: 100% !important;
    min-height: 3.55rem !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 1.7rem !important;
    align-items: center !important;
    gap: .65rem !important;
    margin: 0 !important;
    padding: .62rem .15rem !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.075) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255,255,255,.93) !important;
    text-decoration: none !important;
  }

  .header-mobile-sub-link:last-child { border-bottom: 0 !important; }

  .header-mobile-sub-copy {
    min-width: 0 !important;
    display: grid !important;
    gap: .16rem !important;
  }

  .header-mobile-sub-copy strong {
    color: inherit !important;
    font-family: var(--ff-secondary, Arial, sans-serif) !important;
    font-size: clamp(.94rem, 3.7vw, 1.08rem) !important;
    font-weight: 680 !important;
    line-height: 1.25 !important;
    letter-spacing: -.01em !important;
  }

  .header-mobile-sub-copy small {
    color: rgba(255,255,255,.48) !important;
    font-family: var(--ff-secondary, Arial, sans-serif) !important;
    font-size: clamp(.68rem, 2.65vw, .78rem) !important;
    font-weight: 450 !important;
    line-height: 1.38 !important;
  }

  html[dir="rtl"] .header-mobile-sub-copy strong,
  html[dir="rtl"] .header-mobile-sub-copy small { line-height: 1.65 !important; letter-spacing: 0 !important; }

  /* ---------- Contact accordion ---------- */
  .header-mobile-contact-inner { display: grid !important; gap: .55rem !important; }

  .header-mobile-office {
    display: grid !important;
    gap: .18rem !important;
    padding: .7rem .75rem !important;
    border: 1px solid rgba(255,255,255,.09) !important;
    border-radius: .7rem !important;
    background: rgba(255,255,255,.03) !important;
  }

  .header-mobile-office span {
    color: #ff7655 !important;
    font-size: .6rem !important;
    font-weight: 800 !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
  }

  .header-mobile-office strong { color:#fff !important; font-size:.84rem !important; line-height:1.35 !important; }
  .header-mobile-office small { color:rgba(255,255,255,.48) !important; font-size:.67rem !important; line-height:1.45 !important; }
  html[dir="rtl"] .header-mobile-office span { letter-spacing:0 !important; text-transform:none !important; }
  html[dir="rtl"] .header-mobile-office strong,
  html[dir="rtl"] .header-mobile-office small { line-height:1.65 !important; }

  .header-mobile-contact-links { display:grid !important; grid-template-columns:1fr !important; gap:.4rem !important; }
  .header-mobile-contact-links a {
    min-height:2.75rem !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:.6rem .7rem !important;
    border:1px solid rgba(255,255,255,.12) !important;
    border-radius:.65rem !important;
    color:#fff !important;
    font-size:.73rem !important;
    text-decoration:none !important;
  }

  /* ---------- Actions: always AFTER the navigation, never floating over it ---------- */
  .header-nav-wrapper .header-mobile-actions {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    margin: 1rem 0 0 !important;
    padding: 1rem 0 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .55rem !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    border-top: 1px solid rgba(255,255,255,.13) !important;
    flex: none !important;
    order: initial !important;
  }

  .header-nav-wrapper .header-mobile-actions a.header-mobile-action {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 3.65rem !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 1.5rem !important;
    align-items: center !important;
    justify-content: stretch !important;
    gap: .7rem !important;
    margin: 0 !important;
    padding: .68rem .8rem !important;
    border-radius: .78rem !important;
    color: #fff !important;
    text-align: start !important;
    text-decoration: none !important;
    font-family: var(--ff-secondary, Arial, sans-serif) !important;
    font-size: inherit !important;
    font-weight: 500 !important;
    line-height: normal !important;
    white-space: normal !important;
  }

  .header-nav-wrapper .header-mobile-action > span:first-child {
    min-width: 0 !important;
    display: grid !important;
    gap: .08rem !important;
  }

  .header-nav-wrapper .header-mobile-action strong {
    display: block !important;
    color: inherit !important;
    font-size: .88rem !important;
    font-weight: 780 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
  }

  .header-nav-wrapper .header-mobile-action small {
    display: block !important;
    color: rgba(255,255,255,.72) !important;
    font-size: .65rem !important;
    font-weight: 480 !important;
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
  }

  .header-nav-wrapper .header-mobile-action--primary {
    border: 1px solid #ff5a2f !important;
    background: #ff5a2f !important;
    color: #fff !important;
  }

  .header-nav-wrapper .header-mobile-action--secondary {
    border: 1px solid rgba(255,255,255,.14) !important;
    background: rgba(255,255,255,.045) !important;
    color: #fff !important;
  }

  html[dir="rtl"] .header-nav-wrapper .header-mobile-action strong,
  html[dir="rtl"] .header-nav-wrapper .header-mobile-action small { line-height:1.6 !important; }

  /* ---------- Very narrow phones ---------- */
  @media (max-width: 23.5rem) {
    .header { inset-inline:.45rem !important; padding-inline:.62rem .45rem !important; gap:.4rem !important; }
    html[dir="rtl"] .header { padding-inline:.45rem .62rem !important; }
    .header-logo { width:6.2rem !important; }
    .header-mobile-language,
    .header-nav-toggle { width:2.65rem !important; min-width:2.65rem !important; height:2.65rem !important; min-height:2.65rem !important; }
    .header-nav-wrapper { padding-inline:.78rem !important; }
    .header-mobile-top-link,
    .header-mobile-accordion-toggle {
      min-height:3.5rem !important;
      grid-template-columns:minmax(0,1fr) 1.65rem !important;
      gap:.48rem !important;
      padding-block:.72rem !important;
      font-size:1.02rem !important;
    }
    .header-mobile-accordion-inner { margin-inline-start:.5rem !important; padding-inline-start:.6rem !important; }
    html[dir="rtl"] .header-mobile-accordion-inner { margin-inline-start:0 !important; margin-inline-end:.5rem !important; padding-inline-start:0 !important; padding-inline-end:.6rem !important; }
    .header-mobile-sub-link { min-height:3.35rem !important; }
    .header-mobile-sub-copy strong { font-size:.9rem !important; }
    .header-mobile-sub-copy small { font-size:.65rem !important; }
  }

  /* ---------- Tablet ---------- */
  @media (min-width: 48rem) {
    .header { inset-inline:clamp(1rem,3vw,2rem) !important; min-height:4.65rem !important; padding-inline:1rem .65rem !important; }
    html[dir="rtl"] .header { padding-inline:.65rem 1rem !important; }
    .header-logo { width:8.8rem !important; }
    .header-mobile-language,
    .header-nav-toggle { width:3.1rem !important; min-width:3.1rem !important; height:3.1rem !important; min-height:3.1rem !important; }
    .header-nav-wrapper { padding-top:calc(max(0px, env(safe-area-inset-top)) + 6.35rem) !important; padding-inline:clamp(2rem,8vw,5rem) !important; }
    .header-nav-shell { width:min(100%,42rem) !important; }
    .header-mobile-top-link,
    .header-mobile-accordion-toggle { min-height:4.2rem !important; font-size:1.35rem !important; }
    .header-mobile-accordion-inner { margin-inline-start:.8rem !important; padding-inline-start:1rem !important; }
    html[dir="rtl"] .header-mobile-accordion-inner { margin-inline-start:0 !important; margin-inline-end:.8rem !important; padding-inline-start:0 !important; padding-inline-end:1rem !important; }
    .header-nav-wrapper .header-mobile-actions { grid-template-columns:1fr 1fr !important; }
  }

  /* ---------- Short landscape ---------- */
  @media (max-height: 31.25rem) and (orientation: landscape) {
    .header { top:max(.3rem, env(safe-area-inset-top)) !important; min-height:3.45rem !important; padding-block:.3rem !important; }
    .header-logo { width:6.55rem !important; }
    .header-mobile-language,
    .header-nav-toggle { width:2.55rem !important; min-width:2.55rem !important; height:2.55rem !important; min-height:2.55rem !important; }
    .header-nav-wrapper { padding-top:calc(max(0px, env(safe-area-inset-top)) + 4.35rem) !important; padding-bottom:calc(max(0px, env(safe-area-inset-bottom)) + .7rem) !important; }
    .header-mobile-intro { display:none !important; }
    .header-mobile-top-link,
    .header-mobile-accordion-toggle { min-height:3.2rem !important; padding-block:.55rem !important; font-size:.98rem !important; }
    .header-mobile-sub-link { min-height:3rem !important; }
    .header-nav-wrapper .header-mobile-actions { grid-template-columns:1fr 1fr !important; }
  }
}

@media (min-width: 64rem) {
  .header-mobile-language { display:none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .header-nav-wrapper,
  .header-mobile-accordion-panel,
  .header-mobile-accordion-toggle svg,
  .header-nav-toggle-icon::before,
  .header-nav-toggle-icon::after { transition-duration:1ms !important; }
}