/* Font Awesome @font-face */
@font-face {
    font-family: FontAwesome;
    font-style: normal;
    font-weight: 400;
    src: url(fonts/8b43027f47b20503057dfbbaa9401fef.eot);
    src: url(fonts/8b43027f47b20503057dfbbaa9401fef.eot?#iefix&v=4.7.0) format("embedded-opentype"),url(fonts/20fd1704ea223900efa9fd4e869efb08.woff2) format("woff2"),url(fonts/f691f37e57f04c152e2315ab7dbad881.woff) format("woff"),url(fonts/1e59d2330b4c6deb84b340635ed36249.ttf) format("truetype"),url(fonts/6878d55e3615ccf40c386ec2a90dfd6a.svg#fontawesomeregular) format("svg");
}

/* Base styles and small reset */
:root{ --base-font-size: clamp(14px, 1.2vw, 16px); --tool-bg: #009fe3; --tool-color: #fff; --brandon-font: 'Outfit', "Calibri W01 Regular_904604", Calibri, helvetica, sans-serif }
html{ height:100%; margin:0; padding:0; background-color: #fff; font-family: var(--brandon-font) }
body{ height:100%; margin:0; padding:0; font-size:var(--base-font-size); font-family: var(--brandon-font); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; padding-top:117px; padding-bottom:0; margin-bottom:0; min-height:100vh; display:flex; flex-direction:column; overflow-x:hidden; background-color: #fff; color: #58585a; }
*:not([class*="icon"]):not([class*="fa"]):not([class*="FontAwesome"]) { font-family: var(--brandon-font) }
img{ max-width:100%; height:auto; display:block }
/* Top tools - responsive, right-aligned container */
:root{ --tool-bg: #009fe3; --tool-color: #fff }
*, *::before, *::after{ box-sizing: border-box }
.top-tools{ position:fixed; top:0; left:0; right:0; z-index:1001; background: var(--tool-bg); color: var(--tool-color); font-family: var(--brandon-font); display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; padding:0 12px; height:49px; }
.top-tools ul{ list-style:none; display:flex; margin:0; padding:0; }
.top-tools li{ display:flex; align-items:center; padding:8px 14px; border-left:1px solid rgba(255,255,255,0.18); border-right:1px solid rgba(255,255,255,0.06); min-width:44px; }
.top-tools a{ color:inherit; text-decoration:none; display:flex; align-items:center; gap:8px; font-size:14px; }
.top-tools .icon{ width:16px; height:16px; flex-shrink:0; display:block; fill: currentColor; }
.top-tools a:focus, .top-tools a:hover{ background: rgba(255,255,255,0.04); outline: none }
.top-tools-panel{ width:100%; display:none; background: var(--tool-bg); color: var(--tool-color); padding:24px 16px 28px; position:relative; }
.top-tools-panel[aria-hidden="false"]{ display:block; }
.top-tools-close{ position:absolute; top:14px; right:18px; width:28px; height:28px; border-radius:50%; border:0; background:#fff; color:#3f7fb3; font-size:20px; line-height:1; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.top-tools-close:hover,
.top-tools-close:focus{ background:#f0f5f9; }
.top-tools-panel-inner{ max-width:1200px; margin:0 auto; display:flex; gap:40px; align-items:flex-start; }
.top-tools-panel-content{ flex:1; min-width:260px; }
.top-tools-panel-content h3{ margin:0 0 12px; font-size:20px; }
.top-tools-panel-content p{ margin:0 0 12px; line-height:1.5; }
.top-tools-panel-content a{ color: var(--tool-color); text-decoration:underline; }
.top-tools-panel-map{ background-color:#3f7fb3; background-image:url("images/polygon-map.png"); background-size:cover; background-position:center; }
.top-tools-panel-map .top-tools-panel-inner{ max-width:1400px; }
.top-tools-panel-map-content{ width:100%; }
.map-header{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; align-items:flex-start; }
.map-header h3{ margin:0; font-size:16px; letter-spacing:0.04em; }
.map-header-details p{ margin:0 0 6px; }
.map-header a{ color:#fff; text-decoration:none; font-size:14px; }
.map-divider{ height:1px; background:rgba(255,255,255,0.35); margin:18px 0 24px; }
.map-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:22px 26px; }
.map-card h4{ margin:0 0 6px; font-size:14px; }
.map-card p{ margin:0 0 6px; font-size:13px; }
.map-link{ display:block; color:#fff; text-decoration:none; font-size:13px; margin-bottom:4px; }
.map-link::after{ content:" ›"; }
.top-tools-form{ flex:1; min-width:280px; display:flex; flex-direction:column; gap:16px; }
.top-tools-form label{ font-size:13px; text-transform:none; display:block; margin-bottom:8px; }
.top-tools-form .form-row-split{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.top-tools-form .form-field{ display:flex; flex-direction:column; }
.top-tools-form input,
.top-tools-form select,
.top-tools-form textarea{ width:100%; padding:12px 12px; border-radius:4px; border:1px solid transparent; background:#fff; color:#333; font-size:14px; }
.top-tools-form textarea{ resize:vertical; min-height:110px; }
.top-tools-form input::placeholder{ color: rgba(0,0,0,0.5); }
.top-tools-form input:focus,
.top-tools-form select:focus,
.top-tools-form textarea:focus{ outline:2px solid rgba(255,255,255,0.6); outline-offset:2px; }
.top-tools-form .consent-row label{ display:flex; align-items:flex-start; gap:8px; font-size:13px; line-height:1.4; margin:0; }
.top-tools-form .consent-row input{ width:auto; margin-top:2px; }
.top-tools-form fieldset{ border:0; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.top-tools-form legend{ font-size:12px; text-transform:uppercase; letter-spacing:0.04em; margin-bottom:8px; }
.top-tools-form .submit-row{ display:flex; justify-content:flex-end; }
.top-tools-form button{ background:#e66f19; color:#fff; border:0; padding:10px 20px; font-size:14px; border-radius:4px; cursor:pointer; }
.top-tools-form button:hover,
.top-tools-form button:focus{ background:#ff7f28; }
/* make touch targets larger for accessibility */
.tool-link { color: #fff; }     /* icon follows this */
.icon { width:20px; height:20px; }

.top-tools li{ border-radius:4px; }
.top-tools a{ padding:6px 0; display:inline-flex; align-items:center }
/* Responsive behavior: show icons only on narrow screens */
@media (max-width: 640px){
    .top-tools{ padding:6px 8px }
    .top-tools .label{ display:none }
    .top-tools-panel{ padding:18px 12px 22px; }
    .top-tools-panel-inner{ flex-direction:column; gap:24px; }
    .top-tools-form .form-row-split{ grid-template-columns:1fr; gap:16px; }
    .top-tools-close{ top:10px; right:12px; }
    /* Hide some icons on very small screens to match mobile design */
    .top-tools li:nth-child(n+4) { display: none; }
}
/* Very small screens: slightly smaller padding */
@media (max-width: 360px){
    .top-tools li{ padding:6px 8px }
    .top-tools .icon{ width:clamp(12px, 4vw, 16px); height:clamp(12px, 4vw, 16px) }
}

/* Main navigation styles */
.main-nav{ position:fixed; top:50px; left:0; right:0; width:100%; z-index:1000; background:#fff; border-top:1px solid #eee; font-family: var(--brandon-font); box-shadow:0 2px 4px rgba(0,0,0,0.05); height:60px }
.nav-inner{ max-width:1400px; margin:0 auto; display:flex !important; flex-direction:row !important; align-items:center !important; padding:0 40px; gap:60px; position:relative; width:100%; overflow:visible; justify-content:flex-start; height:60px; min-width:0 }

/* Underline that sits at the bottom of the navigation container and moves under active/hovered item */
.nav-underline{ position:absolute; bottom:0; left:0; height:2px; background:var(--tool-bg); width:0; transition:left .36s cubic-bezier(.2,.9,.3,1), width .36s cubic-bezier(.2,.9,.3,1), opacity .12s; border-radius:1px; opacity:0; will-change:left, width, opacity }
@media (max-width: 900px){ .nav-underline{ display:none } }
.nav-logo{ display:flex; align-items:center; flex-shrink:0; justify-content:flex-start }
.nav-logo img{ 
    height:24px; 
    width:auto; 
    display:block; 
    transition:height .12s ease;
    object-fit:contain;
}

/* Desktop - slightly larger */
@media (min-width: 1400px){ 
    .nav-logo img{ height:28px } 
}

/* Tablet - medium size */
@media (max-width: 1024px) and (min-width: 769px){ 
    .nav-logo img{ height:22px } 
}

/* Mobile - smaller */
@media (max-width: 768px) and (min-width: 481px){ 
    .nav-logo img{ height:16px } 
}

/* Small mobile - even smaller */
@media (max-width: 480px){ 
    .nav-logo img{ height:14px } 
    .nav-logo{ 
        align-items:center; 
        justify-content:flex-start;
        margin-right:auto;
    }
}

/* Ensure logo alignment on all mobile devices */
@media (max-width: 768px){
    .nav-logo{ 
        align-items:center; 
        justify-content:flex-start;
        flex-shrink:0;
    }
}
.nav-mobile-icons{ display:none; align-items:center; gap:16px; margin-left:auto; margin-right:0 }
.nav-mobile-icon{ display:flex; align-items:center; justify-content:center; width:auto; height:auto; color:#58585a; text-decoration:none }
.nav-icon-24{ width:24px; height:24px; display:block; filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0%) contrast(100%) }
.nav-icon-envelope{ width:20px; height:20px; stroke:#58585a; fill:none; flex-shrink:0 }
.nav-search-link{ gap:6px }
.nav-icon-search-img{ width:20px; height:20px; display:block; filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0%) contrast(100%); flex-shrink:0 }
.nav-search-text{ font-size:14px; color:#58585a; white-space:nowrap }

/* Search Overlay */
.search-overlay{ position:fixed; top:50px; left:0; right:0; background:#009fe3; z-index:2000; display:none; align-items:center; justify-content:center; padding:20px 60px; min-height:80px; box-shadow:0 2px 8px rgba(0,0,0,0.1) }
.search-overlay[aria-hidden="false"]{ display:flex }
.search-overlay-close{ position:absolute; top:16px; right:20px; width:32px; height:32px; border-radius:50%; background:#fff; border:none; color:#000; font-size:20px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:2001; font-weight:400 }
.search-overlay-close:hover{ background:#f0f0f0 }
.search-overlay-content{ display:flex; align-items:center; gap:16px; max-width:800px; width:100%; padding:0; justify-content:center }
.search-overlay-icon{ width:28px; height:28px; color:#fff; flex-shrink:0; opacity:1 }
.search-overlay-icon svg{ width:100%; height:100%; stroke-width:2.5 }
.search-overlay-input-wrapper{ flex:0 1 auto; position:relative; min-width:200px }
.search-overlay-placeholder{ display:block; color:#fff; font-size:20px; margin-bottom:10px; font-weight:400; white-space:nowrap }
.search-overlay-line{ width:100%; height:2px; background:#fff }

/* Damage Report Banner */
.damage-report-banner{ position:fixed; top:50px; left:0; right:0; background:#009fe3; z-index:2000; display:none; padding:50px 60px 60px; box-shadow:0 4px 12px rgba(0,0,0,0.15) }
.damage-report-banner[aria-hidden="false"]{ display:block }
.damage-report-close{ position:fixed; top:8px; right:18px; width:28px; height:28px; border-radius:50%; background:#fff; border:none; color:#009fe3; font-size:18px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:2001; font-weight:400 }
.damage-report-close:hover{ background:#f0f0f0 }
.damage-report-content{ max-width:1400px; margin:0 auto }
.damage-report-heading{ color:#fff; font-size:32px; font-weight:400; text-align:center; margin:0 0 40px; padding:0 }
.damage-report-center-section{ display:flex; align-items:center; justify-content:center; margin-bottom:50px }
.damage-report-phone{ display:flex; align-items:center; gap:15px }
.damage-report-icon{ width:28px; height:28px; flex-shrink:0; stroke:#fff; fill:none }
.phone-number{ color:#fff; font-size:42px; font-weight:700; line-height:1 }
.damage-report-grid{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:60px; align-items:start; position:relative }
.damage-report-column{ border-left:1px solid rgba(255,255,255,0.3); padding-left:40px }
.damage-report-column:first-child{ border-left:none; padding-left:0 }
.damage-report-column h3{ color:#fff; font-size:18px; font-weight:600; margin:0 0 20px; padding:0 }
.damage-report-link{ display:flex; align-items:center; gap:12px; color:#fff; text-decoration:none; font-size:16px; transition:opacity 0.2s }
.damage-report-link:hover{ opacity:0.8 }
.damage-report-tips{ display:flex; flex-direction:column; gap:12px }
.damage-report-tip-link{ color:#fff; text-decoration:none; font-size:14px; line-height:1.6; transition:opacity 0.2s }
.damage-report-tip-link:hover{ opacity:0.8 }

/* Mobile damage report banner adjustments */
@media (max-width: 900px) {
    .damage-report-banner {
        top: 60px;
        padding: 30px 20px 40px;
    }
    .damage-report-close {
        top: 16px;
        right: 16px;
        width: 28px;
        height: 28px;
        font-size: 18px;
    }
    .damage-report-heading {
        font-size: 24px;
        margin-bottom: 30px;
    }
    .damage-report-center-section {
        margin-bottom: 40px;
    }
    .phone-number {
        font-size: 28px;
    }
    .damage-report-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .damage-report-column {
        border-left: none;
        padding-left: 0;
        border-top: 1px solid rgba(255,255,255,0.3);
        padding-top: 30px;
    }
    .damage-report-column:first-child {
        border-top: none;
        padding-top: 0;
    }
    .damage-report-column h3 {
        font-size: 16px;
        margin-bottom: 16px;
    }
    .damage-report-link {
        font-size: 14px;
    }
    .damage-report-tip-link {
        font-size: 13px;
    }
}

/* Mobile search overlay adjustments */
@media (max-width: 900px) {
    .search-overlay {
        top: 60px;
        padding: 16px 50px;
        min-height: 70px;
    }
    .search-overlay-close {
        top: 14px;
        right: 16px;
        width: 28px;
        height: 28px;
        font-size: 18px;
    }
    .search-overlay-content {
        gap: 12px;
        max-width: 100%;
    }
    .search-overlay-icon {
        width: 24px;
        height: 24px;
    }
    .search-overlay-placeholder {
        font-size: 18px;
        margin-bottom: 8px;
    }
    .search-overlay-line {
        height: 1.5px;
    }
}

.nav-toggle{ display:none; border:0; background:transparent; padding:8px; margin-left:16px; flex-shrink:0 }
.nav-toggle .hamburger{ width:22px; height:2px; background:#58585a; display:block; position:relative }
.nav-toggle .hamburger::before, .nav-toggle .hamburger::after{ content:''; position:absolute; left:0; right:0; height:2px; background:#58585a }
.nav-toggle .hamburger::before{ top:-6px }
.nav-toggle .hamburger::after{ top:6px }

.nav-list{ list-style:none; display:flex !important; flex-direction:row !important; margin:0; padding:0; margin-left:0; gap:22px; align-items:center; flex-wrap:nowrap !important }
.nav-item{ position:static; display:flex !important; align-items:center; flex-shrink:0; width:auto !important }
/* Main Navigation Links */
/* Main Navigation Links */
.nav-link{ 
    font-family: Brandon, "Calibri W01 Regular_904604", helvetica, sans-serif;
    color: rgb(88, 88, 90);
    font-size: 13px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: normal;
    padding: 0 15px; /* Horizontal padding only */
    display: flex; /* Flex container */
    align-items: center; /* Center text vertically */
    justify-content: center;
    height: 100%;
    text-decoration: none;
    position: relative; /* Context for underline */
    white-space: nowrap;
    border-bottom: none;
    transition: color 0.2s ease;
}

/* Remove span styling - text is handled by parent flex */


/* Hover Effect using ::after pseudo-element on CONTAINER (.nav-link) */
/* Matches reference site: underline spans full padding width */
.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px !important; /* Enforce 2px thickness strictly */
    background-color: rgb(0, 159, 227);
    transition: width 0.25s ease-out, left 0.25s ease-out;
    z-index: 1100; /* Higher than megamenu (1000) to sit on top */
}

.nav-link:hover::after,
.nav-link:focus::after, 
.nav-item.active > .nav-link::after { 
    width: 100%;
    left: 0;
}

.nav-link:hover,
.nav-link:focus, 
.nav-item.active > .nav-link {
    color: rgb(88, 88, 90);
}



.nav-item:hover > .nav-link,
.nav-item:focus-within > .nav-link, 
.nav-item.active > .nav-link {
    color: rgb(88, 88, 90); 
}

/* Mega menu placeholder styles (full-bleed, subtle bottom shadow) */
.megamenu{ position:absolute; left:0; right:0; top:100%; display:none; background:#fff; border-top:1px solid #eee; box-shadow:0 6px 10px rgba(0,0,0,0.04); z-index:1000; padding:18px 0; margin-top:-1px }
.megamenu-inner{ max-width:none; width:100%; margin:0; padding:0 }

/* Three-column mega layout (image + list + sublist) */
.megamenu-grid{ display:grid; grid-template-columns:400px 1fr 300px; gap:50px; align-items:start; margin:18px }
.megamenu-grid.no-sub{ grid-template-columns:360px 1fr }
.megamenu.case-studies .megamenu-grid { grid-template-columns: 1fr; gap: 0; }
.megamenu.case-studies .megamenu-list-wrap { max-width: 100%; }

.megamenu.case-studies .megamenu-list-item:first-child a,
.megamenu.case-studies .megamenu-list-item:first-child a .title,
.megamenu.case-studies .megamenu-list-item:first-child a .title b {
    color: #58585a !important;
    font-weight: 600 !important;
}

.megamenu.case-studies .megamenu-list-item:first-child a:hover,
.megamenu.case-studies .megamenu-list-item:first-child a:hover .title,
.megamenu.case-studies .megamenu-list-item:first-child a:hover .title b {
    color: #58585a !important;
    font-weight: 600 !important;
}
.megamenu.case-studies .megamenu-list-wrap { max-width: 100%; }
.megamenu-image img{ width:400px; height:250px; object-fit:cover; display:block; border-radius:0 }
.megamenu-caption{ color:#58585a; font-size:13px; margin-top:10px; text-decoration:none; cursor:pointer; display:inline-block }
.megamenu-caption:hover{ text-decoration:underline }
.megamenu-sub{ transition:opacity .12s linear }

/* About-specific layout: large image on the left, narrower center list */
/* About-specific layout: large image on the left, narrower center list */
/* About specific overrides removed to match generic style exactly */
/*.megamenu.about .megamenu-grid{ grid-template-columns:400px 1fr 1fr; align-items:start; gap: 50px; }*/
/*.megamenu.about .megamenu-list-wrap{ width:100%; padding-left:8px }*/
.megamenu.about .megamenu-image img{ width: 400px; height: 250px; object-fit:cover; border-radius:0 }

/* About center list: vertical stacked items with consistent spacing and dividing lines */
/* .megamenu.about .megamenu-list{ display:block; padding:0; margin:0 } */
/* .megamenu.about .megamenu-list-item{ border-bottom:0.8px solid rgba(217, 217, 217, 0.6) } */
/* .megamenu.about .megamenu-list-item:last-child{ border-bottom:0 } */
.megamenu.about .megamenu-list-item.header{ padding:8px 0 12px; margin:0 0 4px; color:#58585a; font-weight:400; text-transform:none }
/* .megamenu.about .megamenu-list-item a{ display:flex; align-items:center; justify-content:space-between; padding:0 8px; color:#58585a; text-decoration:none; width:100%; height:56px; box-sizing:border-box; flex-wrap:nowrap; white-space:nowrap } */
/* .megamenu.about .megamenu-list-item a:hover .title{ color: color-mix(in srgb, currentColor 80%, black 20%) } */

/* .megamenu.about .megamenu-list-item.header .title{ text-decoration:none; color:#58585a; font-weight:600; padding-bottom:8px; display:block; white-space:normal; line-height:1.5 } */

/* Center the right column in the About layout for visual balance */
/* .megamenu.about .megamenu-sub{ padding-left:32px; align-self:center } */

/* Make active center row visually match screenshot: simple text emphasis */
.megamenu.about .megamenu-list-item.active a{ background:none; color:#58585a; font-weight: 300; }
.megamenu.about .megamenu-list-item.active .title{ text-decoration: none; color:#58585a; font-weight:300 }

/* Darker chevrons for the About active row */
/* Removed specific overrides for reduced chevron sizes */

/* Right column styling to match screenshot */
.megamenu.about .megamenu-sub{ padding-left:32px; }
.megamenu.about .sub-title{ margin:0 0 12px; padding-bottom:0; color:#58585a; font-size:14px; font-weight:600 }
.megamenu.about .sub-list li{ padding:10px 0; border-bottom:1px solid #eee }
.megamenu.about .sub-list li.active a{ color:#58585a; font-weight:300;  }

/* Main list (middle column) */
/* Global nav + megamenu typography: ensure a consistent line-height and weight */
.nav-link, .megamenu-list-item a, .megamenu-list-item .title, .sub-list li a, .megamenu-caption { line-height:1.5; font-weight:300 }
.sub-title, .sub-title a { font-weight: 600; line-height:1.5; color:#58585a; text-decoration:none }

.megamenu-list-wrap{ max-width:520px; max-height: 420px; overflow-y: auto; padding-right: 8px; scrollbar-width: thin; scrollbar-color: rgba(0,0,0,0.2) transparent; }
.megamenu-list-wrap::-webkit-scrollbar { width: 6px; }
.megamenu-list-wrap::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,0.2); border-radius: 3px; }
.megamenu-list-wrap::-webkit-scrollbar-track { background: transparent; }
.megamenu-list{ list-style:none; margin:0; padding:0 6px;letter-spacing: 0.3px }
.megamenu-list-item{ border-bottom:0.8px solid rgba(217, 217, 217, 0.6); }
.megamenu-list-item a{ display:flex; align-items:center; justify-content:space-between; padding:0 8px; color:#58585a; text-decoration:none; font-size:15px; line-height:1.5; height:56px; box-sizing:border-box; flex-wrap:nowrap; white-space:nowrap }
.megamenu-list-item + .megamenu-list-item{ border-top:0 }
.megamenu-list-item .title{ font-size:15px; transition: transform 0.2s ease }
.megamenu-list-item .chev{ width:28px; height:28px; fill:currentColor; opacity:1; transition: transform .14s ease, fill .14s ease; flex-shrink:0; margin-left:auto; display:block }

/* hover/active arrow behavior: larger and bolder look via transform */
.megamenu-list-item a:hover .chev, .megamenu-list-item a:focus .chev{ fill:var(--tool-bg); transform: translateX(4px) }
.megamenu-list-item.active a .chev{ fill:var(--tool-bg); transform: translateX(4px) }

/* reduce spacing and tighten lines to match reference */
.megamenu-list-item a .title{ display:block; color:#58585a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex:1; text-align:left; line-height:1.3; min-width:0 }
.megamenu-list-item a{ display:flex; align-items:center; justify-content:space-between; padding:0 8px; color:#58585a; text-decoration:none; font-size:15px; line-height:1.5; height:56px; box-sizing:border-box; flex-wrap:nowrap; white-space:nowrap; max-width:100% }

/* active / selected item */
/* active / selected item */
.megamenu-list-item.active a{ background:none; color:#58585a; font-weight:300; letter-spacing: normal; position: relative; }

/* Remove the blue vertical line on active/hover states */
.megamenu-list-item.active a::before {
    display: none !important;
    background-color: transparent !important;
    width: 0 !important;
    content: none !important;
}

/* Also ensure no blue line appears on hover for other items */
.megamenu-list-item a:hover::before,
.megamenu-list-item a:focus::before {
    display: none !important;
    background-color: transparent !important;
    width: 0 !important;
    content: none !important;
}

.megamenu-list-item.active a .chev{ fill:var(--tool-bg) }

/* hover + focus state for list items */
.megamenu-list-item a:hover .title, .megamenu-list-item a:focus .title{ color: inherit; transform: translateX(4px) }
.megamenu-list-item a:hover .chev, .megamenu-list-item a:focus .chev{ fill:var(--tool-bg) }

/* underline titles on hover/focus for all menu links */
.megamenu-list-item a:hover .title,
.megamenu-list-item a:focus .title {
    /* fallback: use the current text color and underline it */
    color: currentColor;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-decoration-color: currentColor;
    text-underline-offset: 2px;
}

/* progressively enhance: if color-mix is supported, darken the current color slightly */
@supports (color: color-mix(in srgb, currentColor 80%, black 20%)) {
    .megamenu-list-item a:hover .title,
    .megamenu-list-item a:focus .title {
        color: color-mix(in srgb, currentColor 80%, black 20%);
        text-decoration-color: color-mix(in srgb, currentColor 80%, black 20%);
    }
}

/* prevent active items from being underlined */
.megamenu-list-item.active .title { text-decoration: none; }

/* Sublist (right column) */
.megamenu-sub{ border-left:1px solid #eee; padding-left:28px; display:block; max-height: 420px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(0,0,0,0.2) transparent; }
.megamenu-sub::-webkit-scrollbar { width: 6px; }
.megamenu-sub::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,0.2); border-radius: 3px; }
.megamenu-grid.no-sub .megamenu-sub{ display:none }
.sub-inner{ max-height:none; overflow:visible; padding-right:8px }
.sub-inner h4{ margin:6px 0 14px; color:#58585a; font-size:15px; font-weight:300 }
.sub-inner h4 a{ color:#58585a; text-decoration:none; }
.sub-list{ list-style:none; margin:0; padding:0 }
.sub-list li{ padding:8px 0; border-bottom:1px solid transparent }
.sub-list li a{ color:#58585a; text-decoration:none; font-size:14px; display:flex; align-items:center; justify-content:space-between; gap:8px }
.sub-list li a:hover{ color: #58585a; text-decoration: none; }
.sub-list li a .chev{ width:12px; height:12px; fill:currentColor; opacity:0.9; flex-shrink:0; transition: transform .14s ease }
.sub-list li a:hover .chev{ transform: translateX(4px) }

/* slim scrollbar in sublist */
.sub-inner::-webkit-scrollbar{ width:8px }
.sub-inner::-webkit-scrollbar-thumb{ background:rgba(0,0,0,0.06); border-radius:4px }

/* utility */
.hidden{ display:none }

/* Mega Menu Container - reference match */
.megamenu {
    display: none;
    position: absolute; /* Relative to nav-item or nav-inner */
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
    background: #fff;
    padding: 40px 25px; /* Reference padding */
    box-shadow: 0 2px 4px rgba(0,0,0,0.3); /* Reference shadow */
    z-index: 900;
    border-top: 1px solid #eee;
}

.megamenu-inner {
    max-width: 1430px;
    margin: 0 auto;
    width: 100%;
}

/* Typography & List Styles */
.megamenu-list-item { 
    border-bottom: 0.8px solid rgba(217, 217, 217, 0.6); /* Reference border */
}

.megamenu-list-item a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0; /* Vertical padding from reference measurements approx */
    color: #58585a;
    text-decoration: none;
    font-size: 15px; /* Reference size */
    font-weight: 300; /* Lighter weight to match Nav */
    line-height: 1.5;
}

.megamenu-list-item.header {
    font-size: 14px; /* Reference header size */
    font-weight: 300;
    color: #58585a;
    padding-bottom: 8px;
    margin-bottom: 8px;
    border-bottom: none;
}

/* Remove chevron from generic items if not desired, or style it */
.megamenu-list-item .chev {
    width: 28px;
    height: 28px;
    fill: currentColor;
    opacity: 1;
}

/* Responsive: collapse into toggle */
@media (max-width: 900px){
    .megamenu-grid{ grid-template-columns:1fr; gap:12px; margin:12px }
    .megamenu-image img{ width:100%; height:auto; max-height:180px; object-fit:cover; border-radius:0 }
    .megamenu.about .megamenu-image img{ width:100%; height:auto; max-height:160px; object-fit:cover; border-radius:0 }
    .megamenu-list-item a{ padding:12px 8px }
    .megamenu{ padding:12px 0 }
    /* Ensure submenu items with chevrons are visible on mobile */
    .sub-list li a{ display:flex; align-items:center; justify-content:space-between; gap:8px }
    .sub-list li a .chev{ width:12px; height:12px; flex-shrink:0 }
}

/* Small screens adjustments */
@media (max-width: 360px){
    .megamenu-image img{ max-height:140px }
}

/* small animation */
@keyframes megaFadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.nav-item:hover > .megamenu{ animation: megaFadeIn .14s ease-out }


/* Ensure nav link underline shows on hover */
.nav-item:hover > .nav-link, .nav-item:focus-within > .nav-link{ border-bottom-color: var(--tool-bg); color: var(--tool-bg) }

        /* Main Content Styles */
        .main-content {
            max-width: 1200px;
            margin: 0 auto;
            padding: 60px 40px;
            background-color: #fff !important;
        }


        
/* Responsive tweaks */
/* Responsive tweaks */
@media (max-width: 1200px){
    .nav-inner{ padding:10px 16px }
    .nav-list{ gap:12px }
    .nav-link{ font-size:12px; padding:8px 1px 12px }
}
@media (max-width: 900px){
    /* ensure toggled nav remains usable on small devices */
    .nav-list{ padding:12px }
}
@media (max-width: 640px){
    .top-tools ul{ flex-wrap:wrap; gap:6px }
    .top-tools li{ padding:8px 10px }
}
@media (min-width:1400px){
    .nav-inner{ max-width:100%; padding:10px 40px 12px }
    .nav-link{ font-size:14px }
}

/* reduce megamenu paddings on small screens to keep content visible */
@media (max-width:900px){
    .megamenu-inner{ padding:0 12px }
    .sub-inner{ max-height:none; overflow:visible }
      .content-wrapper {
            max-width: 800px;
            margin: 0 auto;
        }

        .main-content h1 {
            font-size: 32px;
            font-weight: 700;
            color: #58585a;
            margin: 0 0 32px 0;
            line-height: 1.2;
            letter-spacing: -0.5px;
        }

        .main-content h2 {
            font-size: 24px;
            font-weight: 600;
            color: #58585a;
            margin: 40px 0 20px 0;
            line-height: 1.3;
            letter-spacing: -0.3px;
        }

        .main-content p {
            font-size: 16px;
            line-height: 1.6;
            color: #444;
            margin: 0 0 20px 0;
        }

        .main-content .meaning-list {
            font-size: 16px;
            line-height: 1.7;
            padding-left: 24px;
        }

        .main-content .meaning-list li {
            margin-bottom: 16px;
        }

        /* Also apply to content-wrapper for consistency */
        .content-wrapper h1 {
            font-size: 32px;
            font-weight: 700;
            color: #58585a;
            margin: 0 0 32px 0;
            line-height: 1.2;
            letter-spacing: -0.5px;
        }

        .content-wrapper h2 {
            font-size: 24px;
            font-weight: 600;
            color: #58585a;
            margin: 40px 0 20px 0;
            line-height: 1.3;
            letter-spacing: -0.3px;
        }

        .content-wrapper p {
            font-size: 16px;
            line-height: 1.6;
            color: #444;
            margin: 0 0 20px 0;
        }
        
}

/* Tablet styles (768px - 1024px) */
@media (max-width: 1024px) and (min-width: 769px) {
    .main-content {
        padding: 50px 32px;
    }

    .content-wrapper {
        max-width: 100%;
        padding: 0 16px;
    }

    .main-content h1,
    .content-wrapper h1 {
        font-size: 42px;
        margin: 0 0 32px 0;
        color: #58585a;
    }

    .main-content h2,
    .content-wrapper h2 {
        font-size: 28px;
        margin: 40px 0 20px 0;
        color: #58585a;
    }

    .main-content p,
    .content-wrapper p {
        font-size: 17px;
        line-height: 1.7;
    }

    .main-content .meaning-list {
        font-size: 16px;
        line-height: 1.6;
        padding-left: 28px;
    }

    .main-content .meaning-list li {
        margin-bottom: 14px;
    }
}

/* Mobile styles (up to 768px) */
@media (max-width: 768px) {
    .main-content {
        padding: 40px 20px !important;
    }

    .content-wrapper {
        max-width: 100%;
        padding: 0;
    }

    .main-content h1,
    .content-wrapper h1 {
        font-size: 32px;
        margin: 0 0 24px 0;
        line-height: 1.3;
        letter-spacing: -0.3px;
        color: #58585a;
    }

    .main-content h2,
    .content-wrapper h2 {
        font-size: 24px;
        margin: 32px 0 18px 0;
        line-height: 1.3;
        letter-spacing: -0.2px;
        color: #58585a;
    }

    .main-content p,
    .content-wrapper p {
        font-size: 16px;
        line-height: 1.6;
        margin: 0 0 20px 0;
    }

    .main-content .meaning-list {
        font-size: 15px;
        line-height: 1.6;
        padding-left: 24px;
        margin: 0 0 24px 0;
    }

    .main-content .meaning-list li {
        margin-bottom: 12px;
        padding-left: 8px;
    }
}

/* Small mobile styles (up to 480px) */
@media (max-width: 480px) {
    .main-content {
        padding: 32px 16px !important;
    }

    .content-wrapper {
        max-width: 100%;
    }

    .main-content h1,
    .content-wrapper h1 {
        font-size: 28px;
        margin: 0 0 20px 0;
        line-height: 1.2;
        letter-spacing: -0.2px;
        color: #58585a;
    }

    .main-content h2,
    .content-wrapper h2 {
        font-size: 22px;
        margin: 28px 0 16px 0;
        line-height: 1.3;
        color: #58585a;
    }

    .main-content p,
    .content-wrapper p {
        font-size: 15px;
        line-height: 1.6;
        margin: 0 0 18px 0;
    }

    .main-content .meaning-list {
        font-size: 14px;
        line-height: 1.5;
        padding-left: 20px;
        margin: 0 0 20px 0;
    }

    .main-content .meaning-list li {
        margin-bottom: 10px;
        padding-left: 6px;
    }
}

/* Desktop only safety */
@media (min-width: 901px){
    .main-nav{ 
        display:block !important; 
        position:fixed !important; 
        top:49px !important;    /* Changed from 50px to 49px (matches blue bar height) */
        left:0 !important; 
        right:0 !important; 
        width:100% !important; 
        height:67.5px !important; 
        background:#fff !important; 
        box-shadow: inset 0 -1px 0 #e1e1e1 !important; 
        z-index: 1000 !important;
    }
    
    /* Darken page content when hovering over navigation links */
    body:has(.nav-link:hover, .megamenu-list-item a:hover, .sub-list li a:hover, .sub-title a:hover)::before {
        content: '';
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.4);
        z-index: 999;
        pointer-events: none;
        transition: opacity 0.3s ease;
    }
    
    /* Ensure navbar and top-tools stay above the overlay and remain unchanged */
    .main-nav {
        z-index: 1000 !important;
    }
    
    .top-tools {
        z-index: 1001 !important;
    }
    .nav-inner {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 0 !important;
        width: 100% !important;
        max-width: 1430px !important;
        height: 100% !important; /* Pass down height */
        padding: 0 !important;   /* Control padding carefully */
        margin: 0 auto !important;
    }
    .nav-list {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 0 !important; 
        margin-left: auto !important;
        height: 100%;
        align-items: stretch !important; /* Stretch items to full height */
    }
    .nav-link{ 
        display: flex !important; /* Use flex to center text vertically */
        align-items: center !important;
        height: 100% !important;
        line-height: normal !important; 
        padding: 0 15px !important; /* Remove vertical padding, let flex center it */
        font-size: 13px !important; /* Reduced to match reference */
        font-weight: 300 !important; /* Light weight as requested */
        letter-spacing: normal !important; /* Standard spacing (closer together) */
    }
    /* Duplicate nav-list rule was here - removed */
    .nav-list > .nav-item{ display:flex !important; flex-direction:row !important; align-items:stretch !important; flex-shrink:0 !important; width:auto !important; min-width:fit-content !important; position:static !important; vertical-align:middle !important; height: auto !important }
    .nav-item{ display:flex !important; flex-direction:row !important; align-items:stretch !important; flex-shrink:0 !important; width:auto !important; min-width:fit-content !important; position:static !important; height: auto !important }
    .nav-link{ display:flex !important; align-items:center !important; height:100% !important; line-height:normal !important; white-space:nowrap !important; width:auto !important; padding:0 15px !important; position: relative !important }

    /* Desktop content styles - ensure consistency */
    .main-content h1,
    .content-wrapper h1 {
        font-size: 32px;
        font-weight: 700;
        color: #58585a;
        margin: 0 0 32px 0;
        line-height: 1.2;
        letter-spacing: -0.5px;
    }

    .main-content h2,
    .content-wrapper h2 {
        font-size: 24px;
        font-weight: 600;
        color: #58585a;
        margin: 40px 0 20px 0;
        line-height: 1.3;
        letter-spacing: -0.3px;
    }

    .main-content p,
    .content-wrapper p {
        font-size: 16px;
        line-height: 1.6;
        color: #444;
        margin: 0 0 20px 0;
    }

    .main-content .meaning-list,
    .content-wrapper .meaning-list {
        font-size: 16px;
        line-height: 1.7;
        padding-left: 24px;
    }

    .main-content .meaning-list li,
    .content-wrapper .meaning-list li {
        margin-bottom: 16px;
    }
}

/* Responsive: collapse into toggle */

@media (max-width: 900px){
    /* Hide top-tools on mobile */
    .top-tools{ display:none !important }
    /* Adjust main-nav position for mobile */
    .main-nav{ top:0 !important }
    body{ padding-top:60px }
    /* Adjust nav-inner padding for mobile */
    .nav-inner{ padding:0 16px !important; justify-content:space-between !important }
    /* Show mobile icons in header */
    .nav-mobile-icons{ display:flex !important; gap:16px; margin-left:auto; margin-right:0; align-items:center }
    .nav-mobile-icon{ display:flex; align-items:center; justify-content:center; width:auto; height:auto; color:#58585a; text-decoration:none }
    .nav-toggle{ display:block; margin-left:16px }
    .nav-list{ position:fixed; right:0; left:0; top:60px; background:#fff; flex-direction:column !important; align-items:flex-start; gap:0; padding:10px 12px; display:none !important; box-shadow:0 8px 20px rgba(0,0,0,0.08); z-index:50; max-height:calc(100vh - 60px); overflow-y:auto }
    .nav-list.open{ display:flex !important }
    .nav-item{ width:100%; }
    .nav-link{ width:100%; padding:12px 8px; border-bottom:1px solid #f0f0f0 }
    .megamenu{ position:static; width:100%; transform:none; box-shadow:none; padding:12px 8px; display:none; max-height:none; overflow:visible }
    .nav-item.open > .megamenu{ display:block }
    /* Remove left border on mobile for submenu */
    .megamenu-sub{ border-left:none; padding-left:0 }
    /* Stack megamenu content vertically on mobile */
    .megamenu-grid{ grid-template-columns:1fr !important; gap:16px }
    .megamenu-image{ order:1 }
    .megamenu-list-wrap{ order:2 }
    .megamenu-sub{ order:3 }
}

/* Very small screens adjustments */
@media (max-width: 360px){
    .nav-logo img{ height:12px }
    .nav-link{ font-size:13px }
} 
.book-images {
    display: flex;
    flex-direction: row;
    gap: 20px;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 40px 16px 40px 16px;
    margin-bottom: 0;
    margin-top: 40px;
    flex-shrink: 0;
    background: #fff;
}

.book-images-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 0 16px;
    justify-items: center;
}

.book-images-container img {
    width: 100%;
    height: auto;
    max-width: 100%;
    object-fit: contain;
    display: block;
}

/* Desktop: show 4 images in a row */
@media (min-width: 901px) {
    .book-images-container {
        display: flex;
        flex-direction: row;
        gap: 20px;
        max-width: 800px;
        margin: 0 auto;
        justify-content: center;
        align-items: center;
    }
    
    .book-images-container img {
        max-width: 180px;
    }
}

/* Footer Styles */
.site-footer {
    background-color: #009fe3;
    color: #fff;
    font-family: var(--brandon-font);
    width: 100%;
    margin-top: auto;
    margin-bottom: 0;
    position: relative;
    flex-shrink: 0;
}

/* ===========================================
   FOOTER ACCORDION ARROW ALIGNMENT FIXES
   =========================================== */

/* Footer Accordion Base Styles */
.footer-accordion {
    position: relative;
}

.footer-item {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    display: block;
    margin-bottom: 12px;
    line-height: 1.2;
}

.footer-item:hover,
.footer-item:focus {
    opacity: 0.8;
    text-decoration: underline;
}

/* Arrow button base - hidden by default */
.footer-nav-button {
    background: none;
    border: 0;
    padding: 0;
    display: none;
    cursor: pointer;
    color: #fff;
}

footer .nav-arrow-icon {
    color: #fff;
    transition: transform 0.3s ease;
    font-size: 16px;
}

/* Accordion animation */
.footer-item-content {
    overflow: hidden;
    transition: max-height 0.35s ease;
}

/* Rotate arrow when open */
.footer-accordion.is-open .nav-arrow-icon {
    transform: rotate(90deg);
}

/* ===========================
   Mobile & Tablet only (≤1024px)
   =========================== */
@media (max-width: 1024px) {
    /* Container for better alignment */
    .footer-accordion {
        position: relative !important;
        display: flex !important;
        flex-wrap: wrap;
        align-items: flex-start !important; /* Align to top instead of center */
        justify-content: space-between !important;
        width: 100% !important;
        min-height: 60px; /* Set a minimum height to prevent shifting */
        padding: 20px 0; /* Increased from 16px to accommodate larger text */
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }
    
    /* Make the accordion container have relative positioning for absolute arrow */
    .footer-accordion.footer-col {
        position: relative !important;
        padding-right: 44px; /* Make space for the arrow button */
        padding-top: 0; /* Remove top padding from container */
    }
    
    /* Title styling - flex item that grows, larger font for mobile/tablet */
    .footer-item {
        flex: 1 1 auto;
        min-width: 0; /* Allow text to shrink */
        color: #fff;
        font-weight: 600; /* Semi-bold on mobile */
        font-size: 18px; /* Increased from 16px to 18px for better readability */
        line-height: 1.3; /* Better line spacing */
        text-decoration: none;
        padding-top: 15px; /* Fixed top padding */
        padding-bottom: 15px; /* Fixed bottom padding */
        padding-right: 12px; /* Space between text and arrow */
        margin-bottom: 0;
        position: relative;
        display: inline-block;
        height: auto; /* Let content determine height */
        text-align: left !important; /* Left align text */
    }
    
    /* Contact heading - MUST match .footer-item font size exactly */
    .footer-col .footer-heading,
    h3.footer-heading,
    .footer-heading {
        font-weight: 600 !important; /* Semi-bold on mobile - matches .footer-item */
        font-size: 18px !important; /* MUST match .footer-item font-size: 18px */
        line-height: 1.3 !important; /* Better line spacing - matches .footer-item */
        padding: 15px 0 !important; /* Matches .footer-item */
        margin-bottom: 12px !important;
        text-align: left !important; /* Left align */
    }
    
    /* Position the arrow button fixed at the top-right */
    .footer-accordion .footer-nav-button {
        position: absolute !important;
        right: 0 !important;
        top: 0 !important; /* Fixed at top instead of 50% */
        transform: none !important; /* Remove translateY */
        margin-left: 0 !important;
        margin-right: 0 !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 60px; /* Match the container min-height */
        flex-shrink: 0;
        background: none;
        border: 0;
        padding: 0;
        cursor: pointer;
        color: #fff;
        z-index: 2;
    }
    
    /* Ensure consistent arrow positioning for both accordions */
    .footer-grid .footer-accordion.footer-col:first-child .footer-nav-button,
    .footer-grid .footer-accordion.footer-col:nth-child(2) .footer-nav-button {
        right: 0 !important;
        top: 0 !important; /* Both at the same top position */
    }
    
    /* Fix arrow icon alignment within button */
    footer .nav-arrow-icon {
        color: #fff;
        font-size: 18px;
        transition: transform 0.3s ease;
        position: relative;
        top: 0;
        left: 0;
        transform: none;
        margin: 0;
        padding: 0 !important;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 26px;
        height: 26px;
    }
    
    /* Rotate arrow when accordion is open */
    .footer-accordion.is-open .nav-arrow-icon {
        transform: rotate(90deg) !important;
    }
    
    /* Content styling - make sure content expands below the arrow */
    .footer-item-content {
        width: 100%;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
        margin-top: 0;
        padding: 0;
        list-style: none;
        clear: both; /* Ensure content clears the floated/positioned elements */
    }
    
    .footer-accordion.is-open .footer-item-content {
        max-height: 500px;
        padding-top: 12px;
        padding-bottom: 12px; /* Add some bottom padding */
    }
    
    /* Ensure proper list item styling */
    .footer-item-content li {
        padding: 8px 0;
    }
    
    .footer-item-content a {
        color: #fff;
        text-decoration: none;
        font-size: 14px;
        opacity: 0.9;
    }
    
    .footer-item-content a:hover {
        opacity: 1;
        text-decoration: underline;
    }
    
    /* Center social icons on mobile/tablet */
    .social-col {
        text-align: center !important; /* Center the social icons column */
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        width: 100% !important;
    }
    
    .footer-sm-wrapper {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        padding-top: 8px !important; /* Reduced to bring icons closer to contact content */
    }
    
    .footer-sm-wrapper ul {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        margin: 0 auto !important;
        padding: 0 !important;
        gap: 20px !important; /* Increased spacing between icons */
    }
    
    .footer-sm-icon {
        display: inline-block !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .footer-sm-icon i {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 32px !important; /* Smaller size */
        height: 32px !important;
        font-size: 32px !important; /* Smaller icons */
        color: #fff !important;
        text-decoration: none !important;
        transition: none !important; /* Remove transitions */
    }
    
    /* Clean link styling - links are clickable */
    .footer-sm-icon a {
        text-decoration: none !important;
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
        cursor: pointer !important;
        display: inline-block;
        pointer-events: auto !important;
    }
    
    .footer-sm-icon a:hover,
    .footer-sm-icon a:focus {
        text-decoration: none !important;
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
    }
    
    /* Subtle hover effect to indicate clickability */
    .footer-sm-icon a:hover i {
        opacity: 0.8 !important;
        transition: opacity 0.2s ease;
    }
    
    .footer-sm-icon a:focus i {
        opacity: 0.8 !important;
    }
    
    /* Ensure the social column has proper spacing */
    .footer-grid > .footer-col:last-child {
        padding-top: 8px !important; /* Reduced to bring icons closer to contact content */
        padding-bottom: 6px !important; /* Reduced to bring divider line closer to icons */
    }
    
    /* Reduce divider line spacing to bring it closer to social icons, but more space before newsletter - centered */
    .footer-divider-line {
        border-top: none !important;
        height: 1px !important;
        background-color: rgba(255, 255, 255, 0.2) !important;
        max-width: 300px !important;
        margin: 6px auto 20px !important; /* Centered with auto margins */
    }
    
    /* Reduce newsletter section spacing */
    .footer-logos-heading {
        padding-top: 4px !important; /* Small padding, main space comes from divider margin */
    }
    
    /* Mobile adjustments for social icons divider */
    .footer-sm-divider {
        margin: 6px auto 20px !important;
        max-width: 280px;
    }
}

/* Desktop devices (>1024px) */
@media (min-width: 1025px) {
    /* Hide button on desktop */
    .footer-nav-button {
        display: none !important;
    }
    
    /* Reset mobile styles */
    .footer-accordion {
        display: block;
        padding: 0;
        border-bottom: none;
    }
    
    .footer-accordion.footer-col {
        padding-right: 0 !important; /* Remove arrow space on desktop */
    }
    
    .footer-item {
        display: inline-block;
        font-weight: 700; /* Bold on desktop */
        font-size: 14px; /* Keep desktop size */
        margin-bottom: 12px;
        padding: 15px 0;
        padding-right: 0;
        text-align: left; /* Left align on desktop */
    }
    
    /* Contact heading - MUST match .footer-item font size exactly on desktop */
    .footer-col .footer-heading,
    h3.footer-heading,
    .footer-heading {
        font-weight: 700; /* Bold on desktop - matches .footer-item */
        font-size: 14px; /* MUST match .footer-item font-size: 14px */
        padding: 15px 0; /* Matches .footer-item */
        margin-bottom: 12px;
        text-align: left; /* Left align on desktop */
    }
    
    /* Always show content on desktop */
    .footer-item-content {
        display: block !important;
        max-height: none !important;
        padding: 0 !important;
        overflow: visible;
    }
    
    footer .nav-arrow-icon {
        display: none !important;
    }
    
    /* Desktop adjustments for social icons divider */
    .footer-sm-divider {
        margin: 12px auto 30px;
        max-width: 250px;
    }
}

/* Smaller mobile devices (≤480px) */
@media (max-width: 480px) {
    .footer-accordion {
        padding: 18px 0; /* Slightly less padding on very small screens */
        min-height: 50px; /* Smaller min-height on small screens */
    }
    
    .footer-accordion .footer-nav-button {
        width: 40px;
        height: 50px; /* Slightly smaller height */
    }
    
    footer .nav-arrow-icon {
        width: 20px;
        height: 20px;
        font-size: 16px;
    }
    
    .footer-accordion.footer-col {
        padding-right: 40px; /* Adjust for smaller button */
    }
    
    .footer-item {
        font-size: 17px; /* Increased from 15px to 17px for better readability */
        font-weight: 600; /* Semi-bold */
        line-height: 1.3; /* Better line spacing */
        padding-top: 15px; /* Fixed top padding */
        padding-bottom: 15px; /* Fixed bottom padding */
        padding-right: 12px; /* Space between text and arrow */
    }
    
    /* Contact heading - MUST match .footer-item font size exactly on small mobile */
    .footer-col .footer-heading,
    h3.footer-heading,
    .footer-heading {
        font-size: 17px !important; /* MUST match .footer-item font-size: 17px */
        font-weight: 600 !important; /* Semi-bold - matches .footer-item */
        line-height: 1.3 !important; /* Better line spacing - matches .footer-item */
        padding: 15px 0 !important; /* Matches .footer-item */
    }
    
    .footer-item-content a {
        font-size: 13px;
    }
    
    /* Center social icons on small mobile */
    .social-col {
        text-align: center !important; /* Center the social icons column */
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        width: 100% !important;
    }
    
    .footer-sm-wrapper {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        padding-top: 6px !important; /* Reduced to bring icons closer to contact content */
    }
    
    .footer-sm-wrapper ul {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        margin: 0 auto !important;
        padding: 0 !important;
        gap: 18px !important; /* Increased spacing between icons */
    }
    
    .footer-sm-icon {
        display: inline-block !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .footer-sm-icon i {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 28px !important; /* Smaller size for small mobile */
        height: 28px !important;
        font-size: 28px !important; /* Smaller icons */
        color: #fff !important;
        text-decoration: none !important;
        transition: none !important; /* Remove transitions */
    }
    
    /* Clean link styling - links are clickable */
    .footer-sm-icon a {
        text-decoration: none !important;
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
        cursor: pointer !important;
        display: inline-block;
        pointer-events: auto !important;
    }
    
    .footer-sm-icon a:hover,
    .footer-sm-icon a:focus {
        text-decoration: none !important;
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
    }
    
    /* Subtle hover effect to indicate clickability */
    .footer-sm-icon a:hover i {
        opacity: 0.8 !important;
        transition: opacity 0.2s ease;
    }
    
    .footer-sm-icon a:focus i {
        opacity: 0.8 !important;
    }
    
    /* Ensure the social column has proper spacing */
    .footer-grid > .footer-col:last-child {
        padding-top: 4px !important; /* Reduced to bring icons closer to contact content */
        padding-bottom: 4px !important; /* Reduced to bring divider line closer to icons */
    }
    
    /* Reduce divider line spacing to bring it closer to social icons, but more space before newsletter - centered */
    .footer-divider-line {
        border-top: none !important;
        height: 1px !important;
        background-color: rgba(255, 255, 255, 0.2) !important;
        max-width: 280px !important;
        margin: 4px auto 18px !important; /* Centered with auto margins */
    }
    
    /* Reduce newsletter section spacing */
    .footer-logos-heading {
        padding-top: 2px !important; /* Small padding, main space comes from divider margin */
    }
    
    /* Small mobile adjustments for social icons divider */
    .footer-sm-divider {
        margin: 4px auto 18px !important;
        max-width: 280px;
    }
}

.footer-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 16px;
    display: flex;
    flex-direction: column;
    gap: 0;
    align-items: stretch;
}

@media (min-width: 901px) {
    html {
        background-color: #009fe3;
        height: 100%;
    }
    
    body {
        background-color: #fff;
        min-height: 100vh;
        display: flex;
        flex-direction: column;
    }
    
    .site-footer {
        margin-top: auto;
        flex-shrink: 0;
    }
    
    .footer-content {
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 40px;
        padding: 30px 16px;
    }
    
    .footer-column {
        flex: 0 0 auto;
    }
    
    .footer-column:first-child {
        min-width: 180px;
    }
    
    .footer-column:nth-child(2) {
        min-width: 180px;
    }
    
    .footer-contact-column {
        min-width: 280px;
        display: flex;
        flex-direction: column;
        position: relative;
    }
    
    .footer-contact-column .contact-info-wrapper {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 40px;
        width: 100%;
    }
    
    .footer-contact-column .contact-info {
        flex: 0 0 auto;
    }
    
    .footer-contact-column .footer-social-column {
        flex: 0 0 auto;
        margin-top: 0;
    }
}

.footer-social-column {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-end;
    margin-top: 0;
    flex: 0 0 auto;
}

@media (min-width: 901px) {
    .footer-social-column {
        align-items: flex-start;
        justify-content: flex-start;
    }
    
    .footer-social-column .social-icons {
        flex-direction: row;
        gap: 16px;
    }
}

.footer-column h3 {
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 12px 0;
    /* text-transform: uppercase; */
    letter-spacing: 0.5px;
    line-height: 1.2;
}

.footer-accordion {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.footer-accordion-toggle {
    width: 100%;
    background: none;
    border: none;
    padding: 0;
    margin: 0 0 12px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    color: #fff;
    text-align: left;
}

.footer-accordion-toggle h3 {
    margin: 0;
}

.footer-chevron {
    width: 20px;
    height: 20px;
    stroke: #fff;
    flex-shrink: 0;
    margin-left: 12px;
    transition: transform 0.3s ease;
}

/* Mobile: chevron points right by default, rotates down when open */
@media (max-width: 900px) {
    .footer-chevron {
        transform: rotate(-90deg);
        width: 16px;
        height: 16px;
    }
    
    .footer-accordion-toggle[aria-expanded="true"] .footer-chevron {
        transform: rotate(0deg);
    }
    
    /* Make accordion toggles look like links with right arrow */
    .footer-accordion-toggle {
        width: 100%;
        text-align: left;
        justify-content: space-between;
    }
    
    .footer-accordion-toggle h3 {
        font-weight: 600;
        font-size: 16px;
    }
}

.footer-accordion-content {
    list-style: none;
    margin: 0;
    padding: 0 0 12px 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
}

.footer-accordion-content.open {
    max-height: 500px;
    padding-bottom: 12px;
}

.footer-accordion-content li {
    margin-bottom: 0;
}

.footer-contact-column h3 {
    margin: 0 0 12px 0;
}

.footer-column ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-column ul li {
    margin-bottom: 0;
}

.footer-column ul li:not(:last-child) {
    margin-bottom: 8px;
}

.footer-column ul li a {
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    line-height: 1.5;
    display: inline-block;
    transition: opacity 0.2s ease;
}

.footer-column ul li a:hover,
.footer-column ul li a:focus {
    opacity: 0.8;
    text-decoration: underline;
}

.contact-info {
    color: #fff;
    font-size: 14px;
    line-height: 1.3;
    flex: 0 0 auto;
}

.contact-info p {
    margin: 0;
    line-height: 1.3;
}

.contact-info p:not(:last-child) {
    margin-bottom: 4px;
}

.contact-info p:first-child {
    white-space: nowrap;
}

.contact-info a {
    color: #fff;
    text-decoration: none;
    display: inline-block;
    transition: opacity 0.2s ease;
    line-height: 1.5;
}

.contact-info a:hover,
.contact-info a:focus {
    opacity: 0.8;
    text-decoration: underline;
}

.social-icons {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 0;
    justify-content: flex-end;
}

@media (min-width: 901px) {
    .footer-social-column .social-icons {
        flex-direction: row;
        gap: 16px;
    }
}

.social-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-decoration: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

/* Mobile: smaller social icons, centered */
@media (max-width: 900px) {
    .social-icon {
        width: 32px;
        height: 32px;
    }
}

/* Fix hamburger visibility on very small screens */
@media (max-width: 470px) {

/*Main Content Styles - overridden by more specific responsive styles above */


  /* Give the header a bit more usable room */
  .nav-inner {
    padding: 0 12px !important;
    gap: 8px !important;
  }

  /* Hide the "Search" text so icons don't push the hamburger away */
  .nav-search-text {
    display: none !important;
  }

  /* Slightly reduce icon spacing */
  .nav-mobile-icons {
    gap: 10px !important;
    margin-left: auto !important;
  }

  /* Make sure the hamburger is ALWAYS visible and clickable */
  .nav-toggle {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;              /* good tap target */
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    margin-left: 6px !important;
    padding: 0 !important;
    z-index: 3000;            /* stay above */
  }

  /* Ensure the bars are visible */
  .nav-toggle .hamburger,
  .nav-toggle .hamburger::before,
  .nav-toggle .hamburger::after {
    background: #58585a !important;
  }

  /* Optional: slightly smaller logo to free space */
  .nav-logo img {
    height: 26px !important;
  }
}

.social-icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
}

.social-icon:hover,
.social-icon:focus {
    opacity: 0.8;
    transform: scale(1.1);
}

.footer-divider {
    width: 100vw;
    height: 1px;
    background-color: #fff;
    margin: 0;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

.footer-newsletter {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 16px;
    text-align: center;
}

.footer-newsletter h2 {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 12px 0;
    letter-spacing: 0.5px;
}

.newsletter-image {
    max-width: 50px;
    width: auto;
    height: auto;
    display: block;
    margin: 0 auto;
}

.footer-legal {
    background-color: #1F6381;
    padding: 12px;
    width: 100%;
}

.footer-legal-content {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    justify-content: center;
    font-size: 13px;
}

.footer-legal-link {
    color: #fff;
    text-decoration: none;
    opacity: 0.9;
    transition: opacity 0.2s ease;
    font-size: 13px;
    white-space: nowrap;
}

.footer-legal-link:hover,
.footer-legal-link:focus {
    opacity: 1;
    text-decoration: underline;
}

@media (max-width: 640px) {
    .footer-legal {
        padding: 12px 16px;
    }
    
    .footer-legal-content {
        flex-direction: column;
        gap: 8px;
        text-align: center;
        font-size: 12px;
        justify-content: flex-start;
        align-items: flex-start;
    }
    
    .footer-legal-link {
        font-size: 12px;
        opacity: 0.9;
        white-space: normal;
    }
}

/* Responsive Footer - Mobile only */
@media (max-width: 900px) {
    /* Reduce main content padding on mobile */
    main.main-content {
        padding-top: 40px !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        padding-bottom: 60px !important;
    }
    
    .site-footer {
        margin-top: 0;
    }
    
    .footer-content {
        flex-direction: column;
        gap: 0;
        padding: 0;
    }
    
    .footer-column {
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        padding: 0;
        width: 100%;
    }
    
    /* Accordion items - Our Services and About Us */
    .footer-accordion {
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        padding: 12px 16px 8px 16px;
    }
    
    .footer-accordion-toggle {
        padding: 0;
        min-height: auto;
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .footer-accordion-toggle h3 {
        font-weight: 600;
        font-size: 16px;
        margin: 0;
        line-height: 1.2;
    }
    
    .footer-accordion-content {
        padding: 0;
        margin: 0 0 16px 0;
    }
    
    .footer-accordion-content.open {
        padding-bottom: 0;
        margin-bottom: 16px;
    }
    
    .footer-accordion-content li {
        padding: 4px 0;
    }
    
    .footer-accordion-content li a {
        color: #fff;
        text-decoration: none;
        font-size: 14px;
    }
    
    /* Contact section - always visible, not accordion */
    .footer-contact-column {
        width: 100%;
        padding: 20px 16px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }
    
    .footer-contact-column h3 {
        margin: 0 0 16px 0;
        padding-top: 0;
        font-weight: 600;
        font-size: 16px;
    }
    
    .contact-info {
        margin-bottom: 20px;
        font-size: 14px;
        line-height: 1.3;
    }
    
    .contact-info p {
        margin: 0 0 4px 0;
    }
    
    .contact-info p:first-child {
        white-space: normal;
    }
    
    .contact-info a {
        color: #fff;
        text-decoration: none;
    }
    
    /* Social icons in contact section on mobile */
    .footer-contact-column .footer-social-column {
        width: 100%;
        padding: 0;
        margin-top: 20px;
        border-bottom: none;
        justify-content: center;
    }
    
    .footer-contact-column .footer-social-column .social-icons {
        padding: 0;
        margin: 0 auto;
        gap: 12px;
        justify-content: center;
    }
    
    .footer-contact-column .footer-social-column .social-icon {
        width: 32px;
        height: 32px;
    }
    
    /* Newsletter section */
    .footer-newsletter {
        padding: 30px 16px;
        text-align: center;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }
    
    .footer-newsletter h2 {
        margin: 0 0 16px 0;
        font-size: 16px;
        font-weight: 600;
    }
    
    /* Footer legal links - mobile responsive */
    .footer-legal {
        padding: 16px;
        background-color: #1F6381;
    }
    
    .footer-legal-content {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 12px;
        text-align: left;
        align-items: center;
        justify-content: flex-start;
    }
    
    .footer-legal-link {
        font-size: 13px;
        display: inline-block;
        white-space: nowrap;
    }
}

/* Hide footer divider on mobile */
@media (max-width: 900px) {
    .footer-divider {
        display: none;
    }
}

/* Desktop: Always show accordion content */
@media (min-width: 901px) {
    .footer-accordion-toggle {
        pointer-events: none;
        padding: 0;
        margin: 0 0 20px 0;
    }
    
    .footer-chevron {
        display: none;
    }
    
    .footer-accordion-content {
        max-height: none;
        padding: 0;
    }
    
    .footer-accordion {
        border-bottom: none;
    }
    
    .footer-column {
        border-bottom: none;
    }
    
    /* Desktop: Show social icons in contact section, positioned to the right */
    .footer-contact-column {
        display: flex;
        flex-direction: column;
    }
    
    .footer-social-column {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
    }
    
    .footer-social-column .social-icons {
        flex-direction: row;
        gap: 16px;
        margin-top: 0;
        justify-content: flex-start;
    }
    
    .footer-column {
        display: flex;
        flex-direction: column;
    }
    
    /* Reduce main content padding on mobile */
    .main-content {
        padding-top: 40px !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

/* Optional: further project styles can go here */


/* =========================================
   FOOTER STYLES (Replicating polygongroup.com/de-DE)
   ========================================= */
.site-footer {
    background-color: #009FE3; /* Polygon Blue */
    color: #fff;
    font-family: 'Brandon', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 13px; /* Reduced from 16px to match screenshot */
    padding-top: 30px;
}

.footer-main {
    max-width: 1430px; /* Increased from 1200px to match reference */
    margin: 0 auto;
    padding: 0 15px; /* Base padding */
    box-sizing: border-box;
}

.footer-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 25px;
}

/* ===========================================
   FOOTER TITLE VERTICAL ALIGNMENT FIX
   =========================================== */

@media (max-width: 1024px) {
    /* Fix for accordion container padding */
    .footer-accordion.footer-col {
        padding: 20px 0 20px 0 !important; /* Consistent vertical padding */
    }
    
    /* Fix for contact column padding */
    .footer-col:not(.footer-accordion) {
        padding: 20px 0 20px 0 !important; /* Match accordion padding */
    }
    
    /* Make ALL titles have the same styling */
    .footer-item,
    .footer-heading,
    h3.footer-heading {
        /* Exact same font properties */
        font-weight: 600 !important;
        font-size: 18px !important;
        line-height: 1.3 !important;
        
        /* Exact same positioning */
        padding: 0 !important;
        margin: 0 !important;
        
        /* Exact same height and display */
        height: auto !important;
        display: inline-block !important;
        vertical-align: baseline !important;
        
        /* Text alignment */
        text-align: left !important;
    }
    
    /* Specifically fix the contact heading to match accordion items */
    .footer-col .footer-heading {
        margin-bottom: 12px !important; /* Add the same bottom margin as accordion content has */
    }
    
    /* Ensure arrow button doesn't affect vertical alignment */
    .footer-accordion .footer-nav-button {
        top: 20px !important; /* Align with the container padding */
    }
}

/* For small mobile devices */
@media (max-width: 480px) {
    .footer-accordion.footer-col,
    .footer-col:not(.footer-accordion) {
        padding: 18px 0 18px 0 !important; /* Slightly reduced padding */
    }
    
    .footer-item,
    .footer-heading,
    h3.footer-heading {
        font-size: 17px !important; /* Consistent font size */
    }
    
    .footer-accordion .footer-nav-button {
        top: 18px !important; /* Adjust arrow position */
    }
}

/* Base footer heading style - desktop default, overridden by media queries for mobile */
.footer-heading {
    color: #fff;
    font-weight: 700;
    font-size: 14px; /* Desktop size - matches .footer-item */
    margin-bottom: 12px;
    margin-top: 0;
    display: inline-block;
    padding: 15px 0;
    line-height: 1.2;
    text-align: left;
}

.footer-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-list li {
    margin-bottom: 8px; /* Tighter spacing */
}

.footer-list a {
    color: #fff;
    text-decoration: none;
    font-weight: 400;
    transition: opacity 0.2s;
    font-size: 13px;
}

.footer-list a:hover {
    opacity: 0.8;
    text-decoration: underline;
}

.footer-contact-info p {
    margin: 0 0 3px;
    line-height: 1.4;
    font-size: 13px;
}

.footer-contact-info a {
    color: #fff;
    text-decoration: none;
}

/* Social Icons (Redesigned) */
.footer-sm-wrapper {
    display: flex;
    justify-content: center; /* Center the wrapper */
    align-items: center;
    padding-top: 20px; /* Reduced to bring icons closer to contact content */
    width: 100%;
}

.footer-sm-wrapper ul {
    display: flex;
    justify-content: center; /* Center the icons */
    align-items: center;
    gap: 20px; /* Increased spacing between icons */
    list-style: none;
    padding: 0;
    margin: 0 auto; /* Center horizontally */
}

.footer-sm-icon {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.footer-sm-icon i {
    color: #fff;
    font-size: 32px !important; /* Smaller size */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    transition: none; /* Remove all transitions */
    text-decoration: none !important; /* Remove any text decoration */
}

/* Remove all link styling - icons are no longer links */
.footer-sm-icon a {
    text-decoration: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    display: inline-block;
    pointer-events: auto !important;
}

.footer-sm-icon a:hover,
.footer-sm-icon a:focus,
.footer-sm-icon a:active {
    text-decoration: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Subtle hover effect to indicate clickability */
.footer-sm-icon a:hover i {
    opacity: 0.8 !important; /* Slight opacity change on hover */
    transition: opacity 0.2s ease;
}

.footer-sm-icon a:focus i {
    opacity: 0.8 !important;
}

/* Divider Line */
.footer-divider-line {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    margin: 8px 0 25px; /* Closer to social icons (top), more space before newsletter (bottom) */
    width: 100%;
}

/* Center divider line on mobile/tablet */
@media (max-width: 1024px) {
    .footer-divider-line {
        border-top: none;
        height: 1px;
        background-color: rgba(255, 255, 255, 0.2);
        max-width: 300px;
        margin: 6px auto 20px !important; /* Centered with auto margins */
    }
}

/* White divider line under social media icons */
.footer-sm-divider {
    border: 0;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.2);
    margin: 8px auto 25px;
    width: 100%;
    max-width: 300px; /* Limit width for better visual */
    display: block;
}

/* Footer Logos Section (Replaces Newsletter) */
.footer-logos {
    display: flex;
    justify-content: center;
    text-align: center;
    padding-bottom: 0;
    width: 100%;
}

.footer-logos-heading {
    color: #fff;
    font-size: 16px; /* Updated to match reference */
    font-weight: 700;
    margin-bottom: 0;
    margin-top: 0;
    padding-top: 8px; /* Reduced to bring closer to divider line */
    text-align: center;
    text-transform: none;
}

.footer-logos-images {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.footer-logos-images img {
    height: 48px; /* Slightly increased from 40px */
    width: auto;
    margin: 50px auto;
}

@media (min-width: 640px) {
    .footer-logos-images {
        flex-direction: row;
    }
}

/* Bottom Legal Bar (Redesigned) */
.legal-wrapper {
    background-color: #1F6381;
    min-height: 45.6px;
    display: flex;
    align-items: center;
}

.legal-wrapper .grid-item-12 {
    padding: 0; /* Match inspector box model */
}

.legal-ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 20px;
}

.legal-ul .legal-ul {
    display: flex;
    gap: 20px;
    padding: 0;
    margin: 0;
}

.legal-li {
    display: flex;
    align-items: center;
    position: relative;
    padding-right: 20px;
}

.legal-li:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    height: 14px;
    width: 1px;
    background-color: rgba(255, 255, 255, 0.163);
}

.legal-li a {
    color: #ccc; /* Gray color */
    text-decoration: none;
    font-size: 12px;
    font-family: Brandon, Calibri W01 Regular_904604, helvetica, sans-serif;
    font-weight: 400;
    line-height: 1.5;
    transition: color 0.3s ease;
}

.legal-li a:hover {
    color: #fff; /* White on hover */
    text-decoration: none; /* No underline */
}

/* =========================================
   FOOTER LEGAL LINKS - CENTERED MULTI-LINE ALIGNMENT
   ========================================= */

/* Mobile and Tablet devices (≤1024px) */
@media (max-width: 1024px) {
    /* Legal wrapper adjustments for mobile */
    .legal-wrapper {
        padding: 12px 0 !important;
        min-height: auto !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }
    
    /* Container adjustments */
    .legal-wrapper .grid-container {
        padding: 0 16px !important;
        width: 100% !important;
    }
    
    /* Legal links list - centered and wraps */
    .legal-ul {
        text-align: center !important; /* Center the text */
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: center !important; /* Center items horizontally */
        align-items: center !important;
        gap: 8px 16px !important; /* 8px vertical, 16px horizontal gap */
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Fix for any nested ul */
    .legal-ul .legal-ul {
        display: contents !important;
        width: 100% !important;
    }
    
    /* Legal list items */
    .legal-li {
        display: inline-flex !important;
        align-items: center !important;
        padding: 0 8px !important; /* Horizontal padding only */
        margin: 0 !important;
        white-space: nowrap !important;
    }
    
    /* Vertical separator line between items (only on same line) */
    .legal-li:not(:last-child)::after {
        content: "" !important;
        position: absolute !important;
        right: -8px !important; /* Position between items */
        height: 12px !important;
        width: 1px !important;
        background-color: rgba(255, 255, 255, 0.163) !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
    }
    
    /* Remove separator for last item in container */
    .legal-li:last-child::after {
        display: none !important;
    }
    
    /* Legal link text */
    .legal-li a {
        font-size: 12px !important;
        line-height: 1.4 !important;
        white-space: nowrap !important;
        color: #ccc !important;
        text-decoration: none !important;
        padding: 4px 0 !important;
    }
    
    /* Hover effect */
    .legal-li a:hover {
        color: #fff !important;
    }
}

/* Small mobile devices (≤480px) like 375px */
@media (max-width: 480px) {
    .legal-ul {
        gap: 6px 12px !important; /* Tighter spacing on small screens */
        justify-content: center !important;
    }
    
    .legal-li {
        padding: 0 6px !important;
    }
    
    .legal-li a {
        font-size: 11px !important;
        line-height: 1.3 !important;
    }
    
    /* Adjust separator position for tighter spacing */
    .legal-li:not(:last-child)::after {
        right: -6px !important;
        height: 10px !important;
    }
}

/* Very small screens (≤375px) */
@media (max-width: 375px) {
    .legal-ul {
        gap: 4px 10px !important; /* Even tighter spacing */
    }
    
    .legal-li {
        padding: 0 4px !important;
    }
    
    .legal-li a {
        font-size: 10px !important;
        line-height: 1.2 !important;
    }
    
    .legal-li:not(:last-child)::after {
        right: -5px !important;
        height: 8px !important;
    }
}

/* Tablet devices (481px - 768px) */
@media (min-width: 481px) and (max-width: 768px) {
    .legal-ul {
        gap: 8px 20px !important;
    }
    
    .legal-li {
        padding: 0 10px !important;
    }
    
    .legal-li a {
        font-size: 12px !important;
    }
    
    .legal-li:not(:last-child)::after {
        right: -10px !important;
        height: 12px !important;
    }
}

/* Desktop styles (≥1025px) - Keep original layout */
@media (min-width: 1025px) {
    .legal-wrapper {
        justify-content: flex-start !important;
    }
    
    .legal-ul {
        text-align: left !important;
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
        gap: 20px !important;
    }
    
    .legal-li {
        padding-right: 20px !important;
        position: relative !important;
    }
    
    .legal-li:not(:last-child)::after {
        content: "";
        position: absolute;
        right: 0;
        height: 14px;
        width: 1px;
        background-color: rgba(255, 255, 255, 0.163);
        top: 50%;
        transform: translateY(-50%);
    }
    
    .legal-li a {
        font-size: 12px !important;
    }
}

/* Utilities */
.no-margin {
    margin: 0 !important;
}

.grid-container {
    max-width: 1430px;
    margin: 0 auto;
    width: 100%;
    padding: 0 15px;
    box-sizing: border-box;
}

/* Grid System */
.grid-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

.grid-row:after, .grid-row:before {
    content: "";
    display: table;
}

.grid-row:after {
    clear: both;
}

.grid-item-12 {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    box-sizing: border-box;
    flex: 0 0 100%;
    max-width: 100%;
}

/* Responsive */
@media (max-width: 900px) {
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .footer-col {
        margin-bottom: 20px;
    }
    
    .social-col .social-icons {
        justify-content: flex-start;
    }
    
    .footer-main {
        padding: 0 15px; /* Mobile padding */
    }
}

@media (min-width: 960px) {
    .footer-main {
        padding: 0 15px; /* Reduced to match user screenshot */
    }
}

/* Tablet + mobile navigation + megamenu adjustments */
@media (max-width: 1024px) {
    .top-tools {
        display: none !important;
    }

    body {
        padding-top: 60px !important;
    }

    .main-nav {
        top: 0 !important;
        height: 60px !important;
    }

    .nav-underline {
        display: none !important;
    }

    .nav-inner {
        padding: 0 16px !important;
        justify-content: space-between !important;
        gap: 12px !important;
        height: 60px !important;
    }

    .nav-mobile-icons {
        display: flex !important;
        gap: 16px;
        margin-left: auto !important;
        margin-right: 0 !important;
        align-items: center;
    }

    .nav-toggle {
        display: flex !important;
        align-items: center;
        justify-content: center;
        margin-left: 12px !important;
    }

    .nav-toggle .hamburger,
    .nav-toggle .hamburger::before,
    .nav-toggle .hamburger::after {
        transition: transform 0.2s ease, background 0.2s ease;
    }

    .nav-toggle[aria-expanded="true"] .hamburger {
        background: transparent;
    }

    .nav-toggle[aria-expanded="true"] .hamburger::before {
        top: 0;
        transform: rotate(45deg);
    }

    .nav-toggle[aria-expanded="true"] .hamburger::after {
        top: 0;
        transform: rotate(-45deg);
    }

    .nav-list {
        position: fixed !important;
        top: 60px !important;
        left: 0 !important;
        right: 0 !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0 !important;
        padding: 0 !important;
        background: #fff !important;
        display: none !important;
        box-shadow: 0 8px 20px rgba(0,0,0,0.08) !important;
        z-index: 50 !important;
        max-height: calc(100vh - 60px) !important;
        overflow-y: auto !important;
    }

    .nav-list.open {
        display: flex !important;
    }

    .nav-item {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .nav-link {
        width: 100% !important;
        padding: 16px 20px !important;
        border-bottom: 1px solid #e6e6e6 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px;
        font-size: 15px !important;
        letter-spacing: normal !important;
        background: #fff !important;
        color: #58585a !important;
    }

    .nav-item.open > .nav-link {
        background: #009fe3 !important;
        color: #fff !important;
        border-bottom-color: transparent !important;
    }

    .nav-item.has-megamenu > .nav-link::after {
        content: "";
        position: static !important;
        margin-left: auto;
        width: 20px !important;
        height: 20px !important;
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18L15 12L9 6' stroke='%2358585a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        transform: rotate(0deg);
        background-color: transparent !important;
        opacity: 1 !important;
        flex-shrink: 0;
        display: inline-block;
        transition: transform 0.3s ease;
    }

    .nav-item.open > .nav-link::after {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18L15 12L9 6' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        transform: rotate(90deg);
    }

    .nav-item:not(.has-megamenu) > .nav-link::after {
        content: none !important;
    }

    .megamenu {
        position: static !important;
        width: 100% !important;
        box-shadow: none !important;
        padding: 0 !important;
        border-top: none !important;
        display: none !important;
    }

    .nav-item.open > .megamenu {
        display: block !important;
    }

    .megamenu-inner {
        padding: 0 !important;
    }

    .megamenu-grid {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
        margin: 0 !important;
    }

    .megamenu-image {
        order: 0 !important;
        margin: 0 !important;
    }

    .megamenu-image img {
        display: none !important;
    }

    .megamenu-caption {
        font-size: 16px !important;
        font-weight: 600 !important;
        margin: 0 !important;
        padding: 14px 20px !important;
        border-bottom: 1px solid #e6e6e6 !important;
    }

    .megamenu-list-wrap {
        max-height: none !important;
        overflow: visible !important;
        padding: 0 !important;
    }

    .megamenu-list {
        padding: 0 20px !important;
    }

    .megamenu-list-item {
        border-bottom: 0 !important;
    }

    .megamenu-list-item a {
        height: auto !important;
        padding: 14px 0 !important;
        font-size: 16px !important;
        white-space: normal !important;
    }

    .megamenu-list-item a .title {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    .megamenu-list-item .chev {
        width: 20px !important;
        height: 20px !important;
    }

    /* Mobile hamburger menu: Restructure to show sub-items under parent items */
    .megamenu-list-item[data-sub] {
        position: relative;
    }

    /* Hide the chevron SVG on mobile for items with sub-items - replace with arrow */
    .megamenu-list-item[data-sub] > a .chev {
        display: none !important;
    }

    /* Add expand/collapse arrow for items with sub-items on mobile */
    .megamenu-list-item[data-sub] > a {
        position: relative;
    }

    .megamenu-list-item[data-sub] > a::after {
        content: "";
        position: static !important;
        margin-left: auto;
        margin-right: 0;
        width: 22px !important;
        height: 22px !important;
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18L15 12L9 6' stroke='%2358585a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        transform: rotate(0deg);
        transition: transform 0.3s ease, background-image 0.3s ease;
        display: inline-block;
        padding-left: 12px;
        flex-shrink: 0;
    }

    .megamenu-list-item[data-sub].expanded > a::after {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18L15 12L9 6' stroke='%23009fe3' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        transform: rotate(90deg);
    }
    
    .megamenu-list-item[data-sub] > a:hover::after {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18L15 12L9 6' stroke='%23009fe3' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    }

    /* Hide sub-items by default on mobile */
    .megamenu-sub {
        display: none !important;
    }
    
    /* Disable hover effects on mobile for megamenu items */
    .megamenu-list-item[data-sub]:hover {
        background: transparent !important;
    }
    
    .megamenu-list-item[data-sub] > a:hover {
        color: #58585a !important;
    }
    
    /* Remove underline for items with data-sub attributes on mobile (all states: hover, focus, active, visited, and expanded) */
    .megamenu-list-item[data-sub] a .title,
    .megamenu-list-item[data-sub] a:hover .title,
    .megamenu-list-item[data-sub] a:focus .title,
    .megamenu-list-item[data-sub] a:active .title,
    .megamenu-list-item[data-sub] a:visited .title,
    .megamenu-list-item[data-sub].expanded a .title,
    .megamenu-list-item[data-sub].expanded a:hover .title,
    .megamenu-list-item[data-sub].expanded a:focus .title,
    .megamenu-list-item[data-sub].expanded a:active .title,
    .megamenu-list-item[data-sub].expanded a:visited .title {
        text-decoration: none !important;
        text-underline-offset: 0 !important;
    }
    
    /* Also override the @supports color-mix rule for mobile */
    @supports (color: color-mix(in srgb, currentColor 80%, black 20%)) {
        .megamenu-list-item[data-sub] a:hover .title,
        .megamenu-list-item[data-sub] a:focus .title,
        .megamenu-list-item[data-sub] a:active .title,
        .megamenu-list-item[data-sub].expanded a .title,
        .megamenu-list-item[data-sub].expanded a:hover .title,
        .megamenu-list-item[data-sub].expanded a:focus .title,
        .megamenu-list-item[data-sub].expanded a:active .title {
            text-decoration: none !important;
            text-underline-offset: 0 !important;
        }
    }
    
    /* MOBILE ONLY: Style expanded items: blue text, bold, no underline, no background change */
    /* This only applies to hamburger menu (max-width: 1024px), desktop styles remain unchanged */
    
    /* FIX: Remove ALL underline styles for expanded items on mobile */
    .megamenu-list-item[data-sub].expanded > a .title,
    .megamenu-list-item[data-sub].expanded a .title {
        text-decoration: none !important;
    }
    
    /* FIX: Ensure the link itself doesn't have underline in expanded state */
    .megamenu-list-item[data-sub].expanded > a {
        background: transparent !important;
        color: #009fe3 !important;
        text-decoration: none !important;
    }
    
    .megamenu-list-item[data-sub].expanded > a .title {
        color: #009fe3 !important;
        text-decoration: none !important;
    }
    
    /* FIX: Remove any border or pseudo-element underlines for expanded items */
    .megamenu-list-item[data-sub].expanded > a::before {
        display: none !important;
        content: none !important;
    }
    
    /* FIX: Make sure chevron arrow color is consistent (keep the ::after for arrow) */
    .megamenu-list-item[data-sub].expanded > a::after {
        background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 18L15 12L9 6' stroke='%23009fe3' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
        transform: rotate(90deg);
    }
    
    /* FIX: Remove any hover underline effects for expanded items */
    .megamenu-list-item[data-sub].expanded > a:hover .title,
    .megamenu-list-item[data-sub].expanded > a:focus .title,
    .megamenu-list-item[data-sub].expanded > a:active .title,
    .megamenu-list-item[data-sub].expanded a:hover .title,
    .megamenu-list-item[data-sub].expanded a:focus .title,
    .megamenu-list-item[data-sub].expanded a:active .title {
        text-decoration: none !important;
    }
    
    /* FIX: Ensure expanded link itself has no underline on hover/focus/active */
    .megamenu-list-item[data-sub].expanded > a:hover,
    .megamenu-list-item[data-sub].expanded > a:focus,
    .megamenu-list-item[data-sub].expanded > a:active {
        text-decoration: none !important;
    }
    
    /* CRITICAL FIX: Override the problematic rule from index.html that applies to all viewports */
    /* This rule: .megamenu:not(.about):not(.case-studies) .megamenu-list-item:not(.active):hover>a .title */
    /* Disable hover underline entirely on mobile for items with submenus */
    .megamenu:not(.about):not(.case-studies) .megamenu-list-item[data-sub]:not(.active):hover>a .title,
    .megamenu:not(.about):not(.case-studies) .megamenu-list-item[data-sub].expanded:not(.active):hover>a .title,
    .megamenu:not(.about):not(.case-studies) .megamenu-list-item[data-sub].expanded > a .title {
        text-decoration: none !important;
    }
    
    /* Disable hover underline for ALL items on mobile (not just data-sub) */
    .megamenu:not(.about):not(.case-studies) .megamenu-list-item:not(.active):hover>a .title {
        text-decoration: none !important;
    }
    
    /* Fix for "ÜBER UNS" (About) section - remove hover underline on mobile */
    .megamenu.about .megamenu-list-item:not(.active):hover>a,
    .megamenu.about .megamenu-list-item:not(.active):hover>a .title {
        text-decoration: none !important;
    }
    
    /* Make expanded items in About section blue with no underline */
    .megamenu.about .megamenu-list-item[data-sub].expanded > a,
    .megamenu.about .megamenu-list-item[data-sub].expanded > a .title,
    .megamenu.about .megamenu-list-item[data-sub].expanded:hover > a,
    .megamenu.about .megamenu-list-item[data-sub].expanded:hover > a .title {
        color: #009fe3 !important;
        text-decoration: none !important;
    }
    
    /* Prevent hover from showing sub-lists on mobile */
    .megamenu-list-item[data-sub]:hover + .mobile-sub-items {
        display: none !important;
    }

    /* Show sub-items directly under parent item when expanded on mobile */
    .megamenu-list-item[data-sub].expanded + .mobile-sub-items {
        display: block !important;
    }

    .mobile-sub-items {
        display: none !important;
        padding: 0 0 8px 16px;
        margin: 0 0 0 16px;
        list-style: none;
        border-left: 2px solid #009fe3;
    }
    
    .megamenu-list-item[data-sub].expanded + .mobile-sub-items {
        display: block !important;
        margin-top: 8px;
        margin-bottom: 16px;
    }

    .mobile-sub-items li {
        padding: 8px 0 !important;
        border-bottom: none !important;
    }

    .mobile-sub-items li:last-child {
        border-bottom: none;
    }

    /* Style for parent link item inside mobile submenu */
    .mobile-sub-items .mobile-parent-link-item {
        border-bottom: 1px solid rgba(0, 159, 227, 0.1);
        margin-bottom: 8px;
        padding-bottom: 12px;
        padding-top: 12px;
    }

    /* Style for child items in mobile submenu */
    .mobile-sub-items li:not(.mobile-parent-link-item) {
        padding: 10px 0;
        border-bottom: 1px solid rgba(0, 159, 227, 0.05);
    }

    .mobile-sub-items li a {
        font-size: 14px !important;
        color: #58585a !important;
        text-decoration: none !important;
        display: block;
        white-space: normal !important;
        line-height: 1.5;
        padding: 0;
    }

    .mobile-sub-items li a:hover {
        color: var(--tool-bg) !important;
    }

    /* Mobile submenu - Parent link should always be grey (#58585a) */
    .mobile-sub-items li:first-child a,
    .mobile-sub-items li:first-child a.mobile-parent-link,
    .mobile-sub-items li.mobile-parent-link-item a,
    .mobile-sub-items li.mobile-parent-link-item a.mobile-parent-link,
    .mobile-sub-items .mobile-parent-link {
        color: #58585a !important;
        font-weight: 600 !important;
    }

    /* Ensure hover doesn't change the parent link color */
    .mobile-sub-items li:first-child a:hover,
    .mobile-sub-items li:first-child a.mobile-parent-link:hover,
    .mobile-sub-items li.mobile-parent-link-item a:hover,
    .mobile-sub-items li.mobile-parent-link-item a.mobile-parent-link:hover,
    .mobile-sub-items .mobile-parent-link:hover,
    .mobile-sub-items li:first-child a:focus,
    .mobile-sub-items li:first-child a.mobile-parent-link:focus,
    .mobile-sub-items li.mobile-parent-link-item a:focus,
    .mobile-sub-items li.mobile-parent-link-item a.mobile-parent-link:focus,
    .mobile-sub-items .mobile-parent-link:focus,
    .mobile-sub-items li:first-child a:visited,
    .mobile-sub-items li:first-child a.mobile-parent-link:visited,
    .mobile-sub-items li.mobile-parent-link-item a:visited,
    .mobile-sub-items li.mobile-parent-link-item a.mobile-parent-link:visited,
    .mobile-sub-items .mobile-parent-link:visited {
        color: #58585a !important;
    }

    /* Make sure the parent link doesn't get blue from other rules */
    .mobile-sub-items li:first-child a.mobile-parent-link,
    .mobile-sub-items li.mobile-parent-link-item a.mobile-parent-link {
        color: #58585a !important;
    }

    /* Prevent any blue color from overriding */
    .mobile-sub-items li:first-child a:not(.mobile-parent-link),
    .mobile-sub-items li.mobile-parent-link-item a:not(.mobile-parent-link) {
        color: #58585a !important;
    }

    .mobile-sub-items li a .chev {
        display: none !important;
    }

    .sub-inner {
        padding-right: 0 !important;
    }

    .sub-title {
        font-size: 14px !important;
        font-weight: 600 !important;
        margin: 12px 0 8px !important;
    }

    .sub-list li {
        padding: 6px 0 !important;
    }

    .sub-list li a {
        font-size: 14px !important;
        white-space: normal !important;
    }

    /* Parent link in mobile submenu - ALWAYS grey */
    .megamenu-list-item[data-sub].expanded + .mobile-sub-items li:first-child a,
    .megamenu-list-item[data-sub].expanded + .mobile-sub-items .mobile-parent-link-item a,
    .megamenu-list-item[data-sub].expanded + .mobile-sub-items .mobile-parent-link {
        color: #58585a !important;
        font-weight: 600 !important;
        text-decoration: none !important;
    }
    
    /* Ensure hover doesn't change it */
    .megamenu-list-item[data-sub].expanded + .mobile-sub-items li:first-child a:hover,
    .megamenu-list-item[data-sub].expanded + .mobile-sub-items .mobile-parent-link-item a:hover,
    .megamenu-list-item[data-sub].expanded + .mobile-sub-items .mobile-parent-link:hover {
        color: #58585a !important;
        text-decoration: underline !important;
    }
}

@media (max-width: 470px) {
    .nav-inner {
        padding: 0 12px !important;
        gap: 8px !important;
    }

    .nav-search-text {
        display: none !important;
    }

    .nav-mobile-icons {
        gap: 10px !important;
        margin-left: auto !important;
    }

    .nav-toggle {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        min-width: 44px;
        min-height: 44px;
        margin-left: 6px !important;
        padding: 0 !important;
        z-index: 3000;
    }

    .nav-toggle .hamburger,
    .nav-toggle .hamburger::before,
    .nav-toggle .hamburger::after {
        background: #58585a !important;
    }

    .nav-toggle[aria-expanded="true"] .hamburger {
        background: transparent !important;
    }

    .nav-logo img {
        height: 26px !important;
    }
}