* {
    /* outline: 2px solid red; */
}

@media screen and (max-width: 1200px) {
    .header {
        .header__items {
            .header__links {
                gap: 35px;
            }
        }
    }
    .blog {
        .blog__items {
            .blog__content {
                gap: 30px;
            }
        }
    }
    .stores {
        .stores__items {
            grid-template-columns: repeat(1, 1fr);
            .stores__map {
                height: 400px;
            }
            .stores__content {
                .stores__card {
                    .stores__card-text {
                        min-height: 30%;
                    }
                }
            }
        }
    }
    .footer {
        .footer__items {
            .footer__content {
                gap: 10px;
                align-items: center;
            }
        }
    }
}

@media screen and (max-width: 992px) {
    .header {
        .header__items {
            .header__links {
                position: fixed;
                top: 0;
                width: 50%;
                right: -200%;
                height: 100vh;
                background: #fff;
                flex-direction: column;
                justify-content: center;
                transition: 0.3s all;
                li {
                    a {
                        font-size: 14px;
                    }
                }
            }
            .header__links-active {
                right: 0;
                transition: 0.3s all;
            }
            .header__burger {
                position: relative;
                z-index: 50;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                padding: 5px 2px;
                height: 25px;
                width: 25px;
                border: none;
                background: none;
                transition: 0.3s all;
                .line {
                    display: block;
                    height: 1.8px;
                    width: 100%;
                    background: #000;
                    &:nth-child(1) {
                        width: 70%;
                        transition: 0.3s all;
                    }
                    &:nth-child(3) {
                        width: 70%;
                        transition: 0.3s all;
                    }
                    transition: 0.3s all;
                }
            }
            .header__burger-active {
                transition: 0.3s all;
                .line {
                    &:nth-child(1) {
                        width: 100%;
                        transform: translate(0px, 6px) rotate(45deg);
                        transition: 0.3s all;
                    }
                    &:nth-child(2) {
                        width: 0;
                        transition: 0.3s all;
                    }
                    &:nth-child(3) {
                        width: 100%;
                        transform: translate(0px, -7px) rotate(-45deg);
                        transition: 0.3s all;
                    }
                }
            }
        }
    }
    .promo {
        .promo__content {
            .promo__items {
                .promo__title {
                    width: 100%;
                }
            }
        }
    }
    .category {
        .category__items {
            .category__content {
                grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
                .category__item {
                    padding: 10px;
                    .category__item-text {
                        font-size: 14px;
                    }
                }
            }
        }
    }
    .blog {
        .blog__items {
            .blog__content {
                grid-template-columns: 1fr;
            }
        }
    }
    .footer {
        .footer__items {
            .footer__content {
                flex-direction: column;
                align-items: start;
                gap: 20px;
                .footer__contact {
                    text-align: left;
                    display: flex;
                    flex-direction: column;
                    gap: 20px;
                    .footer__contact-number {
                        display: block;
                        width: 100%;
                        text-align: left;
                    }
                }
            }
        }
    }
}

@media screen and (max-width: 768px) {
    :root {
        --main-title: 54px;
    }
    .about {
        .about__items {
            grid-template-columns: 1fr;
        }
    }
    .application {
        .application__items {
            grid-template-columns: 1fr;
            .application__form {
                .iti {
                    width: 100%;
                }
                .application__form-name,
                .application__form-number,
                .application__form-btn {
                    width: 100%;
                }
            }
        }
    }
    .category {
        .category__items {
            .category__content {
                gap: 20px;
                .category__item {
                    .category__item-text {
                        font-size: 12px;
                    }
                }
            }
        }
    }
}

@media screen and (max-width: 576px) {
    :root {
        --main-title: 38px;
        --title: 22px;
    }
    .header {
        .header__items {
            padding-inline: 20px;
        }
    }
    .blog {
        .blog__items {
            .blog__content {
                .blog__text {
                    .blog__btn {
                        width: 100%;
                    }
                }
            }
        }
    }
    .category {
        .category__items {
            .category__content {
                grid-template-columns: repeat(2, 1fr);
                gap: 20px;
            }
        }
    }
}