@media (max-width: 1199.98px) {
    * {
        scrollbar-width: 0;
    }

    *::-webkit-scrollbar {
        width: 0;
        height: 0;
    }
}

@media (max-width: 575.98px) {
    html {
        font-size: calc(1vw / 5);
    }

    h1 {
        font-size: 32rem;
    }

    h2 {
        font-size: 28rem;
    }

    h3 {
        font-size: 24rem;
    }

    .section {
        padding: 40rem 0;
    }

    .bar__menu {
        width: 45rem;
        height: 45rem;
        border-radius: 50%;
        border: 2rem solid var(--accent);
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        user-select: none;
        flex: 0 0 auto;
        z-index: 1;
    }

    .bar__menu span {
        display: flex;
        width: 50%;
        height: 2rem;
        background-color: var(--accent);
        position: relative;
        transition: background-color .4s ease;
    }

    .bar__menu span::before, .bar__menu span::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 2rem;
        background-color: var(--accent);
        transition: transform .4s ease;
    }

    .bar__menu span::before {
        top: -5rem;
    }

    .bar__menu span::after {
        top: 5rem;
    }

    .bar__menu.active span {
        background-color: transparent;
    }

    .bar__menu.active span::after {
        top: 0;
        transform: rotate(225deg) translateY(-50%);
    }

    .bar__menu.active span::before {
        top: 0;
        transform: rotate(-225deg) translateY(-50%);
    }

    .header__title img {
        width: 170rem;
    }

    .header__title span {
        font-size: 24rem;
    }

    .header__nav {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: var(--blue);
        transition: transform .4s ease;
        transform: translateY(-100%);
        overflow-y: auto;
        padding: 30rem;
        justify-content: center;
    }

    .header__link {
        text-transform: uppercase;
        font-size: 22rem;
    }

    .header__nav.open {
        display: flex;
    }

    .header__nav.active {
        transform: translateY(0);
    }

    .header__nav ul {
        gap: var(--gap);
        font-size: 22rem;
        text-transform: uppercase;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .block__table td {
        padding: 15rem;
    }

    .block__heading {
        flex-direction: column;
        align-items: flex-start;
    }

    .cards {
        grid-template-columns: repeat(1, 1fr);
    }

    .block__video-img {
        height: 330rem;
    }

    .block__video-play {
        width: 75rem;
        height: 75rem;
    }

    .block__video-play::before {
        border-width: 10rem 0 10rem 20rem;
    }

    .block__info-content {
        grid-template-columns: repeat(1, 1fr);
    }

    .block__info {
        border-radius: 100rem;
    }

    .block__questions {
        grid-template-columns: repeat(1, 1fr);
    }

    .block__half-content {
        grid-template-columns: repeat(1, 1fr);
    }

    .hero {
        margin-bottom: 350rem;
    }

    .hero::before {
        height: 100%;
    }

    .hero .block__title {
        width: 100%;
    }

    .hero-down {
        bottom: -200rem;
    }

    .hero__item-bottom {
        margin-left: auto;
        margin-right: auto;
    }

    .hero .block__half-right .hero__item-img {
        margin-top: 0;
    }

    .hero__img {
        bottom: -27%;
        min-width: 100%;
    }

    .advantages__content {
        grid-template-columns: repeat(2, 1fr);
    }

    .works__container {
        border-radius: 100rem;
        min-height: auto;
    }

    .works__list {
        position: relative;
        z-index: 1;
    }

    .works__circle {
        opacity: .3;
    }

    .works__list-item:nth-child(n+1) {
        margin-left: 0;
        width: 100%;
        margin-top: 40rem;
    }

    .taking .block__half-content > * {
        width: 100%;
        margin-left: 0;
    }

    .taking__item-img {
        right: 0;
    }

    .manual {
        padding-bottom: 0;
    }

    .manual__container {
        border-radius: 100rem 100rem 0 0;
    }

    .manual__block-item:first-child {
        margin-top: 30rem;
    }

    .manual__block {
        padding: 40rem 30rem;
    }

    .manual__img {
        left: 0;
    }

    .modal .modal__body {
        min-width: 90%;
    }

    .modal__inner {
        padding: 30rem;
    }

    .footer__title img {
        width: 170rem;
    }

    .footer__title span {
        font-size: 24rem;
    }

    .footer__content {
        flex-direction: column;
        align-items: flex-start;
    }

    html[lang="kz"] .block__half-left .hero__item-bottom .btn {
        margin-left: 0;
    }
}

@media (min-width: 575.99px) {
    .cards[data-grid='4'] {
        grid-template-columns: repeat(4, 1fr);
    }

    .cards[data-grid='4'] .card__img {
        height: 190rem;
    }

    .cards[data-grid='4'] .card__title {
        font-size: 18rem;
    }
}

@media (min-width: 1920.98px) {
    html {
        font-size: calc(1vw / 20);
    }
}

@media not (hover: none) {
    a:hover:not(.btn) {
        color: var(--accent);
    }

    .btn:not(.no-hover):hover {
        background-color: var(--blue);
        color: #fff;
    }

    .btn-blue:hover, .header .btn:hover {
        background-color: var(--accent);
        color: var(--black);
    }

    .btn-transparent.btn-blue:hover {
        background-color: var(--blue);
        color: #fff;
    }

    .faq__item:hover {
        background-color: var(--blue);
        color: #fff;
    }

    .faq__item:hover .faq__question::before, .faq__item:hover .faq__question::after {
        background-color: #fff;
    }

    a.block__questions-item:hover {
        color: var(--blue);
    }

    .block__video-img:hover .block__video-play {
        background-color: var(--blue);
    }
}