/* HL mega unify — premium card polish. Desktop only. Keep cards; cut nested chrome. */
@media (min-width: 992px) {
  .hl-mega__body.is-idle,
  .hl-mega__body[hidden] {
    display: none !important;
  }

  .hl-mega.is-l2-open .hl-mega__body:not(.is-idle) {
    display: block !important;
  }

  /* —— OUTER: cold-gray panel; white cards sit on top —— */
  #header .ps-mainmenu__desktop .hl-mega__container,
  #header .ps-mainmenu__desktop .hl-mega__container.container,
  body:not(#cart):not(#checkout) #header .ps-mainmenu__desktop .hl-mega__container {
    padding: 0 !important;
    background: #fbfcfd !important;
    border: 1px solid rgba(20, 30, 40, 0.09) !important;
    border-top: 1px solid rgba(20, 30, 40, 0.07) !important;
    border-radius: 0 0 10px 10px !important;
    box-shadow: 0 14px 34px rgba(20, 30, 40, 0.06) !important;
  }

  /* —— TAB BAR (L2) —— flex like L3: full rows, last row stretches —— */
  #header .ps-mainmenu__desktop .hl-mega__groups,
  .ps-mainmenu__desktop .hl-mega__groups {
    --hl-l2-gap: 9px;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    align-content: flex-start !important;
    grid-template-columns: none !important;
    grid-auto-flow: unset !important;
    grid-auto-rows: unset !important;
    margin: 0 !important;
    padding: 11px 16px !important;
    min-height: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid #e5e7ea !important;
    border-radius: 0 !important;
    gap: 7px var(--hl-l2-gap) !important;
    column-gap: var(--hl-l2-gap) !important;
    row-gap: 7px !important;
    box-shadow: none !important;
  }

  /* Keep measuring mode (natural widths) from ear.css — do not override is-measuring here */

  #header .ps-mainmenu__desktop .hl-mega.is-l2-open .hl-mega__groups,
  .ps-mainmenu__desktop .hl-mega.is-l2-open .hl-mega__groups {
    margin-bottom: 0 !important;
    padding-bottom: 11px !important;
  }

  #header .ps-mainmenu__desktop .hl-mega__group,
  .ps-mainmenu__desktop .hl-mega__group,
  #header .ps-mainmenu__desktop .hl-mega__groups.is-single-row .hl-mega__group,
  #header .ps-mainmenu__desktop .hl-mega__groups.is-two-row .hl-mega__group {
    /* Basis = 1/cols; flex-grow fills incomplete last row (L3-style full width) */
    flex: 1 1 calc((100% - (var(--hl-l2-cols, 5) - 1) * var(--hl-l2-gap, 9px)) / var(--hl-l2-cols, 5)) !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: calc((100% - (var(--hl-l2-cols, 5) - 1) * var(--hl-l2-gap, 9px)) / var(--hl-l2-cols, 5) - 0.25px) !important;
    box-sizing: border-box !important;
    min-height: 44px !important;
    height: 45px !important;
    max-height: 46px !important;
    margin: 0 !important;
    padding: 6px 12px !important;
    border: 1px solid #dfe3e7 !important;
    border-radius: 7px !important;
    background: #ffffff !important;
    box-shadow: none !important;
    align-items: center !important;
    color: #1f2429 !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    transform: none !important;
  }

  /* Measuring: natural widths only (hl-mega-l2.js) */
  #header .ps-mainmenu__desktop .hl-mega__groups.is-measuring,
  .ps-mainmenu__desktop .hl-mega__groups.is-measuring {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
  }

  #header .ps-mainmenu__desktop .hl-mega__groups.is-measuring .hl-mega__group,
  .ps-mainmenu__desktop .hl-mega__groups.is-measuring .hl-mega__group {
    flex: 0 0 auto !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  #header .ps-mainmenu__desktop .hl-mega__group:hover,
  .ps-mainmenu__desktop .hl-mega__group:hover {
    background: #f7f8fa !important;
    border-color: #cfd5db !important;
    box-shadow: none !important;
    color: #1f2429 !important;
    transform: none !important;
  }

  #header .ps-mainmenu__desktop .hl-mega__group.is-active,
  #header .ps-mainmenu__desktop .hl-mega__group.is-l2-active,
  #header .ps-mainmenu__desktop .hl-mega__groups.is-single-row .hl-mega__group.is-active,
  #header .ps-mainmenu__desktop .hl-mega__groups.is-single-row .hl-mega__group.is-l2-active,
  #header .ps-mainmenu__desktop .hl-mega__groups.is-two-row .hl-mega__group.is-active,
  #header .ps-mainmenu__desktop .hl-mega__groups.is-two-row .hl-mega__group.is-l2-active {
    background: #ffffff !important;
    color: #171a1e !important;
    font-weight: 600 !important;
    border: 1px solid #dfe3e7 !important; /* underline is the active signal */
    border-radius: 7px !important;
    box-shadow: none !important;
    transform: none !important;
  }

  #header .ps-mainmenu__desktop .hl-mega__group::before,
  .ps-mainmenu__desktop .hl-mega__group::before {
    content: none !important;
    display: none !important;
  }

  /* Top icon — shared optical box, no mini-card */
  #header .ps-mainmenu__desktop .hl-mega__icon,
  .ps-mainmenu__desktop .hl-mega__icon {
    width: 28px !important;
    height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    flex: 0 0 28px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    object-fit: contain !important;
  }

  #header .ps-mainmenu__desktop .hl-mega__group:hover .hl-mega__icon,
  #header .ps-mainmenu__desktop .hl-mega__group.is-active .hl-mega__icon,
  #header .ps-mainmenu__desktop .hl-mega__group.is-l2-active .hl-mega__icon {
    background: transparent !important;
    border: 0 !important;
    opacity: 1 !important;
  }

  #header .ps-mainmenu__desktop .hl-mega__title,
  #header .ps-mainmenu__desktop .hl-mega__title-text {
    font-size: 13.5px !important;
    font-weight: inherit !important;
    line-height: 1.2 !important;
    color: inherit !important;
  }

  /* —— Kill L4 nested plane —— */
  .hl-mega__stage-l4,
  .hl-mega__stage-l4.is-idle,
  .hl-mega__stage-l4[hidden] {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
  }

  .hl-mega__stage-l3 {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Detail body — inherits cold panel; cards stay white */
  #header .ps-mainmenu__desktop .hl-mega__body,
  .ps-mainmenu__desktop .hl-mega__body {
    padding: 10px 12px 6px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  /* —— ONE card type — 5 columns —— */
  .hl-mega__tile-grid {
    display: grid !important;
    grid-template-columns: repeat(var(--hl-tile-cols, 5), minmax(0, 1fr)) !important;
    column-gap: 9px !important;
    row-gap: 7px !important;
    gap: 7px 9px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: stretch !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .hl-mega__tile-grid[data-count="1"] { --hl-tile-cols: 1; }
  .hl-mega__tile-grid[data-count="2"] { --hl-tile-cols: 2; }
  .hl-mega__tile-grid[data-count="3"] { --hl-tile-cols: 3; }
  .hl-mega__tile-grid[data-count="4"] { --hl-tile-cols: 4; }
  .hl-mega__tile-grid[data-count="5"],
  .hl-mega__tile-grid[data-count="6"],
  .hl-mega__tile-grid[data-count="7"],
  .hl-mega__tile-grid[data-count="8"],
  .hl-mega__tile-grid[data-count="9"],
  .hl-mega__tile-grid[data-count="10"],
  .hl-mega__tile-grid[data-count="11"],
  .hl-mega__tile-grid[data-count="12"],
  .hl-mega__tile-grid[data-count="13"],
  .hl-mega__tile-grid[data-count="14"],
  .hl-mega__tile-grid[data-count="15"],
  .hl-mega__tile-grid[data-count="16"],
  .hl-mega__tile-grid[data-count="17"],
  .hl-mega__tile-grid[data-count="18"],
  .hl-mega__tile-grid[data-count="19"],
  .hl-mega__tile-grid[data-count="20"],
  .hl-mega__tile-grid[data-count="21"],
  .hl-mega__tile-grid[data-count="22"],
  .hl-mega__tile-grid[data-count="23"],
  .hl-mega__tile-grid[data-count="24"],
  .hl-mega__tile-grid[data-count="25"],
  .hl-mega__tile-grid[data-count="26"],
  .hl-mega__tile-grid[data-count="27"],
  .hl-mega__tile-grid[data-count="28"],
  .hl-mega__tile-grid[data-count="29"],
  .hl-mega__tile-grid[data-count="30"],
  .hl-mega__tile-grid[data-count="31"],
  .hl-mega__tile-grid[data-count="32"],
  .hl-mega__tile-grid[data-count="33"],
  .hl-mega__tile-grid[data-count="34"],
  .hl-mega__tile-grid[data-count="35"],
  .hl-mega__tile-grid[data-count="36"] { --hl-tile-cols: 5; }

  .hl-mega__tile {
    min-width: 0 !important;
    display: flex !important;
    height: 100% !important;
  }

  .hl-mega__tile-chips,
  .hl-mega__chip {
    display: none !important;
  }

  .hl-mega__tile-main,
  .ps-mainmenu__desktop a.hl-mega__tile-main,
  #top-menu .hl-mega a.hl-mega__tile-main,
  #top-menu .hl-mega a.hl-mega__tile-main:link,
  #top-menu .hl-mega a.hl-mega__tile-main:visited,
  .hl-mega__link--solo {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    height: auto !important;
    min-height: 46px !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 6px 10px !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    color: #2f353b !important;
    background: #ffffff !important;
    border: 1px solid #dfe3e7 !important;
    border-radius: 7px !important;
    box-shadow: none !important;
    transform: none !important;
    white-space: normal !important;
    overflow: hidden !important;
    transition:
      background-color 150ms ease,
      border-color 150ms ease,
      color 150ms ease !important;
  }

  .hl-mega__tile-main:hover,
  .ps-mainmenu__desktop a.hl-mega__tile-main:hover,
  #top-menu .hl-mega a.hl-mega__tile-main:hover,
  .hl-mega__link--solo:hover {
    background: #f7f8fa !important;
    border-color: rgba(215, 25, 32, 0.22) !important;
    box-shadow: none !important;
    transform: none !important;
    color: #1f2429 !important;
    text-decoration: none !important;
  }

  .hl-mega__tile-main:hover .hl-mega__tile-title,
  .hl-mega__link--solo:hover .hl-mega__tile-title {
    color: #1f2429 !important;
  }

  .hl-mega__tile-main:hover .hl-mega__tile-arrow,
  .hl-mega__link--solo:hover .hl-mega__tile-arrow {
    color: var(--hl-menu-red, #d71920) !important;
    opacity: 1 !important;
    transform: translateX(1px);
  }

  .hl-mega__tile.is-l3-active > .hl-mega__tile-main,
  .hl-mega__tile-main.is-current,
  .hl-mega__tile-main[aria-current="page"] {
    border-color: #c8ced5 !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }

  .hl-mega__tile.is-l3-active > .hl-mega__tile-main .hl-mega__tile-arrow,
  .hl-mega__tile-main.is-current .hl-mega__tile-arrow {
    color: var(--hl-menu-red, #d71920) !important;
    opacity: 1 !important;
  }

  .hl-mega__tile-main:focus-visible,
  .hl-mega__link--solo:focus-visible,
  #header .ps-mainmenu__desktop .hl-mega__group:focus-visible {
    outline: 2px solid rgba(215, 25, 32, 0.45) !important;
    outline-offset: 2px !important;
  }

  /* Icon — shared optical box, no mini-card chrome */
  .hl-mega__tile-thumb {
    flex: 0 0 32px !important;
    width: 32px !important;
    height: 32px !important;
    max-width: 32px !important;
    max-height: 32px !important;
    padding: 2px !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
    box-sizing: border-box !important;
    border-radius: 5px !important;
    background: #f4f5f7 !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .hl-mega__tile-thumb.is-logo,
  .hl-mega__tile-thumb.is-fallback {
    opacity: 0.28;
    background: transparent !important;
    border: 0 !important;
  }

  .hl-mega__tile-title,
  .ps-mainmenu__desktop .hl-mega__tile-title,
  #top-menu .hl-mega .hl-mega__tile-title {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    line-height: 1.18 !important;
    letter-spacing: -0.01em !important;
    color: #2f353b !important;
    text-transform: none !important;
    white-space: normal !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    text-overflow: clip !important;
  }

  .hl-mega__tile-arrow {
    flex: 0 0 14px !important;
    width: 14px !important;
    text-align: right !important;
    color: #6b7280 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    opacity: 0.55 !important;
    transition: transform 140ms ease, color 140ms ease, opacity 140ms ease;
  }

  /* —— FOOTER —— compact text CTA —— */
  .hl-mega__panel-foot,
  #header .ps-mainmenu__desktop .hl-mega__panel-foot {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    margin-top: 6px !important;
    padding: 6px 2px 0 !important;
    min-height: 34px !important;
    height: auto !important;
    border-top: 1px solid #e5e7ea !important;
    background: transparent !important;
  }

  .hl-mega__panel-foot .hl-mega__viewall,
  #header .ps-mainmenu__desktop .hl-mega__panel-foot .hl-mega__viewall {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #2f353b !important;
    text-decoration: none !important;
    transition: color 140ms ease !important;
  }

  .hl-mega__panel-foot .hl-mega__viewall:hover,
  #header .ps-mainmenu__desktop .hl-mega__panel-foot .hl-mega__viewall:hover {
    color: var(--hl-menu-red, #d71920) !important;
  }

  /* Softer watermark on cold-gray panel */
  #header .ps-mainmenu__desktop .hl-mega__body::after {
    opacity: 0.014 !important;
  }
}

/* Narrow desktop: keep usable cards; 4 cols under 1280 */
@media (min-width: 992px) and (max-width: 1279.98px) {
  .hl-mega__tile-grid[data-count="4"],
  .hl-mega__tile-grid[data-count="5"],
  .hl-mega__tile-grid[data-count="6"],
  .hl-mega__tile-grid[data-count="7"],
  .hl-mega__tile-grid[data-count="8"],
  .hl-mega__tile-grid[data-count="9"],
  .hl-mega__tile-grid[data-count="10"],
  .hl-mega__tile-grid[data-count="11"],
  .hl-mega__tile-grid[data-count="12"],
  .hl-mega__tile-grid[data-count="13"],
  .hl-mega__tile-grid[data-count="14"],
  .hl-mega__tile-grid[data-count="15"],
  .hl-mega__tile-grid[data-count="16"],
  .hl-mega__tile-grid[data-count="17"],
  .hl-mega__tile-grid[data-count="18"],
  .hl-mega__tile-grid[data-count="19"],
  .hl-mega__tile-grid[data-count="20"],
  .hl-mega__tile-grid[data-count="21"],
  .hl-mega__tile-grid[data-count="22"],
  .hl-mega__tile-grid[data-count="23"],
  .hl-mega__tile-grid[data-count="24"],
  .hl-mega__tile-grid[data-count="25"],
  .hl-mega__tile-grid[data-count="26"],
  .hl-mega__tile-grid[data-count="27"],
  .hl-mega__tile-grid[data-count="28"],
  .hl-mega__tile-grid[data-count="29"],
  .hl-mega__tile-grid[data-count="30"],
  .hl-mega__tile-grid[data-count="31"],
  .hl-mega__tile-grid[data-count="32"],
  .hl-mega__tile-grid[data-count="33"],
  .hl-mega__tile-grid[data-count="34"],
  .hl-mega__tile-grid[data-count="35"],
  .hl-mega__tile-grid[data-count="36"] { --hl-tile-cols: 4; }

  #header .ps-mainmenu__desktop .hl-mega__groups,
  .ps-mainmenu__desktop .hl-mega__groups {
    padding: 10px 12px !important;
    column-gap: 8px !important;
    row-gap: 6px !important;
  }

  #header .ps-mainmenu__desktop .hl-mega__body,
  .ps-mainmenu__desktop .hl-mega__body {
    padding: 10px 10px 6px !important;
  }
}