body{ padding: 0; margin: 0; color: #0D0D0D; font-family: 'Roboto', sans-serif; background: #FFFFFF }
*{ box-sizing: border-box }
a{ text-decoration: none; color: inherit }
form, p, h1, h2, h3, h4, h5, h6{ margin: 0; padding: 0 }
input, button, textarea{ outline: none; font-family: 'Roboto', sans-serif }




.logo{ color: #0055FF }
.container{ width: 100%; max-width: 1320px }

h1{ font-size: 82px; line-height: 100%; font-weight: 700 }
h2{ font-size: 48px; line-height: 100%; font-weight: 700; letter-spacing: -0.02em }
h3{ font-size: 36px; line-height: 110%; font-weight: 700 }
h4{ font-size: 24px; line-height: 120%; font-weight: 700; letter-spacing: 0.04em }
h5{ font-size: 18px; line-height: 120%; font-weight: 700; letter-spacing: 0.04em }
.b1{ font-size: 18px; line-height: 100%; font-weight: 600 }
.t1{ font-size: 21px; line-height: 150%; font-weight: 400 }
.t2{ font-size: 18px; line-height: 150%; font-weight: 400 }
.t3{ font-size: 14px; line-height: 150%; font-weight: 400 }

.btn{ display: flex; align-items: center; justify-content: center; height: 48px; border-radius: 10px; padding: 0 16px; font-size: 18px; line-height: 100%; font-weight: 600; border: 2px solid transparent; cursor: pointer; letter-spacing: -0.02em }
.btn-ico{ width: 48px; min-width: 48px }
.btn-blue{ color: #fff; background: #0055FF; border-color: #0055FF }
.btn-blue-outline{ color: #0D0D0D; background: transparent; border-color: #0055FF }
.btn-white-outline{ color: #fff; background: transparent; border-color: #fff }
.btn-black-outline{ color: #0D0D0D; background: transparent; border-color: #0D0D0D }

.slider-dots{ display: flex; align-items: flex-start }
.slider-dots > div{ width: 10px; height: 10px; border-radius: 50%; border: 2px solid #fff }
.slider-dots > div + div{ margin-left: 24px }
.slider-dots > div.active{ background: #fff }




.nav{ padding: 10px; display: flex; justify-content: center; width: 100%; border-bottom: 1px solid #E6E6E6; position: fixed; top: 0; left: 0; right: 0; z-index: 10; background: #fff }
.nav .container{ display: flex; align-items: center; justify-content: space-between }
.nav .links{ display: flex; align-items: center; justify-content: center }
.nav .link{ font-size: 18px; line-height: 100%; font-weight: 600 }
.nav .link + .link{ margin-left: 48px }




.section-main{ padding-top: calc(36px + 70px); display: flex; justify-content: center }
.section-main .container{ border-radius: 40px; background: #0D0D0D; color: #fff; padding: 112px; height: 675px; display: flex; flex-direction: column; position: relative }
.main-top{ display: flex; position: relative; z-index: 2 }
.main-top > div:nth-child(1){ flex-grow: 1 }
.main-top .t1{ width: 100%; max-width: 425px; margin-top: 24px }
.main-bottom{ display: flex; align-items: flex-end; z-index: 2; flex-grow: 1 }
.main-arrows{ display: flex; align-items: center; flex-grow: 1; justify-content: flex-end }
.main-arrows .btn + .btn{ margin-left: 24px }
.main-arrows .btn:nth-child(1){ background: url("img/arrow-left_white.svg") no-repeat center / 24px }
.main-arrows .btn:nth-child(2){ background: url("img/arrow-right_white.svg") no-repeat center / 24px }
.main-bgs{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; overflow: hidden; max-width: 100%; border-radius: 40px }
.main-bg{ width: 100%; min-width: 100%; height: 100%; background: no-repeat center / cover }
.main-bg:nth-child(1){ background-image: url("img/main-bg-1.webp") }




.section-about{ padding: 120px 0; display: flex; justify-content: center }
.section-about h3{ margin-top: 36px; color: #808080 }
.about-blocks{ margin-left: -12px; margin-right: -12px; margin-top: 64px; width: calc(100% + 24px); display: flex; flex-wrap: wrap }
.about-block{ padding: 0 12px; width: calc(100% / 3); display: flex; flex-direction: column }
.about-card{ padding: 36px 24px; background: #F5F5F5; border-radius: 40px; flex-grow: 1 }
.about-card__ico{ width: 48px; height: 48px; border-radius: 10px; background: no-repeat center / 24px #0055FF }
.about-card__ico-structure{ background-image: url("img/structure_white.svg") }
.about-card__ico-team{ background-image: url("img/team_white.svg") }
.about-card__ico-clients{ background-image: url("img/clients_white.svg") }
.about-card h4{ text-transform: uppercase; margin-top: 24px }
.about-card .t3{ margin-top: 24px }




.section-clients{ padding: 120px 0; display: flex; justify-content: center; text-align: center; background: #F5F5F5 }
.section-clients .t1{ margin-top: 36px }
.clients-blocks_scroll{ margin-left: -12px; margin-right: -12px; width: calc(100% + 24px); max-width: calc(100% + 24px); margin-top: 40px; overflow: hidden }
.clients-blocks{ display: flex; flex-wrap: wrap; min-width: 2688px }
.client-block{ padding: 24px 12px 0; width: 336px; min-width: 336px }
.client-card{ width: 100%; height: 130px; border-radius: 20px; background: no-repeat center #fff }
.client-card + .client-card{ margin-top: 24px }
.clients-dots{ margin-top: 64px; justify-content: center }
.clients-dots > div{ border-color: #0D0D0D }
.clients-dots > div.active{ background: #0D0D0D }

.client-1{ background-image: url("img/company-1.png"); background-size: 190px }
.client-2{ background-image: url("img/company-2.png"); background-size: 190px }
.client-3{ background-image: url("img/company-3.png"); background-size: 100px }
.client-4{ background-image: url("img/company-4.png"); background-size: 60px }
.client-5{ background-image: url("img/company-5.png"); background-size: 150px }
.client-6{ background-image: url("img/company-6.png"); background-size: 130px }
.client-7{ background-image: url("img/company-7.png"); background-size: 130px }
.client-8{ background-image: url("img/company-8.svg"); background-size: 180px }
.client-9{ background-image: url("img/company-9.svg"); background-size: 180px }
.client-10{ background-image: url("img/company-10.svg"); background-size: 180px }
.client-11{ background-image: url("img/company-11.svg"); background-size: 180px }
.client-12{ background-image: url("img/company-12.png"); background-size: 110px }
.client-13{ background-image: url("img/company-13.svg"); background-size: 180px }
.client-14{ background-image: url("img/company-14.svg"); background-size: 180px }
.client-15{ background-image: url("img/company-15.svg"); background-size: 180px }
.client-16{ background-image: url("img/company-16.webp"); background-size: 180px }




.section-strategy{ padding: 120px 0 0; color: #fff; display: flex; justify-content: center }
.section-strategy .container{ padding: 112px; border-radius: 40px; background: #0055FF; overflow: hidden; display: flex; flex-direction: column; align-items: flex-start; position: relative }
.section-strategy h1{ max-width: 650px; position: relative; z-index: 2 }
.section-strategy .t2{ max-width: 650px; margin-top: 36px; z-index: 2 }
.section-strategy .btn{ margin-top: 122px; z-index: 2 }
.strategy-img{ position: absolute; top: 0; bottom: 0; right: 0; width: 761px; background: url("img/strategy-bg.webp") no-repeat right bottom / contain }




.section-vectors{ padding: 24px 0 120px; display: flex; justify-content: center }
.section-vectors .container{ display: flex; overflow-x: auto; scrollbar-width: none }
.section-vectors .container::-webkit-scrollbar{ display: none }
.vectors_scroll{ display: flex; max-width: 100% }
.vectors-text{ flex-grow: 1; display: flex; flex-direction: column; justify-content: center }
.vector-card{ padding: 36px 24px; border-radius: 40px; color: #fff; display: flex; flex-direction: column; align-items: flex-start; margin-left: 24px; background: #0055FF; width: 540px }
.vector-card:nth-child(3){ background: #8000FF }
.vector-card .t2{ margin-top: 24px; flex-grow: 1 }
.vector-card .btn{ margin-top: 24px }




.section-ruslab{ padding: 120px 0; background: #8000FF; display: flex; justify-content: center }
.section-ruslab .container{ display: flex; align-items: center; justify-content: space-between }
.ruslab-content{ color: #fff; padding-left: 112px; width: 100%; max-width: calc(540px + 112px); display: flex; flex-direction: column; align-items: flex-start }
.ruslab-logo{ width: 198px; height: 60px; background: url("img/ruslab.svg") no-repeat center / contain }
.ruslab-content h2{ margin-top: 48px }
.ruslab-content h4{ margin-top: 24px; text-transform: uppercase }
.ruslab-content .btn{ margin-top: 48px }
.ruslab-img{ width: 648px; height: 367px; background: url("img/ruslab-img.webp") no-repeat center / contain }




.section-projects{ padding: 96px 0 120px; display: flex; justify-content: center }
.projects-title{ display: flex; align-items: center; justify-content: space-between }
.projects-blocks{ display: flex; flex-wrap: wrap; margin-top: 40px }
.project-block{ padding: 24px 12px 0; width: calc(100% / 3); display: flex; flex-direction: column }
.project-card{ border-radius: 40px; flex-grow: 1; padding: 36px 24px; background: #F5F5F5; display: flex; flex-direction: column; align-items: flex-start }
.project-ico{ width: 64px; height: 64px; background: no-repeat center / contain }
.project-card h4{ margin-top: 36px; text-transform: uppercase }
.project-card .t2{ margin-top: 16px; flex-grow: 1 }
.project-card .btn{ margin-top: 24px }

.project-block:nth-child(1) .project-ico{ background-image: url("img/manager.png") }
.project-block:nth-child(2) .project-ico{ background-image: url("img/merge.png") }
.project-block:nth-child(3) .project-ico{ background-image: url("img/guard.png") }
.project-block:nth-child(4) .project-ico{ background-image: url("img/seeds.png") }
.project-block:nth-child(5) .project-ico{ background-image: url("img/list.png") }
.project-block:nth-child(6) .project-ico{ background-image: url("img/cogwheel.png") }




.section-architecture{ padding: 60px 0 180px; display: flex; justify-content: center }
.section-architecture .container{ display: flex; align-items: center; justify-content: space-between; flex-direction: row-reverse }
.architecture-img{ width: 648px; height: 648px; background: url("img/architecture.webp") no-repeat center / cover; position: relative; border-radius: 40px }
.architecture-ico:nth-child(1){ width: 220px; height: 220px; position: absolute; top: -60px; left: -90px; border-radius: 40px; background: url("img/architecture.svg") no-repeat center / 110px #8000FF }
.architecture-ico:nth-child(2){ width: 180px; height: 180px; position: absolute; bottom: -60px; right: -90px; border-radius: 40px; background: url("img/code.svg") no-repeat center / 90px #0055FF }

.architecture-content{ width: 100%; max-width: 536px; display: flex; flex-direction: column; align-items: flex-start }
.architecture-content .t2{ margin-top: 36px }
.architecture-content .btn{ margin-top: 64px }




.section-work{ padding: 120px 0; display: flex; justify-content: center; background: #C9E052 }
.section-work .container{ display: flex; flex-direction: column; align-items: center }
.section-work h2:first-child{ text-align: center }
.section-work .t1:nth-child(2){ margin-top: 36px; text-align: center }
.section-work .btn:nth-child(3){ margin-top: 42px }

.competencies-blocks{ margin-top: 18px; display: flex; flex-wrap: wrap; margin-left: -12px; margin-right: -12px; width: calc(100% + 24px) }
.competence-block{ padding: 24px 12px 0; display: flex; flex-direction: column; width: 50% }
.competence-card{ display: flex; flex-grow: 1; padding: 36px; border-radius: 40px; background: #0D0D0D; color: #fff }
.competence-ico{ width: 64px; min-width: 64px; height: 64px; background: no-repeat center / contain }
.competence-content{ flex-grow: 1; padding-left: 36px }
.competence-content .t3{ margin-top: 24px; color: #CCCCCC }

.competence-block:nth-child(1) .competence-ico{ background-image: url("img/competence-1.svg") }
.competence-block:nth-child(2) .competence-ico{ background-image: url("img/competence-2.svg") }
.competence-block:nth-child(3) .competence-ico{ background-image: url("img/competence-3.svg") }
.competence-block:nth-child(4) .competence-ico{ background-image: url("img/competence-4.svg") }

.work-title{ display: flex; align-items: center; justify-content: space-between; width: 100%; margin-top: 64px }
.works-blocks{ display: flex; flex-wrap: wrap; margin-top: 40px; margin-left: -12px; margin-right: -12px; width: calc(100% + 24px) }
.work-block{ padding: 24px 12px; width: calc(100% / 3) }
.work-card{ background: #0D0D0D; border-radius: 40px; min-height: 300px; padding: 36px 24px; color: #fff; display: flex; flex-direction: column; align-items: flex-start }
.work-card h4{ text-transform: uppercase }
.work-card h5{ color: #C9E052; text-transform: uppercase; flex-grow: 1; margin-top: 12px }
.work-card .t2{ color: #CCCCCC }
.section-work .t1:nth-child(7){ margin-top: 64px; text-align: center }
.section-work .container > .btn:last-child{ margin-top: 36px }




.section-terms{ padding: 120px 0 0; display: flex; justify-content: center }
.section-terms .container{ background: #F5F5F5; border-radius: 40px; padding: 112px; display: flex; flex-direction: column; align-items: center }
.terms-blocks{ display: flex; flex-wrap: wrap; margin-left: -32px; margin-right: -32px; margin-top: 28px; width: calc(100% + 64px) }
.terms-block{ padding: 36px 32px 0; width: 50% }
.terms-card{ display: flex }
.terms-ico{ width: 36px; min-width: 36px; height: 36px; background: url("img/checkmark.svg") no-repeat center / contain; margin-top: 5px }
.terms-card .t2{ padding-left: 24px }
.section-terms .btn{ margin-top: 64px }




.section-form{ padding: 120px 0 0; display: flex; justify-content: center }
.section-form .container{ border-radius: 40px; padding: 112px 100px 112px 112px; background: #0055FF; color: #fff; display: flex; align-items: center; justify-content: space-between }
.form-content{ width: 100%; max-width: 312px }
.form-content .t2{ margin-top: 24px }
.form-content .b1{ margin-top: 24px }
.form-content .b1:last-child{ margin-top: 10px }
.form-fields{ display: flex; flex-wrap: wrap; padding-left: 52px; flex-grow: 1 }
.form-field{ padding: 0 12px; width: 100% }
.form-input{ width: 100%; height: 48px; padding: 0 16px; border-radius: 10px; background: #fff; display: flex; align-items: center; font-size: 18px; line-height: 120%; color: #0D0D0D; border: 0 }
textarea.form-input{ padding: 16px; align-items: flex-start; height: 75px }
.form-input::placeholder{ color: #CCCCCC }
.form-field:nth-child(1), .form-field:nth-child(2){ width: 50% }
.form-field:nth-child(3){ margin-top: 24px }
.form-bottom{ padding: 24px 12px 0; display: flex; align-items: center }
.form-bottom button{ margin-left: 24px }

.checkbox input[type=checkbox]{ display: none }
.checkbox label{ display: flex; cursor: pointer }
.checkbox label > div:nth-child(1){ width: 24px; min-width: 24px; height: 24px; background: url("img/checkbox-inactive.svg") no-repeat center / contain }
.checkbox input:checked + label > div:nth-child(1){ background-image: url("img/checkbox-active.svg") }
.checkbox label > div:nth-child(2){ padding-left: 24px }




.footer{ padding: 120px 0 67px; display: flex; justify-content: center }
.footer .container{ display: flex; align-items: flex-start; justify-content: space-between }
.footer .t2{ color: #808080 }
.footer .b1{ color: #0055FF }




.nav-btns .btn-ico{ display: none }
.main-top .btn, .main-dots_mob{ display: none }
.vectors-text_mob, .vector-padding{ display: none }
.section-ruslab .container > .btn{ display: none }
.architecture-padding{ display: none }

@media (max-width: 400px){
    h1{ font-size: 36px }
    h2{ font-size: 36px }
    h3{ font-size: 24px }
    h4{ font-size: 18px }
    h5{ font-size: 14px }
    .b1{ font-size: 18px }
    .t1{ font-size: 14px }
    .t2{ font-size: 14px }
    .t3{ font-size: 12px }


    .btn{ height: 36px; padding: 0 12px; font-size: 14px; border-radius: 8px }
    .btn-ico{ width: 36px; min-width: 36px; padding: 0 }

    .slider-dots > div{ width: 8px; height: 8px; border-width: 1px }
    .slider-dots > div + div{ margin-left: 12px }


    .container{ max-width: calc(100% - 40px) }


    .nav{ padding: 10px 0 }
    .nav .links{ display: none }
    .nav-btns{ display: flex; align-items: flex-start }
    .nav-btns .btn-ico{ background: url("img/menu.svg") no-repeat center / 24px; margin-left: 10px; display: flex }


    .section-main{ padding-top: calc(20px + 56px) }
    .section-main .container{ padding: 60px 40px 40px; height: 475px; justify-content: space-between; border-radius: 20px }
    .main-top .t1{ margin-top: 10px }
    .main-dots{ display: none }
    .main-dots_mob{ display: flex }
    .main-top > div:first-child{ display: flex; flex-direction: column; align-items: flex-start }
    .main-top .btn{ display: flex; margin-top: 30px }
    .main-arrows .btn + .btn{ margin-left: 20px }
    .main-bottom{ align-items: center; flex-grow: unset }
    .main-bottom > .btn{ display: none }


    .section-about{ padding: 60px 0 }
    .section-about h3{ margin-top: 20px; font-size: 18px }
    .about-blocks{ margin-top: 16px }
    .about-block{ width: 100%; padding: 24px 12px 0 }
    .about-card{ padding: 20px; border-radius: 20px }
    .about-card__top{ display: flex; align-items: center }
    .about-card__ico{ width: 36px; height: 36px; margin-right: 20px; border-radius: 8px }
    .about-card h4{ margin-top: 0 }
    .about-card .t3{ margin-top: 20px }


    .section-clients{ padding: 60px 0 }
    .section-clients .t1{ margin-top: 20px }
    .clients-blocks_scroll{ margin-top: 20px; margin-left: -10px; margin-right: -10px; width: calc(100% + 20px); min-width: calc(100% + 20px) }
    .clients-blocks{ min-width: 712px }
    .client-block{ padding: 20px 10px 0; width: 178px; min-width: 178px }
    .client-card{ height: 66px; border-radius: 10px }

    .client-1{ background-size: 120px }
    .client-2{ background-size: 120px }
    .client-3{ background-size: 100px }
    .client-4{ background-size: 60px }
    .client-5{ background-size: 105px }
    .client-6{ background-size: 80px }
    .client-7{ background-size: 130px }
    .client-8{ background-size: 180px }
    .client-9{ background-size: 120px }
    .client-10{ background-size: 110px }
    .client-11{ background-size: 180px }
    .client-12{ background-size: 110px }
    .client-13{ background-size: 100px }
    .client-14{ background-size: 120px }
    .client-15{ background-size: 180px }
    .client-16{ background-size: 180px }

    .clients-dots{ margin-top: 40px }


    .section-strategy{ padding: 60px 0 0 }
    .section-strategy .container{ padding: 40px; height: 475px; border-radius: 20px }
    .section-strategy .t2{ margin-top: 10px }
    .section-strategy .btn{ margin-top: 30px }
    .strategy-img{ right: -10px; bottom: -10px; left: auto; top: auto; width: 275px; height: 243px }


    .section-vectors{ padding: 20px 0 60px }
    .section-vectors .container{ max-width: 100% }
    .vectors-text{ min-width: 266px; padding-left: 20px }
    .vectors-text_mob{ display: flex; align-items: center; color: #808080; margin-top: 20px }
    .vectors-text_mob > div:nth-child(2){ margin-left: 10px; width: 12px; height: 12px; background: url("img/arrow-right_gray.svg") no-repeat center / contain }
    .vector-card{ width: 280px; min-width: 280px; margin-left: 20px; border-radius: 20px; padding: 20px }
    .vector-card .t2{ font-size: 12px; margin-top: 20px }
    .vector-card .btn{ margin-top: 20px }
    .vector-padding{ display: block; width: 20px; min-width: 20px }
    .vectors_scroll{ max-width: unset }


    .section-ruslab{ padding: 40px 0 }
    .section-ruslab .container{ flex-direction: column }
    .ruslab-content{ padding-left: 0; text-align: center; align-items: center }
    .ruslab-logo{ height: 40px }
    .ruslab-content h2{ margin-top: 20px }
    .ruslab-content h4{ margin-top: 20px }
    .ruslab-content .btn{ display: none }
    .ruslab-img{ width: 324px; height: 183px; margin-top: 20px }
    .section-ruslab .container > .btn{ margin-top: 20px; display: flex }


    .projects-title .btn{ display: none }
    .section-projects{ padding: 60px 0 0 }
    .projects-blocks{ flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-left: -20px; margin-right: -20px; width: calc(100% + 40px); min-width: calc(100% + 40px) }
    .projects-blocks::-webkit-scrollbar{ display: none }
    .project-block{ padding: 0 10px; width: 266px; min-width: 266px }
    .project-block:first-child{ padding-left: 20px; width: 276px; min-width: 276px }
    .project-block:last-child{ padding-right: 20px; width: 276px; min-width: 276px }
    .project-card{ padding: 20px; border-radius: 20px }
    .project-ico{ width: 48px; height: 48px }
    .project-card h4{ margin-top: 20px }
    .project-card .t2{ margin-top: 10px }
    .project-card .btn{ margin-top: 20px }


    .section-architecture{ padding: 0 }
    .section-architecture .container{ max-width: 100%; flex-direction: row; overflow-x: auto; scrollbar-width: none; padding: 60px 0 80px }
    .section-architecture .container::-webkit-scrollbar{ display: none }
    .architecture-content{ padding-left: 20px; padding-right: 60px; width: 326px; min-width: 326px }
    .architecture-img{ width: 324px; min-width: 324px; height: 324px; border-radius: 20px }
    .architecture-ico:nth-child(1){ width: 100px; height: 100px; border-radius: 20px; background-size: 55px; top: -20px; left: -40px }
    .architecture-ico:nth-child(2){ width: 80px; height: 80px; border-radius: 20px; background-size: 45px; bottom: -20px; right: -40px }
    .architecture-padding{ width: 60px; min-width: 60px; display: block; height: 10px }
    .architecture-content .t2{ margin-top: 20px; font-size: 12px }
    .architecture-content .btn{ margin-top: 30px }


    .section-work{ padding: 60px 0 }
    .section-work .t1:nth-child(2){ margin-top: 20px }
    .section-work .btn:nth-child(3){ margin-top: 30px }
    .competencies-blocks{ margin-top: 30px; margin-left: -20px; margin-right: -20px; width: calc(100% + 40px); max-width: calc(100% + 40px); overflow-x: auto; scrollbar-width: non; flex-wrap: nowrap }
    .competencies-blocks::-webkit-scrollbar{ display: none }
    .competence-block{ padding: 0 10px; width: 266px; min-width: 266px }
    .competence-block:first-child{ padding-left: 20px; width: 276px; min-width: 276px }
    .competence-block:last-child{ padding-right: 20px; width: 276px; min-width: 276px }
    .competence-card{ padding: 20px; border-radius: 20px; flex-direction: column }
    .competence-ico{ width: 48px; min-width: 48px; height: 48px }
    .competence-content{ padding-left: 0; padding-top: 20px }
    .competence-content .t3{ margin-top: 20px }

    .work-title{ margin-top: 60px }
    .work-title .btn{ display: none }
    .works-blocks{ margin-top: 30px; margin-left: -20px; margin-right: -20px; width: calc(100% + 40px); max-width: calc(100% + 40px); overflow-x: auto; scrollbar-width: non; flex-wrap: nowrap }
    .works-blocks::-webkit-scrollbar{ display: none }
    .work-block{ padding: 0 10px; width: 266px; min-width: 266px }
    .work-block:first-child{ padding-left: 20px; width: 276px; min-width: 276px }
    .work-block:last-child{ padding-right: 20px; width: 276px; min-width: 276px }
    .work-card{ padding: 20px; border-radius: 20px; min-height: 276px }
    .work-card h5{ margin-top: 20px }
    .work-card .t2{ font-size: 12px }
    .section-work .t1:nth-child(7){ font-size: 18px; margin-top: 40px }
    .section-work .container > .btn:last-child{ margin-top: 30px }


    .section-terms{ padding: 60px 0 0 }
    .section-terms .container{ padding: 40px 20px; border-radius: 20px }
    .terms-blocks{ margin-top: 20px }
    .terms-block{ width: 100%; padding: 10px 32px 0 }
    .terms-ico{ width: 24px; min-width: 24px; height: 24px; margin-top: 2px }
    .terms-card .t2{ padding-left: 20px; font-size: 12px }
    .section-terms .btn{ margin-top: 30px }


    .section-form{ padding: 60px 0 0 }
    .section-form .container{ padding: 40px 20px; border-radius: 20px; flex-direction: column }
    .form-content h2{ text-align: center }
    .form-content .t2{ margin-top: 10px; text-align: center }
    .form-content .b1{ margin-top: 20px; text-align: center }
    .form-content .b1:last-child{ margin-top: 10px }
    .form-fields{ padding-left: 0; padding-top: 30px }
    .form-field{ padding: 0 }
    .form-field:nth-child(1), .form-field:nth-child(2){ width: 100% }
    .form-input{ height: 36px; border-radius: 8px; padding: 0 12px; font-size: 12px }
    .form-field:nth-child(2){ padding-top: 20px }
    .form-field:nth-child(3){ margin-top: 20px }
    textarea.form-input{ padding: 12px; height: 50px }
    .form-bottom{ padding: 20px 0 0; flex-direction: column }
    .form-bottom .checkbox{ width: 100% }
    .form-bottom button{ margin-left: 0; margin-top: 30px }

    .checkbox label > div:nth-child(2){ padding-left: 10px; font-size: 12px }


    .footer{ padding: 60px 0 30px }
    .footer .container{ flex-wrap: wrap; text-align: center }
    .footer .container div:nth-child(1){ order: 4; width: 100%; margin-top: 10px }
    .footer .container div:nth-child(2){ order: 3; width: 100%; margin-top: 30px }
    .footer .container div:nth-child(3){ order: 1; width: calc(100% - 140px); text-align: left }
    .footer .container div:nth-child(4){ order: 2; width: 140px; text-align: right }
}