/**
 * Hub cities — mobile / tablet: native smooth horizontal scroll (like homepage services).
 */

@media (max-width: 1100px) {
    .legalizacja-hub-page {
        overflow-x: hidden;
    }

    .legalizacja-hub-cities {
        padding: 36px 0 32px;
        background: #fff;
        overflow: hidden;
    }

    .legalizacja-hub-cities > .container {
        padding-left: 16px;
        padding-right: 16px;
    }

    .legalizacja-hub-cities .legalizacja-section-head {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        max-width: none;
        margin: 0 0 16px;
        text-align: left;
    }

    .legalizacja-hub-cities .legalizacja-section-head .legalizacja-results__kicker {
        display: inline-flex;
        align-self: center;
        width: auto;
        max-width: 100%;
        margin: 0 auto 14px;
        padding: 7px 16px;
        font-size: 11px;
        letter-spacing: 0.08em;
    }

    .legalizacja-hub-cities .legalizacja-section-head .ttl {
        margin-bottom: 8px;
        font-size: clamp(24px, 6vw, 30px);
        line-height: 1.18;
    }

    .legalizacja-hub-cities .legalizacja-section-head p {
        margin: 0;
        font-size: 15px;
        line-height: 1.55;
        color: #5a6d80;
    }

    .legalizacja-hub-cities__swipe {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
        margin: 0 0 14px;
        padding: 0 16px;
    }

    .legalizacja-hub-cities__swipe-label {
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        color: #8fa3b8;
    }

    .legalizacja-hub-cities__swipe-icon {
        display: block;
        flex: 0 0 auto;
        width: 34px;
        height: 22px;
        animation: legalizacjaHubSwipeHint 2.4s ease-in-out infinite;
    }

    @keyframes legalizacjaHubSwipeHint {
        0%,
        100% {
            transform: translateX(0);
            opacity: 0.72;
        }
        50% {
            transform: translateX(5px);
            opacity: 1;
        }
    }

    .legalizacja-hub-cities__cta-wrap {
        display: none !important;
    }

    .legalizacja-hub-cities .legalizacja-hub-city-card__slide--other {
        display: block !important;
    }

    .legalizacja-hub-cities__viewport {
        position: relative;
        max-width: none;
        width: 100%;
        margin: 0;
        padding: 0;
        overflow: visible;
    }

    .legalizacja-hub-cities.is-slider-mode .legalizacja-hub-cities__track {
        display: flex !important;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 16px;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 16px 8px;
        grid-template-columns: unset !important;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        scroll-behavior: smooth;
        scroll-snap-type: x proximity;
        scroll-padding-inline: 16px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        cursor: grab;
    }

    .legalizacja-hub-cities.is-slider-mode .legalizacja-hub-cities__track::-webkit-scrollbar {
        display: none;
    }

    .legalizacja-hub-cities.is-slider-mode .legalizacja-hub-cities__track.is-dragging {
        cursor: grabbing;
        scroll-snap-type: none;
        scroll-behavior: auto;
        user-select: none;
    }

    .legalizacja-hub-cities.is-slider-mode .legalizacja-hub-city-card__slide {
        flex: 0 0 min(320px, calc(100vw - 48px));
        width: min(320px, calc(100vw - 48px));
        min-width: 0;
        scroll-snap-align: start;
        scroll-snap-stop: normal;
    }

    .legalizacja-hub-city-card {
        width: 100%;
        aspect-ratio: 4 / 5;
        min-height: 360px;
        border-radius: 22px;
        box-shadow: 0 14px 34px rgba(9, 43, 150, 0.14);
        transform: none;
        animation: none;
        touch-action: manipulation;
    }

    .legalizacja-hub-city-card__media img {
        transform: scale(1.12);
        object-position: center center;
    }

    .legalizacja-hub-city-card__shine {
        display: none;
    }

    .legalizacja-hub-city-card__overlay {
        background: linear-gradient(
            180deg,
            rgba(9, 20, 45, 0.06) 0%,
            rgba(9, 20, 45, 0.38) 46%,
            rgba(9, 20, 45, 0.92) 100%
        );
    }

    .legalizacja-hub-city-card__body {
        gap: 8px;
        padding: 20px 18px 18px;
    }

    .legalizacja-hub-city-card__region {
        padding: 5px 10px;
        font-size: 10px;
        letter-spacing: 0.07em;
    }

    .legalizacja-hub-city-card__title {
        display: block;
        overflow: visible;
        font-size: clamp(19px, 5vw, 22px);
        line-height: 1.2;
        text-shadow: 0 6px 18px rgba(0, 0, 0, 0.28);
    }

    .legalizacja-hub-city-card--other .legalizacja-hub-city-card__title {
        font-size: clamp(18px, 4.8vw, 21px);
        line-height: 1.22;
    }

    .legalizacja-hub-city-card__office {
        display: block;
        overflow: visible;
        font-size: 13px;
        line-height: 1.45;
        color: rgba(255, 255, 255, 0.88);
    }

    .legalizacja-hub-city-card__btn {
        align-self: flex-start;
        min-height: 38px;
        margin-top: 8px;
        padding: 10px 16px;
        font-size: 11px;
        letter-spacing: 0.04em;
        box-shadow: 0 8px 20px rgba(35, 128, 235, 0.3);
        animation: legalizacjaHubCityBtnGlowMobile 2.8s ease-in-out infinite;
    }

    @keyframes legalizacjaHubCityBtnGlowMobile {
        0%,
        100% {
            box-shadow: 0 8px 20px rgba(35, 128, 235, 0.3);
        }
        50% {
            box-shadow: 0 10px 24px rgba(35, 128, 235, 0.4), 0 0 12px rgba(126, 200, 255, 0.22);
        }
    }

    .legalizacja-hub-city-card:hover,
    .legalizacja-hub-city-card:focus-visible {
        transform: none;
        box-shadow: 0 14px 34px rgba(9, 43, 150, 0.14);
    }

    .legalizacja-hub-city-card:hover .legalizacja-hub-city-card__media img {
        transform: scale(1.12);
        filter: none;
    }

    .legalizacja-hub-city-card:hover .legalizacja-hub-city-card__btn {
        transform: none;
        filter: none;
    }

    .legalizacja-hub-offices {
        margin-top: 24px;
        padding: 16px 14px;
        border-radius: 16px;
    }

    .legalizacja-hub-offices__head p {
        font-size: 14px;
    }

    .legalizacja-hub-offices__grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .legalizacja-hub-offices__card {
        padding: 14px;
        border-radius: 14px;
    }

    .legalizacja-hub-offices__title {
        font-size: 15px;
    }
}

@media (max-width: 1100px) and (prefers-reduced-motion: reduce) {
    .legalizacja-hub-cities__swipe-icon,
    .legalizacja-hub-city-card__btn {
        animation: none;
    }
}