﻿
/*------------------------------------------------------------*
**Главная
**------------------------------------------------------------*/

/* CSS Document */

html {
scroll-behavior: smooth;
}

body {
margin:0px;
padding:0px;
background:#fff;
font-family: "Noto Sans", sans-serif;
color:#1D1D1D;
font-size: 16px;
line-height:normal;
}

a {
color:#1D1D1D;
transition: .5s;
}

a:hover {
color: #1D1D1D;
text-decoration:none;
}

.btn, .feedback, button {
transition: .5s;
cursor:pointer;
border:0px;
}

* {
box-sizing: border-box;
}

input, button, textarea, select {
font-size:16px;
outline:none;
font-family: "Noto Sans", sans-serif;
}

img {
max-width:100%;
}

p {
margin:0 0 10px 0;
}

p:last-child {
margin:0px !important;
}

.container {
width:100%;
max-width:1752px;
margin:0 auto;
padding:0 20px;
}

.section {
margin:0 0 120px 0;
}

.section-1 {
background:url(../images/section1-bg.jpg) no-repeat center center;
background-size:cover;
padding:32px 0 0 0;
}

.header {
display:flex;
align-items:center;
justify-content: space-between;
gap:20px;
position:relative;
}

.header .logo a {
display:block;
text-decoration:none;
width:238px;
height:68px;
background:url(../images/logo.svg) no-repeat;
}

.header .geo .select {
display:flex;
align-items:center;
gap:8px;
color: var(--white, #FFF);
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 140%;
cursor:pointer;
}

.header .geo .select:before {
content:"";
width:14px;
height:14px;
background:url(../images/geo.svg) no-repeat;
}

.header .geo .select:after {
content:"";
width:6px;
height:3px;
background:url(../images/geo-select.svg) no-repeat;
}

.header .menu ul {
list-style:none;
margin:0px;
padding:0px;
display:flex;
align-items:center;
gap:48px;
}

.header .menu .sub {
display:flex;
align-items:center;
gap:8px;
}

.header .menu .sub:after {
content:"";
width:6px;
height:3px;
background:url(../images/geo-select.svg) no-repeat;
}

.header .menu a {
text-decoration:none;
color: var(--white, #FFF);
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 19.6px */
}

.header .menu a:hover {
color: var(--accent, #E09F34);
}

.header .info {
display:flex;
align-items:center;
gap:40px;
}

.header .phone a {
display:block;
text-decoration:none;
margin:0 0 8px 0;
color: var(--white, #FFF);
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: 160%; /* 28.8px */
}

.header .phone span {
display:block;
text-align:center;
color: var(--gray, #888);
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 19.6px */
}

.header .btn {
display:block;
text-decoration:none;
cursor:pointer;
padding:22px 32px;
border-radius: 8px;
background: var(--accent, #E09F34);
color: var(--black, #1D1D1D);
font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 120%; /* 14.4px */
text-transform: uppercase;
}

.section-1 .flex {
display:flex;
gap:208px;
padding:178px 0;
}

.section-1 .col {
flex:1;
text-align:center;
}

.section-1 .title {
color: var(--white, #FFF);
text-align: center;
font-size: 76px;
font-style: normal;
font-weight: 900;
line-height: 110%; /* 83.6px */
text-transform: uppercase;
margin:0 0 32px 0;
}

.section-1 .title span {
color: var(--accent, #E09F34);
}

.section-1 .desc {
display:flex;
align-items:center;
justify-content: center;
gap:12px;
color: var(--white, #FFF);
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 160%;
margin:0 0 40px 0;
}

.section-1 .desc:before {
content:"";
width:10px;
height:14px;
background:url(../images/section1-desc.svg) no-repeat;
}

.btn-orange {
display:inline-flex;
align-items:center;
gap:16px;
cursor:pointer;
text-decoration:none;
padding:30px 40px;
border-radius: 8px;
background: var(--accent, #E09F34);
color: var(--black, #1D1D1D);
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 120%; /* 16.8px */
text-transform: uppercase;
}

.title-section {
color: var(--black, #1D1D1D);
text-align: center;
font-size: 56px;
font-style: normal;
font-weight: 900;
line-height: 120%; /* 67.2px */
text-transform: uppercase;
margin:0 0 48px 0;
}

.desc-section {
margin:-32px 0 48px 0;
text-align: center;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 160%; /* 28.8px */
}

.section-2 .flex {
display:flex;
flex-wrap:wrap;
gap:16px;
}

.section-2 .item {
width:calc(33.333% - 11px);
border-radius: 16px;
border: 2px solid var(--border-white, #E1E1E1);
background:url(../images/section2-bg.png) no-repeat, #F6F6F6;
background-size:cover;
overflow:hidden;
padding:48px;
transition: .5s;
display:flex;
flex-direction:column;
}

.section-2 .item:hover {
border: 2px solid var(--accent, #E09F34);
}

.section-2 .images {
font-size:0px;
line-height:0px;
text-align:center;
margin:0 0 10px 0;
}

.section-2 .name {
font-size: 30px;
font-style: normal;
font-weight: 900;
line-height: 140%; /* 42px */
margin:0 0 16px 0;
}

.section-2 .desc {
font-family: Roboto;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 22.4px */
margin:0 0 32px 0;
flex:1;
}

.section-3 {
text-align:center;
}

.section-3 .flex {
display:flex;
flex-wrap:wrap;
gap:32px;
margin:0 0 48px 0;
text-align:left;
}

.section-3 .item {
display:block;
text-decoration:none;
width:calc(33.333% - 22px);
background:url(../images/section2-bg.png) no-repeat, #F6F6F6;
background-size:cover;
overflow:hidden;
border-radius: 16px;
border: 1px solid var(--border-white, #E1E1E1);
position:relative;
padding:48px;
font-size: 22px;
font-style: normal;
font-weight: 900;
line-height: 140%;
height:360px;
}

.section-3 .item:hover {
border:1px solid var(--accent, #E09F34);
}

.section-3 .images {
font-size:0px;
line-height:0px;
position:absolute;
bottom:0px;
right:0px;
z-index:3;
}

.section-4 .flex {
display:flex;
flex-wrap:wrap;
gap:32px;
margin:0 0 48px 0;
}

.section-4 .item {
width:calc(50% - 16px);
position:relative;
padding:40px;
border-radius: 16px;
border: 1px solid var(--border-white, #E1E1E1);
background: var(--bg-white, #F6F6F6);
height:260px;
}

.section-4 .name {
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 25.2px */
text-transform: uppercase;
margin:0 0 16px 0;
width:100%;
max-width:300px;
}

.section-4 .desc {
width:100%;
max-width:300px;
font-family: Roboto;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 22.4px */
}

.section-4 .images {
font-size:0px;
line-height:0px;
position:absolute;
bottom:0px;
right:0px;
z-index:3;
}

.section-4 .bottom {
display:flex;
justify-content: center;
gap:16px;
}

.section-5 .flex {
display:flex;
flex-wrap:wrap;
gap:16px;
}

.section-5 .item {
width:calc(50% - 8px);
padding:24px 123px 24px 24px;
border-radius: 10px;
border: 1px solid var(--border-white, #E1E1E1);
background: var(--bg-white, #F6F6F6);
position:relative;
cursor:pointer;
}

.section-5 .item:before {
content:"";
position:absolute;
top:50%;
right:24px;
z-index:3;
transition: .5s;
border-radius: 10px;
background:url(../images/section5-arrow.svg) no-repeat center center, #FFF;
width:67px;
height:54px;
margin:-27px 0 0 0;
}

.section-5 .item.active:before {
transform: rotate(180deg);
}

.section-5 .question {
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 25.2px */
text-transform: uppercase;
}

.section-5 .answer {
display:none;
font-family: Roboto;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 140%;
padding:8px 0 0 0;
}

.section-6 {
padding:104px 0;
background:url(../images/section6-bg.jpg) no-repeat center center;
background-size:cover;
}

.section-6 .title {
color: var(--white, #FFF);
font-size: 64px;
font-style: normal;
font-weight: 900;
line-height: 120%;
text-transform: uppercase;
margin:0 0 16px 0;
}

.section-6 .title span {
color: var(--accent, #E09F34);
}

.section-6 .desc {
color: var(--white, #FFF);
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 160%; /* 28.8px */
margin:0 0 48px 0;
width:100%;
max-width:524px;
}

.section-6 .form {
display:flex;
flex-wrap:wrap;
gap:16px;
width:100%;
max-width:968px;
}

.section-6 input {
width:calc(33.333% - 11px);
height:80px;
border-radius: 10px;
border: 1px solid var(--border-black, #292929);
padding:0px 32px 0px 60px;
color: var(--white, #FFF);
font-family: Roboto;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 22.4px */
}

.section-6 textarea {
width:100%;
height:80px;
border-radius: 10px;
border: 1px solid var(--border-black, #292929);
margin:0 0 32px 0;
padding:29px 32px 29px 60px;
color: var(--white, #FFF);
font-family: Roboto;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 140%;
resize:none;
overflow:hidden;
}

.section-6 ::placeholder {
color:#fff;
}

.section-6 .name {
background:url(../images/section6-icon1.svg) no-repeat 32px center, #1D1D1D;
}

.section-6 .phone {
background:url(../images/section6-icon2.svg) no-repeat 32px center, #1D1D1D;
}

.section-6 .mail {
background:url(../images/section6-icon3.svg) no-repeat 32px center, #1D1D1D;
}

.section-6 .text {
background:url(../images/section6-icon4.svg) no-repeat 32px center, #1D1D1D;
}

.section-6 .bottom {
display:flex;
align-items:center;
gap:32px;
}

.section-6 .warning {
flex:1;
color: var(--gray, #888);
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 19.6px */
}

.footer {
background: var(--black, #1D1D1D);
padding:64px 0;
}

.footer .head {
display:flex;
justify-content: space-between;
gap:20px;
margin:0 0 48px 0;
padding:0 0 48px 0;
border-bottom:1px rgba(255,255,255,.06) solid;
}

.footer .logo {
display:block;
text-decoration:none;
width:238px;
height:68px;
background:url(../images/logo.svg) no-repeat;
margin:0 0 40px 0;
}

.footer .desc {
color: var(--gray, #888);
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 19.6px */
width:100%;
max-width:284px;
}

.footer .name {
color: var(--white, #FFF);
font-size: 14px;
font-style: normal;
font-weight: 900;
line-height: 140%; /* 19.6px */
text-transform: uppercase;
margin:0 0 24px 0;
opacity: 0.2;
}

.footer ul {
list-style:none;
margin:0px;
padding:0px;
display:flex;
flex-direction:column;
gap:16px;
}

.footer ul a {
text-decoration:none;
color: var(--white, #FFF);
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 19.6px */
}

.footer ul a:hover {
color: var(--accent, #E09F34);
}

.footer .info {
margin:0 0 24px 0;
color: var(--white, #FFF);
font-family: Roboto;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 22.4px */
}

.footer .info:last-child {
margin:0px;
}

.footer .info span {
display:block;
margin:0 0 8px 0;
color: var(--white, #FFF);
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: normal;
opacity: 0.3;
}

.footer .info a {
text-decoration:none;
color: var(--white, #FFF);
}

.footer .select-city {
display:flex;
align-items:center;
gap:8px;
cursor:pointer;
}

.footer .bottom {
display:flex;
justify-content: space-between;
gap:20px;
color: var(--white, #FFF);
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 19.6px */
}

.footer .bottom a {
color:#fff;
text-decoration:none;
}

.footer .bottom a:hover {
color: var(--accent, #E09F34);
}

.footer .copyright {
color: var(--gray, #888);
}

.mobile-menu {
display:none;
}








@media screen and (max-width:1900px) {

.section-4 .images {
max-width:50%;
}






}




@media screen and (max-width:1550px) {

.header .menu ul {
gap:20px;
}

.header .info {
gap:20px;
}

.section-1 .title {
font-size:50px;
}





}




@media screen and (max-width:1440px) {

.header .geo {
display:none;
}

.header .btn {
padding:15px;
}

.section-1 .flex {
gap:100px;
}









}



@media screen and (max-width:1240px) {

.section-1 .title {
font-size:40px;
}

.header .menu {
display:none;
position:absolute;
top:calc(100% + 10px);
right:0px;
z-index:9;
border-radius: 8px;
background: var(--accent, #E09F34);
padding:20px;
}

.header .menu ul {
flex-direction:column;
gap:10px;
}

.header .menu a {
color: var(--black, #1D1D1D) !important;
}

.mobile-menu {
display:block;
cursor:pointer;
width:27px;
height:20px;
background:url(../images/mobile-menu.svg) no-repeat;
}

.section-2 .item {
padding:20px;
}

.section-2 .name {
font-size:22px;
}

.section-2 .desc {
margin:0 0 20px 0;
}

.section-3 .item {
padding:20px;
}

.section-4 .item {
padding:20px;
}




}



@media screen and (max-width:1000px) {

.section-1 .flex {
padding:100px 0;
gap:40px;
}

.section-1 .title {
font-size:30px;
}

.section-1 .desc {
font-size:14px;
}

.btn-orange {
justify-content: center;
padding:15px 25px;
text-align:center;
}

.section-3 .flex {
gap:20px;
}

.section-3 .item {
width:calc(50% - 10px);
}

.section-5 .item {
width:100%;
}

.section-6 .title {
font-size:40px;
}














}






@media screen and (max-width:780px) {

.header .logo a {
width:34px;
height:21px;
background:url(../images/logo-small.svg) no-repeat;
}

.header .btn {
display:none;
}

.header .info {
flex:1;
}

.header .phone {
flex:1;
text-align:center;
}

.section-1 .flex {
padding:50px 0;
flex-direction:column;
}

.section-1 .title {
margin:0 0 20px 0;
}

.section-1 .title br {
display:none;
}

.section-1 .desc {
margin:0 0 20px 0;
}

.section {
margin:0 0 50px 0;
}

.title-section {
font-size:26px;
margin:0 0 30px 0;
}

.desc-section {
margin:-20px 0 30px 0;
font-size:16px;
}

.section-2 .item {
width:100%;
text-align:center;
}

.section-3 .item {
width:100%;
height:300px;
}

.section-4 .flex {
width:100%;
margin:0 0 20px 0;
}

.section-4 .item {
width:100%;
}

.section-4 .images {
max-width:67%;
}

.section-4 .bottom {
flex-direction:column;
gap:10px;
}

.section-5 .question {
font-size:16px;
}

.section-5 .item {
padding:20px 60px 20px 20px;
}

.section-5 .item:before {
width:30px;
height:30px;
background-size:15px !important;
right:20px;
margin:-15px 0 0 0;
}

.section-6 {
padding:50px 0;
}

.section-6 .title {
font-size:30px;
}

.section-6 .desc {
font-size:16px;
margin:0 0 20px 0;
}

.section-6 input {
width:100%;
height:60px;
padding:10px 20px 10px 40px;
background-position:10px center !important;
}

.section-6 .text {
height:60px;
margin:0px;
padding:18px 20px 10px 40px;
background-position:10px center !important;
}

.section-6 .bottom {
width:100%;
flex-direction:column;
gap:16px;
}

.section-6 .btn-orange {
width:100%;
}

.section-6 .warning {
flex:none;
width:100%;
text-align:center;
}

.footer {
padding:50px 0;
}

.footer .head {
flex-direction:column;
margin:0 0 20px 0;
padding:0 0 20px 0;
}

.footer .bottom {
flex-direction:column;
}

.footer .logo {
margin:0 auto 20px auto;
}

.footer .desc {
text-align:center;
max-width:none;
}




















}







