@media (min-aspect-ratio: 16/9) {
    .video-modal-content {
        width: 0;
        height: calc(100vh - 10em);
        padding-top: 0;
        padding-left: calc((100vh - 10em) * 1.7778);
        /* 16:9 calc */
    }
}

@media screen and (max-width:1300px) {
    .brief .container {
        width: 100%
    }
    .order .parallax-bottom {
        top: 300px
    }
}

@media screen and (max-width:1200px) {
    .brief .container,
    .container {
        width: 960px
    }
    .header-menu {
        width: 580px;
        flex-wrap: wrap;
        justify-content: center
    }
    .header-menu li,
    .header-menu li:last-child {
        margin-right: 20px;
        margin-left: 20px;
        margin-top: 12px
    }
    .header-up .logo {
        width: 180px
    }
    .brief-img img,
    .contacts-img img,
    .header-main__illustration img,
    .logo img {
        max-width: 100%;
        height: auto
    }
    .header-up__right {
        flex-direction: column
    }
    .header-phone {
        margin-right: 0;
        margin-bottom: 10px
    }
    .header-main {
        padding-top: 28px
    }
    .header-main__illustration {
        width: 250px
    }
    .header-main__content h1 {
        font-size: 85px;
        line-height: 85px
    }
    .header-main__content p {
        font-size: 24px;
        line-height: 30px;
        margin: 15px 0 30px
    }
    .header-main__illustration:first-child {
        margin-top: 150px
    }
    .header-bottom img {
        /* max-width: 90%; */
        margin-left: auto;
        margin-right: auto
    }
    .advantage-item {
        width: 295px
    }
    .advantage-title {
        width: 500px
    }
    .portfolio-slider {
        width: 100%
    }
    .portfolio-slider {
        max-width: 1100px
    }
    .order-item {
        width: 49%
    }
    .order-item__title {
        padding: 0 35px
    }
    .work-item {
        width: 290px
    }
    .brief-img {
        width: 500px
    }
    .brief-content {
        margin-left: 0
    }
    .brief-content__text {
        width: 420px
    }
    .brief-box {
        justify-content: space-between
    }
    .team-slider__item {
        width: 305px
    }
    .contacts-img {
        width: 560px
    }
    .contacts-box {
        align-items: center
    }
    .order .parallax-top {
        top: -500px
    }
    .order .parallax-bottom {
        top: 350px
    }
    .modal-wrapper {
        max-width: 94%;
    }
    .modal-brief-wrapper {
        padding: 80px 50px 70px;
    }
    .back-images img {
        max-width: 60%;
        height: auto;
    }
    .technical-item__head p {
        width: auto;
        max-width: 90%;
    }
    .modal-up .up {
        height: 440px;
    }
    .header-video {
        width: 560px;
        height: 340px;
        top: 135px;
        left: calc(50% - 260px);
    }
    .header-video::before {
        width: 640px;
        height: 400px;
        top: calc(50% - 189px);
        left: calc(50% - 320px);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
    }
    .header-video-slider__item {
        padding-bottom: 335px;
    }
}

@media screen and (max-width:992px) {
    .brief .container,
    .container,
    .header-up__box {
        width: 720px
    }
    .header {
        padding-top: 80px
    }
    .header-up {
        background: #fff;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 3;
        box-shadow: 0 4px 30px rgba(86, 92, 189, .08)
    }
    .header-up__box {
        padding: 10px 0
    }
    .header-menu {
        position: fixed;
        bottom: 0;
        height: calc(100vh - 80px);
        flex-direction: column;
        align-items: center;
        width: 100%;
        background: url(../images/header-mobile-back.jpg);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        flex-wrap: nowrap;
        overflow-y: scroll;
        left: 0;
        clip-path: circle(0px at 0 0px);
        transition: all .5s ease
    }
    .header-menu li,
    .header-menu li:last-child {
        margin: 20px 0
    }
    .header-menu li a {
        font-weight: 700;
        text-align: center;
        color: #fff;
        font-size: 24px
    }
    .header-up__right {
        flex-direction: row
    }
    .header-phone {
        margin-bottom: 0
    }
    .lang {
        margin: 0 15px
    }
    .burger-menu {
        display: block;
        width: 30px;
        height: 24px;
        transform: rotate(0);
        transition: .3s ease-in-out;
        cursor: pointer;
        z-index: 3
    }
    .burger-menu span {
        display: block;
        position: absolute;
        width: 100%;
        z-index: 100;
        opacity: 1;
        left: 0;
        transform: rotate(0);
        transition: .35s ease-in-out;
        height: 4px;
        background-color: #f99746;
        border-radius: 5px
    }
    .burger-menu span:nth-child(1) {
        top: 0
    }
    .burger-menu span:nth-child(2),
    .burger-menu span:nth-child(3) {
        top: 10px
    }
    .burger-menu span:nth-child(4) {
        top: 20px
    }
    .burger-menu.active span:nth-child(1) {
        top: 8px;
        width: 0%;
        left: 50%
    }
    .burger-menu.active span:nth-child(2) {
        top: 9px;
        transform: rotate(45deg);
        width: 30px
    }
    .burger-menu.active span:nth-child(3) {
        transform: rotate(-45deg);
        width: 30px
    }
    .burger-menu.active span:nth-child(4) {
        top: 8px;
        width: 0%;
        left: 50%
    }
    .header-main__content h1 {
        font-size: 65px;
        line-height: 65px
    }
    .header-main__illustration {
        width: 200px
    }
    .header-main__illustration {
        width: 190px
    }
    .header-main__illustration:first-child {
        margin-top: 120px
    }
    .header-bottom {
        margin-top: -10px
    }
    .header-menu.active {
        clip-path: circle(100%)
    }
    .title {
        font-size: 50px;
        line-height: 65px
    }
    .subtitle span {
        font-size: 15px;
        line-height: 15px
    }
    .subtitle {
        margin-bottom: 7px
    }
    .advantage-title {
        width: 400px
    }
    .advantage-item {
        width: 350px
    }
    .advantage-box {
        padding: 0
    }
    .portfolio-slider {
        padding: 0 60px
    }
    .portfolio-slider .slick-next {
        right: 5px
    }
    .portfolio-slider .slick-prev {
        left: 5px
    }
    .price-box {
        width: 100%
    }
    .price-item__up {
        padding: 33px 5px 75px
    }
    .price-item {
        width: calc(33% - 20px);
        margin: 0 10px
    }
    .order-item__img {
        height: 210px
    }
    .order-item {
        padding: 20px 15px 30px
    }
    .order-item__subtitle {
        margin: 15px 0 15px;
        font-size: 17px
    }
    .order-item__title {
        padding: 0;
        font-size: 34px;
        line-height: 44px
    }
    .reviews-left,
    .reviews-right {
        display: none
    }
    .reviews-slider {
        width: 100%
    }
    .reviews-slider__item {
        margin: 0 70px
    }
    .reviews-slider .slick-prev {
        left: 0
    }
    .reviews-slider .slick-next {
        right: 0
    }
    .work-item {
        width: 45%
    }
    .work-item:nth-child(3) {
        order: 4
    }
    .work-item:nth-child(4) {
        order: 3
    }
    .work-item:nth-child(6) {
        order: 6
    }
    .work-item:nth-child(3):before {
        transform: rotate(90deg);
        left: 120px;
        top: -45px
    }
    .work-item:nth-child(4):before {
        left: auto;
        right: -40px;
        transform: rotate(90deg);
        top: calc(50% - 50px)
    }
    .work-item:nth-child(5):before {
        top: -48px;
        right: 134px;
        transform: rotate(90deg)
    }
    .work-item:nth-child(6):before {
        right: auto;
        left: -87px;
        transform: rotate(180deg)
    }
    .brief-box {
        flex-direction: column-reverse
    }
    .brief-content,
    .brief-content .title {
        text-align: center
    }
    .brief-content__text {
        margin-left: auto;
        margin-right: auto;
        width: 540px
    }
    .brief-content .btn {
        margin-left: auto;
        margin-right: auto
    }
    .brief-img {
        width: 80%;
        margin: 40px auto 0
    }
    .brief {
        padding: 80px 0 40px;
        background-color: #def2ff
    }
    .team {
        margin-top: 0;
        padding: 100px 0 415px
    }
    .work {
        padding-bottom: 0
    }
    .team-slider__item {
        width: 340px
    }
    .contacts-img {
        width: 380px;
        margin-top: 80px
    }
    .modal-title {
        width: 100%;
    }
    .modal-subtitle {
        font-size: 18px;
        line-height: 26px;
    }
    .modal-title {
        font-size: 48px;
        line-height: 60px;
    }
    .contact-info__item {
        width: calc(50% - 6px);
    }
    .technical-item__head .number {
        margin-right: 15px;
    }
    .inputs-radio label:last-child {
        margin-right: 0;
    }
    .inputs-radio label {
        margin-right: 45px;
    }
    .inputs-radio .label-file {
        margin-right: 90px;
    }
    .modal {
        padding-top: 60px;
    }
    .modal-up .up {
        left: auto;
        right: 0;
        height: 410px;
    }
    .review-box {
        padding: 45px 30px;
    }
    .modal-review .modal-wrapper {
        padding: 50px 0px 40px;
    }
    .review-inputs {
        width: calc(100% - 200px);
    }
    .review-form {
        width: 100%;
    }
    .video-modal-content {
        width: calc(100% - 1em);
        padding-top: calc((100% - 1em) * 0.5625);
        /* 16:9 calc */
    }
    .header-video {
        width: 420px;
        height: 255px;
        top: 100px;
        left: calc(50% - 200px);
    }
    .header-video::before {
        width: 480px;
        height: 300px;
        top: calc(50% - 145px);
        left: calc(50% - 239px);
    }
    .header-video-slider__item {
        padding-bottom: 250px;
    }
    .header-video-slider__item iframe {
        left: 5px;
    }
}

@media screen and (max-width:767px) {
    .brief .container,
    .container,
    .header-up__box {
        width: 540px
    }
    .header-main {
        flex-direction: column;
        padding-top: 50px
    }
    .header-main .header-main__illustration {
        display: none
    }
    .header-main__content {
        margin-top: 0
    }
    .header-bottom {
        margin-top: 60px
    }
    .advantage {
        margin-top: -40px;
        padding: 130px 0 40px
    }
    .title {
        font-size: 45px;
        line-height: 55px
    }
    .advantage-title {
        width: 315px
    }
    .advantage-item {
        width: 265px
    }
    .advantage-item__text {
        padding: 0
    }
    .portfolio {
        padding-top: 90px
    }
    .portfolio-slider__item {
        margin: 0 55px
    }
    .portfolio-slider {
        width: 575px
    }
    .portfolio-slider .slick-next {
        right: 30px
    }
    .portfolio-slider .slick-prev {
        left: 30px
    }
    .price-item {
        margin: 0 20px
    }
    .price-item__up {
        background-position: bottom
    }
    .price-box .slick-prev {
        left: 0
    }
    .price-box .slick-next {
        right: 0
    }
    .price-box .slick-list {
        padding-bottom: 30px
    }
    .order-box {
        flex-direction: column
    }
    .order-item {
        width: 100%;
        margin-top: 40px;
        padding: 30px 30px 40px
    }
    .order-item__img {
        height: auto
    }
    .reviews {
        padding: 80px 0 357px
    }
    .work .title {
        width: 100%
    }
    .work-wrapper {
        flex-direction: column
    }
    .work-item {
        width: 345px;
        margin-left: auto;
        margin-right: auto
    }
    .work-item:nth-child(2):before,
    .work-item:nth-child(3):before,
    .work-item:nth-child(4):before,
    .work-item:nth-child(5):before,
    .work-item:nth-child(6):before {
        background-image: url(../images/work-points-mobile.svg);
        height: 78px;
        width: 9px;
        left: calc(50% - 4.5px);
        top: -78px;
        transform: rotate(0)
    }
    .team-slider__item {
        width: 263px
    }
    .team {
        padding: 100px 0 350px
    }
    .work-item:nth-child(3),
    .work-item:nth-child(4),
    .work-item:nth-child(5),
    .work-item:nth-child(6) {
        order: 0
    }
    .contacts-box {
        flex-direction: column
    }
    .contacts-img {
        width: 100%
    }
    .contacts-social__item {
        flex-direction: column
    }
    .contacts-social__item img {
        margin-right: 0;
        margin-bottom: 10px
    }
    .contacts-img {
        margin-top: 40px
    }
    .contacts-content .subtitle,
    .contacts-content .title {
        text-align: center
    }
    .contacts-content .subtitle {
        padding-left: 0
    }
    .order .parallax {
        min-height: 1700px;
        width: auto
    }
    .modal-close {
        top: 25px;
        right: 25px;
        width: 25px;
        height: 25px;
    }
    .modal-wrapper {
        border-radius: 45px;
    }
    .modal-brief-wrapper {
        padding: 55px 20px 50px;
    }
    .contact-info__item label {
        font-size: 18px;
        line-height: 18px;
    }
    .modal-subtitle2 {
        width: 100%;
    }
    .modal-title {
        font-size: 40px;
        line-height: 50px;
    }
    .modal-subtitle {
        font-size: 17px;
    }
    .modal-title2 {
        font-size: 32px;
        line-height: 44px;
    }
    .inp {
        font-size: 16px;
        line-height: 16px;
        padding: 20px;
        height: 58px;
        border-radius: 10px;
    }
    .review-textarea {
        font-size: 16px;
        line-height: 16px;
        padding: 30px 20px;
    }
    .technical-item__head p {
        font-size: 16px;
        line-height: 22px;
    }
    .technical-item__head p {
        max-width: 88%;
    }
    .inputs-radio label {
        padding-left: 40px;
        font-size: 16px;
        line-height: 16px;
        margin-right: 30px;
    }
    .file-select-name {
        width: 230px;
    }
    .choice-level__item {
        margin-bottom: 30px;
    }
    .modal-up {
        margin-bottom: 110px;
    }
    .modal-up .up {
        left: auto;
        right: 0;
        height: 370px;
    }
    .modal-up .bottom {
        height: 160px;
    }
    #premium .modal-brief-wrapper,
    #medium .modal-brief-wrapper,
    #simple .modal-brief-wrapper {
        padding-bottom: 120px;
    }
    .modal-thanks .modal-wrapper {
        padding: 10px 0px 35px;
    }
    .modal-review .modal-wrapper {
        padding: 45px 0px 35px
    }
    .review-box {
        padding: 25px 30px;
        flex-direction: column;
        align-items: flex-start;
    }
    .review-inputs {
        width: 100%;
    }
    .image-input {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 10px;
    }
    .review-thanks.is-visible {
        width: 100%;
        padding: 0;
    }
    .review-thanks {
        flex-direction: column;
        padding-left: 60px !important;
        padding-right: 60px !important;
    }
    .review-thanks.is-visible {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .review-thanks__content {
        width: 100%;
        margin-left: 0;
        text-align: center;
    }
    .header-video {
        width: 315px;
        height: 191px;
        top: 83px;
        left: calc(50% - 155px);
    }
    .header-video::before {
        width: 360px;
        height: 225px;
        top: calc(50% - 105px);
        left: calc(50% - 179px);
    }
    .header-video-slider__item {
        padding-bottom: 195px;
    }
    .header-video-slider .slick-next,
    .header-video-slider .slick-prev {
        width: 60px;
        height: 60px;
    }
    .header-video-slider .slick-next {
        right: -100px;
    }
    .header-video-slider .slick-prev {
        left: -100px;
    }
}

@media screen and (max-width:576px) {
    .brief .container,
    .container,
    .header-up__box {
        width: 395px
    }
    .header-up .logo,
    .logo {
        width: 115px
    }
    .header-phone {
        font-size: 16px;
        line-height: 16px
    }
    .lang {
        width: 32px;
        height: 32px;
        margin: 0 12px 0 14px;
        font-size: 14px;
    }
    .burger-menu {
        width: 26px
    }
    .burger-menu.active span:nth-child(2) {
        top: 10px
    }
    .burger-menu.active span:nth-child(3) {
        top: 11px
    }
    .header {
        padding-top: 60px
    }
    .header-main .header-main__illustration {
        text-align: center;
        margin-top: 50px
    }
    .header-main .header-main__illustration:last-child {
        display: block;
        order: 2;
        width: 100%
    }
    .header-main__content p {
        font-size: 22px;
        margin: 22px 0 25px
    }
    .btn {
        font-size: 18px;
        line-height: 18px;
        width: 235px;
        padding: 24px 10px
    }
    .video-btn {
        padding: 24px 10px 24px 40px
    }
    .video-btn:before {
        left: 54px
    }
    .header {
        background-image: url(../images/header-background-mobile.jpg)
    }
    .header-menu {
        height: calc(100vh - 59px)
    }
    .advantage {
        background: linear-gradient(172.74deg, #125c84 7.07%, #2989be 97.72%)
    }
    .title {
        font-size: 34px;
        line-height: 44px
    }
    .subtitle span {
        font-size: 14px;
        line-height: 14px
    }
    .subtitle span:after,
    .subtitle span:before {
        width: 10px;
        height: 2px;
        border-radius: 3px;
        top: calc(50% - 2px)
    }
    .subtitle span:before {
        left: -16px
    }
    .subtitle span:after {
        right: -16px
    }
    .header-bottom img {
        width: 100%
    }
    .header-bottom {
        margin-top: 90px
    }
    .portfolio-slider {
        width: 100%;
        max-width: 450px;
        padding: 0
    }
    .portfolio {
        padding-top: 70px;
        padding-bottom: 350px
    }
    .portfolio-slider .slick-next,
    .portfolio-slider .slick-prev,
    .price-box .slick-next,
    .price-box .slick-prev,
    .reviews-slider .slick-next,
    .reviews-slider .slick-prev {
        top: auto;
        bottom: 0
    }
    .portfolio-slider .slick-list,
    .price-box .slick-list,
    .reviews-slider .slick-list {
        padding-bottom: 95px!important
    }
    .portfolio-slider .slick-next,
    .price-box .slick-next,
    .reviews-slider .slick-next {
        right: calc(50% - 60px)
    }
    .portfolio-slider .slick-prev,
    .price-box .slick-prev,
    .reviews-slider .slick-prev {
        left: calc(50% - 60px)
    }
    .reviews-slider__item {
        margin: 0
    }
    .portfolio {
        background-image: url(../images/portfolio-back-mobile.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover
    }
    .price {
        margin-top: -260px
    }
    .price-item {
        margin: 0 50px
    }
    .price-box .slick-list {
        width: 400px;
        margin-left: auto;
        margin-right: auto
    }
    .order {
        margin-top: 0;
        background-image: url(../images/order-back-mobile.jpg)!important;
        padding: 150px 0 70px
    }
    .reviews {
        padding: 80px 0 0;
        background-image: url(../images/reviews-back-mobile.jpg)
    }
    .reviews-slider__item:before {
        display: none
    }
    .reviews .container {
        position: relative
    }
    .reviews-wrapper:before {
        content: '';
        width: 63px;
        height: 47px;
        background-image: url(../images/quote-icon.svg);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        position: absolute;
        top: 200px;
        left: 0
    }
    .brief-img {
        width: 100%
    }
    .brief-content__text {
        width: 100%
    }
    .brief {
        margin-top: -25px;
        background-color: transparent;
        background-image: url(../images/brief-back-mobile.jpg);
        background-position: top center;
        background-repeat: no-repeat;
        background-size: cover;
        padding: 120px 0 40px
    }
    .work {
        margin-top: 60px
    }
    .work-item:last-child {
        margin-bottom: 0
    }
    .team-slider__item.empty {
        display: none
    }
    .team {
        background-image: url(../images/team-back-mobile.jpg);
        background-position: bottom center
    }
    .title-left .subtitle,
    .title-left .title {
        text-align: center
    }
    .title-left .subtitle {
        padding: 0
    }
    .team-slider {
        margin-top: 30px
    }
    .header-bottom .header-mobile-img {
        max-width: 100%
    }
    .advantage-title .subtitle,
    .advantage-title .title {
        text-align: left
    }
    .advantage-title .subtitle {
        padding-left: 16px
    }
    .advantage-title {
        width: 150px
    }
    .advantage-item__title {
        margin: 17px 0 15px
    }
    .advantage-item {
        width: 100%;
        max-width: 350px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 35px
    }
    .advantage-item__icon {
        height: auto
    }
    .advantage {
        box-shadow: none
    }
    .advantage-wave img {
        display: none!important
    }
    .advantage-wave .advantage-wave-mobile {
        display: block!important
    }
    .order .parallax-top {
        top: -750px
    }
    .modal-title {
        font-size: 29px;
        line-height: 40px;
    }
    .modal-subtitle {
        font-size: 16px;
        line-height: 24px;
    }
    .modal-wrapper {
        border-radius: 40px;
    }
    .modal-title2 {
        font-size: 26px;
    }
    .modal-brief-wrapper {
        padding: 55px 10px 50px;
    }
    .contact-info-wrapper {
        flex-direction: column;
    }
    .contact-info__item {
        width: 100%;
        margin-bottom: 20px;
    }
    .contact-info__item label {
        padding-left: 10px;
    }
    .technical-item__head .number {
        width: 32px;
        height: 32px;
        font-size: 14px;
        line-height: 14px;
        margin-right: 10px;
    }
    .inputs-file {
        flex-direction: column;
    }
    .inputs-file label {
        margin-right: 0;
        margin-bottom: 30px;
    }
    .inputs-file .label-file {
        margin-right: 0;
        margin-bottom: 50px;
    }
    .file-select-name {
        width: 100%;
    }
    .inputs-radio label {
        margin-right: 20px;
    }
    .inputs-file {
        margin-bottom: -30px;
    }
    .modal-up {
        margin-bottom: 90px;
    }
    .modal-up .up {
        height: 355px;
    }
    .modal-up .bottom {
        /* height: 90px; */
        left: -130px;
    }
    #premium .modal-brief-wrapper,
    #medium .modal-brief-wrapper,
    #simple .modal-brief-wrapper {
        padding-bottom: 90px;
    }
    .modal-thanks .response-title {
        margin: 10px 0px 5px;
        font-size: 45px;
    }
    .modal-thanks img {
        max-width: 100%;
    }
    .modal-thanks .response-text {
        width: 90%;
        font-size: 22px;
    }
    .response-title {
        font-size: 42px;
    }
    .review-thanks__text {
        margin-top: 10px;
        font-size: 22px;
    }
    .header-video {
        width: 280px;
        height: 170px;
        top: 35px;
        left: calc(50% - 140px);
    }
    .header-video::before {
        width: 320px;
        height: 200px;
        top: calc(50% - 94px);
        left: calc(50% - 159px);
    }
    .header-video-slider__item {
        padding-bottom: 195px;
    }
    .header-video-slider .slick-next,
    .header-video-slider .slick-prev {
        width: 50px;
        height: 50px;
    }
    .header-video-slider .slick-next {
        right: -100px;
    }
    .header-video-slider .slick-prev {
        left: -100px;
    }
    .header-video-slider__item {
        padding-bottom: 173px;
    }
    .header-video-slider .slick-arrow:before {
        height: 15px!important;
        width: 9px!important;
        position: absolute;
        top: calc(50% - 6px);
        left: calc(50% - 4px);
    }
    .header-video-slider .slick-prev:before {
        height: 15px!important;
        width: 9px!important;
        position: absolute;
        top: calc(50% - 6px);
        right: calc(50% - 4px);
    }
    .header-video-play{
        width: 50px;
        height: 50px;
        top: calc(50% - 25px);
        left: calc(50% - 25px);
    }
    .header-video-play:before{
        width: 11px;
        height: 16px;
        top: calc(50% - 6px);
        left: calc(50% - 5px);
    }
}

@media screen and (max-width:410px) {
    .brief .container,
    .container,
    .header-up__box {
        width: 345px
    }
    .header-phone {
        font-size: 14px;
        line-height: 16px
    }
    .lang ul li a {
        font-size: 12px;
        line-height: 12px
    }
    .lang {
        height: 26px;
        width: 26px
    }
    .lang ul {
        padding: 5px 0px;
    }
    .lang.active ul {
        height: 70px;
        border-radius: 85px;
    }
    .header-up__box {
        padding: 6px 0 5px
    }
    .header {
        padding-top: 50px
    }
    .header-main__content h1 {
        font-size: 60px;
        line-height: 60px
    }
    .header-main {
        padding-top: 37px
    }
    .header-main__content p {
        font-size: 20px;
        line-height: 28px;
        margin: 17px 0 20px
    }
    .btn {
        width: 220px;
        padding: 22px 10px;
        font-size: 16px;
        line-height: 16px
    }
    .video-btn {
        padding: 22px 10px 22px 40px
    }
    .video-btn:before {
        width: 12px;
        height: 15px
    }
    .header-bottom {
        margin-top: 56px
    }
    .advantage {
        margin-top: -50px
    }
    .subtitle span {
        font-size: 12px;
        line-height: 12px
    }
    .title {
        font-size: 30px;
        line-height: 38px
    }
    .advantage {
        padding: 105px 0 6px
    }
    .advantage-title {
        width: 135px
    }
    .advantage-box {
        margin-top: 25px
    }
    .advantage-item {
        margin-bottom: 45px
    }
    .advantage-item__title {
        font-size: 20px;
        line-height: 20px;
        margin: 0 0 12px
    }
    .advantage-item__text {
        font-size: 16px;
        line-height: 23px
    }
    .portfolio {
        padding-top: 55px
    }
    .portfolio-slider .slick-list {
        margin: 0
    }
    .portfolio-slider__item {
        margin: 0 16.5px;
        padding: 15px 15px 18px 15px
    }
    .portfolio-slider .slick-list {
        padding-top: 25px!important
    }
    .portfolio-slider__item h4 {
        font-size: 20px;
        line-height: 20px
    }
    .portfolio-slider__item-video {
        height: 190px
    }
    .team-slider__item {
        margin-bottom: 0
    }
    .team-slider .slick-list {
        padding-bottom: 95px!important
    }
    .portfolio-slider .slick-next,
    .portfolio-slider .slick-prev,
    .price-box .slick-next,
    .price-box .slick-prev,
    .reviews-slider .slick-next,
    .reviews-slider .slick-prev,
    .team-slider .slick-next,
    .team-slider .slick-prev {
        bottom: -2px;
        top: auto
    }
    .portfolio-slider .slick-next,
    .price-box .slick-next,
    .reviews-slider .slick-next,
    .team-slider .slick-next {
        right: calc(50% - 53px)
    }
    .portfolio-slider .slick-prev,
    .price-box .slick-prev,
    .reviews-slider .slick-prev,
    .team-slider .slick-prev {
        left: calc(50% - 53px)
    }
    .portfolio {
        padding-bottom: 293px
    }
    .header-menu {
        height: calc(100vh - 50px)
    }
    .header-menu {
        justify-content: flex-start;
        padding-top: 49px
    }
    .slick-next,
    .slick-prev {
        box-shadow: 0 2px 30px rgba(221, 42, 123, .1)
    }
    .portfolio-slider__item:before {
        width: 96%;
        left: 2%;
        box-shadow: 0 25px 49px -10px rgb(103 182 255 / 40%)
    }
    .price {
        padding-bottom: 30px
    }
    .price-box .slick-list {
        width: 100%;
        padding: 0
    }
    .price-box {
        margin-top: 26px
    }
    .price-item__text {
        height: 168px
    }
    .price-item__price {
        margin-bottom: 5px
    }
    .price-item {
        padding-bottom: 29px
    }
    .price-box .slick-next,
    .price-box .slick-prev {
        bottom: -15px
    }
    .order {
        margin-top: -30px;
        padding: 80px 0 59px
    }
    .order-item__subtitle {
        font-size: 16px;
        line-height: 24px;
        padding: 0 30px;
        margin: 34px 0 9px
    }
    .order-item__title {
        font-size: 30px;
        line-height: 42px;
        padding: 0 10px
    }
    .order-item {
        padding: 30px 15px 37px
    }
    .order-item__text {
        margin: 14px 0 17px
    }
    .reviews {
        padding: 54px 0 0
    }
    .reviews-slider__item .author-img {
        width: 100px
    }
    .reviews-wrapper {
        padding-top: 11px
    }
    .reviews-slider__item .author-text {
        font-size: 18px;
        line-height: 26px;
        margin: 25px 0 19px
    }
    .reviews-wrapper:before {
        width: 48px;
        height: 36px;
        top: 150px
    }
    .work {
        margin-top: 59px
    }
    .work-wrapper {
        padding-top: 39px
    }
    .work-item {
        padding: 50px 0 41px
    }
    .brief {
        padding: 109px 0 46px
    }
    .brief-content__text {
        margin: 24px 0 25px
    }
    .team {
        padding: 56px 0 140px
    }
    .team-slider__item .author-position {
        margin: 12px 0 12px
    }
    .contacts {
        margin-top: -163px
    }
    .contacts-img {
        margin-top: 13px
    }
    .footer {
        margin-top: 60px;
        padding: 17px 0
    }
    .footer-copyright {
        font-size: 12px;
        line-height: 18px
    }
    .order .parallax-bottom {
        top: 430px
    }
    .team-title {
        margin-bottom: 30px;
    }
    .modal-brief-wrapper {
        padding: 40px 10px 35px;
    }
    .modal-wrapper {
        border-radius: 30px;
    }
    .modal-close {
        top: 15px;
        right: 15px;
    }
    .modal-title {
        font-size: 27px;
    }
    .technical-item {
        margin-bottom: 30px;
    }
    .technical-item__head p {
        width: 86%;
    }
    .inputs-radio label {
        font-size: 14px;
        line-height: 14px;
        padding-left: 35px;
        margin-bottom: 20px;
    }
    .inputs-radio label::before {
        width: 24px;
        height: 24px;
        border-radius: 50%;
        top: calc(50% - 12px);
    }
    .inputs-radio label::after {
        top: calc(50% - 4px);
        left: 8px;
    }
    .inputs-radio {
        flex-wrap: wrap;
        margin-top: 20px;
    }
    .inputs-file {
        margin-bottom: -15px;
    }
    .inp-submit {
        font-size: 18px;
        line-height: 18px;
        width: 225px;
        height: 68px;
        border-radius: 80px;
    }
    .choice-level__item {
        margin-bottom: 0;
    }
    .modal-title {
        margin-bottom: 10px;
    }
    .chioce-level p {
        margin-bottom: 20px;
    }
    .response-title {
        font-size: 38px;
    }
    .review-box {
        padding: 25px 15px;
    }
    .modal-review .modal-wrapper {
        padding: 30px 0px;
    }
    .review-thanks {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    .header-video {
        width: 245px;
        height: 149px;
        top: 25px;
        left: calc(50% - 120px);
    }
    .header-video::before {
        width: 280px;
        height: 175px;
        top: calc(50% - 81px);
        left: calc(50% - 140px);
    }
    .header-video-slider__item {
        padding-bottom: 148px;
    }
    .header-video-slider__item iframe {
        left: 3px;
        width: 100%;
        height: 100%;
    }
    .header-video-slider .slick-next,
    .header-video-slider .slick-prev {
        width: 40px;
        height: 40px;
    }
    .header-video-slider .slick-next {
        right: -50px;
    }
    .header-video-slider .slick-prev {
        left: -50px;
    }
}

@media screen and (max-width:359px) {
    .brief .container,
    .container,
    .header-up__box {
        width: 100%;
        padding: 0 10px
    }
    .work-item {
        width: 100%
    }
    .header-up .logo,
    .logo img {
        width: 100px
    }
    .header-phone {
        font-size: 12px;
        line-height: 14px
    }
    .lang {
        margin: 0 10px 0 10px
    }
    .header-up__box {
        padding-top: 8px;
        padding-bottom: 8px
    }
    .price-item {
        margin: 0 25px
    }
    .order-item__title {
        font-size: 28px;
        line-height: 38px
    }
    .reviews-wrapper:before {
        left: 10px
    }
    .modal-title {
        font-size: 23px;
        line-height: 34px;
    }
    .modal-subtitle {
        font-size: 15px;
        line-height: 20px;
    }
    .inp {
        font-size: 14px;
        line-height: 14px;
        padding: 18px;
        height: 52px;
        border-radius: 10px;
    }
    .review-textarea {
        font-size: 14px;
        line-height: 14px;
        padding: 25px 18px;
    }
    .technical-item__head p {
        font-size: 14px;
        line-height: 20px;
    }
    .contact-info__item label {
        font-size: 16px;
        line-height: 16px;
    }
    .modal-up {
        margin-bottom: 90px;
    }
    .modal-up .up {
        height: 310px;
    }
    .modal-up .bottom {
        height: 125px;
    }
    .modal-thanks .response-title {
        font-size: 40px;
        line-height: 55px;
    }
    .modal-thanks .response-text {
        line-height: 24px;
        font-size: 20px
    }
    .header-video{
        width: 230px;
        height: 140px;
        left: calc(50% - 115px);
        top: 10%;
    }
    .header-video::before{
        width: 262px;
        height: 163px;
        top: calc(50% - 76px);
        left: calc(50% - 131px);
    }
    .header-video-slider .slick-next,
    .header-video-slider .slick-prev{
        top: 60%;
    }
    .header-video-slider .slick-next{
        right: -35px;
    }
    .header-video-slider .slick-prev{
        left: -35px;
    }
    .header-video-slider__item{
        padding-bottom: 140px;
    }
}