/* === Site Customizer Overrides === */
/* Colors reference theme variables from theme-inline.css:
   --global-color-7: #0c152c (navy)
   --global-color-8: #bf992d (gold accent)
   --global-color-9: #3a3a3a (body text)
   --global-color-10: #15274f (dark blue)
   --global-color-11: #F8F2EB (cream)
   --base-3: #ffffff (white)
*/

/* ── Global ── */

html {
    scroll-behavior: smooth;
}

label {
    color: var(--global-color-7);
}

/* ── Gradient & Overlay Components ── */

.background-greadient {
    background-image: linear-gradient(90deg, #192e59 0%, #132447 100%);
}

.background-ovarlay {
    position: relative;
    background-blend-mode: normal;
    background-image: var(--inline-bg-image);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.background-ovarlay::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: rgba(248, 242, 235, 0.8);
}

/* ── Sticky Navigation ── */

.sticky-enabled .main-navigation.is_stuck {
    -webkit-backdrop-filter: saturate(180%) blur(5px);
    backdrop-filter: saturate(180%) blur(5px);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 2px 2px -2px rgba(0, 0, 0, .2);
}

.main-navigation.sticky-navigation-transition .main-nav > ul > li > a,
.sticky-navigation-transition .menu-toggle,
.main-navigation.sticky-navigation-transition .menu-bar-item > a,
.sticky-navigation-transition .navigation-branding .main-title {
    line-height: 46px;
}

.header-wrap #site-navigation:not(.toggled) .main-nav > ul > li > a,
.header-wrap #mobile-header:not(.toggled):not(.navigation-stick) .main-nav > ul > li > a,
.header-wrap .main-navigation:not(.toggled):not(.navigation-stick) .menu-toggle,
.header-wrap .main-navigation:not(.toggled):not(.navigation-stick) .menu-toggle:hover,
.main-navigation:not(.toggled):not(.navigation-stick) .menu-bar-item:not(.close-search) > a {
    line-height: 46px;
}

/* ── Mobile Slideout Menu ── */

#generate-slideout-menu:before {
    position: absolute;
    width: 100%;
    height: 100%;
    content: '';
    background-image: url('images/Menu_background-1.webp');
    background-position: center center;
    background-size: cover;
    opacity: .3;
}

/* ── Menu Item Styles ── */

/* Align first item right */
.main-navigation li:first-child {
    margin-left: auto;
}

/* CTA button — last menu item */
.main-navigation .main-nav > ul > li:last-child > a {
    color: var(--base-3) !important;
    background-color: var(--global-color-8);
    border-radius: 4px;
    margin: 5px 0;
}

.main-navigation .main-nav > ul > li:last-child > a:hover {
    color: var(--base-3);
    background-color: var(--global-color-7) !important;
    border-radius: 4px;
}

.main-navigation .main-nav > ul > li:last-child ul li a {
    background-color: transparent;
}

/* Hover lines on non-CTA items */
.main-navigation .main-nav > ul > li:not(:last-child) {
    position: relative;
}

.main-navigation .main-nav > ul > li:not(:last-child)::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--global-color-8);
    transform: translateY(-5px) scaleX(0);
    opacity: 0;
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.main-navigation .main-nav > ul > li:not(:last-child)::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--global-color-8);
    transform: translateY(5px) scaleX(0);
    opacity: 0;
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.main-navigation .main-nav > ul > li:not(:last-child):hover::before {
    transform: translateY(0) scaleX(1);
    opacity: 1;
}

.main-navigation .main-nav > ul > li:not(:last-child):hover::after {
    transform: translateY(0) scaleX(1);
    opacity: 1;
}

/* Slideout menu CTA item */
li#menu-item-3150 {
    color: var(--base-3);
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-color: var(--global-color-8);
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

li#menu-item-3150:hover {
    background-color: var(--global-color-7) !important;
}

/* ── Desktop Overrides (1025px+) ── */

@media (min-width: 1025px) {
    .main-navigation .main-nav > ul > li:last-child > a {
        color: var(--base-3) !important;
        background-color: var(--global-color-8);
        border-radius: 4px;
        margin: 5px 0;
    }
}

/* ── Mobile & Tablet Overrides (1024px and below) ── */

@media (max-width: 1024px) {
    .main-navigation .main-nav > ul > li:last-child > a {
        background-color: transparent !important;
    }

    .main-navigation .main-nav ul ul li a {
        color: #000 !important;
    }

    .main-navigation .main-nav ul li:not([class*="current-menu-"]):hover > a,
    .main-navigation .main-nav ul li:not([class*="current-menu-"]):focus > a,
    .main-navigation .main-nav ul li.sfHover:not([class*="current-menu-"]) > a,
    .main-navigation .menu-bar-item:hover > a,
    .main-navigation .menu-bar-item.sfHover > a {
        color: var(--base-3) !important;
    }
}

/* ── Mobile Overrides (768px and below) ── */

@media (max-width: 768px) {
    .owl-carousel {
        overflow: hidden;
    }

    .owl-stage {
        display: flex !important;
        align-items: flex-start !important;
    }

    .owl-item {
        box-sizing: border-box;
    }

    .with_frm_style .frm_submit.frm_flex {
        justify-content: center;
    }
}

/* ── Forms ── */

.color-white .with_frm_style .frm_primary_label {
    display: block;
    width: 100%;
    color: white;
}

.frm_style_formidable-style.with_frm_style .form-field {
    margin-bottom: 10px;
}

/* Form submission feedback */
.form-success {
    padding: 20px;
    background: #d4edda;
    color: #155724;
    border-radius: 5px;
    margin-top: 15px;
    text-align: center;
    font-weight: 600;
}

.form-error {
    padding: 20px;
    background: #f8d7da;
    color: #721c24;
    border-radius: 5px;
    margin-top: 15px;
    text-align: center;
}