/* Desktop service menu: keep service groups visible in columns instead of
   opening overlapping third-level fly-outs. Mobile retains the theme's
   existing expandable menu behaviour. */
@media (min-width: 1200px) {
    .main-menu > ul > li > .services-mega-menu {
        display: grid;
        grid-template-columns: repeat(4, minmax(180px, 1fr));
        column-gap: 18px;
        row-gap: 8px;
        left: 50%;
        right: auto;
        width: 900px;
        max-width: calc(100vw - 48px);
        padding: 20px 22px 24px;
        -webkit-transform: translateX(-50%) scaleY(0);
        transform: translateX(-50%) scaleY(0);
        transform-origin: top center;
    }

    .main-menu > ul > li:hover > ul.sub-menu.services-mega-menu {
        -webkit-transform: translateX(-50%) scaleY(1) !important;
        transform: translateX(-50%) scaleY(1) !important;
    }

    .services-mega-menu > li {
        min-width: 0;
        padding: 0 10px !important;
    }

    .services-mega-menu > li:first-child {
        grid-column: 1 / -1;
        padding-bottom: 8px !important;
        border-bottom: 1px solid var(--th-border-color);
    }

    .services-mega-menu > li.menu-item-has-children > a {
        color: var(--title-color);
        font-weight: 700;
        padding-bottom: 5px;
    }

    .services-mega-menu > li.menu-item-has-children > a::after {
        display: none;
    }

    .services-mega-menu > li > ul.sub-menu {
        position: static;
        display: block;
        visibility: visible;
        opacity: 1;
        width: auto;
        min-width: 0;
        margin: 0 !important;
        padding: 3px 0 0;
        transform: none;
        transition: none;
        box-shadow: none;
        border: 0;
        background: transparent;
        z-index: auto;
    }

    .services-mega-menu > li > ul.sub-menu li {
        padding: 0 !important;
    }
}

/* Keep the expanded footer services list compact. Twelve links occupy six
   rows on tablet and desktop instead of making the footer three rows taller. */
.footer-services-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(155px, 1fr));
    column-gap: 28px;
    align-items: start;
}

@media (max-width: 575px) {
    .footer-services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 16px;
    }
}