@media (min-width: 769px)  and (max-width: 1600px) {
    .header-wrap {
        width: 1320px;
    }
    .pp-items {
        max-width: 1320px;
    }
    .ps-sidebar {
        padding: 20px 20px 64px 20px;
    }
    .promotion-calc {
        width: 1320px;
    }
    .pcl-el-wrap {
        height: 370px;
    }
    .promotion-form {
        width: 1320px;
    }
    .promotion-questions {
        width: 1320px;
    }
    .footer-wrap {
        max-width: 1320px;
    }
}

@media (max-width: 1366px) {
    /* HEADER */
    header {
        position: fixed;
        background: #101010;
        margin-top: 0;
        z-index: 2;
        padding: 0;
    }
    .header-wrap {
        width: 100%;
        height: 42px;
        margin: 12px auto 12px;
    }
    .header-menu, .header-right {
        display: none;
    }
    .header-logo img {
        max-width: 170px;
        margin-left: 10px;
    }
    .header-menu-mobile {
        display: block;
    }
    .header-left {
        width: 100%;
        justify-content: space-between;
        margin-right: 20px;
    }

}

@media (min-width: 769px) and (max-width: 1366px) {
    .promo-text {
        padding: 0 20px;
        text-align: center;
    }
    .promotion-control {
        padding: 0 20px;
    }
    .promotion-problems {
        padding: 0 20px;
    }
    .promotion-scroll {
        padding: 0 20px;
    }
    .pcl-head {
        max-width: 100%;
    }
    .promotion-calc {
        width: 100%;
    }
    .pcl-elements {
        flex-wrap: wrap;
        justify-content: center;
    }
    .pcl-el-wrap {
        width: 45%;
    }
    .promotion-form {
        width: 100%;
        padding: 0 20px;
    }
    .pf-body {
        flex-direction: column;
    }
    .promotion-questions {
        width: 100%;
        padding: 0 20px 40px 20px;
    }
    .details__title {
        padding: 25px 80px 25px 0;
    }
    .footer-wrap {
        max-width: 100%;
        flex-wrap: wrap;
        padding: 0 20px;
    }
}

@media (max-width: 768px) {
    .button-purple-1, .button-purple-2 {
        padding: 12px 0;
        border-radius: 8px;
        font-size: 14px;
    }
    .hsl-button.arrow-button {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    body .hsl-button.arrow-button:after {
        top: 2px;
    }
    .mobile {
        display: block;
    }
    .desktop {
        display: none;
    }




    /* PROMOTION */
    .promotion {
        background-position: center top 60px;
        background-size: 150%;
    }
    .promotion-start {
        height: 70vh;
    }
    .promo-head {
        flex-direction: column;
        font-size: 34px;
        margin-top: 40px;
    }
    .ph-img img {
        max-width: 93px;
    }
    .promo-text {
        font-size: 18px;
        padding: 0 16px;
        text-align: center;
    }
    .promo-buttons > a {
        width: 156px;
    }


    /* PROMOTION MARQUEE */
    .pm-items {
        padding: 7px 0;
    }
    .pm-item {
        font-size: 14px;
        padding: 20px;
    }


    /* PROMOTION CONTROL */
    .promotion-control {
        margin-top: 40px;
        padding: 0 16px;
    }
    .pc-head {
        font-size: 22px;
        margin-bottom: 18px;
    }
    .pc-text {
        font-size: 18px;
        margin: 0 auto 26px;
    }
    .pc-cards-wrap {
        flex-direction: column;
    }
    .pc-card {
        width: 100%;
        padding: 16px;
    }
    .pcc-head {
        font-size: 48px;
        margin-bottom: 5px;
    }
    .pcc-head-s {
        font-size: 24px;
        margin-bottom: 24px;
    }
    .pcc-body {
        font-size: 16px;
    }
    .pc-cards-of {
        font-size: 16px;
    }


    /* PROMOTION PROBLEMS */
    .promotion-problems {
        margin-top: 40px;
        padding: 0 16px;
    }
    .pp-head {
        font-size: 22px;
        margin-bottom: 24px;
    }
    .pp-item {
        flex-direction: column;
        margin-bottom: 20px;
    }
    .ppi-el {
        flex-direction: column;
        gap: 10px;
    }
    .ppi-text, .ppi-head {
        font-size: 16px;
    }
    .ppi-left {
        align-items: flex-start;
    }
    .ppi-left img {
        height: 16px;
    }
    .ppi-half {
        gap: 8px;
    }


    /* PROMOTION SCROLL */
    .promotion-scroll {
        display: none;
    }
    .promotion-scroll-mobile {
        display: flex;
        padding: 0 16px;
        background-image: url('img/promo.svg');
        background-repeat: no-repeat;
        background-position: top 110px right -60px;
        background-size: 230%;
    }
    .psm-wrap {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 40px;
    }
    .psm-item .title {
        font-family: Cygre600, serif;
        font-size: 22px;
        margin-bottom: 16px;
        max-width: 90%;
    }
    .psm-item .desc {
        font-size: 16px;
        margin-bottom: 16px;
    }
    .psm-item img {
        width: 100%;
        border-radius: 8px;
        border: none;
        background: none;
    }


    /* PROMOTION CALC */
    .promotion-calc {
        width: 100%;
        margin-top: 40px;
        padding: 0 16px;
    }
    .pcl-head {
        font-size: 22px;
        margin: 0 auto 40px;
    }
    .pcl-elements {
        flex-direction: column;
    }
    .pcl-el {
        padding: 16px;
    }
    .pcl-el-wrap {
        width: 100%;
        height: fit-content;
    }
    .pcl-el-head {
        font-size: 22px;
        margin-bottom: 22px;
    }
    .pcl-el-body-s {
        font-size: 28px;
    }
    .pcl-el-body {
        font-size: 22px;
    }
    .calc-price, .pcl-price-rub {
        font-size: 34px;
    }


    /* PROMOTION FORM */
    .promotion-form {
        width: 100%;
        padding: 0 16px;
        margin-top: 40px;
    }
    .pf-head {
        font-size: 22px;
        margin-bottom: 40px;
    }
    .pf-body {
        flex-direction: column;
        margin-top: 16px;
    }
    .pf-el {
        background: transparent;
        padding: 0;
    }
    .pfe-bubbles {
        flex-wrap: wrap;
        gap: 16px;
    }
    .pfe-bubble {
        font-size: 16px;
    }
    .pf-tabs {
        font-size: 18px;
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
    }
    .pf-tab {
        border: 1px solid #383397;
        padding: 20px 20px;
        border-radius: 50px;
        line-height: 0;
        display: flex;
        transition: 0.3s;
    }
    .pf-tab.active, .pf-tab:hover {
        background: #383397;
    }
    .pf-right {
        display: none;
    }
    .pfe-head {
        display: none;
    }
    .pfe-steps {
        margin: 24px 0 24px;
        gap: 20px;
    }
    .pfe-step {
        gap: 24px;
        flex-direction: column;
    }
    .pf-step-left {
        height: 28px;
    }
    .pf-step-head {
        font-family: LTS500, serif;
        font-size: 18px;
    }
    .pf-step-body {
        font-size: 16px;
    }


    /* PROMOTION QUESTIONS */
    .promotion-questions {
        width: 100%;
        padding: 0 16px 40px 16px;
        margin: 40px auto 0;
        font-size: 18px;
        background-position: bottom -440px center;
        background-size: 210%;
    }
    .pq-head {
        font-size: 22px;
        margin-bottom: 24px;
    }
    .details {
        margin: 0 auto;
    }
    .details__title {
        padding: 20px 40px 20px 0;
    }
    .details[open] .details__title {
        position: relative;
    }
    .details .details__title::before, .details .details__title::after {
        top: 50%;
        right: 0;
    }
    .details[open] .details__title {
        margin-bottom: 0;
    }


    /* FOOTER */
    footer {
        padding: 30px 0;
    }
    .footer-wrap {
        flex-direction: column;
        padding: 0 20px;
        max-width: 100%;
        gap: 40px;
    }
    .footer-logo {
        text-align: center;
    }
    .footer-logo img {
        max-width: 238px;
    }
    .fc-1, .fc-2, .fc-3, .fc-4 {
        max-width: 100%;
    }
    .fc-1 .fc-body {
        display: none;
    }
    .fc-head {
        margin-top: 0;
        font-size: 24px;
    }
    .footer-column {
        text-align: center;
    }
    .footer-rights {
        font-family: Cygre400, serif;
        font-size: 14px;
        color: #878787;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .fcb-links a, .fcb-links a:visited {
        color: #9FA4D6;
    }
    .fcb-links div, .fcb-links div:first-of-type {
        text-decoration: underline;
        text-underline-position: under;
        text-decoration-color: #9FA4D6;
    }
    .fcb-small {
        display: flex;
        flex-direction: column;
    }
    .footer-socials {
        gap: 15px;
        justify-content: center;
        margin-bottom: 30px;
    }
    .footer-socials img {
        width: 40px;
    }
    .fc-4 .fc-head {
        margin-bottom: 16px;
    }
    .fc-4 .fc-body {
        gap: 10px;
    }
    .smallest {
        font-size: 14px;
    }
}