@charset "utf-8";

@font-face{
    font-family: "RobotoLight";
    src: url("fonts/RobotoLight.eot");
    src: url("fonts/RobotoLight-1.eot")format("embedded-opentype"),
         url("fonts/RobotoLight.html") format("woff"),
         url("fonts/RobotoLight-2.html") format("truetype");
    font-style: normal;
    font-weight: normal;
}
@font-face{
    font-family: "RobotoRegular";
    src: url("fonts/RobotoRegular.eot");
    src: url("fonts/RobotoRegular-1.eot")format("embedded-opentype"),
         url("fonts/RobotoRegular.html") format("woff"),
         url("fonts/RobotoRegular-2.html") format("truetype");
    font-style: normal;
    font-weight: normal;
}
@font-face{
    font-family: "RobotoBold";
    src: url("fonts/RobotoBold.eot");
    src: url("fonts/RobotoBold-1.eot")format("embedded-opentype"),
         url("fonts/RobotoBold.html") format("woff"),
         url("fonts/RobotoBold-2.html") format("truetype");
    font-style: normal;
    font-weight: normal;
}
@font-face{
    font-family: "RobotoSlabThin";
    src: url("fonts/RobotoSlabThin.eot");
    src: url("fonts/RobotoSlabThin-1.eot")format("embedded-opentype"),
         url("fonts/RobotoSlabThin.html") format("woff"),
         url("fonts/RobotoSlabThin-2.html") format("truetype");
    font-style: normal;
    font-weight: normal;
}
@font-face{
    font-family: "RobotoSlabLight";
    src: url("fonts/RobotoSlabLight.eot");
    src: url("fonts/RobotoSlabLight-1.eot")format("embedded-opentype"),
         url("fonts/RobotoSlabLight.html") format("woff"),
         url("fonts/RobotoSlabLight-2.html") format("truetype");
    font-style: normal;
    font-weight: normal;
}
@font-face{
    font-family: "RobotoSlabRegular";
    src: url("fonts/RobotoSlabRegular.eot");
    src: url("fonts/RobotoSlabRegular-1.eot")format("embedded-opentype"),
         url("fonts/RobotoSlabRegular.html") format("woff"),
         url("fonts/RobotoSlabRegular-2.html") format("truetype");
    font-style: normal;
    font-weight: normal;
}
@font-face{
    font-family: "RobotoSlabBold";
    src: url("fonts/RobotoSlabBold.eot");
    src: url("fonts/RobotoSlabBold-1.eot")format("embedded-opentype"),
         url("fonts/RobotoSlabBold.html") format("woff"),
         url("fonts/RobotoSlabBold-2.html") format("truetype");
    font-style: normal;
    font-weight: normal;
}
/*--- Style ---*/
    *,
    *:after,
    *:before{
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        outline: none !important;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
    }
    html,
    body{
        color: #000000;
        font-size: 16px;
        min-width: 320px;
        background: #ffffff;
        font-family: "RobotoRegular";
    }
    img{
        width: auto;
        max-width: 100%;
        vertical-align: middle;
    }
    a{
        color: inherit;
        cursor: pointer;
    }
    a:hover{
        text-decoration: none;
    }
    ul{
        list-style: none;
    }
    .container{
        width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
        position: relative;
        z-index: 1;
    }
    .clr:after{
        content: "";
        display: table;
        clear: both;
    }
    .lg-backdrop.in{
        opacity: 0.9;
    }
/*--- Main ---*/
.main {
  position: relative;   /* для псевдоэлемента */
  color: #ffffff;
  padding: 0 0 100px 0;
  background: url("images/main/bg.jpg") center top no-repeat;
  background-size: cover;           /* одно значение, без конфликтов */
  overflow: hidden;     /* чтобы псевдоэлемент не вылезал */
}

.main::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* затемнение, меняй 0.5 по вкусу */
  z-index: 1;
}

.main > * {
  position: relative;
  z-index: 2;  /* контент поверх затемнения */
}

.main, .advantages, .question {
  background-attachment: fixed;
  background-size: cover;
}

.main, .advantages, .question {
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
}

    /*--- Header ---*/
        .header{
padding: 30px 0 0 0;
display: flex;
justify-content: flex-end;
gap: 10px;
        }
        .logo{
width: 225px;
text-align: center;
margin: 0 20px 0 0;
font-family: "RobotoSlabBold";
letter-spacing: 0.4px;
text-decoration: none;
font-size: 24px;
        }
        .logo span{
width: 220px;
height: 20px;
display: block;
font-size: 14px;
line-height: 20px;
background: #ff5b01;
text-transform: uppercase;
letter-spacing: 0.3px;
text-align: center;
margin: 5px 0 0 0;
        }
        /*--- Text_btn ---*/
.text_btn{
    text-align: center;
    width: 120px;
    text-align: center;
    margin: 9px 20px 0 0;
    letter-spacing: 0.3px;
    font-family: "RobotoSlabBold";
    font-size: 14px;
}

.text_btn a{
    font-family: "RobotoSlabBold";
    text-decoration: none;
    display: inline-block;
    vertical-align: top;
    margin: 4px 0 0 0;
    font-size: 24px;
}
.text_btn a > *{
    display: inline-block;
    vertical-align: middle;
}
.text_btn span{
    margin: 0;
    padding: 0 10px;
    text-transform: uppercase;
    line-height: 22px;
    background: #ff5b01;
}
.text_btn a:hover span{
    border-color: transparent;
}



        /*--- phone ---*/
.phone {
    width: 250px;
    text-align: center;
    margin: 9px 10px 0 0;
    letter-spacing: 0.3px;
    font-family: "RobotoSlabThin";
    font-size: 18px;
}

.phone a{
    font-family: "RobotoSlabBold";
    text-decoration: none;
    display: inline-block;
    vertical-align: top;
    margin: 4px 0 0 0;
    font-size: 24px;
}
.phone a > *{
    display: inline-block;
    vertical-align: middle;
}
.phone span{
    margin: 0 0 0 6px;
    padding: 0 0 2px 0;
    border-bottom: 2px dashed #ffb900;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
	font-family: "RobotoLight";
}
.phone a:hover span{
    border-color: transparent;
}
.phone strong{
    font-weight: normal;
    font-family: "RobotoSlabBold";
}



        /*--- WA ---*/

.wa {
    width: 250px;
    font-size: 18px;
    text-align: center;
    margin: 9px 10px 0 0;
    letter-spacing: 0.4px;
    font-family: "RobotoSlabThin";
}

.wa a{
    font-family: "RobotoSlabBold";
    text-decoration: none;
    display: inline-block;
    vertical-align: top;
    margin: 4px 0 0 0;
    font-size: 24px;
}
.wa a > *{
    display: inline-block;
    vertical-align: middle;
}
.wa span{
    margin: 0 0 0 6px;
    padding: 0 0 2px 0;
    border-bottom: 2px dashed #ffb900;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
	font-family: "RobotoLight";
}
.wa a:hover span{
    border-color: transparent;
}
.wa strong{
    font-weight: normal;
    font-family: "RobotoSlabBold";
}



/*--- TG ---*/

.tg {
    width: 250px;
    font-size: 18px;
    text-align: center;
    margin: 9px 10px 0 0;
    letter-spacing: 0.4px;
    font-family: "RobotoSlabThin";
}

.tg a{
    font-family: "RobotoSlabBold";
    text-decoration: none;
    display: inline-block;
    vertical-align: top;
    margin: 4px 0 0 0;
    font-size: 24px;
}
.tg a > *{
    display: inline-block;
    vertical-align: middle;
}
.tg span{
    margin: 0 0 0 6px;
    padding: 0 0 2px 0;
    border-bottom: 2px dashed #ffb900;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
	font-family: "RobotoLight";
}
.tg a:hover span{
    border-color: transparent;
}
.tg strong{
    font-weight: normal;
    font-family: "RobotoSlabBold";
}



















    /*--- Offer ---*/
        .offer{
width: 670px;
margin: 96px 0 0 0;
        }
        .offer h1{
margin: 0;
font-size: 45px;
font-weight: normal;
letter-spacing: 0.9px;
font-family: "RobotoSlabBold";
text-transform: uppercase;
line-height: 1.4;
        }
        .offer h1 span{
font-family: "RobotoSlabBold";
        	color: #ffb23c;
        }
        /*--- Offer__advantages ---*/
.offer__advantages{
    font-size: 18px;
    margin: 26px 0 34px 0;
    letter-spacing: 0.34px;
}
.offer__advantages li{
    padding: 0 0 0 29px;
    background: url(images/main/list_style.png) left top 13px no-repeat;
    line-height: 1.85;
}
.offer__advantages li:last-child{
    margin: 0;
}
.offer__advantages strong{
    font-weight: normal;
    font-family: "RobotoBold";
}
        .btn{
width: 273px;
height: 62px;
border: none;
cursor: pointer;
line-height: 60px;
position: relative;
text-align: center;
letter-spacing: 0.3px;
display: inline-block;
vertical-align: middle;
text-decoration: underline;
font-family: "RobotoSlabLight";
-webkit-box-shadow: 0px -2px 0px 0px #c58f00 inset;
box-shadow: 0px -2px 0px 0px #c58f00 inset;
-webkit-transition: all 0.3s;
transition: all 0.3s;
background: #ffbb00;
border-radius: 4px;
font-size: 16px;
color: #000000;
        }
        .btn:hover{
background: #e0a300;
text-decoration: none;
        }
        .btn:active{
background: #cd9500;
-webkit-box-shadow: none;
box-shadow: none;
        }
        .note{
position: absolute;
right: -60px;
bottom: -15px;
background: #ff5500;
font-family: "RobotoRegular";
line-height: 30px;
font-size: 14px;
color: #ffffff;
width: 140px;
height: 33px;
-webkit-transform: rotate(-15deg);
transform: rotate(-15deg);
        }
        /*--- Offer__list ---*/
.offer__list{
    font-family: "RobotoSlabLight";
    letter-spacing: 0.3px;
    display: inline-block;
    vertical-align: middle;
    margin: -5px 0 0 99px;
    font-size: 14px;
}
.offer__list li{
    margin: 0 0 4px 0;
}
.offer__list li:last-child{
    margin: 0;
}
/*--- Portfolio ---*/
    .portfolio{
        position: relative;
        padding: 89px 0 100px 0;
        background: url("images/portfolio/bg.jpg") center top no-repeat;
        background-size: cover;
        text-align: center;
        z-index: 1; 
    }
    h2{
        font-size: 45px;
        font-weight: normal;
        letter-spacing: 0.9px;
        font-family: "RobotoSlabBold";
        text-transform: uppercase;
    }
    h2:after{
        content: "";
        display: block;
        background: #ffb900;
        margin: 22px auto 0 auto;
        width: 100px;
        height: 10px;
    }
    /*--- Portfolio__list ---*/
        .portfolio__list{
margin: 30px 0 0 0;
        }
        .portfolio__list a{
float: left;
width: 288px;
padding: 14px;
border-radius: 4px;
background: #ffffff;
margin: 0 6px 27px 0;
border: 2px solid #f1f1f1;
-webkit-transition: all 0.3s;
transition: all 0.3s;
        }
        .portfolio__list a:hover{
border-color: #ffda77;
        }
        .portfolio__list a:nth-child(4n){
margin-right: 0;
        }
/*--- Services ---*/
    .services{
        text-align: center;
        padding: 89px 0 60px 0;
        background: url("images/services/bg.jpg") center top no-repeat;
        background-size: cover;
        position: relative;
        z-index: 1;
    }
    h2 span{
        display: block;
        line-height: 1.5;
        margin: 15px 0 0 0;
        letter-spacing: 0.35px;
        font-family: "RobotoSlabRegular";
        text-transform: none;
        font-size: 18px;
    }
    h2 strong{
        font-weight: normal;
        font-family: "RobotoSlabBold";
    }
    /*--- Services__list ---*/
        .services__list{
display: flex;
flex-wrap: wrap;
text-align: left;
line-height: 1.5;
font-size: 18px;
font-family: "RobotoSlabRegular";
margin: 32px 0 0 0;
        }
        .services__item{
width: 380px;
letter-spacing: 0.4px;
margin: 0 15px 40px 0;
padding: 0 0 40px 0;
position: relative;
        }
        .services__item:nth-child(3n){
margin-right: 0;
        }
        .services__img{
padding: 10px;
background: #ffffff;
margin: 0 0 16px 0;
        }
        .services__item a{
position: absolute;
left: 0;
bottom: 0;
letter-spacing: 0.3px;
font-family: "RobotoSlabBold";
border-bottom: 2px dashed #ffb900;
text-decoration: none;
padding: 0 0 1px 0;
font-size: 16px;
-webkit-transition: all 0.3s;
transition: all 0.3s;
        }
        .services__item a:hover{
border-color: transparent;
        }
/*--- Advantages ---*/
.advantages {
    position: relative; /* нужно для ::before */
    color: #ffffff;
    text-align: center;
    direction: rtl;
    padding: 89px 0 100px 0;
    background: url("images/advantages/bg.jpg") center top no-repeat;
    background-size: cover;
    overflow: hidden; /* чтобы затемнение не вылезало */
}

.advantages::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* уровень затемнения (меняй 0.5 по вкусу) */
    z-index: 1;
}

.advantages > * {
    position: relative;
    z-index: 2; /* чтобы контент был поверх затемнения */
}

/* Твой существующий код можно оставить как есть */
.advantages h2 {
    margin: 0 0 40px 0;
    direction: ltr;
}

.advantages h2:after {
    margin: 32px auto 0 auto;
}



    /*--- Forma ---*/
        .forma{
color: #000000;
margin: 0 0 0 14px;
padding: 32px 30px 38px 30px;
display: inline-block;
vertical-align: middle;
direction: ltr;
border-radius: 4px;
background: #ffffff;
width: 430px;
        }
        .forma p{
font-size: 20px;
letter-spacing: 0.4px;
font-family: "RobotoSlabBold";
text-transform: uppercase;
line-height: 1.5;
        }
        .forma > span{
display: block;
color: #555555;
line-height: 1.5;
margin: 17px 0 24px 0;
letter-spacing: 0.3px;
        }
        .forma input[type=text],
        .forma select,
        .forma textarea{
width: 100%;
height: 55px;
padding: 0 19px 0 70px;
letter-spacing: 0.4px;
border: 1px solid #aaaaaa;
background: url("images/advantages/form_icon1.png") center left 16px no-repeat;
border-radius: 4px;
        }
        .forma input[name=phone]{
margin: 10px 0 0 0;
background-image: url("images/advantages/form_icon2.png");
        }
        .forma select{
margin: 10px 0 0 0;
padding-right: 28px !important;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: url("images/advantages/form_icon3.png") center left 16px no-repeat, url("images/advantages/arrow.png") center right 8px no-repeat;
        }
        .error::-webkit-input-placeholder{
color: #ff0a22;
        }
        .error:-moz-placeholder{
color: #ff0a22;
        }
        .error::-moz-placeholder{
color: #ff0a22;
        }
        .error:-ms-input-placeholder{
color: #ff0a22;
        }
        .forma label{
display: block;
font-size: 12px;
font-family: "RobotoLight";
letter-spacing: 0.25px;
margin: 19px 0 18px 0;
color: #0066bb;
        }
        .forma label > *{
display: inline-block;
vertical-align: middle;
        }
        .forma label span{
margin: -2px 0 0 5px;
        }
    /*--- Advantages__list ---*/
        .advantages__list{
text-align: left;
margin: 0 0 0 38px;
display: inline-block;
vertical-align: middle;
letter-spacing: 0.35px;
direction: ltr;
font-size: 18px;
        }
        .advantages__list li{
margin: 0 0 28px 0;
        }
        .advantages__list li:last-child{
margin: 0;
        }
        .advantages__list p{
width: 390px;
margin: 0 0 0 33px;
display: inline-block;
vertical-align: middle;
        }
        .advantages__list strong{
font-weight: normal;
font-family: "RobotoBold";
        }
/*--- Machinery ---*/
    .machinery{
        text-align: center;
        padding: 89px 0 100px 0;
        background: url("images/machinery/bg.jpg") center top no-repeat;
        background-size: cover;
        position: relative;
        z-index: 1;
    }
    .machinery h2:after{
        margin: 32px auto 0 auto;
    }
    /*--- Machine ---*/
        .machine{
font-size: 20px;
letter-spacing: 0.5px;
font-family: "RobotoSlabBold";
text-transform: uppercase;
margin: 82px 0 0 0;
        }
        .machine__item{
float: left;
width: 370px;
text-align: left;
margin: 0 30px 0 0;
        }
        .machine__item:last-child{
margin: 0;
        }
        .machine__img{
height: 202px;
border-radius: 2px;
position: relative;
background: #ffffff;
border: 1px solid #bdbdbd;
margin: 0 0 25px 0;
        }
        .machine__img img{
position: absolute;
left: 0;
right: 0;
bottom: -10px;
margin: auto;
        }
    /*--- Slider ---*/
        .slider{
width: 852px;
padding: 15px;
position: relative;
background: #ffffff;
border: 1px solid #bdbdbd;
margin: 35px auto 30px auto;
        }
        .prev,
        .next{
position: absolute;
top: 50%;
left: -108px;
margin: -25px 0 0 0;
width: 51px;
height: 51px;
border-radius: 50%;
border: 4px solid #000000;
background-image: url("images/machinery/prev.png");
background-position: 46% 50%;
background-repeat: no-repeat;
cursor: pointer;
z-index: 1;
        }
        .next{
left: auto;
right: -108px;
background-image: url("images/machinery/next.png");
background-position: 54% 50%;
        }
/*--- Question ---*/
    .question{
        color: #ffffff;
        text-align: center;
        padding: 89px 0 100px 0;
        background: url("images/question/bg.jpg") center top no-repeat;
        background-size: cover;
    }
    .question h2{
        margin: 0 0 37px 0;
    }
    .question h2:after{
        margin: 32px auto 0 auto;
    }
    /*--- Text_btn ---*/
        .question .text_btn,
        .question .phone{
float: none;
display: inline-block;
vertical-align: top;
margin: 0;
        }
        .question .text_btn--call{
margin: 0 152px;
        }
    /*--- Forma ---*/
        .question .forma{
width: 100%;
max-width: 900px;
margin: 40px 0 0 0;
padding: 32px 70px 40px 70px;
        }
        .question .forma > span{
margin: 7px 0 24px 0;
        }
        .question .forma input[type=text]{
float: left;
width: 370px;
        }
        .question .forma input[name=phone]{
margin: 0 0 0 20px;
        }
        .forma textarea{
height: 162px;
margin: 20px 0 0 0;
padding: 19px 19px 19px 70px;
background-image: url("images/advantages/form_icon4.png");
background-position: top 16px left 16px;
        }
        .question .forma label{
margin: 26px 0 18px 0;
        }
/*--- Footer ---*/
    .footer{
        position: relative;
        z-index: 1;
        font-size: 14px;
        padding: 22px 0;
        background: #000000;
        letter-spacing: 0.3px;
        font-family: "RobotoSlabLight";
        color: #ffffff;
    }
    .footer p{
        float: left;
    }
    .footer a{
        float: right;
    }
/*--- Modal ---*/
    .modal{
        display: none;
    }
    .arcticmodal-close{
        font-size: 14px;
        color: #555555;
    }
    /*--- Modal__block ---*/
        .modal__block{
text-align: center;
        }
        .modal__block .forma{
margin: 0;
width: 330px;
padding: 32px 20px 30px 20px;
        }
        .modal__block .forma input[type=text],
        .modal__block .forma select{
background-size: 20px;
padding: 0 19px 0 57px;
width: 270px;
        }
        .modal__block .forma select{
background-size: 20px, auto;
        }
        .modal__block .forma .btn{
width: 270px;
margin: 0 0 13px 0;
        }
/*--- Thanks ---*/
    .thanks{
        background: url("images/main/bg.jpg") center top no-repeat;
        background-size: cover;
    }
    .table{
        width: 100%;
        display: table;
        min-height: 100vh;
        border-collapse: collapse;
    }
    .table__cell{
        padding: 50px 0;
        display: table-cell;
        vertical-align: middle;
    }
    /*--- Thanks__text ---*/
        .thanks__text{
width: 600px;
color: #ffffff;
        }
        .thanks__text p{
font-size: 45px;
margin: 0 0 36px 0;
letter-spacing: 0.9px;
font-family: "RobotoSlabBold";
text-transform: uppercase;
line-height: 1.4;
        }
        .thanks__text p span{
font-family: "RobotoSlabLight";
        }
        
        
        
        
        
        
        /*--- About ---*/
    .about{
        background: url("images/services/bg.jpg") center top no-repeat;
        background-size: cover;
        padding: 89px 0 100px 0;
        text-align: center;
    }
    /*--- About__list ---*/
        .about__list{
margin: 50px 0 47px 0;
position: relative;
font-size: 0;
        }
        .about__list:after{
content: "";
position: absolute;
top: 129px;
left: 0;
right: 0;
height: 1px;
width: 900px;
margin: auto;
background: #ffbb00;
        }
        .about__item{
width: 270px;
font-size: 18px;
color: #000000;
line-height: 1.5;
margin: 0 30px 0 0;
display: inline-block;
vertical-align: top;
letter-spacing: 0.2px;
        }
        .about__item:last-child{
margin-right: 0;
        }
        .about__item div{
width: 15px;
height: 15px;
border-radius: 50%;
background: #ffbb00;
margin: 20px auto 15px auto;
        }
        .about__item p span{
font-family: "RobotoSlabRegular";
        }

.hideform {
  position: fixed;
  background: #fff;
  top: 50%;
  left: 50%;
  z-index: 999999;
  margin: -20px 0px 0px -150px;
  padding: 35px;
  width: 350px;
  line-height: 1.6;
  border: 1px solid #dfdfdf;
  text-align: center;
  font-size: 18px;
  display: none;
  border-radius: 5px;
  box-shadow: 4px 5px 6px 0px #b1b1b1;
}










.price-sticky {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  pointer-events: none;
}

.price-sticky__inner {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
  padding: 8px 42px 8px 16px;
  border-radius: 40px;
  box-shadow: 0 8px 25px rgba(0,0,0,0.35);
  font-size: 16px;
  pointer-events: auto;
  backdrop-filter: blur(6px);
  animation: fadeUp 0.6s ease;
}

/* ✅ ПУЛЬСИРУЮЩАЯ СКИДКА */
.pulse {
  animation: pulse 1.6s infinite;
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 45, 45, 0.6);
    transform: scale(1);
  }
  70% {
    box-shadow: 0 0 0 14px rgba(255, 45, 45, 0);
    transform: scale(1.06);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 45, 45, 0);
    transform: scale(1);
  }
}

.price-sticky__badge {
  background: #ff2d2d;
  color: #fff;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 30px;
  font-size: 14px;
  white-space: nowrap;
}

.price-sticky__text {
  white-space: nowrap;
  font-weight: 500;
}

.price-sticky__phone {
  color: #00ff9c;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  font-size: 16px;
}

.price-sticky__phone:hover {
  text-decoration: underline;
}

/* ✅ КНОПКА ЗАКРЫТИЯ */
.price-sticky__close {
  position: absolute;
  top: -6px;
  right: -6px;
  width: 22px;
  height: 22px;
  border: none;
  border-radius: 50%;
  background: #ff2d2d;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  line-height: 22px;
  padding: 0;
}

.price-sticky__close:hover {
  opacity: 0.8;
}

/* Анимация появления */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ✅ МОБИЛЬНАЯ ВЕРСИЯ */
@media (max-width: 520px) {
  .price-sticky__inner {
    flex-direction: column;
    gap: 4px;
    padding: 10px 38px 10px 14px;
    border-radius: 16px;
    text-align: center;
    font-size: 15px;
  }
}

























@media (max-width: 1219px){

.header {
text-align: center;
flex-direction: column;
align-items: center;
		}

.question {
text-align: center;
flex-direction: column;
align-items: center;
}

	.container {width: 970px;}
	/*--- Main ---*/
		.logo{
		    margin: 0 20px 0 0;
		}
		.text_btn{
		    margin: 9px 20px 0 0;
		}
	/*--- Portfolio ---*/
		.portfolio__list{
		    margin: 30px 0 7px 0;
		}
		.portfolio__list a{
		    width: 230px;
		    margin: 0 6px 20px 0;
		}
	/*--- Services ---*/
		.services__item{
		    width: 303px;
		}
	/*--- Advantages ---*/
		.forma{
		    margin: 0;
		}
		.advantages__list{
		    margin: 0 0 0 22px;
		}
		.advantages__list p{
		    margin: 0 0 0 35px;
		}
	/*--- Machinery ---*/
		.machine__item{
		    width: 293px;
		}
		.slider{
		    width: 780px;
		}
		.prev{
		    left: -68px;
		}
		.next{
			right: -68px;
		}
	/*--- Question ---*/
		.question .text_btn--call{
		    margin: 0 120px;
		}
		
/*--- About ---*/
	.about__item{
	    width: 212px;
	}
	.about__list:after{
	    width: 726px;
	}
}
@media (max-width: 991px){
	.container{width: 750px}
	/*--- Main ---*/
		.logo{
			float: none;
		    display: block;
		    text-align: center;
		    margin: 0 auto 30px auto;
		}
		.logo span{
		    width: auto;
		}
		.text_btn{
		    margin: 0 20px 0 0;
		}
		.phone,.wa {
			margin: 0;
		}
	/*--- Portfolio ---*/
		.portfolio__list a{
		    width: 175px;
		    padding: 10px;
		}
	/*--- Services ---*/
		.services__item{
		    width: 48%;
		    margin: 0 4% 40px 0;
		}
		.services__item:nth-child(3n){
margin-right: 4%;
        }
        .services__item:nth-child(2n){
margin-right: 0;
        }
	/*--- Advantages ---*/
		.forma{
		    width: 380px;
		}
		.advantages__list p{
		    width: 220px;
		}
	/*--- Machinery ---*/
		.machine{
		    font-size: 20px;
		}
		.machine__item{
		    width: 220px;
		}
		.machine__img{
		    height: 140px;
		}
		.slider{
		    width: 580px;
		}
	/*--- Question ---*/
		.question .text_btn--call{
		    margin: 0 30px;
		}
		.question .forma input[type=text]{
		    width: 280px;
		}
		
	/*--- About ---*/
	.about{
        padding: 70px 0;
    }
	.about__item{
	    width: 156px;
	    font-size: 16px;
	}
	.about__list:after{
	    width: 560px;
	}
}
@media (max-width: 767px){
	.container{width: 560px}
	/*--- Main ---*/
		.main{
			padding: 0 0 70px 0;
		}

		.text_btn{
			float: none;
		    margin: 0 26px;
		    display: inline-block;
		    vertical-align: top;
	        text-align: center;
		}

.phone, .wa, .tg {
    text-align: center;
    margin: 30px auto 0 auto;
}

		.offer{
			width: auto;
			text-align: center;
			margin: 70px 0 0 0;
		}
		.offer h1{
		    font-size: 38px;
		}
		.offer__advantages{
			text-align: left;
		    max-width: 370px;
		    margin: 33px auto 40px auto;
		}
		.offer__advantages li{
		    margin: 0 0 10px 0;
		}
		.offer__list{
			text-align: left;
		    margin: 60px 0 0 0;
		}
	/*--- Portfolio ---*/
		.portfolio{
			padding: 70px 0;
		}
		h2{
			font-size: 38px;
		}
		.portfolio__list a{
		    width: 172px;
		}
		.portfolio__list a:nth-child(4n){
margin-right: 6px;
        }
        .portfolio__list a:nth-child(3n){
margin-right: 0;
        }
	/*--- Services ---*/
		.services{
	        padding: 70px 0 30px 0;
	    }
	    .services__list{
		    font-size: 16px;
		}
	/*--- Advantages ---*/
		.advantages{
	        padding: 70px 0;
	    }
	    .forma{
		    width: 100%;
		    max-width: 430px;
		}
	    .advantages__list{
	    	margin: 0;
		    text-align: center;
		}
		.advantages__list li{
		    margin: 0 10px 40px 10px !important;
		    display: inline-block;
		    vertical-align: top;
		    width: 240px;
		}
		.advantages__list p{
		    width: auto;
		    display: block;
		    margin: 10px 0 0 0;
		}
	/*--- Machinery ---*/
		.machinery{
	        padding: 70px 0;
	    }
	    .machine{
		    font-size: 18px;
	        margin: 70px 0 0 0;
		}
	    .machine__item{
		    width: 166px;
		    margin: 0 15px 0 0;
		}
		.machine__img{
		    height: 110px;
		}
		.slider{
		    width: 430px;
		}
		.prev,
		.next{
		    margin: -20px 0 0 0;
		    height: 41px;
		    width: 41px;
		    background-size: 12px;
		    border-width: 3px;
		}
		.prev{
		    left: -50px;
		}
		.next{
		    right: -50px;
		}
	/*--- Question ---*/
		.question{
	        padding: 70px 0;
	    }
		.question .text_btn--call{
		    margin: 0 0 0 95px;
		}
		.question .phone {
		    margin: 30px 0 0 0;
		}
		.question .forma{
		    padding: 32px 30px 40px 30px;
		}
		.question .forma input[type=text]{
		    width: 100%;
		    float: none;
		}
		.question .forma input[name=phone]{
		    margin: 10px 0 0 0;
		}
		.forma textarea{
		    margin: 10px 0 0 0;
		}
	/*--- Thanks ---*/
		.thanks__text {
		    width: auto;
		    text-align: center;
		}
		.thanks__text p{
font-size: 38px;
        }
        
    /*--- About ---*/
	.about__list{
	    margin: 50px 0 17px 0;
	}
	.about__list:after{
	    display: none;
	}
	.about__item{
	    width: 212px;
        font-size: 18px;
	    margin: 0 24px 30px 24px !important;
	}
	.about__item div{
		display: none;
	}
	.about__item > p{
		margin: 20px 0 0 0;
	}
}

@media (max-width: 579px){
	.container{width: 100%}
	/*--- Main ---*/
		.main{
			padding: 0 0 50px 0;
		}
		.text_btn{
		    margin: 0 6px;
		}
		.offer{
			margin: 50px 0 0 0;
		}
		.offer h1{
		    font-size: 30px;
		}
		.offer__advantages{
		    font-size: 16px;
		}
	/*--- Portfolio ---*/
		.portfolio{
			padding: 50px 0;
		}
		h2{
			font-size: 30px;
		}
		.portfolio__list a{
		    width: 49%;
		    padding: 8px;
		    margin: 0 2% 20px 0;
		}
		.portfolio__list a:nth-child(3n){
margin-right: 2%;
        }
        .portfolio__list a:nth-child(2n){
        	margin-right: 0;
        }
	/*--- Services ---*/
		.services{
	        padding: 50px 0 10px 0;
	    }
	    h2 span{
	    	font-size: 16px;
	    }
		.services__list{
		    display: block;
		    text-align: center;
		    font-size: 18px;
		}
		.services__item{
		    padding: 0;
		    width: 100%;
		    max-width: 380px;
		    margin: 0 0 40px 0;
		    display: inline-block;
		    vertical-align: top;
		}
		.services__item:nth-child(3n){
margin-right: 0;
        }
        .services__item p{
        	margin: 0 0 14px 0;
        }
		.services__item a{
		    position: relative;
		}
	/*--- Advantages ---*/
		.advantages{
	        padding: 50px 0;
	    }
	    .advantages__list li{
		    margin: 0 8px 40px 8px !important;
		    width: 194px;
		}
	/*--- Machinery ---*/
		.machinery{
	        padding: 50px 0;
	    }
	    .machine{
		    font-size: 20px;
		}
	    .machine__item{
	    	float: none;
		    width: 100%;
		    margin: 0 0 60px 0;
		    max-width: 370px;
		    display: inline-block;
		    vertical-align: top;
		}
		.machine__img{
		    height: 202px;
		}
		.slider{
		    width: auto;
		    padding: 10px;
		    margin: 35px 35px 30px 35px;
		}
		.prev,
		.next{
		    margin: -13px 0 0 0;
		    background-size: 8px;
		    border-width: 2px;
		    width: 26px;
		    height: 26px;
		}
		.prev{
		    left: -35px;
		}
		.next{
		    right: -35px;
		}
	/*--- Question ---*/
		.question{
	        padding: 50px 0;
	    }
	    .question .text_btn--call{
		    margin: 0 0 0 20px;
		}
	/*--- Footer ---*/
		.footer{
			text-align: center;
		}
		.footer p,
		.footer a{
			float: none;
		}
		.footer p{
			margin: 0 0 15px 0;
		}
	/*--- Thanks ---*/
		.thanks__text p{
font-size: 30px;
        }
    
/*--- About ---*/
    .about__item{
	    width: 100%;
	    max-width: 370px;
	    margin: 0 0 30px 0 !important;
	}
	.about__item p br{
		display: none;
	}
}



@media (max-width: 479px){
	/*--- Main ---*/
		.logo{
		    margin: 0 auto 20px auto;
		}
		.text_btn{
		    margin: 10px 0;
		    width: 100%;
		}
		.phone, .wa {
		    margin: 20px auto 0 auto;
		}
		.offer h1{
		    font-size: 26px;
		}
		.note{
		    left: 0;
		    right: 0;
		    bottom: -40px;
		    margin: auto;
		    -webkit-transform: none;
		    transform: none;
		}
	/*--- Portfolio ---*/
		h2{
			font-size: 26px;
		}
	/*--- Advantages ---*/
		.forma{
			max-width: 350px;
		    padding: 22px 20px 28px 20px;
		}
		.forma p{
		    font-size: 18px;
		}
		.forma input[type=text],
		.forma select{
		    height: 48px;
		    font-size: 14px;
		    padding: 0 10px 0 50px;
		    background-position: center left 9px;
		}
		.forma select{
			background-position: center left 9px, center right 8px;
		}
		.forma label span{
		    width: 140px;
		}
		.forma .btn{
			width: 100%;
			max-width: 273px;
		}
		.advantages__list li{
		    width: 240px;
		}
	/*--- Machinery ---*/
		.machine__item{
		    margin: 0 0 40px 0;
		}
		.slider{
		    width: auto;
		    padding: 0;
		    margin: 35px 0 30px 0;
		}
		.prev,
		.next{
			background-color: #ffffff;
    		border-color: #ffffff;
		}
		.prev{
		    left: 5px;
		}
		.next{
		    right: 5px;
		}
	/*--- Question ---*/
		.question .text_btn--call{
		    margin: 30px 0 0 0;
		}
		.question .forma{
		    padding: 22px 20px 28px 20px;
		}
		.forma textarea{
		    height: 120px;
		    font-size: 14px;
		    padding: 19px 10px 19px 50px;
		    background-position: top 16px left 9px;
		}
	/*--- Modal ---*/
		.modal__block .forma{
		    width: auto;
		}
		.modal__block .forma input[type=text],
		.modal__block .forma select{
			padding: 0 10px 0 40px;
			width: 100%;
		}
		.modal__block .forma .btn{
			width: 100%;
		}
	/*--- Thanks ---*/
		.thanks__text p{
font-size: 26px;
        }
}