/**
 * Header & Footer Overrides
 *
 * Overrides parent brand.css / style.css for modernised header and footer.
 * Pixel-matched from LH staging design, adapted for UKSR branding.
 *
 * Contents:
 *   1. Legacy inline CSS (extracted from parent header.php)
 *   2. Header Bottom Layout
 *   3. Top Bar
 *   4. Partner Bar
 *   5. Logo
 *   6. Main Nav — base link styles (all sizes)
 *   7. Main Nav — desktop layout (min-width: 900px)
 *   8. Footer — Base & Mega Menu
 *   9. Footer — Service Panels
 *  10. Footer — Sitemap & Contact
 *  11. Footer — Language Switcher
 *  12. Footer — Social Icons
 *  13. Footer — Copyright
 *  14. (Moved to hero-homepage.css)
 *  15. Hero — Search overlay
 *  16. Homepage Top Cities
 *  17. Homepage Testimonials (was 15)
 *  18. Homepage Blog
 *
 * @version 1.3.0
 */


/* ================================================================
   1. LEGACY INLINE CSS (from parent header.php)
   ================================================================ */

/* jQuery UI datepicker active state reset */
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
    border: 0;
}

/* WooCommerce booking deposit UI */
.room_single_booking_partial,
.bottom-text {
    display: none;
}

.wc-bookings-booking-cost {
    min-height: 230px;
    height: auto;
}

/* Deposit popup overlay */
.popup {
    position: fixed;
    z-index: 999;
    background: rgba(0, 0, 0, 0.7);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

#popup,
#close {
    cursor: pointer;
}

.popup .popup-parts {
    background: #fff;
    width: 60%;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    padding: 22px;
    border-radius: 13px;
    margin-top: 12%;
}

.kmessage {
    font-size: 18px;
    padding-bottom: 2%;
    color: rgba(0, 0, 0, 0.6);
}

.popup .popup-parts p {
    font-size: 18px;
    text-align: justify;
    margin-top: 0;
}

.popup-parts span {
    position: absolute;
    right: -4px;
    top: -15px;
    font-size: 37px;
}

/* Second popup variant */
.popup1 {
    position: fixed;
    z-index: 999;
    background: rgba(0, 0, 0, 0.7);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

#popup1,
#close1 {
    cursor: pointer;
}

.popup1 .popup-parts1 {
    background: #fff;
    width: 60%;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    padding: 22px;
    border-radius: 13px;
    margin-top: 12%;
}

.popup1 .popup-parts1 p {
    font-size: 18px;
    text-align: justify;
    margin-top: 0;
}

.popup-parts1 span {
    position: absolute;
    right: -4px;
    top: -15px;
    font-size: 37px;
}


/* ================================================================
   2. HEADER BOTTOM LAYOUT
   ================================================================ */

.header_bottom {
    display: block;
    min-height: 132px;
    padding: 30px 0 0 0;
    background-color: var(--uksr-white, #fff);
}

.header_bottom .grid {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: nowrap;       /* was: wrap — prevents nav dropping below logo */
    gap: 24px;
}

.header_bottom .grid__item:first-child {
    display: block;
    flex: 0 0 auto;
    width: auto;
}

.header_bottom .grid__item:last-child {
    display: block;
    flex: 1 1 auto;
    width: auto;
}


/* ================================================================
   3. TOP BAR — Match LH sister site layout
   ================================================================ */

.header_top {
    background-color: var(--uksr-navy, #000032) !important;
    padding: 0.35rem 0;
    font-size: 0.9rem;
    line-height: 1.4;
}

/* Flex layout: contacts left, social+lang right */
.header_top .grid {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
}
.header_top .grid > .grid__item {
    width: auto !important;
    float: none !important;
}
.header_top .grid > .grid__item:last-child {
    display: flex !important;
    align-items: center;
    gap: 16px;
}

/* Contact links — blue to match LH */
.header_top .top_menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
    gap: 16px;
}

.header_top .top_menu ul li {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-right: 0;
    border: none !important;
    background: none !important;
    padding: 0 !important;
    float: none !important;
}

.header_top .top_menu ul li a {
    color: #2294D2;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 400;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color 0.15s ease;
}

.header_top .top_menu ul li a:hover {
    color: #fff;
}

.header_top .top_menu ul li.mail a::before,
.header_top .top_menu ul li.phone a::before {
    margin-right: 0;
}

/* Social icons in top bar — blue, 16px to match LH */
.header_top .header_social {
    display: flex;
    align-items: center;
    gap: 12px;
}
.header_top .header_social a {
    color: #2294D2;
    margin-left: 0;
    font-size: 16px;
    transition: color 0.15s ease;
}
.header_top .header_social a i {
    font-size: 16px !important;
}

.header_top .header_social a:hover {
    color: #fff;
}

/* Language switcher in top bar — clean minimal style like LH */
.header_top .language_option {
    display: inline-flex;
    align-items: center;
    margin-left: 0;
    vertical-align: middle;
}
.header_top .language_option .wpml-ls-legacy-dropdown {
    width: auto !important;
    float: none !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    position: relative;
}

/* WPML dropdown trigger — transparent, no border, flag + chevron */
.header_top .wpml-ls-legacy-dropdown a { color: #fff; }
.header_top .wpml-ls-legacy-dropdown a.js-wpml-ls-item-toggle {
    background: transparent !important;
    border: none !important;
    border-radius: 4px;
    padding: 4px 8px !important;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background 0.15s ease;
}
.header_top .wpml-ls-legacy-dropdown a.js-wpml-ls-item-toggle:hover {
    background: rgba(255,255,255,0.1) !important;
}
/* Flag in trigger */
.header_top .wpml-ls-flag {
    width: 20px; height: 13px; vertical-align: middle; margin-right: 0;
}
/* Hide text label, show just flag */
.header_top .wpml-ls-legacy-dropdown .js-wpml-ls-item-toggle .wpml-ls-native { display: none; }
/* Dropdown trigger chevron — CSS triangle like LH */
.header_top .wpml-ls-legacy-dropdown .js-wpml-ls-item-toggle::after {
    content: '' !important;
    display: inline-block !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    width: 0 !important; height: 0 !important;
    border-left: 4px solid transparent !important;
    border-right: 4px solid transparent !important;
    border-top: 5px solid #fff !important;
    border-bottom: 0 !important;
    margin-left: 4px !important;
    opacity: 0.9;
    vertical-align: middle;
}
/* Dropdown menu — dark navy to match LH, no gap from trigger */
.header_top .wpml-ls-legacy-dropdown ul.wpml-ls-sub-menu {
    background: var(--uksr-navy, #000032) !important;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px; min-width: 160px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    top: 100% !important;
    margin-top: 0 !important;
}
/* Invisible bridge to prevent hover-gap from closing the dropdown */
.header_top .wpml-ls-legacy-dropdown ul.wpml-ls-sub-menu::before {
    content: '';
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    height: 10px;
}
/* Dropdown items — dark bg, white text */
.header_top .wpml-ls-legacy-dropdown .wpml-ls-sub-menu a,
.header_top .wpml-ls-legacy-dropdown .wpml-ls-sub-menu a:link,
.header_top .wpml-ls-legacy-dropdown .wpml-ls-sub-menu a:visited {
    color: #fff !important;
    background: transparent !important;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.header_top .wpml-ls-legacy-dropdown .wpml-ls-sub-menu a:hover {
    background: rgba(255,255,255,0.1) !important;
    color: #fff !important;
}
/* Show full language names in submenu */
.header_top .wpml-ls-legacy-dropdown .wpml-ls-sub-menu .wpml-ls-native { display: inline !important; }

/* Footer language switcher */
#footer_language_list {
    text-align: center;
}
#footer_language_list ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}
#footer_language_list ul li {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #fff;            /* active (non-link) language inherits this */
}
#footer_language_list ul li a {
    color: rgba(255,255,255,0.7);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
}
#footer_language_list ul li a:hover {
    color: #fff;
}


/* ================================================================
   4. PARTNER BAR
   ================================================================ */

.partner-bar {
    background-color: rgb(245, 245, 247);
    border-bottom: 1px solid rgb(226, 227, 234);
    height: 43px;
    padding: 0;
}

.partner-bar__inner {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 20px;
    height: 100%;
}

.partner-bar__label {
    color: rgb(91, 94, 111);
    font-size: 12.8px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1.024px;
}

.partner-bar__logos {
    display: flex;
    gap: 12px;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

.partner-bar__logos li {
    display: flex;
    align-items: center;
}

.partner-bar__logos a {
    display: flex;
    align-items: center;
    transition: opacity 0.2s ease;
}

.partner-bar__logos a:hover {
    opacity: 0.8;
    text-decoration: none;
}

.partner-bar__logos img {
    height: 30px;
    width: auto;
    display: block;
}


/* ================================================================
   5. LOGO
   ================================================================ */

.header .logo img {
    max-height: 77px;
}


/* ================================================================
   6. MAIN NAV — Base link styles (all screen sizes)
   ================================================================ */

.header_nav .nav.top-nav > li > a,
.header_nav ul.nav > li > a,
.header_nav .menu > li > a {
    font-family: 'proxima-nova', sans-serif;
    font-size: 13px !important;
    font-weight: 600;
    text-decoration: none !important;
    text-transform: uppercase;
    letter-spacing: 0;
    color: var(--uksr-nav-text, rgba(0, 0, 50, 0.6));
    background: transparent !important;
    transition: color 0.3s ease !important;
}

.header_nav .nav.top-nav > li > a:hover,
.header_nav .nav.top-nav > li > a:focus,
.header_nav ul.nav > li > a:hover,
.header_nav ul.nav > li > a:focus,
.header_nav .menu > li > a:hover,
.header_nav .menu > li > a:focus {
    color: var(--uksr-navy, #000032) !important;
    text-decoration: none !important;
}

/* Current/active page text color */
.header_nav .nav.top-nav > li.current-menu-item > a,
.header_nav .nav.top-nav > li.current_page_item > a,
.header_nav .menu > li.current-menu-item > a,
.header_nav .menu > li.current_page_item > a {
    color: var(--uksr-navy, #000032);
}


/* ================================================================
   7. MAIN NAV — Desktop layout (≥900px)
      Wrapped in media query to let parent theme mobile nav toggle work.
   ================================================================ */

@media (min-width: 900px) {

    .header_nav {
        display: flex !important;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
        gap: 0;
        padding: 8px 0 !important;
        background: var(--uksr-white, #fff) !important;
    }

    .header_nav ul.nav,
    .header_nav .nav.top-nav,
    .header_nav .menu {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
        gap: 0;
        height: 44px;
        border-top: 1px solid rgb(224, 224, 224);
        border-bottom: 1px solid rgb(224, 224, 224);
        background-color: var(--uksr-white, #fff);
        box-shadow: rgba(0, 0, 0, 0.05) 0px 2px 4px 0px;
    }

    .header_nav .nav.top-nav > li,
    .header_nav ul.nav > li,
    .header_nav .menu > li {
        display: inline-flex !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
        position: relative;
    }

    .header_nav .nav.top-nav > li > a,
    .header_nav ul.nav > li > a,
    .header_nav .menu > li > a {
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        padding: 0 16px;
        margin: 0;
        line-height: 1.2;
        height: 42px;
        box-sizing: border-box;
    }

    /* Animated gradient underline */
    .header_nav .nav.top-nav > li > a::after,
    .header_nav ul.nav > li > a::after,
    .header_nav .menu > li > a::after {
        content: '';
        position: absolute;
        bottom: -1px;
        left: 0;
        right: 0;
        width: 100%;
        height: 3px;
        background: linear-gradient(90deg, var(--uksr-magenta, #E6007E) 0%, var(--uksr-dark-blue, #29235C) 100%);
        border-radius: 3px 3px 0 0;
        transform: scaleX(0);
        transform-origin: center;
        transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    }

    /* Hover underline — 50% width preview */
    .header_nav .nav.top-nav > li > a:hover::after,
    .header_nav ul.nav > li > a:hover::after,
    .header_nav .menu > li > a:hover::after {
        transform: scaleX(0.5);
    }

    /* Focus state for accessibility */
    .header_nav .nav.top-nav > li > a:focus-visible,
    .header_nav ul.nav > li > a:focus-visible,
    .header_nav .menu > li > a:focus-visible {
        outline: 2px solid var(--uksr-cyan, #6ACAF3);
        outline-offset: 2px;
        border-radius: var(--uksr-radius-sm, 4px);
    }

    /* Current/active page — full underline */
    .header_nav .nav.top-nav > li.current-menu-item > a::after,
    .header_nav .nav.top-nav > li.current_page_item > a::after,
    .header_nav ul.nav > li.current-menu-item > a::after,
    .header_nav ul.nav > li.current_page_item > a::after,
    .header_nav .menu > li.current-menu-item > a::after,
    .header_nav .menu > li.current_page_item > a::after {
        transform: scaleX(1);
    }

    /* ── SEARCH ICON — magnifying glass (replaces "Search" text) ── */

    .header_nav .nav.top-nav > li.menu-item-search > a,
    .header_nav ul.nav > li.menu-item-search > a,
    .header_nav .menu > li.menu-item-search > a {
        font-size: 0 !important;
        color: transparent !important;
        overflow: hidden;
        width: 42px;
        padding: 0 !important;
        position: relative;
    }

    .header_nav .nav.top-nav > li.menu-item-search > a::before,
    .header_nav ul.nav > li.menu-item-search > a::before,
    .header_nav .menu > li.menu-item-search > a::before {
        content: '';
        display: block;
        width: 18px;
        height: 18px;
        margin: 0 auto;
        background: currentColor;
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M15.5 14h-.79l-.28-.27a6.5 6.5 0 1 0-.71.71l.27.28v.79l4.25 4.25a1 1 0 0 0 1.42-1.42L15.5 14Zm-6 0a4.5 4.5 0 1 1 0-9 4.5 4.5 0 0 1 0 9Z' fill='currentColor'/%3E%3C/svg%3E");
        -webkit-mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M15.5 14h-.79l-.28-.27a6.5 6.5 0 1 0-.71.71l.27.28v.79l4.25 4.25a1 1 0 0 0 1.42-1.42L15.5 14Zm-6 0a4.5 4.5 0 1 1 0-9 4.5 4.5 0 0 1 0 9Z' fill='currentColor'/%3E%3C/svg%3E");
        mask-size: contain;
        mask-repeat: no-repeat;
        color: var(--uksr-nav-text, rgba(0, 0, 50, 0.6));
    }

    .header_nav .nav.top-nav > li.menu-item-search > a:hover::before,
    .header_nav ul.nav > li.menu-item-search > a:hover::before,
    .header_nav .menu > li.menu-item-search > a:hover::before {
        color: var(--uksr-navy, #000032);
    }

    /* No gradient underline on search icon */
    .header_nav .nav.top-nav > li.menu-item-search > a::after,
    .header_nav ul.nav > li.menu-item-search > a::after,
    .header_nav .menu > li.menu-item-search > a::after {
        display: none;
    }

    /* ── CTA PILL BUTTON — Last nav item ── */

    .header_nav .nav.top-nav > li:last-child > a,
    .header_nav ul.nav > li:last-child > a,
    .header_nav .menu > li:last-child > a {
        border-radius: 9999px;
        box-shadow: rgba(230, 0, 126, 0.45) 0px 0px 12px 0px;
        background: transparent !important;
        color: rgb(0, 0, 50) !important;
        font-weight: 700;
        padding: 0.65rem 1.4rem;
    }

    .header_nav .nav.top-nav > li:last-child > a:hover,
    .header_nav .nav.top-nav > li:last-child > a:focus,
    .header_nav ul.nav > li:last-child > a:hover,
    .header_nav ul.nav > li:last-child > a:focus,
    .header_nav .menu > li:last-child > a:hover,
    .header_nav .menu > li:last-child > a:focus {
        background: transparent !important;
        color: var(--uksr-magenta, #E6007E) !important;
        box-shadow: rgba(230, 0, 126, 0.6) 0px 0px 18px 0px;
        opacity: 0.9;
    }

    /* No underline on CTA */
    .header_nav .nav.top-nav > li:last-child > a::after,
    .header_nav ul.nav > li:last-child > a::after,
    .header_nav .menu > li:last-child > a::after {
        display: none;
    }

} /* end @media (min-width: 900px) */


/* ================================================================
   8. FOOTER — Base & Mega Menu
   ================================================================ */

.uksr-enhanced-footer {
    background-color: var(--uksr-navy, #000032);
    color: var(--uksr-white, #fff);
    font-family: var(--uksr-font-primary);
}

.footer-mega-menu {
    display: block;
    padding: 60px 0 40px;
    border-bottom: 2px solid rgba(177, 203, 12, 0.2);
    background: linear-gradient(#000000 0%, #000032 100%) !important;
}

.footer-mega-menu .wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0;
}


/* ================================================================
   9. FOOTER — Service Panels
   ================================================================ */

.footer-service-panel {
    display: flex;
    flex-direction: column;
    flex: 1 1 calc(33.333% - 23px);
    min-width: 220px;
    box-sizing: border-box;
    padding: 0 0 0 20px;
    background: transparent;
    border-left: 4px solid var(--uksr-green, #B1CB0C);
    border-radius: 0;
    transition: background-color 0.3s ease;
}

.footer-service-panel:hover {
    background: transparent;
}

/* Brand-coloured left borders */
.footer-service-panel--uksr {
    border-left-color: var(--uksr-green, #B1CB0C);
}

.footer-service-panel--lh {
    border-left-color: #2294D2;
}

.footer-service-panel--ukse {
    border-left-color: var(--uksr-orange, #EE7218);
}

/* Panel logos — match LH: constrained 180px, 24px gap below to links */
.footer-service-panel__logo {
    max-height: 50px !important;
    height: 50px !important;
    max-width: 180px !important;
    width: auto !important;
    margin: 0 0 24px !important;
    padding: 0 !important;
    display: block !important;
    object-fit: contain !important;
    object-position: left center !important;
}

/* Panel titles — brand-coloured headings matching LH (58px tall) */
.footer-service-panel__title {
    font-size: 20.8px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 27px;
    min-height: 58px;
    margin: 0 0 15px;
    padding: 0;
    display: flex;
    align-items: center;
}
.footer-service-panel--uksr .footer-service-panel__title {
    color: var(--uksr-green, #B1CB0C);
}
.footer-service-panel--lh .footer-service-panel__title {
    color: #2294D2;
}
.footer-service-panel--ukse .footer-service-panel__title {
    color: var(--uksr-orange, #EE7218);
}

/* Description hidden — LH doesn't show them */
.footer-service-panel__desc {
    display: none;
}

/* Panel links */
.footer-service-panel__links {
    list-style: none !important;
    margin: 0 0 25px !important;
    padding: 0 !important;
    flex: 1 1 0%;
}

.footer-service-panel__links li {
    list-style: none !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
}

.footer-service-panel__links li::before {
    content: none !important;
    display: none !important;
}

.footer-service-panel__links a {
    display: block !important;
    color: var(--uksr-white, #fff) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 22.4px !important;
    text-decoration: none !important;
    padding: 6px 0 !important;
    border-bottom: 1px solid transparent !important;
    transition: all 0.3s ease !important;
}

/* Hover — simple color change like LH */
.footer-service-panel__links a:hover,
.footer-service-panel__links a:focus {
    color: #2294D2 !important;
    border-bottom-color: transparent !important;
    padding-left: 0 !important;
    text-decoration: none !important;
}

/* CTA buttons — brand-coloured borders */
.footer-service-panel__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    background: transparent;
    border: 2px solid var(--uksr-green, #B1CB0C);
    border-radius: var(--uksr-radius-md, 8px);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: center;
    transition: all 0.3s ease;
    margin-top: auto;
    align-self: flex-start;
}

.footer-service-panel__cta:hover,
.footer-service-panel__cta:focus {
    background: transparent;
    text-decoration: none;
    transform: translateY(-2px);
}

/* All panel CTAs — blue text, brand-coloured borders (match LH) */
.footer-service-panel__cta {
    color: #2294D2;
}
.footer-service-panel__cta:hover,
.footer-service-panel__cta:focus {
    color: #2294D2;
}

/* UKSR panel CTA — green border */
.footer-service-panel--uksr .footer-service-panel__cta {
    border-color: var(--uksr-green, #B1CB0C);
}

/* LH panel CTA — blue border */
.footer-service-panel--lh .footer-service-panel__cta {
    border-color: #2294D2;
}

/* UKSE panel CTA — orange border */
.footer-service-panel--ukse .footer-service-panel__cta {
    border-color: var(--uksr-orange, #EE7218);
}


/* ================================================================
   10. FOOTER — Sitemap & Contact (LH parity: 2-col flex layout)
   ================================================================ */

.uksr-enhanced-footer .footer-top {
    padding: 40px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(0, 0, 50, 0.8);
}

.uksr-enhanced-footer .footer-top .wrap {
    display: flex;
    gap: 48px;
    flex-wrap: wrap;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

/* Both columns match LH: flex: 1 1 280px, max-width: 400px */
.footer-sitemap,
.footer-contact {
    flex: 1 1 280px;
    max-width: 400px;
}

.footer-sitemap h4,
.footer-contact h4 {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--uksr-white, #fff) !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 20px;
}

/* Sitemap: single column list, blue links, no bullets — match LH */
.footer-sitemap__grid {
    display: flex;
    flex-direction: column;
    gap: 0;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.footer-sitemap__grid li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.footer-sitemap__grid li::before,
.footer-sitemap__grid li::marker {
    content: none !important;
    display: none !important;
}

.footer-sitemap a {
    color: #2294D2;
    text-decoration: none;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
    transition: color 0.15s ease;
}

.footer-sitemap a:hover {
    color: #fff;
}

/* Useful Information: labeled sections — match LH's 16px gap between items */
.footer-contact p {
    color: rgba(255, 255, 255, 0.85);
    font-size: 16px;
    line-height: 24px;
    margin: 0 0 4px;
    text-align: left !important;
}
.footer-contact p.footer-contact__label {
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    margin: 20px 0 8px;
}
.footer-contact p.footer-contact__label:first-of-type {
    margin-top: 0;
}

.footer-contact a {
    color: #2294D2;
    text-decoration: none;
    transition: color 0.15s ease;
}

.footer-contact a:hover {
    color: #fff;
}


/* ================================================================
   11. FOOTER — Language Switcher
   ================================================================ */

.uksr-enhanced-footer .footer-middle {
    padding: 24px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    background: transparent;
}

.uksr-enhanced-footer .footer-middle .wrap {
    text-align: center;
    display: flex;
    justify-content: center;
}

/* Pill container around language list — matches LH */
.uksr-enhanced-footer .footer-middle .footer-lang-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    background: rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    padding: 16px 64px;
}

.uksr-enhanced-footer .footer-middle a {
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
    transition: color 0.15s ease;
}

.uksr-enhanced-footer .footer-middle a:hover {
    color: var(--uksr-white, #fff);
}


/* ================================================================
   12. FOOTER — Social Icons
   ================================================================ */

.footer-social {
    text-align: center;
    padding: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-social__icons {
    display: flex;
    justify-content: center;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-social__icons a,
.footer-social a {
    display: inline-block;
    background: transparent;
    color: #2294D2;
    border-radius: 0;
    font-size: 1.1rem;
    text-decoration: none;
    margin: 0 8px;
    padding: 0;
    transition: color 0.15s ease, opacity 0.15s ease;
}

.footer-social__icons a:hover,
.footer-social__icons a:focus,
.footer-social a:hover,
.footer-social a:focus {
    background: transparent !important;
    color: var(--uksr-magenta, #E6007E) !important;
    opacity: 1 !important;
    text-decoration: none !important;
}

/* WhatsApp specific hover — brand green */
.footer-social__icons a[aria-label="WhatsApp"]:hover,
.footer-social__icons a[aria-label="WhatsApp"]:focus,
.footer-social a[aria-label="WhatsApp"]:hover,
.footer-social a[aria-label="WhatsApp"]:focus {
    color: rgb(37, 211, 102) !important;
}


/* ================================================================
   13. FOOTER — Copyright
   ================================================================ */

.uksr-enhanced-footer .footer-bottom {
    background-color: #000020;
    padding: 20px 0;
    text-align: center;
}

.uksr-enhanced-footer .footer-bottom p {
    color: #fff;
    font-size: 16px;
    margin: 0;
}

.uksr-enhanced-footer .footer-bottom a {
    color: #cccccc;
    text-decoration: none;
    transition: color 0.15s ease;
}

.uksr-enhanced-footer .footer-bottom a:hover {
    color: var(--uksr-magenta, #E6007E);
}


/* ================================================================
   14. BLOG CAROUSEL — UKSE-parity card carousel (footer.php)
   ================================================================ */

/* Section wrapper — edge-to-edge breakout like testimonials */
.section_latest_blog {
    padding: 24px 0 40px !important;
    background: var(--uksr-grey-50, #f8f9fa);
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: visible;
}

/* Section heading — centered, dark blue, magenta underline */
.section_latest_blog > h2 {
    background: none !important;
    color: var(--uksr-dark-blue, #29235C) !important;
    font-family: "proxima-nova", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    padding: 0 0 8px !important;
    margin: 0 0 32px !important;
    text-align: center !important;
    display: block !important;
    position: relative;
}

.section_latest_blog > h2::after {
    content: '';
    display: block;
    width: 300px;
    max-width: 80%;
    height: 3px;
    background: var(--uksr-magenta, #E6007E);
    margin: 15px auto 0;
}

/* Hide parent theme's span underline decoration */
.section_latest_blog > h2 span {
    display: none !important;
}

/* Carousel container — max-width keeps card sizes consistent at all viewports */
.uksr-blog-carousel {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0;
}

/* ── Slick equal-height slides ── */
.uksr-blog-carousel .slick-track {
    display: flex !important;
}

.uksr-blog-carousel .slick-slide {
    height: auto !important;
    display: flex !important;
    overflow: visible !important;
}

.uksr-blog-carousel .slick-slide > div {
    display: flex;
    width: 100%;
}

.uksr-blog-carousel .slick-list {
    overflow: visible !important;
    padding-bottom: 16px !important;
}

/* ── Card (each slide) ── */
.uksr-blog-carousel .blog_slide {
    display: flex !important;
    flex-direction: column;
    height: 100%;
    background: #fff;
    border-radius: 12px;
    box-shadow: rgba(0, 0, 50, 0.1) 0px 4px 12px;
    overflow: hidden;
    margin: 0 27px;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.uksr-blog-carousel .blog_slide:hover {
    box-shadow: rgba(0, 0, 50, 0.18) 0px 8px 24px;
    transform: translateY(-2px);
}

/* Override parent brand.css green bg/heading on .blog_slide */
.uksr-blog-carousel .blog_slide,
.uksr-blog-carousel .blog_slide:hover {
    background: #fff !important;
}

/* ── Featured image thumbnail ── */
.uksr-blog-carousel .blog_slide__thumb {
    width: 100%;
    height: 184px;
    overflow: hidden;
    flex-shrink: 0;
    position: relative;
}

.uksr-blog-carousel .blog_slide__thumb img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    display: block;
}

/* ── Card body (text content) ── */
.uksr-blog-carousel .blog_slide__body {
    padding: 20px 24px 24px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Date */
.uksr-blog-carousel .blog_slide__body > span {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--uksr-green, #B1CB0C);
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Title */
.uksr-blog-carousel .blog_slide h3 {
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 27px !important;
    color: var(--uksr-dark-blue, #29235C) !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    background: none !important;
    text-transform: none !important;
}

/* Excerpt */
.uksr-blog-carousel .blog_slide p {
    font-size: 14px;
    line-height: 22.4px;
    color: #495057;
    margin: 0 0 16px;
    flex: 1;
}

/* Read More button */
.uksr-blog-carousel .blog_slide .blog-button {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    color: var(--uksr-green, #B1CB0C);
    border: 2px solid var(--uksr-green, #B1CB0C);
    border-radius: 8px;
    padding: 10px 20px;
    text-decoration: none;
    text-align: center;
    background: transparent;
    transition: all 0.3s ease;
    align-self: flex-start;
}

.uksr-blog-carousel .blog_slide .blog-button:hover {
    background: var(--uksr-green, #B1CB0C);
    color: #fff;
}

/* ── Slick dots ── */
.uksr-blog-carousel .slick-dots {
    display: flex !important;
    justify-content: center;
    list-style: none;
    margin: 24px 0 0;
    padding: 0;
}

.uksr-blog-carousel .slick-dots li {
    margin: 0 4px;
}

.uksr-blog-carousel .slick-dots li button {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(177, 203, 12, 0.35);
    border: none;
    padding: 0;
    font-size: 0;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.3s ease;
}

.uksr-blog-carousel .slick-dots li button:before {
    display: none;
}

.uksr-blog-carousel .slick-dots li.slick-active button {
    background: var(--uksr-green, #B1CB0C);
    transform: scale(1.2);
}

/* ── Override parent brand.css blog styles ── */
.section_latest_blog .blog_slide h2 {
    display: none !important;
}

/* Parent brand.css: .blog_slide has bg color, heading bg, padding */
.section_latest_blog .uksr-blog-carousel .blog_slide {
    padding: 0 !important;
    border: none !important;
    min-height: auto !important;
}

/* Parent: .section_latest_blog h2 has background/padding — reset */
.section_latest_blog .uksr-blog-carousel h3 {
    background: none !important;
    padding: 0 !important;
}

/* Parent: .blog-button has different styles */
.section_latest_blog .uksr-blog-carousel .blog-button {
    width: auto !important;
    margin: 0 !important;
}


/* ================================================================
   15. RESPONSIVE
   ================================================================ */

/* ── Tablet (900px – 1024px) ─────────────────────────────── */
@media (min-width: 900px) and (max-width: 1024px) {

    /* ── Header: hide top bar (phone wraps badly at 900-1000px) ── */
    .header_top {
        display: none;
    }

    /* ── Header: hide partner bar to save space ── */
    .partner-bar {
        display: none;
    }

    /* ── Header: compact logo ── */
    .header .logo img {
        max-height: 55px;
    }

    /* ── Header: tighter bottom bar ── */
    .header_bottom {
        min-height: auto;
        padding: 12px 0 0;
    }

    .header_bottom .grid {
        gap: 12px;              /* was 16px — tighter fit */
        align-items: center;
    }

    .header_bottom .grid__item:last-child {
        min-width: 0;           /* allow nav to shrink below content size */
    }

    /* ── Nav: tighter link spacing to fit on one line ── */
    .header_nav .nav.top-nav > li > a,
    .header_nav ul.nav > li > a,
    .header_nav .menu > li > a {
        font-size: 11px !important;  /* was 12px */
        padding: 0 8px;              /* was 0 10px */
        height: 36px;                /* was 38px */
    }

    .header_nav ul.nav,
    .header_nav .nav.top-nav,
    .header_nav .menu {
        height: 36px;           /* was 38px — match reduced link height */
    }

    /* ── Nav CTA pill: smaller at tablet ── */
    .header_nav .nav.top-nav > li:last-child > a,
    .header_nav ul.nav > li:last-child > a,
    .header_nav .menu > li:last-child > a {
        padding: 0.5rem 1rem;
        font-size: 11px !important;
    }

    /* ── Footer ── */
    .footer-mega-menu .wrap {
        justify-content: center;
    }

    .footer-service-panel {
        flex: 1 1 calc(50% - 15px);
        max-width: calc(50% - 15px);
    }

    .uksr-enhanced-footer .footer-top .wrap {
        flex-direction: column;
    }
}

/* ── Mobile (≤768px) ─────────────────────────────────────── */
@media (max-width: 768px) {

    /* Partner bar hidden on mobile */
    .partner-bar {
        display: none;
    }

    /* Header bottom compact */
    .header_bottom {
        min-height: auto;
        padding: 12px 0;
    }

    .header_bottom .grid {
        align-items: center;
    }

    /* Footer mega menu stacks */
    .footer-mega-menu {
        padding: var(--uksr-space-lg, 1.5rem) 0;
    }

    .footer-mega-menu .wrap {
        flex-direction: column;
        gap: 0;
    }

    .footer-service-panel {
        flex: 1 1 100%;
        min-width: 100%;
        padding: 16px 0 16px 16px;
        border-left: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    /* Footer stacks */
    .uksr-enhanced-footer .footer-top .wrap {
        flex-direction: column;
    }

    /* Footer social compact */
    .footer-social__icons a,
    .footer-social a {
        font-size: 1rem;
        padding: 0 6px;
    }

    /* Blog section */
    .section_latest_blog > h2 {
        font-size: 24px !important;
        margin-bottom: 20px !important;
    }

    .uksr-blog-carousel .blog_slide {
        margin: 0 8px;
    }

    /* ── Footer service panels — stack single-column ── */
    .footer-service-panel {
        border-left: 4px solid var(--uksr-green, #B1CB0C);
        border-bottom: none;
        padding: 20px 0 20px 16px;
    }

    .footer-service-panel--lh {
        border-left-color: #2294D2;
    }

    .footer-service-panel--ukse {
        border-left-color: var(--uksr-orange, #EE7218);
    }

    .footer-service-panel + .footer-service-panel {
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .footer-service-panel__logo {
        max-height: 36px !important;
        height: 36px !important;
        margin: 0 0 16px !important;
    }

    .footer-service-panel__title {
        font-size: 17px;
        min-height: auto;
        margin-bottom: 10px;
    }

    .footer-service-panel__links a {
        font-size: 13px !important;
        padding: 4px 0 !important;
    }

    .footer-service-panel__cta {
        font-size: 13px;
        padding: 10px 16px;
    }

    /* ── Footer sitemap/contact — full width ── */
    .footer-sitemap,
    .footer-contact {
        flex: 1 1 100%;
        max-width: none;
    }

    /* ── Footer lang pill — wrap on narrow screens ── */
    .uksr-enhanced-footer .footer-middle .footer-lang-pill {
        gap: 16px;
        padding: 12px 24px;
        flex-wrap: wrap;
    }

    /* ── Footer copyright — smaller text ── */
    .uksr-enhanced-footer .footer-bottom {
        padding: 16px 12px;
    }

    .uksr-enhanced-footer .footer-bottom p {
        font-size: 13px;
    }
}

/* ── Small phone (≤480px) ─────────────────────────────────── */
@media (max-width: 480px) {
    /* Footer panels full bleed */
    .footer-mega-menu .wrap {
        padding: 0 12px;
    }

    .footer-service-panel__links a {
        font-size: 12.5px !important;
    }

    .footer-service-panel__cta {
        padding: 8px 14px;
        font-size: 12px;
    }

    .uksr-enhanced-footer .footer-top .wrap {
        padding: 0 16px;
    }

    .uksr-enhanced-footer .footer-bottom p {
        font-size: 12px;
    }
}


/* ================================================================
   19. FOOTER ACCORDION — Mobile collapsible panels (≤899px)
   ================================================================ */

@media (max-width: 899px) {

    /* ── Service panel title — clickable toggle ── */
    .footer-service-panel__title {
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 16px 16px 0;
        margin: 0;
    }

    .footer-service-panel__title::after {
        content: '';
        width: 10px;
        height: 10px;
        border-right: 2px solid rgba(255,255,255,0.5);
        border-bottom: 2px solid rgba(255,255,255,0.5);
        transform: rotate(45deg);
        transition: transform 0.3s ease;
        flex-shrink: 0;
    }

    .footer-service-panel.is-expanded .footer-service-panel__title::after {
        transform: rotate(-135deg);
    }

    /* ── Service panel body — collapsed by default ── */
    .footer-service-panel__body {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s ease;
    }

    .footer-service-panel.is-expanded .footer-service-panel__body {
        max-height: 500px;
    }

}


/* ================================================================
   BACK TO TOP BUTTON
   ================================================================
   Replaces legacy .back_to_top (parent 48px grey FA icon, inline
   onclick, jQuery animate). Modern: small dark-blue pill, bottom-right,
   appears after 1200px scroll, smooth native scroll, accessible.
   ================================================================ */

/* Hide parent theme back-to-top (in case parent footer loads) */
.back_to_top { display: none !important; }

.uksr-back-to-top {
    position: fixed;
    bottom: 24px;
    left: 24px;
    z-index: 900;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 10px;
    background: var(--uksr-dark-blue, #29235C);
    color: #fff;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease, background 0.15s ease;
    -webkit-tap-highlight-color: transparent;
}

.uksr-back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.uksr-back-to-top:hover {
    background: var(--uksr-magenta, #E6007E);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.uksr-back-to-top:active {
    transform: scale(0.93);
}

.uksr-back-to-top svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* Mobile: slightly smaller, tighter to edge */
@media (max-width: 768px) {
    .uksr-back-to-top {
        width: 36px;
        height: 36px;
        bottom: 16px;
        left: 16px;
        border-radius: 8px;
    }
}
