@media (max-width: 1200px) {
    .demos__stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .demos__stats {
        grid-template-columns: 1fr;
    }

    .demos__hero-map {
        font-size: 1.5rem;
    }

    .demos__team b {
        font-size: 2.25rem;
    }

    .demos__hero-content {
        padding: 1rem;
    }
}

@media (max-width: 992px) {
    .demos-setup__columns {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 768px) {
    .demos-settings__toggles {
        grid-template-columns: minmax(0, 1fr);
    }

    .demos-setup__intro {
        padding: 1.5rem 1rem;
    }
}

@media (max-width: 576px) {
    .demos-setup__row-info {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.125rem;
    }
}

@media (max-width: 768px) {
    .demos__hero-thumb {
        width: 7.5rem;
    }
}

@media (max-width: 576px) {
    .demos__hero-head {
        gap: 0.875rem;
    }

    .demos__hero-thumb {
        width: 5.5rem;
        border-radius: var(--br-8);
    }
}


/* FIX (cs2.uz): filtrlar tepada bitta qatorda, demolar to'liq kenglikda - qatorda 4 ta */
.demos__filters--top {
    position: static !important;
}

.demos__filters--top .card-header {
    display: none;
}

@media (min-width: 993px) {
    .demos__filters--top form {
        display: grid;
        grid-template-columns: minmax(12rem, 1.4fr) repeat(3, minmax(9rem, 1fr)) auto auto;
        align-items: end;
        gap: 0.75rem;
    }

    /* hamma maydon, kalit va tugma bitta pastki chiziqda */
    .demos__filters--top .inputs-inline {
        margin: 0 !important;
        justify-content: flex-end;
    }

    .demos__filters--top .inputs-inline > label,
    .demos__filters--top .adaptive-select-wrapper {
        margin: 0 !important;
    }

    .demos__filters--top .demos__switch {
        align-self: end !important;
        margin: 0 !important;
        height: 36px;
        display: flex !important;
    }

    .demos__filters--top .demos__switch > label {
        white-space: nowrap;
        margin: 0 !important;
    }

    .demos__filters--top button[type="reset"] {
        align-self: end;
        width: auto !important;
        height: 36px;
        margin: 0 !important;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

@media (min-width: 577px) and (max-width: 992px) {
    .demos__filters--top form {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem;
    }

    .demos__filters--top .inputs-inline:first-child,
    .demos__filters--top button[type="reset"] {
        grid-column: 1 / -1;
    }
}

.demos__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1300px) {
    .demos__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    .demos__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .demos__grid {
        grid-template-columns: minmax(0, 1fr);
    }
}