/* Mobile-only Swiper presentation for the small news cards. */

.dt-news-events__cards-pagination {
    display: none;
}

.dt-news-events__cards .swiper-wrapper {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 27px;
}

@media (max-width: 1199px) {
    .dt-news-events__cards .swiper-wrapper {
        gap: 18px;
    }
}

@media (max-width: 599px) {
    .dt-news-events__cards.swiper {
        display: block;
        width: 100%;
        margin-top: 14px;
        padding: 0 0 5px;
        overflow: hidden;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-y;
    }

        .dt-news-events__cards.swiper .swiper-wrapper {
            display: flex;
            gap: 0;
            align-items: stretch;
            will-change: transform;
        }

        .dt-news-events__cards.swiper .swiper-slide {
            flex: 0 0 auto;
            width: calc(100% - 22px);
            height: auto;
            min-height: 100%;
            margin: 0;
        }

        .dt-news-events__cards.swiper .htk-activity-card > a {
            height: 100%;
            padding: 0 0 3px;
        }

        .dt-news-events__cards.swiper .htk-img {
            height: 180px;
        }

        .dt-news-events__cards.swiper strong {
            margin-top: 11px;
            font-size: 15px;
        }

        .dt-news-events__cards.swiper p {
            margin-bottom: 0;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

    .dt-news-events__cards-pagination {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 18px;
        margin: 8px 0 0;
        gap: 6px;
    }

        .dt-news-events__cards-pagination .swiper-pagination-bullet {
            display: block;
            width: 7px;
            height: 7px;
            margin: 0 !important;
            border: 0;
            border-radius: 50%;
            background: #a8c6d4;
            opacity: 1;
            -webkit-transition: width .25s ease, border-radius .25s ease, background .25s ease;
            transition: width .25s ease, border-radius .25s ease, background .25s ease;
        }

        .dt-news-events__cards-pagination .swiper-pagination-bullet-active {
            width: 22px;
            border-radius: 8px;
            background: #0c2997;
        }

    .dt-news-events__cards.swiper .swiper-slide:focus-within {
        outline: 3px solid rgba(17, 148, 160, .35);
        outline-offset: -3px;
        border-radius: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dt-news-events__cards-pagination .swiper-pagination-bullet {
        -webkit-transition: none;
        transition: none;
    }
}