/**
 * Fix 008 - the full header nav from 1280px instead of 1366px.
 *
 * Elementor shows the full bar (67c70ca) from its desktop breakpoint, 1366px,
 * and the hamburger bar (4dc4457) below it. That put most Windows laptops on
 * the hamburger: a 1920x1080 screen at the default 150% scaling is 1280px wide.
 * Moving the site-wide tablet breakpoint instead would shift the tablet layout
 * of every page (8,666 tablet settings on 102 of 112 pages), so only the
 * header moves.
 *
 * Paired with one setting in header #22: the desktop mega menu (8e2b2ae) has
 * its own Breakpoint set to "None". Left on "Tablet", its script turns it into
 * a click-to-open dropdown below 1366px. That setting alone changes nothing on
 * screen while the bar is hidden there, so this file is the switch.
 * ld-header-nav.js gives the menu hover in the new range.
 *
 * Every rule sits inside a width range, so nothing below 1280px or from 1424px
 * up is affected.
 */

/* 1280-1365px: the full bar instead of the hamburger bar. */
@media (min-width: 1280px) and (max-width: 1365px) {
    .elementor-22 .elementor-element.elementor-element-67c70ca.elementor-hidden-tablet,
    .elementor-22 .elementor-element.elementor-element-7b8bd93.elementor-hidden-tablet {
        display: var(--display, flex);
    }

    .elementor-22 .elementor-element.elementor-element-4dc4457 {
        display: none;
    }
}

/* 1280-1423px: the row fits the window.
 *
 * #mainHeader is a fixed 1377px, centred by overflowing the bar's 1140px inner
 * box. Below about 1424px (1377 + the bar's 32px padding + a 15px scrollbar)
 * that cut the logo off on the left and My Account on the right. Here the row
 * takes the window's width, and the two halves size to their content instead
 * of a fixed 50/50 split, so the buttons never wrap onto two lines. */
@media (min-width: 1280px) and (max-width: 1423px) {
    .elementor-22 .elementor-element.elementor-element-67c70ca > .e-con-inner {
        max-width: 100%;
    }

    .elementor-22 #mainHeader.elementor-element-7b8bd93 {
        --width: 100%;
        width: 100%;
        max-width: 100%;
    }

    .elementor-22 .elementor-element.elementor-element-e760f4f {
        --width: auto;
        width: auto;
        flex: 1 1 auto;
        min-width: 0;
    }

    .elementor-22 .elementor-element.elementor-element-011d7bf {
        --width: auto;
        width: auto;
        flex: 0 0 auto;
    }

    .elementor-22 .elementor-element.elementor-element-87a829a .elementor-button,
    .elementor-22 .elementor-element.elementor-element-cc28a34 .elementor-button {
        white-space: nowrap;
    }
}

/* 1280-1365px: slightly tighter spacing. The row needs about 1283px; at 1280
 * there are about 1233px. Gaps and button padding give back about 68px, and
 * no text or link is removed. */
@media (min-width: 1280px) and (max-width: 1365px) {
    .elementor-22 .elementor-element.elementor-element-e760f4f {
        gap: 24px;
    }

    .elementor-22 .elementor-element.elementor-element-8e2b2ae {
        --n-menu-title-space-between: 0.75rem;
    }

    .elementor-22 .elementor-element.elementor-element-011d7bf {
        gap: 12px;
    }

    .elementor-22 .elementor-element.elementor-element-87a829a .elementor-button,
    .elementor-22 .elementor-element.elementor-element-cc28a34 .elementor-button {
        padding-left: 16px;
        padding-right: 16px;
    }
}
