.elementor-kit-4{--e-global-color-primary:#DFAA00;--e-global-color-secondary:#1A1A1A;--e-global-color-text:#333333;--e-global-color-accent:#F5F5F5;--e-global-color-77dd98f:#FFFFFF;--e-global-color-1f3525b:#1A2747;--e-global-typography-primary-font-family:"Playfair Display";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Open Sans";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Open Sans";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-4 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ============================================================
   DRM HEADER — CLEAN VERSION
   Scoped to the header only. No site-wide rules.
   Place in: Theme Builder > Header template > (section) Advanced > Custom CSS
   Using ".elementor-kit-4" targets the header container itself.
   ============================================================ */


/* ---- 1. Header overlaps the hero (transparent at top) ---- */
.elementor-kit-4 {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 999;
    background: transparent;
    transition: background 0.3s ease;
}

.elementor-kit-4 .e-con {
    background: transparent;
    transition: background 0.3s ease;
}


/* ---- 2. Navy background when Elementor Sticky activates ---- *
   This uses Elementor's OWN sticky class — no custom JS, no
   competing .scrolled class. Turn Sticky ON in the header
   section: Advanced > Motion Effects > Sticky = Top.          */
.elementor-kit-4.elementor-sticky--effects,
.elementor-kit-4.elementor-sticky--active {
    background: #0d1b35;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2);
}

.elementor-kit-4.elementor-sticky--active .e-con {
    background: #0d1b35;
}


/* ============================================================
   NAV MENU COLORS
   Default = white.  Active page = gold with underline.
   Kept minimal — set what you can in the Nav Menu widget's
   Style tab; this only handles the active-page gold state,
   which the widget can't always target reliably.
   ============================================================ */

/* Default menu items: white, no underline */
.elementor-kit-4 .elementor-nav-menu > li > a.elementor-item {
    color: #ffffff;
    border-bottom: none;
    padding-bottom: 0;
    background: transparent;
}

/* Menu arrows/icons: white */
.elementor-kit-4 .elementor-nav-menu > li > a .sub-arrow,
.elementor-kit-4 .elementor-nav-menu > li > a i,
.elementor-kit-4 .elementor-nav-menu > li > a svg {
    color: #ffffff;
    fill: #ffffff;
}

/* Active page: gold text + gold underline */
.elementor-kit-4 .elementor-nav-menu > li.current-menu-item > a.elementor-item,
.elementor-kit-4 .elementor-nav-menu > li.current-menu-ancestor > a.elementor-item,
.elementor-kit-4 .elementor-nav-menu > li.current-menu-parent > a.elementor-item {
    color: #D4A017;
    border-bottom: 3px solid #D4A017;
    padding-bottom: 4px;
}

/* Active page arrow: gold */
.elementor-kit-4 .elementor-nav-menu > li.current-menu-ancestor > a .sub-arrow,
.elementor-kit-4 .elementor-nav-menu > li.current-menu-ancestor > a i,
.elementor-kit-4 .elementor-nav-menu > li.current-menu-ancestor > a svg {
    color: #D4A017;
    fill: #D4A017;
}


/* ============================================================
   DESKTOP DROPDOWN  (min-width: 768px)
   ============================================================ */
@media (min-width: 768px) {
    .elementor-kit-4 .elementor-nav-menu .sub-menu {
        background: #0a1628;
        border: 1px solid rgba(255, 255, 255, 0.1);
        border-radius: 8px;
        padding: 10px 0;
        min-width: 220px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    }

    .elementor-kit-4 .elementor-nav-menu .sub-menu li a {
        color: #ffffff;
        padding: 10px 20px;
        font-size: 14px;
        border-bottom: none;
        background: transparent;
    }

    .elementor-kit-4 .elementor-nav-menu .sub-menu li a:hover,
    .elementor-kit-4 .elementor-nav-menu .sub-menu li a:focus {
        background: rgba(255, 255, 255, 0.05);
    }

    .elementor-kit-4 .elementor-nav-menu .sub-menu li.current-menu-item > a {
        color: #D4A017;
    }
}


/* ============================================================
   MOBILE MENU  (max-width: 1024px)
   Full-screen dropdown overlay.
   ============================================================ */
@media (max-width: 1024px) {
    .elementor-kit-4 .elementor-nav-menu--dropdown.elementor-nav-menu__container {
        width: 100vw;
        top: 0;
        left: 0;
        position: fixed;
        height: 100vh;
        margin: 0;
    }

    /* No underline bars on mobile active items */
    .elementor-kit-4 .elementor-nav-menu--dropdown li.current-menu-item > a,
    .elementor-kit-4 .elementor-nav-menu--dropdown li.current-menu-ancestor > a,
    .elementor-kit-4 .elementor-nav-menu--dropdown li.current-menu-parent > a {
        color: #D4A017;
        border-bottom: none;
    }
}


/* ============================================================
   OPTIONAL / TEST SEPARATELY — breadcrumb links non-clickable
   Only keep this if you deliberately want breadcrumb links
   disabled. If breadcrumbs should be clickable, DELETE this.
   Not header-related — consider moving to the page that uses it.
   ============================================================ */
/*
.yoast-breadcrumb a,
.breadcrumb a,
#breadcrumbs a {
    pointer-events: none;
    cursor: default;
}
*//* End custom CSS */