/* Shared service directory: reuse the theme's cards, colours and typography. */
.service-category-links,
.service-related-links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.service-category-links { justify-content: center; }
.service-related-links .btn-outline-premium { white-space: normal; }
.service-group:nth-of-type(odd) { background: var(--bg-light); }
.service-group,
.service-directory [id] { scroll-margin-top: 110px; }
.service-card-title { font-size: 1.375rem; }
.service-card-title a { color: var(--text-primary); }
.service-card-title a:hover { color: var(--primary); }
.service-detail-image { width: 100%; border-radius: var(--radius-md); }
.premium-page-title h1 { overflow-wrap: break-word; }
.service-category-links .btn-outline-premium { white-space: normal; text-align: center; }

.main-navbar a:focus-visible,
.main-navbar button:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
}
.dropdown-menu-premium a[aria-current="page"] {
    color: var(--primary);
    background: var(--primary-light);
}
.mega-menu-overview {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 12px;
    margin-bottom: 16px;
}

@media (min-width: 992px) {
    .main-navbar .navbar { position: relative; }
    .main-navbar .navbar-nav .nav-mega-item { position: static; }
    .main-navbar .nav-item-row { display: flex; align-items: center; }
    .main-navbar .sub-toggle {
        border: 0;
        background: transparent;
        color: var(--text-muted);
        font-size: 0.72rem;
        width: 26px;
        height: 36px;
        padding: 0;
        cursor: pointer;
        flex: 0 0 26px;
    }
    .main-navbar .nav-item.show-sub .sub-toggle { color: var(--primary); }
    .main-navbar .nav-item.show-sub .sub-toggle i { transform: rotate(180deg); }
    .main-navbar .navbar-nav .nav-item.has-sub > .nav-item-row > .nav-link { padding-right: 0; }
    .main-navbar .navbar-nav .nav-link-ai-consulting { min-width: 132px; }
    .main-navbar .nav-item .dropdown-menu-premium.dropdown-mega {
        width: min(820px, calc(100vw - 48px));
        min-width: 0;
        max-height: calc(100dvh - 120px);
        overflow-y: auto;
    }
    .main-navbar .dropdown-mega .mega-column { min-width: 0; }
    .main-navbar .nav-item .dropdown-menu-premium.services-mega {
        width: min(1000px, calc(100vw - 48px));
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        row-gap: 20px;
    }
    .services-mega .mega-menu-overview { grid-column: 1 / -1; margin-bottom: 0; }
    .services-mega .mega-column:nth-child(4) { border-right: none; }
    .main-navbar .nav-item.has-sub > .dropdown-menu-premium,
    .main-navbar .nav-item.has-sub:hover > .dropdown-menu-premium {
        opacity: 0;
        visibility: hidden;
        transform: translateY(10px);
    }
    .main-navbar .nav-item.has-sub > .dropdown-mega,
    .main-navbar .nav-item.has-sub:hover > .dropdown-mega {
        transform: translateX(-50%) translateY(10px);
    }
    .main-navbar .nav-item.has-sub.show-sub > .dropdown-menu-premium {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
    .main-navbar .nav-item.has-sub.show-sub > .dropdown-mega {
        transform: translateX(-50%) translateY(0);
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .main-navbar .navbar-nav .nav-link { padding-left: 10px; padding-right: 10px; }
    .main-navbar .navbar-nav .nav-link-ai-consulting { min-width: 124px; }
    .main-navbar .nav-quote-btn { min-width: 156px; padding-left: 16px; padding-right: 16px; }
}

@media (max-width: 991.98px) {
    body.mobile-nav-open .gtranslate_wrapper { display: none; }
    .main-navbar .nav-item.has-sub > .dropdown-menu-premium.dropdown-mega {
        display: none !important;
        max-height: none;
    }
    .main-navbar .nav-item.has-sub.show-sub > .dropdown-menu-premium.dropdown-mega {
        display: flex !important;
    }
    .mega-menu-overview { margin: 0; padding: 8px 0; }
    .main-navbar .mega-menu-overview a { padding-left: 18px !important; }
    .main-navbar .dropdown-mega .mega-column { min-width: 0; }
    .service-related-links .btn-outline-premium { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .main-navbar .navbar-collapse,
    .main-navbar .dropdown-menu-premium,
    .mobile-nav-overlay { transition: none; }
}
