/* ── Prevent horizontal overflow + fix sticky ── */
html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip !important;
    overflow-y: visible !important;
}

/* ── iOS / Mobile Safari scroll bug fix ── */
body {
    position: relative;
}

/* ==========================================================================
   Header Sticky - Complete Styles
   ========================================================================== */

/* Header Sticky base */
.elementor .Header {
    position: fixed;
    inset-block-start: 0px;
    z-index: 9999;
    display: flex;
    justify-content: center;
    background-color: transparent;
    transition: background-color 0.3s ease, padding-block-start 0.3s ease, padding-block-end 0.3s ease;
}

.elementor .Header.header-scrolled {
    background-color: #FFFFFF;
    padding-bottom: 20px;
    padding-top: 20px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* ── Menu item RESTING color: white in normal (transparent, not-scrolled) mode ── */
/* Fixes legibility against the dark hero gradient overlay - excludes hover/active
   so Elementor's own hover/active color settings can take over cleanly */
.Header:not(.header-scrolled) .elementor-nav-menu > li > a.elementor-item:not(:hover):not(.elementor-item-active):not([aria-expanded="true"]) {
    color: #FFFFFF !important;
    transition: color 0.5s ease;
}

.Header:not(.header-scrolled) .elementor-nav-menu > li > a.elementor-item:not(:hover):not(.elementor-item-active):not([aria-expanded="true"]) .sub-arrow svg {
    fill: #FFFFFF !important;
    transition: fill 0.5s ease;
}

.Header:not(.header-scrolled) .elementor-button,
.Header:not(.header-scrolled) .elementor-button-text {
    color: #FFFFFF !important;
}

.Header:not(.header-scrolled) .elementor-button svg {
    fill: #FFFFFF !important;
}

/* ── Menu item RESTING color: #1C2E4A in sticky mode ── */
.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item {
    color: #1C2E4A !important;
    transition: color 0.5s ease;
}

.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item .sub-arrow svg {
    fill: #1C2E4A !important;
    transition: fill 0.5s ease;
}

/* NOTE: Hover/active colors in NON-sticky mode are intentionally NOT set here.
   They now use whatever hover/active color you configured directly in Elementor. */

/* ── Menu item hover/active color: #4E9FDD when header IS sticky (.header-scrolled) ── */
.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item:hover,
.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item.elementor-item-active,
.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item[aria-expanded="true"] {
    color: #4E9FDD !important;
    transition: color 0.5s ease;
}

.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item:hover::after,
.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item:hover::before,
.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item.elementor-item-active::after,
.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item.elementor-item-active::before {
    background-color: #4E9FDD !important;
    border-color: #4E9FDD !important;
    transition: background-color 0.5s ease, border-color 0.5s ease;
}

.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item:hover .sub-arrow svg,
.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item.elementor-item-active .sub-arrow svg,
.Header.header-scrolled .elementor-nav-menu > li > a.elementor-item[aria-expanded="true"] .sub-arrow svg {
    fill: #4E9FDD !important;
    transition: fill 0.5s ease;
}

/* ── Primary Button Text color: #1C2E4A in sticky mode ── */
.Header.header-scrolled .Nav-Primary-Button-Text {
    color: #1C2E4A !important;
    transition: color 0.5s ease;
}

/* ── Logo hover feedback - only while header is sticky ── */
.Header.header-scrolled .Logo {
    transition: opacity 0.5s ease;
}

.Header.header-scrolled .Logo:hover {
    opacity: 0.8;
}

.Nav-Primary-Button-Icon svg path {
    fill: none !important;
    stroke: #FFFFFF !important;
    transition: stroke 0.5s ease;
}

.Header.header-scrolled .Nav-Primary-Button-Icon svg path {
    stroke: #1C2E4A !important;
}

.Footer-Map iframe {
    border-radius: 3px;
}

/* Secondary Button icon: white in normal mode (fixes Elementor's currentColor bleed) */
.Secondary-Button-Icon svg path {
    fill: none !important;
    stroke: #FFFFFF !important;
    transition: stroke 0.5s ease;
}

/* On hover: icon and text change to #1C2E4A to match the white background */
.Secondary-Button:hover .Secondary-Button-Icon svg path {
    stroke: #1C2E4A !important;
}

.Secondary-Button-Text {
    transition: color 0.5s ease;
}

.Secondary-Button:hover .Secondary-Button-Text {
    color: #1C2E4A !important;
}