/*
 * Header navigation fit
 * ---------------------------------------------------------------------------
 * The top menu grew from five items to seven (Areas We Serve, Blog). At the
 * theme's desktop spacing - 17px links with 22px gaps, next to a 230px logo and
 * the Get In Touch button - the row overflows, so flexbox squeezes each item and
 * the labels break mid-phrase ("About / Us").
 *
 * These rules only apply from 992px up, where the inline navbar is used. Below
 * that the offcanvas drawer is untouched.
 */

@media all and (min-width: 992px) {

    /* Never break a menu label across lines. */
    .navbar .nav-item .nav-link {
        white-space: nowrap;
    }

    /* The nav may shrink; the logo and the button must not. */
    .navbar .offcanvas-body {
        flex-wrap: nowrap;
    }

    .navbar-brand {
        flex: 0 0 auto;
    }

    .navbar .nav-right {
        flex: 0 0 auto;
    }

    .navbar .navbar-nav {
        flex-wrap: nowrap;
    }
}

/* Laptop widths: tighten spacing so seven items still fit on one row. */
@media all and (min-width: 992px) and (max-width: 1399px) {

    .navbar .nav-item .nav-link {
        margin-right: 14px;
        font-size: 15px;
    }

    .navbar-brand img {
        width: 180px;
    }

    .navbar .nav-right .nav-btn .theme-btn {
        padding-left: 18px;
        padding-right: 18px;
        font-size: 14px;
    }
}

/* Narrow laptops are the tightest case - trim a little further. */
@media all and (min-width: 992px) and (max-width: 1199px) {

    .navbar .nav-item .nav-link {
        margin-right: 10px;
        font-size: 14px;
    }

    .navbar-brand img {
        width: 155px;
    }
}

/*
 * Dropdown submenus
 * ---------------------------------------------------------------------------
 * The top menu never had child items before, so the theme's dropdown CSS had
 * never actually run against this navwalker's markup. Two mismatches:
 *
 *   1. The parent <li> is marked `has-dropdown`, not Bootstrap's `dropdown`, so
 *      it never got `position: relative` and the absolutely positioned submenu
 *      anchored itself to a distant ancestor - landing under the logo.
 *   2. Submenu links are output as `class="bb"`, not `dropdown-item`, so every
 *      `.dropdown-item` rule in the theme was inert and the links sat unstyled.
 *
 * Both are corrected here rather than in class-wp-bootstrap-navwalker.php, which
 * is a vendored file.
 */

@media all and (min-width: 992px) {

    .navbar .nav-item.has-dropdown,
    .navbar .nav-item.menu-item-has-children {
        position: relative;
    }

    .navbar .nav-item .dropdown-menu {
        left: 0;
        width: auto;
        min-width: 270px;
        padding: 12px;
    }

    .navbar .nav-item .dropdown-menu > li {
        margin: 0;
        list-style: none;
    }

    .navbar .nav-item .dropdown-menu > li > a {
        display: block;
        white-space: nowrap;
        font-size: 15px;
        font-weight: 500;
        line-height: 1.35;
        padding: 9px 14px;
        margin: 0;
        border-radius: 10px;
        color: var(--color-dark);
        text-transform: capitalize;
        transition: var(--transition2);
    }

    .navbar .nav-item .dropdown-menu > li > a:hover,
    .navbar .nav-item .dropdown-menu > li.current-menu-item > a {
        background: var(--theme-color);
        color: var(--color-white);
    }
}


/* ==== AAO speed tweaks: stop hero slides stacking before Owl Carousel loads (CLS fix) ==== */
.hero-section .owl-carousel:not(.owl-loaded) {
	display: flex;
	overflow: hidden;
}
.hero-section .owl-carousel:not(.owl-loaded) > * {
	flex: 0 0 100%;
	max-width: 100%;
}