
:root{
--blue:#293486;
--green:#21B557;
--green2:#D1FABD;
--dark:#303845;
--text:#000;
--bg:#f5f8f7;
}

*{margin:0;padding:0;box-sizing:border-box;}

body{



}

.container{
	//font-family:'Montserrat',sans-serif;
max-width:980px;
margin:auto;
padding:0 18px;
}

section{
padding: 28px 0;
}

img,video{
max-width:100%;

}

h1,h2,h3{

}
h1{background: #21B557; color: #fff; padding: 12px; text-align:Center; border-radius: 5px;font-size: 24px; text-transform: uppercase;margin: 0; margin-bottom: 30px;}
h2.sec, h2{
font-size: 25px;text-align:center;text-transform: uppercase;
font-weight:800;
color: var(--text);
margin-bottom:22px;
}

/* HERO */

.hero{
overflow:hidden;
background:
radial-gradient(circle at 10% 20%, rgba(33,181,87,.08), transparent 25%),
radial-gradient(circle at 90% 10%, rgba(41,52,134,.07), transparent 22%),
linear-gradient(135deg,#f8fff8,#eef7ef);
position:relative;
height: 440px;
}


 .gallery img{
width:100%;
height:280px;
object-fit:cover;
border-radius:24px;
box-shadow:0 18px 45px rgba(0,0,0,.08);
}
.gallery img{
height:220px;
}
.hero213::after {
  content: "";
  position: absolute;
  top: -100px; /* Запас для анимации */
  right: 0;
  width: 50%;   /* Занимает правую половину */
  height: 200%; /* Делаем фон длиннее для бесконечной прокрутки */
  
  /* Ваша ссылка на PNG семена */
  //background-image: url('/new/bgb.png'); 
  background-repeat: no-repeat;
  //background-size: contain;
  
  /* ПРОЗРАЧНОСТЬ КАРТИНКИ */
  opacity: 1.6; 
  background-position: right center;
  /* АНИМАЦИЯ */
  //animation: grainsFalling 10s linear infinite;
  z-index: 1;
}

.hcontent {
  position: relative;
  z-index: 2; /* Текст всегда поверх семян */
  max-width: 500px;
}

/* Движение фона */
@keyframes grainsFalling {
  0% { transform: translateY(0); }
  100% { transform: translateY(500px); } /* Смещение вниз */
}
.hero:before{
content:'';
position:absolute;
inset:0;
background-image:
radial-gradient(circle, rgba(201,160,74,.16) 0 4px, transparent 5px),
radial-gradient(circle, rgba(201,160,74,.10) 0 3px, transparent 4px);
background-size:180px 180px,220px 220px;
animation:seedmove 16s linear infinite;
opacity:.6;
z-index: 5;
}

@keyframes seedmove{
0%{transform:translateY(-40px);}
100%{transform:translateY(60px);}
}

.hero-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
align-items:center;
position:relative;
z-index:2;
}

.brand{

align-items:center;
gap:14px;
margin-bottom:22px;
}

.brand img{height:54px;}

.brand span{
font-size: 17px;
font-weight:800;
color:var(--blue);
}

.hero h1{
//font-size:58px;
//font-weight:800;
//color:var(--blue);
//margin-bottom:16px;
}

.hero p{
font-size:20px;
padding-left: 20px;
padding-right: 20px;
margin-bottom:22px;
color: #333;
line-height: 1.45;
}

.hero-box{

padding:0px;
border-radius:0px;
//box-shadow:0 28px 60px rgba(0,0,0,.08);
}

.hero-box img{
border-radius:20px;
}

/* WHY */

.alt{
display:grid;
grid-template-columns:1fr 1fr;
gap:34px;
align-items:center;
margin-bottom:34px;
}

/* Чётные блоки на ПК переворачиваем */
.alt:nth-child(even) .text{
order:2;
}

.alt:nth-child(even) div:last-child{
order:1;
}
.alt .text{
background:#fff;
padding: 28px;
text-align:justify;
border-radius: 22px;
font-size: 16px;
box-shadow:0 14px 34px rgba(0,0,0,.05);
}

.alt .num{
font-size:52px;
font-weight:800;
color:var(--green);
line-height:1;
margin-bottom:8px;
}

.alt h3{
font-size:24px;
color:var(--blue);
margin-bottom:12px;
}

.alt img{
width:100%;
height:100%;
max-height:320px;
object-fit:cover;
border-radius:22px;
box-shadow:0 18px 40px rgba(0,0,0,.08);
}

/* PROCESS */

.process{
background:var(--bg);
}

.flow{
display:grid;
grid-template-columns:repeat(6,1fr);
gap:12px;
margin:36px 0;
align-items:center;
}

.node{
text-align:center;
position:relative;
padding:10px 8px;
}

.node:not(:last-child):after{
content:'➜';
position:absolute;
right:-8px;
top:34px;
font-size:24px;
font-weight:800;
color:var(--green);
}

.circle{
width:78px;
height:78px;
margin:auto auto 14px;
border-radius:50%;
border:3px solid var(--green);
background:#fff;
display:flex;
align-items:center;
justify-content:center;
font-size:30px;
box-shadow:0 12px 30px rgba(33,181,87,.12);
}

.node b{
display:block;
font-size:16px;
color:var(--green);
font-weight:700;
}

.proc-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:34px;
}

.proc-list{
display:grid;
gap:14px;
}

.proc-item{
background:#fff;
padding: 16px;
font-size: 13px;
border-radius:12px;
border-left: 4px solid var(--green);
box-shadow:0 10px 26px rgba(0,0,0,.05);
}

.proc-item strong{
display:block;
font-size: 17px;
color:var(--blue);
margin-bottom:5px;
}

/* CTA */

.cta{
background:linear-gradient(135deg,var(--blue),#1d2564);
color:#fff;
text-align:center;
}

.cta h2{
color:#fff;
font-size:32px;
margin-bottom:14px;
}

.form{
display:grid;
grid-template-columns:1fr 1fr 1fr auto;
gap:14px;
max-width:920px;
margin:auto;
}

.form input,.form select{
padding:16px;
border:none;
border-radius:12px;
}

.form button{
padding:16px 26px;
border:none;
border-radius:12px;
background:var(--green);
color:#fff;
font-weight:700;
}

/* FOOT */

.foot{
background:#303845;
color:#fff;
padding:42px 0;
}

/* EQUIPMENT */

.eq-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:34px;
align-items:start;
}

.eq-list{
display:grid;
gap:30px;
}

.eq-list div{
background:#f7faf7;
padding: 22px;
border-radius:16px;
border-left: 4px solid var(--green);
}

/* CTA */

.cta{
background:linear-gradient(135deg,var(--blue),#1d2564);
color:#fff;
text-align:center;
}

.cta h2{
color:#fff;
font-size:32px;
margin-bottom:12px;
}

.cta p{
font-size:18px;
opacity:.92;
margin-bottom:28px;
}


/* FOOT */

.foot{
background:#303845;
color:#fff;
padding:42px 0;
font-size:15px;
}
/* MOBILE */

@media(max-width:1100px){

.hero-grid,
.proc-grid, .eq-grid{
grid-template-columns:1fr;
}
.eq-grid > div:last-child{
order:1;
}

/* видео вторым */
.eq-grid > div.vds2{
order:2;
}
.flow{
grid-template-columns:repeat(2,1fr);
gap:22px 16px;
}

.node:after{display:none;}

.node:nth-child(1):after,
.node:nth-child(3):after,
.node:nth-child(5):after{
display:block;
content:'➜';
right:-8px;
top:34px;
}

.node:nth-child(2):before,
.node:nth-child(4):before{
content:'⬇';
position:absolute;
left:50%;
transform:translateX(-50%);
bottom:-22px;
font-size:22px;
color:var(--green);
font-weight:800;
}

.form{
grid-template-columns:1fr 1fr;
}

}
.fl{float: left;}
.fl25{width: 25%;}
.vds1{text-align:right}
.vds2{text-align:left;}
.mbg2{max-width: 980px; margin:0 auto;text-align:center;}
@media(max-width:768px){
	
.mbg2{max-width: 90%; margin:0 auto;text-align:center;}
	.vds1, .vds2{text-align:center; width: 100%;}
.fl, .fr{float: none;text-align:center;}
	.fl25{width: 100%;}
section{padding: 28px 15px;}

.hero-grid,
.alt{
grid-template-columns:1fr;
gap:18px;
}

/* На мобиле ВСЕГДА текст сверху */
.alt .text{
order:1 !important;
}

/* Картинка всегда снизу */
.alt div:last-child{
order:2 !important;
}
.hero::after {
background-position: right -200px;
}
.hero h1{font-size:26px;}

h2.sec{font-size: 20px;}

.brand{
flex-direction:column;
align-items:flex-start;
}

.brand span{font-size:22px;}

/* важное: текст-картинка */
.alt:nth-child(even) .text{order:1;}
.alt:nth-child(even) div:last-child{order:2;}

.alt .text{order:1;}
.alt div:last-child{order:2;}

.flow{
grid-template-columns:repeat(2,1fr);
}

.form{
grid-template-columns:1fr;
}

}

/* PAGINATION */
.gal .swiper-pagination{
position:relative;
margin-top:24px;
bottom:auto !important;
text-align:center;
height:16px;
overflow:hidden;
}

.gal .swiper-pagination-bullet{
width:12px;
height:12px;
background:#cfd6dc;
opacity:1;
margin:0 6px !important;
border-radius:30px;
transition:.3s;
display:none; 
}

.gal .swiper-pagination-bullet-active{
width:34px;
background:#21B557;
display:inline-block;
}


.gal .swiper-pagination-bullet.show{
display:inline-block;
}

.btn{border :0  !important; margin: 0  !important; text-shadow: 0 0 0 rgba(0,0,0,0)  !important; background: #22B456 !important;text-align:Center  !important; color: #fff  !important;}
.btn:hover{opacity: 0.7;}