.dt-about-figma__media .dt-about-gallery-thumbs {
    display: block;
    width: 100%;
    overflow: hidden;
}

.dt-about-gallery-thumbs .swiper-wrapper {
    display: flex;
    align-items: stretch;
}

.dt-about-gallery-thumbs .swiper-slide {
    flex: 0 0 calc((100% - 14px) / 3);
    width: calc((100% - 14px) / 3);
    height: 179px;
}

.dt-about-gallery-thumb {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    overflow: hidden;
    border: 3px solid #fff;
    border-radius: 20px;
    background: #eef9fd;
    cursor: pointer;
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.dt-about-gallery-thumb img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: center;
    border: 0 !important;
    border-radius: 15px !important;
    transition: transform .28s ease, filter .28s ease;
}

.dt-about-gallery-thumb:hover img,
.dt-about-gallery-thumb:focus-visible img {
    transform: scale(1.035);
    filter: saturate(1.04);
}

.dt-about-gallery-thumb.is-active {
    border-color: #24aef5;
    box-shadow: 0 0 0 2px rgba(36, 174, 245, .35);
}

.dt-about-gallery-thumb:focus-visible {
    outline: 3px solid #fdde51;
    outline-offset: 3px;
}

.dt-about-gallery-main {
    transition: box-shadow .2s ease;
}

.dt-about-gallery-main .dt-about-figma__main-image {
    transform: scale(1);
    opacity: 1;
    transition: opacity .22s ease, transform .45s ease;
}

.dt-about-gallery-main.is-changing .dt-about-figma__main-image {
    opacity: .22;
    transform: scale(1.045);
}

.dt-about-gallery-main:hover .dt-about-figma__main-image {
    transform: scale(1.012);
}

@media (max-width: 1100px) {
    .dt-about-gallery-thumbs .swiper-slide {
        height: auto;
        aspect-ratio: 293 / 179;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dt-about-gallery-thumb,
    .dt-about-gallery-thumb img,
    .dt-about-gallery-main .dt-about-figma__main-image {
        transition: none;
    }
}