﻿:root {
    --stfm-primary: #1d417b; /* Dark Blue */
    --stfm-secondary: #ef8d2b; /* Orange */
    --stfm-tertiary: #0096D2; /* Bright Blue */
    --stfm-text: #333333;
    --stfm-text-light: #f8f9fa;
    --stfm-light-gray: #f8f9fa;
    --stfm-very-light-blue: #e6f4fa; /* Very light tertiary blue tint */
    --stfm-border-gray: #dee2e6;
    --stfm-heading-font: 'Montserrat', sans-serif;
    --stfm-body-font: 'Open Sans', sans-serif;
}

body {
    font-family: var(--stfm-body-font);
    color: var(--stfm-text);
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--stfm-heading-font);
    font-weight: 700;
    color: var(--stfm-primary);
}

a {
    color: var(--stfm-secondary);
    text-decoration: none;
    transition: color 0.3s ease;
}

    a:hover {
        color: #c87623;
        text-decoration: underline;
    }

.btn-primary.stfm-action-button, .stfm-action-button {
    background-color: var(--stfm-secondary);
    border-color: var(--stfm-secondary);
    color: white !important;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-primary.stfm-action-button:hover, .stfm-action-button:hover {
        background-color: #c87623;
        border-color: #c87623;
        transform: translateY(-2px);
        box-shadow: 0 4px 10px rgba(0,0,0,0.15);
        text-decoration: none;
    }

.btn-outline-primary.stfm-outline-button {
    color: var(--stfm-primary);
    border-color: var(--stfm-primary);
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-outline-primary.stfm-outline-button:hover {
        background-color: var(--stfm-primary);
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
        text-decoration: none;
    }

.bg-light {
    background-color: var(--stfm-light-gray) !important;
}

/* --- SECTION HEADER STYLING (Left Align + Accent) --- */

.section-header {
    margin-bottom: 1.5rem;
    position: relative;
}

.section-title {
    font-size: 2rem;
    font-weight: 700;
    color: var(--stfm-primary);
    text-align: left;
    margin: 0;
    padding-left: 25px;
    position: relative;
    padding-bottom: 0;
}

    .section-title::before {
        content: '';
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 6px;
        height: 65%;
        background-color: var(--stfm-tertiary);
        border-radius: 3px;
    }

    .section-title i {
        font-size: 1.25rem;
        color: var(--stfm-secondary);
        opacity: 0.8;
        transition: transform 0.3s ease;
    }

.section-title-dark-background {
    font-size: 2rem;
    font-weight: 700;
    color: white;
    text-align: left;
    margin: 0;
    padding-left: 25px;
    position: relative;
    padding-bottom: 0;
}

    .section-title-dark-background i {
        font-size: 1.35rem;
        color: var(--stfm-secondary);        
        transition: transform 0.3s ease;
    }

.section-title-dark-background:hover i {
    transform: rotate(15deg) scale(1.1);
}

    .section-title-dark-background::before {
        content: '';
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 6px;
        height: 65%;
        background-color: var(--stfm-tertiary);
        border-radius: 3px;
    }

.section-subtitle {
    display: inline-block;
    position: relative;
    margin: 0 0 0 25px;
    margin-top: 0.5rem;
    padding-top: 0.4rem; /* keeps your fade-out bar visible */

    font-size: 1rem; /* bump it up slightly */
    font-weight: 500; /* a touch heavier */
    line-height: 1.4; /* improve readability */
    letter-spacing: 0.02em; /* just a hint of breathing room */
    color: #495057; /* darker gray for more contrast */
}


    .section-subtitle::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        /* now 100% refers to the subtitle’s own width, not the container */
        width: 100%;
        height: 1px; /* guaranteed to render on all devices */
        /* solid until 80%, then fade out on the right */
        background: linear-gradient( to right, var(--stfm-tertiary) 0%, var(--stfm-tertiary) 80%, transparent 100% );
    }







.content-area {
    padding-top: 1rem;
}

/* --- Header & Navigation --- */
.stfm-header {
    background-color: #ffffff;
}

    .stfm-header .navbar-brand img {
        max-height: 55px;
    }

    .stfm-header .navbar-nav .nav-link {
        color: var(--stfm-primary);
        font-weight: 600;
        padding: 0.8rem 1rem;
    }

        .stfm-header .navbar-nav .nav-link:hover, .stfm-header .navbar-nav .nav-link.active, .stfm-header .navbar-nav .nav-link:focus {
            color: var(--stfm-tertiary);
        }

    .stfm-header .dropdown-menu {
        border: none;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
        border-top: 3px solid var(--stfm-tertiary);
        border-radius: 0 0 0.25rem 0.25rem;
        margin-top: 0.5rem;
    }

    .stfm-header .dropdown-item {
        color: var(--stfm-text);
        font-size: 0.9rem;
        padding: 0.5rem 1.2rem;
    }

        .stfm-header .dropdown-item:hover, .stfm-header .dropdown-item:focus {
            background-color: var(--stfm-light-gray);
            color: var(--stfm-secondary);
        }

.stfm-search-form .form-control {
    font-size: 0.9rem;
    max-width: 180px;
    border-color: var(--stfm-border-gray);
}

.stfm-search-form .btn {
    color: var(--stfm-primary);
    border-color: var(--stfm-border-gray);
}

    .stfm-search-form .btn:hover {
        background-color: var(--stfm-light-gray);
        color: var(--stfm-tertiary);
    }


.highlight-percent {
    color: var(--stfm-primary) !important;
    font-weight: 600;
}

/* Responsive Navigation Menu - Allow Natural Text Wrapping */
.navbar-nav {
    flex-wrap: wrap; /* Allow the nav items themselves to wrap to new lines if needed */
}

    .navbar-nav .nav-link {
        white-space: normal; /* Allow text within each nav item to wrap */
        text-align: left; /* Left justify as requested */
        line-height: 1.3; /* Tighter line height for wrapped text */
        padding: 0.6rem 0.8rem; /* Slightly reduce padding to give more space */
        min-width: 0; /* Allow items to shrink below their content width */
        word-break: break-word; /* Break long words if absolutely necessary */
        hyphens: auto; /* Enable automatic hyphenation for better text flow */
    }

    /* Ensure dropdown toggles still work properly with wrapped text */
    .navbar-nav .dropdown-toggle::after {
        margin-left: 0.5rem;
        vertical-align: middle;
    }

/* On smaller screens, reduce horizontal margins between nav items */
@media (max-width: 1199.98px) {
    .navbar-nav .nav-item {
        margin-left: 0.5rem;
        margin-right: 0.5rem;
    }
}

@media (max-width: 991.98px) {
    .navbar-nav .nav-item {
        margin-left: 0.25rem;
        margin-right: 0.25rem;
    }

    .navbar-nav .nav-link {
        padding: 0.5rem 0.6rem;
        font-size: 0.9rem; /* Slightly smaller text on tablets */
    }
}



/* =============================================== */
/* Top Navigation Bar                              */
/* =============================================== */

.stfm-top-nav {
    background-color: var(--stfm-primary);
    padding: 6px 0;
    position: relative;
    overflow: hidden;
}

    /* Remove any pseudo-elements or patterns */
    .stfm-top-nav::before,
    .stfm-top-nav::after {
        display: none !important;
    }

    .stfm-top-nav .container {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        position: relative;
        z-index: 10;
    }

.stfm-top-nav-items {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.stfm-top-nav .stfm-search-form-top {
    display: flex;
    align-items: center;
    gap: 6px;
}

    .stfm-top-nav .stfm-search-form-top .form-control {
        width: 200px;
        height: 26px;
        padding: 4px 8px;
        font-size: 13px;
        background-color: white !important;
        background-image: none !important;
        border: 1px solid rgba(255, 255, 255, 0.3);
        border-radius: 3px;
        color: var(--stfm-text);
        position: relative;
        z-index: 15;
    }

    .stfm-top-nav .stfm-search-form-top .btn {
        height: 26px;
        width: 26px;
        padding: 0;
        border: 1px solid rgba(255, 255, 255, 0.3);
        background-color: rgba(255, 255, 255, 0.15) !important;
        background-image: none !important;
        color: white;
        border-radius: 3px;
        font-size: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        z-index: 15;
    }

.stfm-top-nav .stfm-action-button {
    height: 26px;
    padding: 4px 12px;
    font-size: 12px;
    line-height: 1.2;
    border-radius: 3px;
    background-image: none !important;
    position: relative;
    z-index: 15;
}

    /* Remove any pseudo-elements from buttons and form elements */
    .stfm-top-nav .stfm-action-button::before,
    .stfm-top-nav .stfm-action-button::after,
    .stfm-top-nav .btn::before,
    .stfm-top-nav .btn::after,
    .stfm-top-nav .form-control::before,
    .stfm-top-nav .form-control::after {
        display: none !important;
    }

@media (max-width: 767.98px) {
    .stfm-top-nav .stfm-search-form-top {
        display: none;
    }
}


/* =============================================== */
/* Responsive Navigation Menu                            */
/* =============================================== */

.navbar-nav {
    flex-wrap: wrap; /* Allow the nav items themselves to wrap to new lines if needed */
}

    .navbar-nav .nav-link {
        white-space: normal; /* Allow text within each nav item to wrap */
        text-align: left; /* Left justify as requested */
        line-height: 1.3; /* Tighter line height for wrapped text */
        padding: 0.6rem 0.8rem; /* Slightly reduce padding to give more space */
        min-width: 0; /* Allow items to shrink below their content width */
        word-break: break-word; /* Break long words if absolutely necessary */
        hyphens: auto; /* Enable automatic hyphenation for better text flow */
    }

    /* Ensure dropdown toggles still work properly with wrapped text */
    .navbar-nav .dropdown-toggle::after {
        margin-left: 0.5rem;
        vertical-align: middle;
    }

.stfm-header .navbar-nav .nav-link {
    font-size: 0.9375rem; /* ~15px */
}

.stfm-header .dropdown-item {
    font-size: 0.875rem; /* ~14px */
}
/* On smaller screens, reduce horizontal margins between nav items */
@media (max-width: 1199.98px) {
    .navbar-nav .nav-item {
        margin-left: 0.5rem;
        margin-right: 0.5rem;
    }
}

@media (max-width: 991.98px) {
    .navbar-nav .nav-item {
        margin-left: 0.25rem;
        margin-right: 0.25rem;
    }

    .navbar-nav .nav-link {
        padding: 0.5rem 0.6rem;
        font-size: 0.9rem; /* Slightly smaller text on tablets */
    }
}

.mb-4-5 {
    margin-bottom: 2rem;
}
.mt-4-5 {
    margin-top: 2rem;
}

.line-spacer {
    display: block;
    margin-bottom: 7px;
}

@media (max-width: 575.98px) {
    #inPageNav {
        display: none;
    }
}

/* Navigation Font Updates - Step 2 */
/* Override main navigation font and remove uppercase */
.navbar-nav.text-uppercase,
.u-main-nav-v3,
.u-main-nav-v3 .nav-link,
.hs-has-mega-menu .nav-link,
.assoc-main-nav-link {
    font-family: var(--stfm-body-font) !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    letter-spacing: 0.02em !important;
}

/* Override mega menu content font */
.hs-mega-menu,
.hs-mega-menu .assoc-mega-menu-header,
.hs-mega-menu .assoc-mega-menu-link,
.assoc-mega-menu-header,
.assoc-mega-menu-link {
    font-family: var(--stfm-body-font) !important;
    text-transform: none !important;
}

/* Top Bar Updates - Step 2 */
/* Style the current top bar to match new design */
.u-header__section--dark {
    background-color: var(--stfm-primary) !important;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}

.u-header__section--dark .quaternary,
.u-header__section--dark a {
    color: white !important;
    text-transform: none !important;
    font-family: var(--stfm-body-font) !important;
    font-size: 12px !important;
}

/* Main Navigation Height and Logo Updates - Step 2 */
/* Reduce main navigation height and logo size */
.u-header__section--light {
    padding-top: 9px !important;
    padding-bottom: 9px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

/* Scale down logo size */
.navbar-brand img {
    height: 42px !important;
    max-height: 42px !important;
}

/* Allow logo to extend slightly beyond navbar padding */
.navbar-brand {
    margin-top: -2px !important;
    margin-bottom: -2px !important;
}

/* Reduce navigation item spacing */
.navbar-nav {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.nav-link {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

/* Mega Menu Dropdown Styling - Step 2 */
/* Style mega menu dropdowns to match new design */
.hs-mega-menu {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    margin-top: 0 !important;
    background-color: white !important;
}

/* Mega menu header styling */
.hs-mega-menu .assoc-mega-menu-header,
.hs-mega-menu .u-header__navbar-brand,
.hs-mega-menu h3,
.hs-mega-menu h4,
.hs-mega-menu .mega-menu-category-header {
    color: var(--stfm-primary) !important;
    font-family: var(--stfm-heading-font) !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    margin-bottom: 12px !important;
    text-transform: none !important;
}

/* Mega menu link styling */
.hs-mega-menu .assoc-mega-menu-link,
.hs-mega-menu a {
    color: var(--stfm-text) !important;
    font-family: var(--stfm-body-font) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    padding: 6px 0 !important;
    display: block !important;
    transition: all 0.3s ease !important;
    text-transform: none !important;
}

.hs-mega-menu .assoc-mega-menu-link:hover,
.hs-mega-menu a:hover {
    color: var(--stfm-secondary) !important;
    text-decoration: none !important;
    padding-left: 8px !important;
}

/* Mega menu column styling */
.hs-mega-menu .col-md-3,
.hs-mega-menu .col-lg-3,
.hs-mega-menu .col-sm-6 {
    padding: 20px 15px !important;
}

/* Mega menu image styling */
.hs-mega-menu img {
    border-radius: 6px !important;
    border: 2px solid var(--stfm-border-gray) !important;
    transition: all 0.3s ease !important;
}

.hs-mega-menu img:hover {
    border-color: var(--stfm-tertiary) !important;
    transform: scale(1.02) !important;
}

/* Navigation link hover states */
.u-main-nav-v3 .nav-link:hover,
.hs-has-mega-menu .nav-link:hover {
    color: var(--stfm-secondary) !important;
    transition: all 0.3s ease !important;
}

/* Active navigation state */
.u-main-nav-v3 .nav-link.active,
.hs-has-mega-menu .nav-link.active {
    color: var(--stfm-tertiary) !important;
    position: relative !important;
}

.u-main-nav-v3 .nav-link.active::after,
.hs-has-mega-menu .nav-link.active::after {
    content: '' !important;
    position: absolute !important;
    bottom: -2px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 80% !important;
    height: 3px !important;
    background-color: var(--stfm-tertiary) !important;
    border-radius: 2px !important;
}

/* Mobile Menu Fixes */
@media (max-width: 991.98px) {
    /* Fix mega menu positioning on mobile */
    .hs-mega-menu {
        position: static !important;
        display: none !important;
        background-color: var(--stfm-light-gray) !important;
        margin: 0 !important;
        padding: 10px 15px !important;
        border-top: 1px solid var(--stfm-border-gray) !important;
        width: 100% !important;
    }
    
    .hs-mega-menu.show {
        display: block !important;
    }
    
    /* Fix mega menu content spacing */
    .hs-mega-menu .row {
        margin: 0 !important;
    }
    
    .hs-mega-menu .col-lg-3,
    .hs-mega-menu .col-lg-4,
    .hs-mega-menu [class*="col-"] {
        width: 100% !important;
        padding: 0 !important;
        margin-bottom: 15px !important;
    }
    
    /* Reduce excessive spacing in mega menu headers */
    .hs-mega-menu .assoc-mega-menu-header {
        font-size: 16px !important;
        margin-bottom: 8px !important;
        color: var(--stfm-primary) !important;
        font-weight: 600 !important;
    }
    
    /* Fix mega menu links spacing */
    .hs-mega-menu .assoc-mega-menu-link {
        font-size: 14px !important;
        padding: 4px 0 !important;
        margin-bottom: 2px !important;
        color: var(--stfm-text) !important;
        display: block !important;
    }
    
    /* Remove excessive margins from mega menu lists */
    .hs-mega-menu ul {
        margin-bottom: 10px !important;
        padding-left: 0 !important;
    }
    
    .hs-mega-menu li {
        margin-bottom: 3px !important;
    }
    
    /* Remove large bottom margins from mega menu content */
    .hs-mega-menu .g-mb-25,
    .hs-mega-menu .g-mb-30 {
        margin-bottom: 10px !important;
    }
}

/* =============================================== */
/* Custom Sticky Header Solution                  */
/* =============================================== */

/* Set CSS custom property for main nav height - used by Jump To component */
:root {
    --main-nav-height: 60px; /* Height when sticky */
    --main-nav-height-static: 76px; /* Height when not sticky */
    --top-bar-height: 36px; /* Top bar height */
}

/* Custom header styling */
.stfm-custom-header {
    position: relative;
}

/* Top bar section - hide when scrolled */
.stfm-custom-header .u-header__section--hidden {
    transition: transform 0.3s ease, opacity 0.3s ease;
    transform: translateY(0);
    opacity: 1;
}

/* Main navigation section - make sticky */
.stfm-custom-header .u-header__section--light {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background-color: white !important;
    transition: all 0.3s ease !important;
    /* Override any HSHeader positioning */
    transform: none !important;
    margin-top: 0 !important;
}

/* When scrolled, hide top bar and enhance main nav shadow */
.stfm-custom-header.header-scrolled .u-header__section--hidden {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

.stfm-custom-header.header-scrolled .u-header__section--light {
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15) !important;
    position: sticky !important;
    top: 0 !important;
}

/* Custom class to track scroll state */
.stfm-custom-header.header-scrolled {
    --main-nav-height: 60px;
}

/* Force override any HSHeader interference - MAXIMUM SPECIFICITY */
html body #stfm-header.stfm-custom-header .u-header__section--light,
html body #stfm-header.stfm-custom-header.header-scrolled .u-header__section--light,
html body header#stfm-header .u-header__section--light {
    position: sticky !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    transform: none !important;
    margin: 0 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    z-index: 1000 !important;
    background-color: white !important;
}

/* Hide logo on iPad and smaller screens to prevent nav wrapping */
@media (max-width: 1180px) {
    #stfm-header .navbar-brand {
        display: none !important;
    }
    
    /* Center navigation when logo is hidden */
    #stfm-header .navbar-collapse {
        justify-content: center !important;
    }
    
    /* Ensure navigation takes full width and space evenly */
    #stfm-header .navbar-nav {
        width: 100% !important;
        justify-content: space-evenly !important;
    }
    
    /* Adjust nav items for better spacing */
    #stfm-header .nav-item {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* Fix mobile hamburger positioning and main nav spacing */
@media (max-width: 991.98px) {
    /* Reduce main nav section padding to minimize white space */
    #stfm-header .u-header__section--light {
        padding-top: 2px !important;
        padding-bottom: 2px !important;
        min-height: auto !important;
    }
    
    /* Position hamburger to stay centered vertically in collapsed state, top in expanded */
    #stfm-header .navbar-toggler {
        position: absolute !important;
        top: 50% !important;
        right: 15px !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
        z-index: 1001 !important;
    }
    
    /* Override hamburger position when menu is expanded to keep it at top */
    #stfm-header .navbar-toggler[aria-expanded="true"] {
        top: 12px !important;
        transform: none !important;
    }
    
    /* Ensure navbar container has minimal height and proper positioning */
    #stfm-header .navbar {
        padding: 4px 0 !important;
        min-height: 40px !important;
        position: relative !important;
    }
    
    /* Hide logo completely on mobile to save space */
    #stfm-header .navbar-brand {
        display: none !important;
    }
    
    /* Ensure expanded menu doesn't affect hamburger position and avoids collision */
    #stfm-header .navbar-collapse {
        padding-top: 10px !important;
        margin-top: 0 !important;
        padding-right: 60px !important; /* Add right padding to avoid hamburger collision */
        clear: both !important;
    }
    
    /* When menu is expanded, adjust navbar to prevent collision */
    #stfm-header .navbar-collapse.show {
        margin-top: 10px !important;
        padding-top: 15px !important;
        border-top: 1px solid #dee2e6 !important;
    }
    
    /* When header is scrolled (sticky) and menu is expanded, adjust positioning to prevent overlay */
    #stfm-header.header-scrolled .navbar-collapse.show {
        position: fixed !important;
        top: var(--main-nav-height, 67px) !important;
        left: 0 !important;
        right: 0 !important;
        background: white !important;
        z-index: 999 !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
        max-height: calc(100vh - var(--main-nav-height, 67px)) !important;
        overflow-y: auto !important;
    }
    
    /* Add padding to body when mobile menu is expanded in sticky mode to push content down */
    body.mobile-menu-open-sticky {
        padding-top: calc(var(--main-nav-height, 67px) + 300px) !important;
    }
    
    /* Mobile mega menu functionality fixes */
    #stfm-header .hs-mega-menu.show {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: static !important;
        width: 100% !important;
        background: #f8f9fa !important;
        box-shadow: none !important;
        margin-top: 10px !important;
        padding: 15px !important;
        border-radius: 5px !important;
    }
    
    /* Mobile sub menu functionality fixes */
    #stfm-header .hs-sub-menu.show {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: static !important;
        width: 100% !important;
        background: #f8f9fa !important;
        box-shadow: none !important;
        margin-top: 10px !important;
        padding: 10px !important;
        border-radius: 5px !important;
    }
    
    /* Remove ALL backgrounds from nav items on mobile - maximum specificity */
    #stfm-header .nav-item > a,
    #stfm-header .nav-item > .nav-link,
    #stfm-header .nav-item.active > a,
    #stfm-header .nav-item.active > .nav-link,
    #stfm-header .nav-item > a.active,
    #stfm-header .nav-item > .nav-link.active,
    #stfm-header .hs-has-mega-menu > a,
    #stfm-header .hs-has-mega-menu > .nav-link,
    #stfm-header .hs-has-mega-menu.open > a,
    #stfm-header .hs-has-mega-menu.open > .nav-link,
    #stfm-header .hs-has-sub-menu > a,
    #stfm-header .hs-has-sub-menu > .nav-link,
    #stfm-header .hs-has-sub-menu.open > a,
    #stfm-header .hs-has-sub-menu.open > .nav-link,
    #stfm-header .navbar-nav .nav-item.active .nav-link,
    #stfm-header .navbar-nav .nav-link.active,
    #stfm-header .navbar-nav .nav-item.active > .nav-link,
    #stfm-header .navbar-nav .nav-item > .nav-link.active {
        background-color: transparent !important;
        background: none !important;
        background-image: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    
    /* Keep only minimal hover styling for mobile nav items */
    #stfm-header .nav-item > a:hover {
        background-color: rgba(0, 0, 0, 0.05) !important;
        border-radius: 3px !important;
    }
}

/* Remove underlines and blue borders from navigation items when hovered/active - all screen sizes */
#stfm-header .nav-link,
#stfm-header .nav-link:hover,
#stfm-header .nav-link:focus,
#stfm-header .nav-link:active,
#stfm-header .hs-has-mega-menu > a,
#stfm-header .hs-has-mega-menu > a:hover,
#stfm-header .hs-has-mega-menu > a:focus,
#stfm-header .hs-has-mega-menu > a:active,
#stfm-header .hs-has-sub-menu > a,
#stfm-header .hs-has-sub-menu > a:hover,
#stfm-header .hs-has-sub-menu > a:focus,
#stfm-header .hs-has-sub-menu > a:active,
#stfm-header .assoc-main-nav-link,
#stfm-header .assoc-main-nav-link:hover,
#stfm-header .assoc-main-nav-link:focus,
#stfm-header .assoc-main-nav-link:active {
    text-decoration: none !important;
    border-bottom: none !important;
    border-top: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Fix mega menu positioning on large screens - align with bottom of main nav */
@media (min-width: 1181px) {
    /* Maximum specificity to override HSMegaMenu JavaScript */
    html body #stfm-header .navbar .hs-mega-menu,
    html body #stfm-header .hs-has-mega-menu .hs-mega-menu,
    html body .navbar .hs-mega-menu {
        top: 100% !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        border-top-left-radius: 0 !important;
        border-top-right-radius: 0 !important;
        transform: none !important;
    }
    
    /* Force positioning with JavaScript-style specificity */
    #stfm-header .navbar .hs-has-mega-menu .hs-mega-menu[style] {
        margin-top: 11px !important;
        top: 100% !important;
    }
}

/* Mobile adjustments */
@media (max-width: 991.98px) {
    :root {
        --main-nav-height: 50px;
        --main-nav-height-static: 60px;
        --top-bar-height: 30px;
    }
    
    #stfm-header.stfm-custom-header .u-header__section--light,
    #stfm-header.stfm-custom-header.header-scrolled .u-header__section--light {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }
}

/* === Search Bar STYLING START === */

/*
 * CSS Overrides for Top Bar Search Dropdown Styling
 */
#siteSearch.u-searchform-v1 {
    /* 1. Removes the "tiny bit of space" from g-mt-10 */
    margin-top: 0 !important;
    /* 2. Changes the "dark border" to a white panel */
    background-color: #ffffff !important;
    /* 3. Overrides g-box-shadow-none and adds a proper dropdown shadow */
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    /* 4. Ensures the padding from g-pa-10 is still applied */
    padding: 0 !important;
    margin-top: 7px !important;
    /* 5. Adds a nice radius to the bottom corners */
    border-radius: 0 0 0.25rem 0.25rem;
    /* 6. Ensures it's wide enough */
    width: 350px !important;
    min-height: 42px !important;
}

/* * Style the 'Go' button to match your site's brand
 */
#siteSearch .btn-primary {
    background-color: var(--stfm-tertiary) !important; /* Your site's dark blue */
    border-color: var(--stfm-tertiary) !important;
    color: white !important;
    min-height: 42px !important;
}

#siteSearch #search-bar-input {
    font-family: var(--stfm-body-font) !important;
    font-size: 14px !important; /* Feel free to adjust this size */
    font-weight: 400 !important;
}

    /* * Optional: Style the placeholder text to match
 */
    #siteSearch #search-bar-input::placeholder {
        font-family: var(--stfm-body-font) !important;
        font-size: 14px !important;
        font-weight: 400 !important;
        color: #6c757d; /* A standard placeholder color */
        opacity: 1; /* Override Firefox's default opacity */
    }


/*
 * CSS Override for Mobile Search Bar Clipping
 * Using manual negative-right positioning
 */
@media (max-width: 767.98px) {
    #siteSearch.u-searchform-v1 {
        width: 90vw !important;
        max-width: 280px !important;
        /* Your override to "slide" the search bar over.
           You can adjust this value as needed. */
        right: -45px !important;
        left: auto !important; /* Ensures right: -45px takes priority */
    }
}

@media (max-width: 480px) {
    #siteSearch.u-searchform-v1 {
        right: -10px !important;
    }
}

/* === Search Bar STYLING END === */



/* === FOOTER STYLING START === */

/* Main Footer Section */
.stfm-footer-main {
    background-color: var(--stfm-primary);
    color: var(--stfm-text-light);
    padding: 3rem 0 2rem 0;
    font-family: var(--stfm-body-font);
}

.stfm-footer-column {
    margin-bottom: 2rem;
}

@media (min-width: 992px) {
    .stfm-footer-column {
        margin-bottom: 0;
    }
}

/* Footer Headings */
.stfm-footer-heading {
    margin-bottom: 1rem;
}

.stfm-footer-title {
    color: var(--stfm-text-light);
    font-family: var(--stfm-heading-font);
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 0;
    letter-spacing: 0.5px;
}

/* Footer Content */
.stfm-footer-content {
    color: var(--stfm-text-light);
    font-size: 0.875rem;
    line-height: 1.6;
}

.stfm-footer-content p {
    margin-bottom: 0.75rem;
    color: var(--stfm-text-light);
}

.stfm-footer-content a {
    color: var(--stfm-secondary);
    text-decoration: none;
    transition: color 0.3s ease;
}

.stfm-footer-content a:hover {
    color: #ffffff;
    text-decoration: underline;
}

/* Force all text elements in footer content to be white */
.stfm-footer-content strong,
.stfm-footer-content b,
.stfm-footer-content span,
.stfm-footer-content em,
.stfm-footer-content i {
    color: var(--stfm-text-light) !important;
}

/* Footer Navigation */
.stfm-footer-nav {
    margin: 0;
}

.stfm-footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.stfm-footer-link-item {
    position: relative;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0.5rem 0;
}

.stfm-footer-link-item:last-child {
    border-bottom: none;
}

.stfm-footer-link {
    color: var(--stfm-text-light);
    text-decoration: none;
    font-size: 0.75rem;
    padding-right: 1.25rem;
    display: block;
    transition: color 0.3s ease;
}

.stfm-footer-link:hover {
    color: var(--stfm-secondary);
    text-decoration: none;
}

/* Footer Social Media */
.stfm-footer-social {
    margin-top: 0.625rem;
}

/* Social Media Icons in Footer Content Area */
.stfm-footer-main .u-icon-v1 {
    display: inline-block !important;
    width: 40px !important;
    height: 40px !important;
    line-height: 38px !important;
    text-align: center !important;
    border-radius: 6px !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--stfm-text-light) !important;
    text-decoration: none !important;
    margin-right: 10px !important;
    margin-bottom: 10px !important;
    transition: all 0.3s ease !important;
}

.stfm-footer-main .u-icon-v1:hover {
    background-color: var(--stfm-secondary) !important;
    color: white !important;
    transform: translateY(-2px) !important;
    text-decoration: none !important;
}

/* Force FontAwesome icons to display in footer */
.stfm-footer-main .u-icon-v1 i[class*="fa-"] {
    font-family: "Font Awesome 6 Brands", "Font Awesome 6 Free" !important;
    font-weight: 400 !important;
    font-size: 18px !important;
    line-height: inherit !important;
    display: inline-block !important;
}

/* Copyright Footer Section */
.stfm-footer-copyright {
    background-color: rgba(29, 65, 123, 0.9);
    color: var(--stfm-text-light);
    padding: 0.625rem 0;
    font-family: var(--stfm-body-font);
}

.stfm-copyright-content {
    text-align: center;
    margin-bottom: 0.625rem;
}

@media (min-width: 768px) {
    .stfm-copyright-content {
        text-align: left;
        margin-bottom: 0;
    }
}

.stfm-copyright-text {
    display: flex;
    justify-content: center;
}

@media (min-width: 992px) {
    .stfm-copyright-text {
        justify-content: flex-start;
    }
}

.stfm-copyright-small {
    font-size: 0.75rem;
    color: var(--stfm-text-light);
    display: block;
    margin-right: 0.625rem;
    margin-bottom: 0.625rem;
}

@media (min-width: 768px) {
    .stfm-copyright-small {
        margin-bottom: 0;
    }
}

.stfm-copyright-link {
    color: var(--stfm-secondary);
    text-decoration: none;
    transition: color 0.3s ease;
}

.stfm-copyright-link:hover {
    color: #ffffff;
    text-decoration: underline;
}

/* Social Media Icons */
.stfm-social-media {
    align-self: center;
}

.stfm-social-icons {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    gap: 0.625rem;
}

@media (min-width: 768px) {
    .stfm-social-icons {
        justify-content: flex-end;
    }
}

.stfm-social-item {
    margin: 0;
}

.stfm-social-link {
    color: rgba(255, 255, 255, 0.5);
    font-size: 1rem;
    transition: color 0.3s ease, transform 0.3s ease;
    display: inline-block;
    padding: 0.3125rem;
}

.stfm-social-link:hover {
    color: var(--stfm-secondary);
    transform: translateY(-2px);
    text-decoration: none;
}

/* === FOOTER STYLING FINISH === */


/* === MAIN NAV FONT AND SPACING STYLING START === */

/*
 * CSS Overrides for Mega Menu Styling
 */

/* 1. Tighten overall padding inside the mega menu panel */
.hs-mega-menu .g-pa-30 {
    padding: 20px !important; /* Was 30px */
}

/* 2. Tighten padding within each column */
.hs-mega-menu .row > [class*="col-"] {
    padding: 15px !important; /* Was 20px 15px */
}

/* 3. Reduce vertical padding on each link */
.hs-mega-menu .assoc-mega-menu-link {
    padding-top: 4px !important; /* Was 6px */
    padding-bottom: 4px !important; /* Was 6px */
    /* 4. Make link text smaller */
    font-size: 12.5px !important; /* Was 14px */
}

/* 5. Reduce space below each list of links (ul) */
.hs-mega-menu .g-mb-25 {
    margin-bottom: 15px !important; /* Was 25px */
}

/* 6. Reduce space between each link (li) */
.hs-mega-menu .g-mb-5 {
    margin-bottom: 2px !important; /* Was 5px */
}

/* === MAIN NAV FONT AND SPACING STYLING START