/* HTML */
/* -------------------------------------------------------------------- */
html { height: 100%; font-size: var(--root-font-size); }
body {  width: 100%; min-height: 100%; vertical-align: top;	background: var(--background-color); color: var(--text-color); font-size: 1.6rem; font-family: var(--font); font-weight: normal; line-height: 1.5; 
}
body > .container { overflow: hidden; opacity: 0;}

iframe { border: none; }

@media screen and (min-width: 2000px) {
	html { font-size: 13px; }
}
@media screen and (min-width: 3000px) {
	html { font-size: 20px; }
}

.-hidden { display: none; }

/* Main elements */
/* ============================================================== */
img { display: inline-block; max-width: 100%; height: auto; }
p:not(:last-child) { margin-bottom: 0.7em; }
b { font-weight: bold; }
a { text-decoration: none; color: inherit; }
a:hover { text-decoration: underline;  }
b, strong { font-weight: bold;}
i { width: auto; height: auto; }
em { font-weight: bold; font-style: normal; }
hr { display: block; margin: 4rem 0; background: 0; border-top: 2px solid #eee; }

/* ============================================================== */
h1, h2, h3, h4 { margin-bottom: 0.5em; line-height: 1.2; color: var(--heading-color); font-weight: 500;}

h1 { font-size: 3.6rem; margin-bottom: 1em;  }
h2 { font-size: 3rem; margin-bottom: 1em;  }
h2.-center { text-align: center; }
h3 { font-size: 2.5rem; }

@media screen and (max-width: 768px) {
	h1 { font-size: 3.2rem; }
	h2 { font-size: 2.8rem; }
	h3 { font-size: 2.4rem; }
}



/* Lists */
/* ============================================================== */
ul, ol { list-style-type: none; }
ol > li::marker  {  display: inline; }
ol > li::before,
ul > li::before { display: inline-block; }
ol > li > p { display: inline; }
ul > li > p { display: inline; }

.hidden { display: none !important; }
.clearfix { clear: both; }

/* ============================================================== */
img.-full { width: 100%; height: auto; float: none; max-width: none; margin-left: 0; margin-right: 0; }
img.-full:not(:first-child) { margin-top: 2rem; }
img.-full:not(:last-child) { margin-bottom: 2rem; }

img.-left { float: left; margin-right: var(--span); margin-bottom: var(--span); max-width: 50rem; height: auto; position: relative; }
img.-right { float: right; margin-left: var(--span); margin-bottom: var(--span); max-width: 50rem; height: auto; position: relative; }

img.-small { max-width: 30rem; }

@media screen and (max-width: 768px) {
	img.-left, img.-right { float: none; max-width: none; margin:0; margin-bottom: 2rem; width: 100%; }
}

/* ============================================================== */
table { width: 100%; margin-bottom: 4rem; background: white;   text-align: center; overflow: hidden; }
table caption { background: var(--color-gray); padding: 2rem; font-size: 2rem; font-weight: bold; color: #333; text-align: center; text-transform: uppercase;  }
table td,
table th { border: 1px solid #d0d0d0; padding: 2rem 2rem; text-align: left;  vertical-align: middle; }
table th { background: #f5f5f5 ;  font-size: 1.8rem; font-weight: bold; border-bottom: 4px solid #82cf2e; }
table td { }                            
table td.value, table th.value { text-align: center; }
table td.first { font-weight: bold; }
table tr.secondary > td:first-child { padding-left: 3rem; }
table h2 { font-size: 1.8rem; }

@media screen and (max-width: 960px) {
	table { overflow: auto; max-width: 100%; }
	table td, table th { padding: 0.5rem 1rem; }
}

.table { font-size: 1.5rem;  }
.table .flex-column { display: flex; flex-wrap: wrap; flex-direction: column; }
.table .col { min-height: 8rem; padding: 1rem; flex-basis: 0; flex-grow: 1; max-width: 100%; }
.table .set-li { display: flex; align-items: stretch; border-bottom: 1px solid #e5e1d9; }
.table .set-li .col:not(:last-child) { border-right: 1px solid #eee6c9; }
.table .set-li .col:first-child { font-weight: bold; }
.table .set-title .col { background: var(--color-green); color: white; font-size: 1.6rem; font-weight: bold; }
.table .set-divider { text-align: center; background: #eae6dd; color: #6c6148; font-size: 1.5rem; font-weight: bold; text-transform: uppercase; padding: 1.5rem 2rem; }


.content-items-container.-borders {display:flex;flex-wrap:wrap;gap:2rem;}
.content-items-container.-borders p{flex-basis:500px; flex-grow:1;border: 3px solid #E0E0E0;padding:1rem;}
.content-items-container.-image { display: flex;flex-wrap: wrap;justify-content: center;}
.content-items-container {display: flex;flex-wrap: wrap;gap:3rem;align-items: center;margin: 3rem 0;}
.content-items-container.-regions {background-color:#f8f6f2;position:relative;overflow:hidden}
.content-items-container.-regions .item{padding: 2rem 3rem;z-index:1; }
.content-items-container.-regions .item:first-child {flex-grow:0;flex-basis:400px}
.content-items-container.-regions:after {content: '';  z-index:0;position: absolute;  right: -15rem;  bottom: -15rem;  width: 30rem;  height: 30rem;  background-image: radial-gradient(circle, #63b73342 15%, rgba(255,255,255,0) 80%); }


.content-items-container.-center { justify-content: center; }

.content-items-container .item { flex-basis:30rem; flex-grow:1; position:relative; }
.content-items-container .item.-grow { flex-basis: 70rem; align-self: flex-start; }
.content-items-container .item img { margin: auto; display: block; }
.content-items-container .item .title { text-align: center; }
.content-items-container.-anser { justify-content: space-between; }
.content-items-container.-anser .item { padding-bottom: 40%; }
.content-items-container.-anser .item img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }
.content-items-container.-anser .item-anser { font-weight: bold; font-size: 8rem; }

@media screen and (max-width:1023px) {
	.content-items-container.-anser .item-anser { display:none; }
}


/* Всплывающие окна */
/* ============================================================== */
.mfp-content {
	--text-color: black; --heading-color: var(--color-red);
	color: black; padding: 4rem; overflow:hidden; background: white; display: inline-block; width: auto !important; max-width: 60rem; z-index: 52; width: 100% !important; 
	font-size: 1.5rem; }
.mfp-content.-policy { max-width: 80%;  }
.product-popup .mfp-content { max-width: 90rem; }

.mfp-bg { z-index: 150;}
.mfp-wrap { z-index: 151; }
.mfp-content form { width: 100%; margin:0 auto; text-align: center; }
.mfp-content a { color: var(--color-green); }
.mfp-content .form button { width: 100%; }
.mfp-content input,
.mfp-content select,
.mfp-content textarea { background: #f4f4f4; border-bottom: 1px solid #888; }
.mfp-content .form-buttons { display: flex; align-items: center; justify-content: center; margin-bottom: 0; }
.mfp-content .vcap-input { justify-content: center; text-align: left; }
.mfp-content .vcap-input > label { font-weight: normal; }
.mfp-content .vcap-input > label a:hover { text-decoration: none; }
.mfp-content h2 { color: black; text-align: center; font-size: 3.6rem; }
.mfp-close { border-radius: 50%; width: 3.5rem; height: 3.5rem; right: 1rem; top: 1rem; line-height: 0; }
.mfp-close:hover,
.mfp-close:focus { color: black; }


.center-container { display: flex; align-items: center; justify-content: center; gap: 1rem 2rem; }
/* Контейнеры для различных элементов и карточек */
/* ============================================================== */
.grid-container { display: grid; grid-template-rows: auto; grid-template-columns: repeat(auto-fill, minmax(var(--item-width), 1fr)); gap: var(--container-gap); justify-content: center;  }

[data-container~="count-5"] { --item-width: 20rem; }
[data-container~="count-4"] { --item-width: 28rem; }
[data-container~="count-3"] { --item-width: 35rem; }
[data-container~="count-2"] { --item-width: 50rem; }

@media screen and (max-width: 960px) {
	.grid-container { display: flex; flex-wrap: wrap; flex-wrap: wrap; justify-content: left; }
	.grid-container > * { flex-basis: var(--item-width);  }
}

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

@media screen and (max-width: 640px) {
	.grid-container {  --item-width: 100% !important; }
}

.flex-container { display: flex; gap: var(--container-gap); flex-wrap: wrap; align-items: center; justify-content: center; }
.flex-container > * { flex-grow: 1; flex-basis: var(--item-width);  }

@media screen and (max-width: 960px) {
	.flex-container > * { max-width: none; }
	.grid-container > * { flex-grow: 1; }
}

.split-container { display: flex; gap: 3rem; flex-wrap: wrap; }
.split-container > * { flex-grow: 1;  flex-basis: 45rem; }
.split-container[data-container~="center"] { align-items: center; }
.split-container[data-container~="no-grow"] > * { flex-grow: 0;  }
.split-container > .image.-large { flex-grow: 2; flex-basis: 45; }
.split-container > .image.-small { flex-basis: 30rem; }

.articles-container { display: flex; gap: 4rem; flex-wrap: wrap; }
.articles-container > * { flex-basis: 100% !important; }
.articles-container > *:not(:last-child) { border-bottom: 1px dashed #aaa; padding-bottom: 2rem; }

.buttons-container { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; align-items: center; }
.teasers-container  {  display: grid; grid-template-columns: repeat(auto-fit, minmax(40rem,1fr)); position: relative;  gap: 2rem;  justify-content: center;  padding: 0.5rem 0; margin: 2rem 0;}

/* ============================================================== */
.twentytwenty-container {  }
.twentytwenty-container img { width: 100%; height: 100%; object-fit: cover; }
.twentytwenty-container .twentytwenty-before-label::before,
.twentytwenty-container .twentytwenty-after-label::before { font-size: 18px; background: #000a; }
.twentytwenty-container .twentytwenty-before-label,
.twentytwenty-container .twentytwenty-after-label { opacity: 0.8; }
.twentytwenty-container .twentytwenty-before-label::before { left: 25% !important; transform: translateX(-50%); }
.twentytwenty-container .twentytwenty-after-label::before { right: 25% !important; transform: translateX(50%); }

.before-after { height: auto !important; padding-top: 56%; position: relative; margin:2rem 0; }
.before-after .before { position: absolute; left:0; top:0; width: 100%; height: 100%;  }
.before-after .after { position: absolute; left:0; top:0; width: 100%; height: 100%;  }

@media screen and (max-width: 640px) {
	.twentytwenty-container .twentytwenty-before-label::before,
	.twentytwenty-container .twentytwenty-after-label::before { font-size: 14px; }
}

/* ============================================================== */
.side-image-container { display: flex; gap: 6rem; justify-content: center; align-items: center; flex-wrap: wrap; }
.side-image-container > * { flex-basis: 40rem; flex-grow: 1; }
.side-image-container > .content { flex-grow: 2; }
.side-image-container > .image { align-self: stretch; position: relative; display: flex; align-items: center; justify-content: center; }
.side-image-container > .image img { max-height: 35rem; width: 100%; height: 100%; object-fit: cover; }

/* ============================================================== */
.side-container { display: flex; align-items: center; flex-wrap: wrap; gap: 4rem;}
.side-container > .content { flex-basis: 30rem; flex-grow: 2; }
.side-container > .side { flex-basis: 20%; flex-grow: 1; min-width: 20rem; align-self: center;}

/* ============================================================== */
.button-up { --color: var(--color-dark-gray); transition: opacity .3s ease; opacity: 0.8; background-color: var(--color-light-gray); height: 5.5rem; width: 5.5rem; bottom: 3rem; right: 3rem; cursor: pointer; display: none; position: fixed; z-index: 999; align-items: flex-end;justify-content: center; border-radius: 50%;  user-select: none; box-shadow: 0 0 5px 0 #0003; }	
.button-up:before { content: "";position: absolute;top: 40%;width: 40%;height: 40%;border-left: 3px solid var(--color);border-top: 3px solid var(--color);transform: rotate(45deg); left: 27%;}
.button-up:hover {opacity: 1;}


/* ============================================================== */
.page-block { padding: var(--block-padding); position: relative; color: var(--text-color); background: var(--background-color); --text-color: inherit; --background-color: transparent;}
.page-block > .block-container { max-width: var(--page-width); margin: 0 auto; position: relative; }

.page-block[data-page-block~="narrow"] { padding-top: var(--span-large); padding-bottom: var(--span-large); }
.page-block[data-page-block~="narrower"] { padding-top: calc(var(--span) * 2); padding-bottom: calc(var(--span) * 2); }
.page-block[data-page-block~="no-padding"] { padding-top: 0; padding-bottom: 0; }
.page-block[data-page-block~="multiple"] { }

.page-block[data-page-block~="black"] { --heading-color: white; --text-color: white;
	--background-color: #252525;	
	--link-color: white; --slider-color-arrow: white; --swiper-pagination-bullet-inactive-color: white;
}

.page-block[data-page-block~="biege"] { --background-color: #f8f6f2; }
.page-block[data-page-block~="gray"] { --background-color: var(--color-gray);}

.page-block > .bg { position: absolute; right: 100%; bottom: 100%; height: 30rem; width: 30rem; z-index: 1; }


/* ============================================================== */
.page-section { padding: 4rem 0; }
.page-section:first-child { margin-top: 0; }
.page-section:last-child { margin-bottom: 0; }

.page-section[data-page-section~="narrow"] { padding: 2rem 0; }


#feedbacks-index .bg-left { position: absolute; width: 19rem; height: 16rem; background: url(../img/bg-brus-02.png) center/contain no-repeat; right: -6.5rem; bottom: -4rem;  }
#feedbacks-index .bg-right { position: absolute; width: 32rem; height: 28rem; background: url(../img/bg-brus-01.png) center/contain no-repeat; left: -10rem; top: 11rem; }
#feedbacks-index .feedbacks-slider { } 
#feedbacks-index .swiper-slide { padding: 0; background: white; z-index: 1; }
#feedbacks-index .swiper-slide:hover { z-index:10; }

.feedback-card { padding: 1rem !important; position: relative; }
.feedback-card a { text-decoration: none !important; }
.feedback-card .image { width: 100%; }
.feedback-card .image img { width: 100%; }
.feedback-card .panel { position: absolute; left: 0; bottom: 0; padding: 1rem; width: 100%; background: white; }

.feedback-slide-card { position: relative; padding-top: 70%; font-size: 1.5rem; z-index: 1; transition: .3s; padding: 1rem; width: 100%; cursor: pointer; }
.feedback-slide-card .image { position: relative; width: 100%; overflow: hidden; padding-top: 70%; display: block; }
.feedback-slide-card .image img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}
.feedback-slide-card .content { position: absolute; bottom: 1rem; left: 1rem; right: 1rem; padding: 2rem; color: white; line-height: 1.2; font-weight: 500; pointer-events: none; }
.feedback-slide-card .name { font-size: 1.5rem;  margin-bottom: 0.3em; }
.feedback-slide-card .location { font-size: 1.3rem; font-weight: normal; }
.feedback-slide-card:hover { z-index: 10; box-shadow: 0 0 10px #0002; }

.photo-slider-card .content { text-align: left; font-size: 1.5rem; }
.photo-slider-card .title { font-size: 1.6rem; font-weight: bold; margin-bottom: 0.5rem; }
.photo-slider-card .image img { width: 100%; }

/* ============================================================== */
.manager-card { min-width: 300px; }
.manager-card .image { width: 220px; height: 270px;  position: relative; margin:0 auto; margin-bottom: 20px; }
.manager-card .image img { position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover; }
.manager-card .info { text-align: center; }
.manager-card .info > .phone { font-size: 17px; text-decoration: none;  height: 40px; display: flex; align-items: center; justify-content: center; gap: 10px; }
.manager-card .info > .phone::before { content: ''; display: block; width: 30px; height: 30px; background: url(../img/icons/manager-phone.png) center/contain no-repeat;  }
.manager-card .info .name { font-weight: bold; color: #63b733; font-size: 19px; }


@media screen and (max-width:640px) {
	.manager-card { display: flex; gap: 1.5rem; align-items: center; flex-basis: 100%; }
	.manager-card .image-wrapper { flex-basis: 30%; }
	.manager-card .image { width:  auto; height: auto; padding-top: 100%; margin-bottom: 0; }
	.manager-card .info { text-align: left; }
	.manager-card .social-icons { justify-content: start; }
	.manager-card .info > .phone { justify-content: start; }
}


/* ============================================================== */


#faq .faq-container { margin-bottom: 4rem; }

.faq-card { background: white; margin-bottom: 1px; font-size: 1.6rem; }
.faq-card .question { padding: 2rem; font-size: 1.8rem; font-weight: 500; display: flex; align-items: center; gap: 1rem; cursor: pointer; }
.faq-card .question .title { flex-grow: 1; }
.faq-card .question i { flex-shrink: 0; }
.faq-card .answer { max-height: 0; overflow: hidden; padding: 0 2rem; transition: .3s; font-size: 1.4rem; }
.faq-card.-open .answer { max-height: none; padding: 2rem; padding-top: 0rem; }
.faq-card.-open .question i { --image: url(../img/icons/close.svg); }


#faq-seo .faq-container { display: grid; grid-template-rows: auto; grid-template-columns: 1fr 1fr; grid-gap: 1rem; justify-content: center;  font-size: 15px; }
.faq-item { background: #f0f0f0; border-radius: 5px; overflow: hidden; text-align: left; align-self: start}
.faq-item .question { font-weight: bold; cursor: pointer; position: relative; display: flex; align-items: center; min-height: 78px;  padding-right: 55px; }
.faq-item .question::after { content:''; position: absolute; display: block; width: 1rem; height: 2rem; right: 2rem; top: 50%;
	background: var(--color-green); transform: translateY(-50%) rotate(-90deg); 
	mask: url(../img/icons/arrow-left.png) center / 100% 100% no-repeat;
	-webkit-mask: url(../img/icons/arrow-left.png) center / 100% 100% no-repeat; 
}

.faq-item .answer { display: none; background: white; border: 1px solid #f0f0f0;  }
.faq-item > * { padding: 15px 30px; }
.faq-item.-open .question { background: #63b733; color: white; }
.faq-item.-open .question a { color: white; }
.faq-item.-open .answer { display: block; }
.faq-item.-open .question::after { background: white; transform: translateY(-50%) rotate(90deg); }

@media screen and (max-width: 960px) {
	.faq-container { grid-template-columns: 1fr; }
}


/* ============================================================== */
.interesting { overflow: hidden; margin: 40px 0; }
.interesting h2 { padding:0 !important; margin-bottom: 20px; border: none; padding:0; display: flex; align-items: center; }
.interesting .interesting-container { display: flex; flex-wrap: wrap; gap: 10px; font-size: 15px; justify-content: center; }
.interesting .interesting-item { }
.interesting .interesting-item a { background: #63b733; color: white; display: inline-block; padding: 10px; transition: all .3s; cursor: pointer; border-radius: 5px; text-decoration: none; }
.interesting .interesting-item a::before { content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%; margin-right:5px; background: white; }
.interesting .interesting-item a:hover { text-decoration: none; background: white; color: black; }
.interesting .interesting-item a:hover::before { background: #63b733; }


/* ============================================================== */
.block-heading { margin: 0; font-size: 3.2rem; text-align: center; max-width: 90rem; margin: 0 auto;  margin-bottom: var(--span-large); }
.block-heading-text { margin: auto; margin-top: calc(var(--span-small) * -1); font-size: 1.5rem; 
	margin-bottom: var(--span-large); max-width: calc(var(--page-width) / 1.5); text-align: center; color: var(--color-dark-biege); }

.block-heading.-left { text-align: left; }

.block-heading-container { display: flex; align-items: center;  justify-content: center; gap: 2rem; margin-bottom: 4rem; }
.block-heading-container h2 { margin-bottom: 0; flex-grow: 1; }
.block-heading-container .simple-button { border-left: 1px solid #eee; }

@media screen and (max-width: 960px) {
	.block-heading { font-size: 3.2rem; }
	.block-heading.-left { text-align: center; }
}


.image-link { display: inline-block;  position: relative; box-shadow: 0 0 5px #0002; display: inline-flex; gap: 0rem; text-decoration: none !important; align-items: center; border-radius: 1rem; overflow: hidden; transition: .3s; }
.image-link img { max-height: 12rem; display: block; }
.image-link .title { font-weight: bold; padding: 1rem 2rem; background: linear-gradient(to right, #63b73330, transparent 4rem); align-self: stretch; display: flex; align-items: center; flex-grow: 1; }
	.image-link:hover { background: #63b733; color: white !important; }


.ui-teasers { display: flex; flex-wrap: wrap; gap:2rem; margin: 2rem 0; --item-width: 45rem; }
.ui-teasers  .teaser { flex-basis: var(--item-width); flex-grow:1;
	display:flex; flex-wrap:wrap; flex-direction:column; align-items:center; text-align:center;
	gap: 1rem; padding: 2rem 4rem; transition: 0.3s; border-bottom: 3px solid #fff;
}

.ui-teasers.-why-we { gap:0; }
.ui-teasers.-why-we .teaser { flex-basis:35rem; border:2px solid #c4c4c4; flex-direction: row; 
	padding:2rem; margin:0 -2px -2px 0; font-weight: 500; text-align:left;}
.ui-teasers.-why-we .teaser:hover {border-bottom: 2px solid #c4c4c4}
.ui-teasers.-why-we::after {content:'';flex-basis:35rem; flex-grow:1; margin: 0 -2px -2px 0;}
.ui-teasers.-why-we .teaser .description { flex-basis:20rem;  flex-grow:1; }

.ui-teasers.-grid { gap:0; display: grid; grid-template-columns: repeat(auto-fit, minmax(var(--item-width), 1fr)); }
.ui-teasers.-grid .teaser { flex-basis:35rem; border:2px solid #c4c4c4;flex-direction: row;padding:2rem;margin:0 -2px -2px 0; display: flex; align-items: center; gap: 1rem; }
.ui-teasers.-grid .teaser:hover { border-bottom: 2px solid #c4c4c4; }
.ui-teasers.-grid::after { content:''; flex-basis:350px; flex-grow:1;margin: 0 -2px -2px 0; }
.ui-teasers.-grid .teaser .description { flex-basis:20rem; text-align:left; flex-grow:1; font-weight: 500; }

.ui-teasers  .teaser:hover { box-shadow:0 0 25px 1px #afafaf; border-bottom: 3px solid #63b733; }
.ui-teasers  .teaser .title { font-weight:bold; }
.ui-teasers  .teaser .cover { background-color: #E8F4E1; width: 7rem;height: 7rem;display: flex;
	margin: 1rem; justify-content: center;align-items: center;border-radius: 100%;position:relative; }
.ui-teasers  .teaser .cover i { background-color: #63B733; width: 7rem;height: 7rem;position:absolute; left: 0.7rem; }


/* Всплывающие сообщения */
/* ============================================================== */
.message-queue { position: fixed; top: 50%; padding: 3rem; left: 50%; right: 0; background: rgba(0, 0, 0, 0.7); transform: translate(-50%, -50%); max-width: 800px; border-radius: 1rem;  z-index: 400; }
.message-queue .message { margin: 0 auto; max-width: 700px; display: block; background: white; padding: 1rem; margin-bottom: 0.5rem; border-radius: 3px; box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);  }
.message-queue .message: last-child { margin-bottom: 0;  }
.message-queue .message.error { border-left: 5px solid #a6051b;  }
.message-queue .message strong { font-weight: bold; }
.message-queue .message .large { font-size: 2.5rem;}
.message-queue .message .large strong { color: #a6051b; }
.message-queue .message.critical { border-left: 5px solid transparent; color: white; background: #a6051b;  }
.message-queue .message.warning { border-left: 5px solid #ffd376;  }

@media screen and (max-width: 640px) {
	 .message-queue { padding: 1rem; bottom: 0; width: 100%; border-radius: 0; top: auto; transform: none; left:0; right:0; }
	 .message-queue .message { padding: 0.5rem; }
}


.message-box {
  background: linear-gradient(271.54deg, #F3F3F3 32.87%, rgba(239, 239, 239, 0) 52.87%, rgba(239, 239, 239, 0) 68.11%, #FFFFFF 68.11%);
  position: relative; box-shadow: inset -9px 1px 0px -5px #63b733;
  border: 3px solid #E0E0E0; display: flex; justify-content: center;
  color: #494949; clear: both; align-items: flex-start; padding: 2rem; padding-left: 16rem;
  text-align: left; margin: 4rem 0; flex-flow: column; min-height: 150px; border-radius: 0; }
.message-box h2 { text-align: left; font-size: 2.4rem; margin: 0 0 1rem 0 !important; color: #63b733; padding:0 !important; }
.message-box > *:last-child { padding-bottom: 0; margin-bottom: 0;  }
.message-box .text { overflow: hidden; }
.message-box:before { content: ''; display: block; position: absolute; top: 50%; transform: translate(-50%, -50%); z-index:1;
	bottom: 0; left: 8rem; width: 7rem; height:7rem; mask: url("../img/icons/message-box-info.png") center / contain no-repeat;
	-webkit-mask: url("../img/icons/message-box-info.png") center / contain no-repeat; background: #63b733; }
.message-box:after {content: ''; display: block; position: absolute; top: 0; bottom: 0;
	left: 3rem; margin:auto; width: 10rem;height: 10rem; background:#e8f4e1; z-index:0; border-radius:100%}
.message-box.-alert:before { mask-image: url(../img/icons/message-box-alert.png); -webkit-mask-image: url(../img/icons/message-box-alert.png);}
.message-box.-question:before { mask-image: url(../img/icons/content/icon-mb-alert.png); -webkit-mask-image: url(../img/icons/icon-mb-question.svg);left: 5.3rem;width: 7.5rem;bottom: 1rem;}
.message-box.-percent:before { mask-image: url(../img/icons/icon-mb-percent.png); -webkit-mask-image: url(../img/icons/icon-mb-percent.png); }
@media screen and (max-width:768px) {
	.message-box:before,
	.message-box:after{ content:none; }
	.message-box {padding-left: 2rem; margin:1rem}
}

@media screen and (max-width: 768px) {
	.message-box.-with-image .image { display: none; }
	.message-box.-with-image::before { display: none; }
}

@media screen and (max-width: 768px) {
	.message-box { padding: 2rem !important; }
	.message-box::before { display: none; }
}


/* Страничная навигация */
/* ============================================================== */
.pagination { display: flex; margin: 4rem 0; text-align: center; align-items: center; justify-content: start; flex-wrap: wrap; }
.pagination .title { margin-right: 2rem; }

.pagination ul { margin-bottom: 0 !important; margin: 0 !important; display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.pagination li a,
.pagination li span { display: flex; align-items: center; justify-content: center; min-width: 3rem; border: 1px solid #0001; cursor: pointer; }
.pagination li a:hover { background: #eee; }


.pagination li.active a,
.pagination li.active span { background: var(--color-green);  color: #ffffff; }

.pagination li { display: inline-flex; list-style-type: none; margin-bottom: 0; margin-left: 0; align-items: center; }
.pagination li:not(.control) a,
.pagination li:not(.control) span { min-width: 4rem; flex-shrink: 0; height: 4rem; align-items: center; justify-content: center; text-decoration: none; }
.pagination li.-real:hover a { background: #dddddd; }

/* Табы */
/* ============================================================== */
.tabs {  position: relative; }
.tabs .tabs-navigation {  display: flex; flex-wrap: wrap; }
.tabs .tabs-navigation a { padding: 1.5rem;  text-decoration: none; display: inline-block; transition: .3s; font-size: 1.7rem; 
	display: inline-flex; background: var(--color-light-gray); cursor: pointer; font-weight: 500; gap: 1rem; 
	align-items: center; }
.tabs .tabs-navigation a:not(:last-child) { border-right: 1px solid #ccc; }

.tabs .tabs-navigation a:hover { border-color: var(--color-green); }
.tabs .tabs-navigation a i { background: black; }
.tabs .tabs-navigation a.-active {  background: var(--color-green); color: white; }
.tabs .tabs-navigation a.-active i { background: white; }
.tabs .tab { display: none; padding: 4rem; }
.tabs .tab.-active { display: block; }

@media screen and (max-width: 768px) {
	.tabs .tab { padding: 2rem; }
	.tabs .tabs-navigation a { font-size: 1.6rem; }
}


.swipe-text { display: none; padding: 2rem; border: 1px dashed #ccc; text-align: center; margin-bottom: 2rem; line-height: 1.2; }
@media screen and (max-width: 768px) {
	.swipe-text { display: block; }
}


/* Иконки соцсетей */
/* ============================================================== */
.social-icons { white-space: nowrap; display: flex; align-items: center; gap: 1rem; justify-content: center; }
.social-icons a {
	--color: var(--color-blue);	
	display: inline-flex; justify-content: center; align-items: center; flex-shrink:0;
	transition: .3s; top: 0; gap: 0.5rem;
	position: relative;  cursor: pointer; }
.social-icons a i { width: 2rem; height: 2rem; background: var(--color); }
.social-icons a.telegram { --color: #3f95d6; }
.social-icons a.whatsapp { --color: #58bb16; }
.social-icons a.viber { --color: #9069ad; }
.social-icons a.youtube { --color: #ff0101; }
.social-icons a.vk { --color: #5a6f8e; }
.social-icons a:hover i { background: black !important; }



/* Оформление элементов в статьях */
/* ============================================================== */             
.article ul,
.article ol { margin-left: 2rem; }
.article ul { list-style-type: disc; margin-bottom: 1em; }
.article ul > li { margin-bottom: 0em; }
.article ul > li::marker { color: var(--color-blue); }
.article > table { margin: 4rem 0; }
.article ol { list-style-type: decimal; margin-bottom: 1em; }
.article li { margin-bottom: 0.5em; }
.article h2 { font-size: 2.8rem; margin-bottom: 0.7em;}
.article a:hover { text-decoration: none; }
.article img { display: block; }
.article > h2:not(:first-child) { margin-top: 1em; }
.article a { color: var(--link-color); text-decoration: underline; }

.certificate-card { flex-basis: 190px; padding: 1rem; background: white; border: 1px solid #0001; }
.certificate-card .image { position: relative; padding-bottom: 135%;}
.certificate-card .image img {position:absolute; width:100%; height:100%; object-fit:cover}																						

/* Хлебные крошки */
/* ============================================================== */
.breadcrumbs { margin-bottom: 2rem; font-size: 1.4rem; flex-wrap: wrap; }
.breadcrumbs ul { display: flex;  color: #333; gap: 0.5rem 1rem; flex-wrap: wrap; align-items: center; }
.breadcrumbs ul li { display: inline-flex; margin-right: 0.5rem; align-items: center; }
.breadcrumbs ul li:not(:last-child)::after { content: ''; display: inline-block; margin-left: 2rem; border-left: 1px solid #ddd; height: 2rem; }
.breadcrumbs a { color: var(--color-green); text-decoration: underline; }
.breadcrumbs a:hover { text-decoration: none; }

@media screen and (max-width: 768px) {
	.breadcrumbs { font-size: 1.4rem; }
}

/* Всплывашки */
/* ============================================================== */
.tippy-content { font-size: 1.5rem; padding: 2rem; }
.tippy-box { background: #ffffffe0; color: black; border-radius: 1rem; }
.tippy-arrow  { color: #ffffffe0;}


.cards-container { display: flex; align-items: center; }
.cards-container > *  { flex-grow: 1; flex-basis: 20rem; align-self: stretch; max-width: 25rem; }

@media screen and (max-width: 1024px) {
	.cards-container { flex-wrap: wrap;}
}

@media screen and (max-width: 768px) {
	.cards-container > * { flex-grow: 1; max-width: none; }
}


/* ============================================================== */

.article-card { display: flex; gap: 2rem; flex-wrap: wrap; }
.article-card .content { flex-grow: 2; flex-basis: 30rem}
.article-card .image { flex-basis: 30rem; flex-shrink: 0;}
.article-card .image img { width: 100%; height: auto; }
.article-card .title { font-size: 2.6rem; color: var(--color-green); font-weight: 500; }
.article-card .description {  margin-top: 1rem; font-size: 1.5rem; }
.article-card .more-button {  margin-top: 1rem; }

@media screen and (max-width: 768px) {
	.article-card .image { flex-grow: 1; }
}

/* ============================================================== */

.news-card { display: flex; gap: 2rem; flex-wrap: wrap; }
.news-card .image { flex-basis: 30rem; flex-shrink: 0; }
.news-card .content { flex-grow: 2; flex-basis: 30rem}
.news-card .datetime { background: #f0f0f0; display: inline-block; padding: 0.5rem 1rem; font-size: 1.3rem; margin-bottom: 0.5rem; }
.news-card .image img { width: 100%; height: auto; }
.news-card .title { font-size: 2.6rem; color: var(--color-green); font-weight: 500; }
.news-card .description {  margin-top: 1rem; font-size: 1.5rem; }
.news-card .more-button {  margin-top: 1rem; }

@media screen and (max-width: 768px) {
	.news-card .image { flex-grow: 1; }
}


/* ============================================================== */

.simple-card { border: 1px solid #e0e0e0; transition: .3s;  z-index: 1; padding: 1rem; display: flex; flex-direction: column; gap: 1rem; text-align: center;  background: white; line-height: 1.3; }
.simple-card:hover { box-shadow: 0 2rem 3rem #0003, inset 0 -2px 0 var(--color-green); z-index: 100 !important; transform: scale(1.1); border-color: transparent;  }

/* ============================================================== */
.portfolio-card { padding: 1rem; text-decoration: none !important; color: black !important; }
.portfolio-card .content { text-align: left; line-height: 1.4; padding: 2rem 0; padding-right: 3rem; position: relative; }
.portfolio-card .title { font-weight: bold;  }
.portfolio-card .address { font-size: 1.4rem; margin-top: 0.5rem; }
.portfolio-card .icon { position: absolute; right: 0; top: 50%; transform: translate(0, -50%); opacity: 0; transition: .3s; }
.portfolio-card .icon i { background: var(--color-green); }
.portfolio-card:hover .icon { opacity: 1; }

/* ============================================================== */
.partner-card .image { padding-top: 30%; position: relative; }
.partner-card .image img { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; object-fit: contain; transform: translate(-50%, -50%);  }

/* ============================================================== */
.gallery-card { padding: 1rem; display: block; transition: .3s; background: white; position: relative; }
.gallery-card .image-wrapper { width: 100%; }
.gallery-card .image { width: 100%;  padding-top: 75%; display: block; position: relative; }
.gallery-card .image img { position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover;}
.gallery-card .content { position: absolute; bottom: 1rem; left: 1rem; right: 1rem; padding: 2rem;
	text-align: left; font-size: 1.5rem;  background: linear-gradient(to top, #000a, transparent);
	line-height: 1.2; font-weight: 500; color: white; display: flex; align-items: center; justify-content: center; }


#catalog-best .product-slide-card { margin-left: -1px;  }
#catalog-best .swiper-slide { flex-basis: 30rem; }
#catalog-best .slider-container { width: 100vw; }

#how-we-build .swiper-slide { flex-basis: 30rem; }
#how-we-build .slider-container { width: 100vw; }
#how-we-build .bg-hammer { position: absolute; display: block; width: 32rem; height: 25rem; left: 0; top: -8rem; background:url(../img/bg-how-we-build.png) center/contain no-repeat; }
#how-we-build.-inner .bg { display: none; }

@media screen and (max-width: 1600px) {
	#how-we-build .bg-hammer { left: -13rem; }
}

@media screen and (max-width: 968px) {
	#how-we-build .bg-hammer { display: none; }
}

/* ============================================================== */
.product-card { border: 1px solid #e0e0e0; transition: .3s;  z-index: 1; padding: 1rem; display: flex; flex-direction: column; gap: 1rem; text-align: center;  background: white; line-height: 1.3; text-decoration: none; }
.product-card:hover { box-shadow: 0 1rem 1rem #0003, inset 0 -2px 0 var(--color-green); z-index: 100 !important; text-decoration: none; }
.product-card .content { padding: 1rem; }
.product-card .properties { display: flex; align-items: center; font-size: 1.4rem; gap: 0.3rem; 1rem; flex-wrap: wrap; margin-bottom: 1rem; justify-content: center; }
.product-card .property { display: flex; align-items: center; gap: 1rem; color: #717171; }
.product-card .property:not(:last-child) { border-right: 1px solid #aaa; padding-right: 1rem; margin-right: 1rem; }
.product-card .property i { width: 1.5rem; height: 1.5rem; }
.product-card .property .value { color: black; }
.product-card .buttons { margin-top: 1rem; }
.product-card .price { margin-top: 1rem; }
.product-card .title { font-weight: 500; color: var(--color-green); font-size: 1.5rem;  }
.product-card .image { position: relative; }
.product-card .image img { width: 100%; }
.product-card .tags { display: flex; font-size: 1.5rem; gap: 0.5rem; position: absolute; bottom: 0.5rem; right: 0.5rem; }
.product-card .tags .tag { background: #fffa; color: black; padding: 0.5rem 0.5rem; border-radius: 2px; }
.product-card .review { font-size: 1.5rem; position: absolute; bottom: 0.5rem; left: 0.5rem; padding: 0.5rem 1rem; border-radius: 2px; background: #000a; color: white; display: flex; align-items: center; gap: 0.5rem; }
.product-card .review i { background: white; width: 1.5rem; height: 1.5rem; }

.product-card-2 { border: 1px solid #e0e0e0; transition: .3s;  z-index: 1; padding: 1rem; display: flex; flex-direction: column; gap: 1rem; text-align: center;  background: white; line-height: 1.3; text-decoration: none; }
.product-card-2:hover { box-shadow: 0 1rem 1rem #0003, inset 0 -2px 0 var(--color-green); z-index: 100 !important; text-decoration: none; }
.product-card-2 .content { padding: 1rem; display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; }
.product-card-2 .main { padding-right: 2rem; text-align: left; border-right: 1px solid #0001; align-selft: stretch; flex-basis: 20rem; flex-grow: 2; }
.product-card-2 .main .description { font-size: 1.3rem; }
.product-card-2 .main .description em { font-weight: 500; }
.product-card-2 .main .link-button { margin-top: 0.5rem; }
.product-card-2 .properties { display: flex; align-items: center; font-size: 1.4rem; gap: 0.3rem; 1rem; flex-wrap: wrap; margin-bottom: 1rem; justify-content: start; }
.product-card-2 .property { display: flex; align-items: center; gap: 1rem; color: #717171; }
.product-card-2 .property:not(:last-child) { border-right: 1px solid #aaa; padding-right: 1rem; margin-right: 1rem; }
.product-card-2 .property i { width: 1.5rem; height: 1.5rem; }
.product-card-2 .property .value { color: black; }
.product-card-2 .side { flex-shrink: 0; flex-basis: 25rem; text-align: left; }
.product-card-2 .link-button { font-weight: normal; }
.product-card-2 .button { --button-height: 4rem; font-size: 1.5rem; align-self: start; }
.product-card-2 .button i { width: 2rem; height: 2rem; }
.product-card-2 .buttons {  display: flex; flex-wrap: wrap; gap: 1rem; flex-direction: column; justify-content: center;  }
.product-card-2 .price { margin-top: 1rem; }
.product-card-2 .title { font-weight: 500; color: var(--color-green); font-size: 1.6rem;  }
.product-card-2 .image { position: relative; }
.product-card-2 .image img { width: 100%; }
.product-card-2 .tags { display: flex; font-size: 1.5rem; gap: 0.5rem; position: absolute; bottom: 0.5rem; right: 0.5rem; }
.product-card-2 .tags .tag { background: #fffa; color: black; padding: 0.5rem 0.5rem; border-radius: 2px; }
.product-card-2 .review { font-size: 1.5rem; position: absolute; bottom: 0.5rem; left: 0.5rem; padding: 0.5rem 1rem; border-radius: 2px; background: #000a; color: white; display: flex; align-items: center; gap: 0.5rem; }
.product-card-2 .review i { background: white; width: 1.5rem; height: 1.5rem; }


@media screen and (max-width: 768px) {
	.product-card-2 .side { text-align: center; flex-grow: 1; }
	.product-card-2 .properties { justify-content: center; }
	.product-card-2 .buttons { align-items: center; }
	.product-card-2 .property i { display: none; }
	.product-card-2 .button { align-self: center; }
}


/* ============================================================== */
.product-build-card { border-radius: 1rem; overflow: hidden; background: transparent; border: 1px solid #ffffff0a; display: flex; align-items: center; text-align: center; flex-direction: column; padding: 2rem 0.5rem; width: 100%; transition: .3s;  text-decoration: none !important;}
.product-build-card .title { font-weight: bold; font-size: 1.2rem; margin-bottom: 0.5rem;  }
.product-build-card .image { border: 1px dashed #fff1; border-radius: 50%; padding: 1rem; }
.product-build-card .icon i { background: #666; width: 1.5rem; height: 1.5rem;  }
.product-build-card .image img { border-radius: 50%; }
.product-build-card .link-button { color: var(--color-green); font-size: 1.3rem; margin-top: 0.5rem; text-decoration: none; }
.product-build-card .link-button i { width: 1.3rem; height: 1.3rem; }
.product-build-card:hover { background: var(--color-green); }
.product-build-card:hover .link-button { color: white; }
.product-build-card:hover .link-button i { background: white; }
.product-build-card:hover .image { background: #48981a; border-color: #fff6; }
.product-build-card:hover .icon i { background: white; }


/* ============================================================== */
.product-slide-card { padding: 0; text-decoration: none !important; position: relative; overflow: hidden; }
.product-slide-card .content { padding: 1rem; font-size: 1.5rem; text-align: left; }
.product-slide-card .top { color: #bbb; font-size: 1.4rem; font-weight: 500; }
.product-slide-card .image { width: 100%; padding-top: 75%; background: #eee; position: relative; overflow: hidden; }
.product-slide-card .image img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }
.product-slide-card .title { font-size: 1.8rem; font-weight: bold; }
.product-slide-card .price strong { font-weight: bold; }

/* ============================================================== */
.product-variant-card { display: flex; gap: 3rem; align-items: start; flex-wrap: wrap; }
.product-variant-card > * { flex-basis: 30rem; flex-grow: 1; }
.product-variant-card h2 { font-size: 2.8rem; text-align: left; margin-bottom: 0.5em; }
.product-variant-card .description { font-size: 1.5rem; }
.product-variant-card .emoji { display: inline-block; }

.product-variant-card .swiper-button-prev { left: 0; }
.product-variant-card .swiper-button-next { right: 0; }

.product-variant-card .images { overflow: hidden; }
.product-variant-card .preview { overflow: hidden; margin-top: 1rem; }
.product-variant-card .preview .swiper-slide { width: auto !important; padding: 0; opacity: 0.6; }
.product-variant-card .preview .swiper-slide-active { opacity: 1; }
.product-variant-card .preview .image img { height: 6rem; width: auto; max-width: none; display: block; }
.product-variant-card .preview .image { border: 2px solid white; box-shadow: 0 0 0.5rem #0001; display: inline-block; }

/* ============================================================== */
.warranty-card { font-size: 1.5rem; margin-left: -1px; }
.warranty-card .image { margin-bottom: 2rem; }
.warranty-card img { width: 7rem; height:7rem; object-fit: contain; }

/* ============================================================== */
.stage-card { font-size: 1.5rem; margin-left: -1px;  }
.stage-card .image { margin-bottom: 2rem; }
.stage-card i { width: 7rem; height:7rem; object-fit: contain; }
.stage-card .title { font-weight: bold; }


/* Адаптивное меню */
/* ============================================================== */
.mobile-menu { background: white; display:none; position: fixed; top:0; left:0; width: 100%; height: auto; z-index: 60; max-height: 100%; box-shadow: 0 3px 5px 0 #0003; overflow: auto; color: black; z-index: 10000; }

.mobile-menu .close-menu-button {  display: flex; cursor: pointer; align-items: center; padding: 1rem; background: var(--color-green); color: white; justify-content: center; gap: 1rem; }
.mobile-menu .close-menu-button i { background: white; }

.mobile-menu .menu { padding: 2rem; z-index: 100;   text-align: left;  line-height: 1.1;  height: auto; max-height: calc(100vh); width: 100%; z-index:20; box-shadow: 0 5px 5px 0 #0003; }
.mobile-menu .menu a {  text-decoration: none; }
.mobile-menu .menu li { display: block; } 
.mobile-menu .menu > li > a { font-weight: bold; }
.mobile-menu .menu li ul { position: relative; background: transparent;}
.mobile-menu .menu li ul li { border: none !important; }

.mobile-menu .menu li a  { display: flex; padding: 0.5rem 1rem; gap: 1rem; align-items: center; min-height: 3rem; }
.mobile-menu .menu li.-active > a { font-weight: bold;  color: var(--color-green); }
.mobile-menu .menu > li.-active > a { background: var(--color-green); color: white; } 
.mobile-menu .menu li a > .text { flex-grow: 1; }
.mobile-menu .menu .opener { display: inline-block; width: 3rem; height: 2.5rem; flex-shrink: 0; background: #333; --mask: url(../img/icons/arrow-down.png) center/1.5rem no-repeat;	mask: var(--mask); -webkit-mask: var(--mask);  background: var(--color-blue); }
.mobile-menu .menu li a:hover {  color: var(--color-green); }
.mobile-menu .menu li > ul { display: none;  font-size: 1.5rem; padding-left: 0; }

.mobile-menu .menu li.-open { border: 1px solid #0002; margin-bottom: 1rem; padding-bottom: 1rem;  }
.mobile-menu .menu li.-open > a { }
.mobile-menu .menu li.-open > ul {  display: block; }
.mobile-menu .menu li.-open > a > .opener { --mask: url(../img/icons/arrow-up.png) center/1.5rem no-repeat; background: white;}

.mobile-menu.-open { display: block; }
.mobile-menu.-open .open-button::after { --image: url(../img/icons/close.svg) center/contain no-repeat; }
.mobile-menu.-open .mobile-menu { display: block;  }

/* ============================================================== */
.mobile-menu-button { display: none; align-items: center; gap: 1rem; justify-content: center; font-size: 1.5rem; min-height: 4rem; transition: .3s;
	cursor: pointer; border: 1px solid #ddd; padding: 1.5rem; }
.mobile-menu-button i { background: black; width: 2rem; height: 2rem; }
.mobile-menu-button:hover { background: var(--color-green); }
.mobile-menu-button:hover i  { background: white; }

@media screen and (max-width: 768px) {
	.mobile-menu-button { display: flex; }
}


/* ============================================================== */
#header { position: relative; z-index: 1000; font-size: 1.4rem; }
#header .block-container { border-bottom: 2px solid #2bbd3c; }

#header .site-logo { text-decoration: none; line-height: 1.3; max-width: 25rem; }
#header .site-logo .image { width: 16.5rem; height: 3rem; object-fit: contain; background: url(../img/logo-site.png) center/contain no-repeat; }
#header .site-logo .slogan { font-size: 1.3rem; margin-top:0.5rem;  }

#header .top-part { margin-bottom: 0.5rem; }

#header .navigation { margin-bottom: 0.5rem; position: relative; z-index: 10; }

.cities-selector { display: flex; align-items: center; gap: 1rem; flex-grow: 1; justify-content: start; font-size: 1.3rem; }
.cities-selector .title { font-weight: bold;  }
.cities-selector .city { text-decoration: underline; cursor: pointer; display: flex; align-items: center; gap: 0.5rem; } 
.cities-selector .city  i { width: 1rem; height: 1rem; }
	.cities-selector .city:hover {  text-decoration: none; color: var(--color-red); }
	.cities-selector .city:hover i { background: var(--color-red); }


#header .header-banner { display: flex; align-items: center;  border-radius: 10px; box-shadow: 0 0 5px 0 #0002; background: linear-gradient(300deg, #a8e1ae, white 6rem), white; border-left: 5px solid #63b733; flex-basis: 33rem; flex-shrink:0; }
#header .header-banner .image { flex-basis: 7rem; flex-shrink: 0; background: url(../img/bg-header-banner.jpg) center/cover no-repeat; align-self: stretch; }
#header .header-banner .item-content { padding: 1rem; }
#header .header-banner .title { font-weight: bold; color: #63b733; }
#header .header-banner .more { display: flex; align-items: center; gap: 0.5rem; }
#header .header-banner i { display: inline-block; width: 2rem; height: 2rem; background: #63b733; }
#header .header-banner:hover { text-decoration: none; }

#header .top-part { display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; }
#header .bg-house { display: none; }

#header .contacts { font-size: 1.4rem; flex-grow: 1; display: flex; flex-direction: column; gap: 0.5rem; }
#header .contacts-part { flex-grow: 1; display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; flex-basis: 20rem; }
#header .phones { display: flex; align-items: center; gap: 1rem 2rem; flex-wrap: wrap; font-weight: 500; }
#header .phones a { font-weight: bold; color: var(--color-green); font-size: 1.6rem; }

#header .main-menu { display: inline-flex; align-items: center; justify-content: start; gap: 0 2rem; font-size: 1.3rem; flex-wrap: wrap; position: relative; }
#header .main-menu i { background: var(--color-green); width: 2.5rem; height: 2.5rem; }
#header .main-menu li.-index a { padding-left: 0; padding-right: 0; }
#header .main-menu li.-index span { display: none; }
#header .main-menu a { padding: 1rem; text-decoration: none; white-space: nowrap; }
#header .main-menu > li > a { display: block;  text-transform: uppercase;  font-weight: 600; }
#header .main-menu li { display: flex; align-items: center; gap: 1rem; position: relative; }
#header .main-menu ul { display: none; padding: 2rem; background: white; position: absolute; left:0; top: 100%; color: black; min-width: 100%; box-shadow: 0 0 10px #0002;  font-size: 1.5rem; border-top: 2px solid var(--color-green); z-index: 10; }
#header .main-menu li:hover > a { color: var(--color-green); }
#header .main-menu li:hover > ul { display: block; }
#header .main-menu > li.-has-children:hover > a { border-radius: 1rem 1rem 0 0; }
#header .main-menu > li.-has-children > a::after { content:''; display: inline-block; width: 1rem; height: 1rem; background: black; --mask: url(../img/icons/arrow-down.png) center/contain no-repeat; mask: var(--mask); --webkit-mask: var(--mask); margin-left: 0.5rem; }

#header .header-numbers { margin-top: 3rem; }
#header .header-numbers a { text-decoration: none !important; } 
#header .header-numbers .simple-card { font-weight: 500; }
#header .header-numbers .simple-card .title { color: #bbb; text-transform: uppercase; font-weight: bold; font-size: 1.2rem; }
#header .header-numbers .simple-card .number { color: var(--color-green); font-size: 4.6rem; margin:1rem; }
#header .header-numbers .simple-card .category { font-weight: bold; font-size: 1.8rem; }
#header .header-numbers .simple-card .price { font-size: 1.4rem; font-weight: normal; }

#header .header-content { display: flex; flex-wrap: wrap; gap: 2rem; align-items: center; }
#header .header-content h1 { font-size: 4.2rem; font-weight: normal; margin-bottom: 0; line-height: 1.1; }
#header .header-content .text { flex-basis: 40rem; flex-grow: 1; }
#header .header-content .price { color: var(--color-orange); border-left: 4px solid rgba(249, 141, 33, .15); padding: 1rem 0; padding-left: 2rem; flex-basis: 10rem; flex-grow: 1; flex-shrink: 0;}
#header .header-content .price .value { font-weight: bold; font-size: 2.2rem; }

.page-template-1 #header { background: url(../img/bg-header-bottom.jpg) bottom center/contain no-repeat; padding-bottom: 10rem; padding-top: 6rem; }
.page-template-1 #header .navigation { border: none; background: white; max-width: 80%; }
.page-template-1 #header .block-container { border: none; }
.page-template-1 #header .contacts { justify-content: right; }
.page-template-1 #header .main-menu a { padding: 0.7rem 0.5rem; }
.page-template-1 #header .contacts-part { justify-content: right; }
.page-template-1 #header .contacts-part > * { flex-basis: 100%; }
.page-template-1 #header .phones { justify-content: right; text-align: right; }
.page-template-1 #header .cities-selector { justify-content: right; margin-bottom: 1rem; }
.page-template-1 #header .social-icons { margin-top: 1rem; justify-content: right; }
.page-template-1 #header .header-content { width: 57%; margin: 4rem 0; }
.page-template-1 #header .top-part { width: 57%; }
.page-template-1 #header .header-numbers { max-width: 80%; }
.page-template-1 #header .header-numbers .simple-card { max-width: none; }
.page-template-1 #header .bg-house { content: ''; position: absolute; width: 50vw; height: 100%; background: url(../img/bg-header-house.jpg) center/cover no-repeat; display: block; top: 0; left: 60%; z-index: -1; }


@media screen and (max-width:1200px) {
	#header .header-banner { display: none; }
}

@media screen and (max-width:1024px) {
	#header .navigation { display: none; }
	.page-template-1 #header .header-content { width: 100%; }
	.page-template-1 #header .header-numbers { max-width: none; }
	.page-template-1 #header .top-part { width: 100%; position: relative; }
}



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

	#header .header-content { text-align: center; }
	#header .header-content h1 { color: white; }	
	#header .header-content { display: block; }
	#header .header-content .price { margin: 0 auto; display: inline-block; margin-top: 4rem; }
	.page-template-1 #header { padding-bottom: 4rem; }


	.page-template-1 #header .bg-house { left: 0; top: 0; width: auto; right: 0;}
	.page-template-1 #header .bg-house::after { content: ''; display: block; background: linear-gradient(#000e, transparent 30rem), #0006; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; }
	#header .header-content .price { color: white; border-left: none; border-top: 4px solid #fff8; }
	.page-template-1 #header { padding-top: 2rem; }
	.page-template-1 #header .top-part::after { content: ''; display: block; background: white; position: absolute; left: -99rem; right: -99rem; top: -2rem; bottom: -2rem; z-index: -1; }

}

@media screen and (max-width:640px) {
	#header .contacts-part { display: none; }
	#header { padding-bottom: 2rem; }
	#header .site-logo { max-width: none; flex-basis: 20rem; flex-grow: 1; }
	#header .mobile-menu-button { flex-basis: 5rem; }
}



#article { padding-top: 0; padding-bottom: 4rem; }


/* ============================================================== */
#about { }
@media screen and (max-width: 768px) {
}



/* ============================================================== */
#news > .block-container { display: flex; gap: 4rem; flex-wrap: wrap; }
#news .news-section { flex-basis: 45rem;  flex-grow: 1; }
#news .articles-section { flex-basis: 45rem;  flex-grow: 1;}


.heading-line { display: flex; align-items: center; margin-bottom: 2rem; }
.heading-line .h2 { margin-bottom: 0; }
.heading-line > *:first-child { flex-grow: 1; }

.news-small-card { display: flex; gap: 2rem; }
.news-small-card .h2 { font-size: 1.3rem; }
.news-small-card .image { flex-basis: 20rem; flex-shrink: 0; }
.news-small-card .text a { color: var(--color-green); font-size: 1.5rem; }
.news-small-card:not(:last-child) { margin-bottom: 2rem; }

@media screen and (max-width:768px) {
	.news-small-card .image { display: none; }
}

.article-small-card .h2 { font-size: 1.3rem; }
.article-small-card:not(:last-child) { margin-bottom: 2rem; }
.article-small-card .text { font-size: 1.5rem; } 
.article-small-card .text a { color: var(--color-green); }


/* ============================================================== */
#faq { }

.filters { padding: 2rem; background: #f0f0f0; margin-bottom: 4rem; display: flex; gap: 1rem; flex-wrap: wrap; }
.filters a { display: inline-block; background: white;  border-radius: 4px; padding: 1rem;  font-size: 1.4rem; transition: .3s; text-decoration:none; }
.filters a:hover,
.filters a.active { background: #ffb228; color: white; text-decoration:none; }



.catalog { margin-top: 2rem; margin-bottom: 4rem; }
.catalog .pagination { margin: 2rem 0; }

.catalog .banner { width: 100%;  margin: 4rem 0; display: block; }

.catalog-filters { margin-bottom: 2rem; }
.catalog-filters .tabs-content { background: #ebebeb; font-size: 1.6rem;  }
.catalog-filters .tabs .tab { padding: 2rem; }
.catalog-filters .filter-values { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.catalog-filters .filter-values a { background: white; padding: 0.5rem 1rem; }
.catalog-filters .filter-values a.-active { background: var(--color-green); color: white; }

@media screen and (max-width: 768px) {
	.catalog-filters .tabs .tabs-navigation a { padding: 1rem; font-size: 1.6rem; }
	.catalog-filters .tabs .tabs-navigation { background: var(--color-light-gray); }
}

#catalog-promo { margin: 0; padding-bottom: 2rem;  }
#catalog-promo > .container { padding:0; max-width: none; }
#catalog-promo .block-heading {  margin-bottom: 2rem; padding-bottom:0; } 

#catalog-promo .bottom { display: flex; align-items: center; gap: 2rem; justify-content: center; margin-top: 2rem; }

#catalog-promo .tabs { padding:0; padding-bottom: 20px; }
#catalog-promo .tabs-navigation { display: flex; align-items: center; justify-content: start; margin-bottom: 0px; }
#catalog-promo .tabs-navigation a { padding: 10px; font-size: 16px; font-weight:500; display: flex; align-items: center; gap: 10px; background: #fafafa; transition: .3s; flex-grow: 1; justify-content: center;  }
#catalog-promo .tabs-navigation a:not(:last-child) { border-right: 1px solid #ddd; }
#catalog-promo .tabs-navigation a:hover { color: white; text-decoration: none; background: #63b733; }
#catalog-promo .tabs-navigation a:hover i { background: white; }
#catalog-promo .tabs-navigation a i { width: 30px; height: 30px; background: #69bc35; }
#catalog-promo .tabs-navigation a.-active { color: #69bc35; background: #f0f0f0;  }

#catalog-promo .tab { display: none;  padding:0; }
#catalog-promo .tab.-active { display: block;}
#catalog-promo .tabs-content { padding: 0; }

#catalog-promo .tab .content { display: flex; gap: 3rem; flex-wrap: wrap; align-items: center; margin:0; padding: 40px 0px; }
#catalog-promo .tab .content .text {  margin-bottom: 20px; flex-basis: 270px; flex-grow: 1; }
#catalog-promo .tab .content .image { flex-basis: 300px; flex-shrink:0; align-self: start; }
#catalog-promo .tab .content .image-wrapper { padding-top: 70%; position: relative; overflow: hidden; }
#catalog-promo .tab .content .image-wrapper::after { content: ''; position: absolute; left:0; top:0; width: 100%; height: 100%; background: linear-gradient(#0002, transparent 20px); }
#catalog-promo .tab .content .image img { position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover; margin:0; }

#catalog-promo .tab .content h2 { text-align: left; font-size: 30px; font-weight: 500; margin-bottom: 15px; }
#catalog-promo .filters { display: flex; justify-content: center; gap: 10px 20px; padding: 20px; border-bottom: 1px solid #eee; background: #f0f0f0; flex-wrap: wrap; margin:0; }
#catalog-promo .filters::after { display: none;}
#catalog-promo .filters-group { flex-basis: 270px; flex-grow: 1; }
#catalog-promo .filters-group .title { font-size: 15px; margin-top: 10px; font-weight: bold; margin-bottom: 5px; }
#catalog-promo .filters-group .values { display: inline-flex; flex-wrap: wrap; align-items: center; position: relative; gap: 5px; }
#catalog-promo .filters-group .values a { color: #333; text-decoration: none; display: inline-block; padding: 5px; line-height: 1.2; margin:0; }
#catalog-promo .filters-group .values a:hover { background: #69bc35; color: white; }
#catalog-promo .filters-group a.more { display: inline-flex; gap: 0.5rem; align-items: center; background: #69bc35; color: white; cursor: pointer; padding-right: 10px; }
#catalog-promo .filters-group a.more i { content:''; width: 9px; height: 9px; display: inline-block; background: white; }
#catalog-promo .filters-group a:hover { color: black; text-decoration: none; }
#catalog-promo .filters-group.-has-opener a::after { display: none; }

#catalog-promo .links-popup { padding: 20px; background: white; position: absolute; left:0; top:0; min-width: 100%; box-shadow: 0 0 5px 0 #0002; z-index: 30; max-height: 30vh; overflow: auto; scrollbar-color: white; scrollbar-width: thin; }
#catalog-promo .bottom { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 20px; justify-content: start; }

@media screen and (max-width: 768px) {
	#catalog-promo .tab .content .text { text-align: center; }
	#catalog-promo .tab .content h2 { text-align: center; }
	#catalog-promo .tab .content { flex-direction: column; padding-top:0; }
	#catalog-promo .tab .content .image { width: 100%; flex-basis: auto; }

	#catalog-promo .tab .content .text { flex-basis: auto; }
	#catalog-promo .bottom { justify-content: center; }
	#catalog-promo .bottom .ui-button { flex-grow: 1; }
	#catalog-promo .tabs-navigation a i { width: 30px; height: 30px; }
}

@media screen and (max-width: 640px) {
	#catalog-promo .ui-tabs-tab .content .image { display: none;  }
}

/* ============================================================== */
.side-controls-container { position: relative; 
	display: flex; align-items: center; gap: 5rem; 
	--slider-color-button-hover: transparent; --slider-color-button: transparent;
	--slider-color-arrow: #dedcdc; 
}
.side-controls-container > .side { width: 30rem; display: flex; justify-content: center; gap: 5rem; align-items: start; flex-direction: column; align-self: stretch; flex-shrink: 0; }
.side-controls-container > .side h2 { font-size: 3.6rem; font-weight: 500; margin-bottom: 0; line-height: 1.3; }
.side-controls-container > .side .buttons { position: relative; display: flex; gap: 2rem; align-items: center; }
.side-controls-container .swiper-button-prev,
.side-controls-container .swiper-button-next { position: relative; left: 0; top: 0; transform: none; display: inline-block; }
.side-controls-container .swiper-button-prev::after,
.side-controls-container .swiper-button-next::after { height: 2.5rem !important; }
.side-controls-container > .content { width: 100vw; align-self: stretch; align-items: stretch; display: flex; }
.side-controls-container .content-wrapper { width: 100%; overflow: hidden; margin-right: -30vw; padding: 6rem 0; display: flex; align-items: center; }
.side-controls-container .swiper-slide { padding: 1rem; }
.side-controls-container .slider-container { padding-left: 2px; display: block; align-items: center; }

.side-controls-container.-inner { background: #f8f6f2; border: 1px solid #0002; }
.side-controls-container.-inner .side { padding: 4rem; }
.side-controls-container.-inner .slider-container { width: 100% !important; overflow: hidden; }
.side-controls-container.-inner > .content { background: white; width: 100% !important; overflow: hidden; }
.side-controls-container.-inner .content-wrapper { padding: 0; margin-right: auto; }
.side-controls-container.-inner .slider { padding: 2rem; }

@media screen and (max-width: 768px) {
	.side-controls-container { flex-wrap: wrap; justify-content: center; gap: 2rem; }
	.side-controls-container > .content { width: 100%; }
	.side-controls-container > .side h2 { font-size: 2.8rem; }
	.side-controls-container > .side { text-align: center; gap: 2rem; align-items: center; }
	.side-controls-container > .side .buttons { justify-content: center; }
	.side-controls-container .content-wrapper { padding: 0; margin-right: auto; }
}

/* ============================================================== */
#-how-we-build > .block-container { display: flex; flex-wrap: wrap;  }
#-how-we-build .slider-container { flex-grow: 3; flex-basis: 50rem; }
#-how-we-build .swiper-slide { padding:0; margin-left: -1px; }


/* ============================================================== */
#footer { background: #202020; padding-top: 10rem; padding-bottom: 6rem; }
#footer .top-part { display: flex; align-items: center; gap: 4rem; flex-wrap: wrap; }

#footer .bottom-part { margin-top: 10rem; padding-top: 4rem; border-top: 1px solid #ffffff1a; color: #fff4;  font-size: 1.4rem; display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; }
#footer .bottom-menu { display: flex; align-items: center; gap: 2rem 4rem; flex-wrap: wrap; flex-grow: 3; flex-basis: 40rem; font-weight: 500; }
#footer .bottom-menu .group { flex-grow: 1; }
#footer .bottom-menu li { margin-bottom: 1rem; }

#footer .contacts { flex-basis: 10rem; flex-grow: 1; font-weight: 500; font-size: 1.4rem; }
#footer .contacts .phone a { font-size: 2.2rem; }
#footer .contacts .phone:not(:last-child) { margin-bottom: 2rem; }

#footer .copyrights { flex-grow: 2; }
#footer .copyrights p { margin-bottom: 0; flex-grow: 1; }
#footer .copyrights a { text-decoration: underline; }

#footer .developer { flex-grow: 1; display: flex; flex-direction: column; gap: 0rem; justify-content: center; align-items: center; font-size: 1.3rem; }
#footer .developer .image { width: 10rem; height: 3rem; background: url(../img/logo-vebas.webp) center/contain no-repeat; }

@media screen and (max-width: 768px) {
	#footer { padding-top: 4rem; }
	#footer .bottom-part { margin-top: 4rem; }
	#footer .bottom-part { text-align: center; }
	#footer .contacts { text-align: center; }
	#footer .bottom-menu .group { display: flex; justify-content: center; flex-wrap: wrap; flex-basis: 40rem; gap: 0.3rem 1rem; }
	#footer .bottom-menu li {  display: inline-block; margin-bottom: 0; }
}


/* ============================================================== */
#yandex-feedbacks { position: relative; }
#yandex-feedbacks .block-container { display: flex; align-items: center; justify-content: center; }
#yandex-feedbacks h2 { text-align: center; margin-bottom: 2rem; }
#yandex-feedbacks iframe { min-width: 50rem; }
#yandex-feedbacks .bg { position: absolute; width: 160rem; top: -2rem; height: auto; bottom: 0rem; left: 50%; transform: translate(-50%, 0); background: url(../img/bg-yandex.webp) center / contain no-repeat; z-index: 1; }
#yandex-feedbacks .yandex-content { position: relative; z-index: 100; }
#yandex-feedbacks .bg-family { position: absolute; width: 425px; height: 250px; bottom: 100px; left: 50%; transform: translate(-600px, 0); background: url(../img/bg-yandex-family.webp) center / contain no-repeat; z-index: 10; }
#yandex-feedbacks .bg-house { position: absolute; width: 600px; height: 500px; bottom: 40px; right: 50%; transform: translate(650px, 0); background: url(../img/bg-yandex-house.webp) center / contain no-repeat; z-index: 10; }

@media screen and (max-width: 768px) {
	#yandex-feedbacks .yandex-iframe { width: 100% !important; max-width: none; }
}


@media screen and (max-width: 640px) {
	#yandex-feedbacks .yandex-iframe { zoom: 74%;  }
	#yandex-feedbacks .bg-family { display: none; }
	#yandex-feedbacks .bg-house { display: none; }
	#yandex-feedbacks .bg { height: 500px; }
}


/* ============================================================== */
#cookie-popup { display: none; position: fixed; bottom: 2rem; left: 50%; width: 100%;
	max-width: 75rem; box-shadow: 0 0 10px 0 #0002; border-radius: 0rem; padding: 3rem 4rem; background: white; transform: translate(-50%, 0); z-index:10000; flex-wrap: wrap; justify-content: center; gap: 1rem; align-items: center; color: black; font-size: 1.5rem; }
#cookie-popup .text { flex-basis: 20rem; flex-grow: 1; }
#cookie-popup .link { color: var(--color-green); text-decoration: underline; }
#cookie-popup.-active { display: flex; }

.banner-top { margin-bottom: 4rem; }

.gallery-slider .gallery-item { position: relative; padding-top: 70%; }
.gallery-slider .gallery-item .image { position: absolute; left: 0; top:0; width: 100%; height: 100%; }
.gallery-slider .gallery-item .image img { position: absolute; left: 0; top:0; width: 100%; height: 100%; }


#company-top .side-image-container .image { flex-basis: 30rem; flex-grow: 0;  }
.company-director { text-align: center; width: 100%; }
.company-director img { margin-bottom: 1rem; }

@media screen and (max-width:960px) {
	#company-top .side-image-container .image { flex-grow: 1; }
}

#company-regions { }

/* ============================================================== */
.proizvodstvo-top { display: flex; align-items: center; gap: 30px; }
.proizvodstvo-top > * { flex-basis: 40%; flex-grow: 1; }

@media screen and (max-width:960px) {
	.proizvodstvo-top { flex-wrap: wrap-reverse; }
	.proizvodstvo-top .image { flex-basis: 100%;  }
}

.proizvodstvo-slider .swiper-slide { padding: 0; }
.proizvodstvo-advantages { color: white; position: relative; background: black; }

.proizvodstvo-wood { position: relative; z-index: 1; }
.proizvodstvo-wood::before { display: block; content: ''; position: absolute; left:-99em; top:0; right:-99em; height:100%; background: #f8f6f2; z-index: -1; }

.proizvodstvo-we-build { position: relative; z-index: 20; }
.proizvodstvo-we-build::before { display: block; content: ''; position: absolute; left:-99em; top:0; right:-99em; height:100%; background: #f8f6f2; z-index: -1; }

.proizvodstvo-produce h3 { text-align: center; margin: 30px 0;}
.proizvodstvo-produce .products-types { display: flex; align-items: center; font-weight: 300; gap: 20px; justify-content: center; flex-wrap: wrap;  }
.proizvodstvo-produce .products-types li { display: flex; align-items: center; gap: 10px; font-size: 24px; justify-content: center; }
.proizvodstvo-produce .products-types li::before { content:''; display: inline-block; width: 50px; height: 50px; background: url(../img/icons/icon-checkmark.png) center/80% auto no-repeat, #e4f5e3; border-radius: 50%; flex-shrink: 0; }

@media screen and (max-width:768px) {
	.proizvodstvo-produce .products-types { gap: 10px; }
	.proizvodstvo-produce .products-types li { font-size: 20px; }
	.proizvodstvo-produce .products-types li::before { width: 30px; height: 30px; }
}

.proizvodstvo-advantages { min-height: 70vh; position: relative; }
.proizvodstvo-advantages .advantage { position: absolute; right:50%; top:0; width: 50vw; height: 100%; }
.proizvodstvo-advantages .advantage .image {  position: absolute; left:0; top:0; width: 100%; height: 100%;  }
.proizvodstvo-advantages .advantage .image img {  position: absolute; left:0; top:0; width: 100%; height: 100%;  object-fit: cover;}
.proizvodstvo-advantages .advantage .content { background: #000b; color: white; padding: 40px; position: absolute; z-index: 1;  width: 70%; top: 40px; right:0; left: auto; font-size: 14px; line-height: 1.2;}
.proizvodstvo-advantages .advantage .content .heading { margin-bottom: 10px; font-size: 20px; display: flex; align-items: center; gap: 10px; }
.proizvodstvo-advantages .advantage .content .heading i { background: #63B733; width: 50px; height: 50px; }
.proizvodstvo-advantages .advantage:nth-child(2) { left: calc(50% - 100px); right: auto; clip-path: polygon(100px 0, 100% 0, 100% 100%, 0 100%); z-index: 5; width: calc(50vw + 100px);}
.proizvodstvo-advantages .advantage:nth-child(2) .content { top: auto; bottom: 40px; right: auto; left:0; padding-left: 60px; }
.proizvodstvo-advantages .advantage:nth-child(2)::before { content:''; display: block; position: absolute; left: -140px; top:0; bottom:0; width:140px; background: linear-gradient(to left, #0007, #0000); }

@media screen and (max-width:1200px) {
	.proizvodstvo-advantages { min-height: 500px; }
}

@media screen and (max-width:768px) {
	.proizvodstvo-advantages { min-height: auto; margin-left: -30px; margin-right: -30px; padding: 0;  }
	.proizvodstvo-advantages .advantage { position: relative; top:0; left: 0; bottom:0; right: 0; min-height: 350px; clip-path: none !important;  width: 100% !important; left: auto !important; right: auto !important; }
	
}

.proizvodstvo-why { padding-bottom:0; }

.what-we-build-card { display: flex; flex-flow: column; gap: 10px; align-items: center;}
.what-we-build-card .title { color: #63b733; font-weight: bold; }


.grid-teasers { gap: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));} 
.grid-teasers .dot-teaser { flex-basis: 100px; }


.dot-teaser { padding: 20px 10px; display: flex; flex-flow: column; gap: 20px; justify-content: center; align-items: center; border: 1px solid #c4c4c4; text-align: center; background: white; left:-1px; margin-top: -1px; min-height: 200px; align-items: center;  position: relative; transition: .3s; top:0; left:0; right:0; bottom:0; cursor: pointer; width: calc(100% + 2px); height: 100%; }
.dot-teaser .image i { width: 90px; height: 90px; display: block; }
.dot-teaser .content { font-weight: bold; font-size: 16px;  text-align: center; min-width: auto; line-height: 1.2; flex-grow: 0; }

.-dot-teaser:hover { left:-10px; top:-10px; bottom: -10px; right: -10px; border-bottom: 4px solid #63b733; width: calc(100% + 20px); height: calc(100% + 20px); z-index: 10; box-shadow: 0 0 20px 0 #0002; }
.dot-teaser:hover { z-index: 10; box-shadow: 0 0 20px 0 #0002;  }

.dot-teaser.-numbers .content { font-weight: normal; }
.dot-teaser.-numbers .number { margin-bottom: 10px; }
.dot-teaser.-numbers .number strong { font-size: 40px; color: #63b733; font-weight: normal; }

.wood-card {}
@media screen and (max-width:960px) {
	.wood-card {flex-basis: 290px; max-width: 100%; } 
}

.ui-video-frame { width: 100%; padding-top: 56%; position: relative; overflow: hidden;}
.ui-video-frame iframe { width: 100% !important; height: 100% !important; left:0; top:0; position: absolute; }


.cities-list .region-title { font-size: 1.7rem; font-weight: bold; margin-bottom: 1rem; }
.cities-list a.region-title { background: #2bbd3c; color: white;}

/* Cities selector */
/* ----------------------------------------------------- */
.cities-list { background: #fffe; color: black; position: fixed; left:0; top:0; width: 100%; z-index: 1000; display: none; opacity: 0; }
.cities-list-inner { position: relative; max-height: 600px; overflow: auto; padding: 2rem; }
.cities-list::after { content:''; position: absolute; left:0; bottom:0; right:0; height: 4rem; background: linear-gradient(transparent, #0003); }
.cities-list .container { max-width: var(--page-width); margin:0 auto;  position: relative; }
.cities-list .cities {  width: 100%; text-align: left;  }
.cities-list .city-wrapper { display: inline-block; width: 25rem; }
.cities-list .city { display: inline-block; clear: both; padding: 0.5rem; }
.cities-list .city:hover { background: #eee; }
.cities-list .city.-current { background: #2bbd3c; color: white; text-decoration:none; }
.cities-list .city.-important { font-weight: bold;  }
.cities-list a { display: inline-block; padding: 5px; font-size: 15px; }
.cities-list a:hover { color: var(--color-yellow); }
.cities-list h2 { text-align: left; font-size: 26px; margin-bottom: 3rem; }
.cities-list .close-button { position: absolute; right: 0; top: 0; width: 40px; height: 40px; background: #eee; cursor: pointer; }
.cities-list .close-button i { width: 20px; height: 20px; background: #333; flex-shrink:0; display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
	.cities-list .close-button:hover { background: #333; }
	.cities-list .close-button:hover i { background: white; }



.payment-small-teasers { display: grid; grid-template-columns: repeat(auto-fit, minmax(35rem, 1fr)); gap: 1rem; margin: 3rem 0;   }
.payment-small-teasers a { display: block; padding: 3rem; border-radius: 1rem; text-decoration: none !important; line-height: 1.2; box-shadow: 0 0 5px 0 #0002;  overflow: hidden; position: relative; display: flex; align-items: center; gap: 0.5rem; font-weight: bold; transition: .3s; color: black !important; background: linear-gradient(300deg, #a8e1ae, white 6rem), white; }
.payment-small-teasers a::before { content: '';  display: block; left:0; top:0; bottom:0; background: #63b633; width: 5px; position: absolute; }
.payment-small-teasers a::after { content: ''; display: inline-block; width: 1rem; height: 1rem; background: #63b633; --image: url(../img/icon/arrow-right.svg); mask: var(--image) center/contain no-repeat; -webkit-mask: var(--image) center/contain no-repeat; }
.payment-small-teasers a:hover { padding-left: 2.5rem; color: #63b633 !important; box-shadow: 0 0 10px #63b63340; }


/* ============================================================== */
#map { background: url("../img/bg-map.jpg") center -20rem no-repeat, #252525; }
#map .block-heading-container { display: flex; flex-wrap: wrap; justify-content: center; text-align: center; }

#map .map-container { display: flex; gap: 4rem; align-items: center; flex-wrap: wrap; }
#map .map-container .map { flex-grow: 1; flex-basis: 30rem; align-self: stretch; min-height: 45rem; position: relative; border-radius: 1rem; overflow: hidden;  }
#map .map-container .map > ymaps { position: absolute; left: 0; top: 0; width: 100% !important; height: 100% !important; }
#map .map-container .map .ymaps-2-1-79-i-ua { width: 100% !important; }
#map .map-container .objects-container { flex-basis: 18rem; flex-shrink: 0; flex-grow: 0; }
#map .map-balloon { text-align: center; max-width: 21rem; }
#map .map-balloon .title { font-weight: bold; font-size: 1.6rem; margin-bottom: 0.5rem; }
#map .map-balloon .image { margin-bottom: 0.5rem; }
#map .map-balloon .address { font-size: 1.3rem; font-style: italic; line-height: 1.3; }
#map .map-balloon .image { margin-top: 0.5rem; }
#map .map-balloon .image img { width: 15rem; height: auto; border-radius: 0.5rem; overflow: hidden; }
#map .map-balloon a { color: var(--color-green); text-decoration: underline; }
#map .ymaps-2-1-79-balloon { max-width: 26rem; border-radius: 0.5rem; }

#map .objects-container { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; flex-basis: 20rem;  flex-grow: 1; }
#map .product-build-card { flex-basis: 15rem; flex-grow: 1; width: auto; }

#map .show-button { display: inline-flex; padding: 0.5rem 1rem; gap: 1rem; border: 1px solid #fff6; border-radius: 0.5rem; align-items: center; color: #fff4; font-size: 1.4rem; transition: .3s; font-weight: 500; text-decoration: none !important; }
#map .show-button i { width: 1.5rem; height: 1.5rem; background: #fff6; }
#map .show-button:hover { border-color: var(--color-green); color: var(--color-green); }
#map .show-button:hover i { background: var(--color-green); }

#map .form-part { display: flex; gap: 4rem 6rem; align-items: center; flex-wrap: wrap; margin-top: 4rem; }
#map .form-part .form { flex-basis: 30rem; flex-grow: 3; }
#map .form-part .side { flex-basis: 10rem; flex-grow: 1; text-align: center; }
#map .form-part .side h2 { font-size: 4rem; margin-bottom: 2rem; }
#map .form-part .side p { color: #fff8;  }
#map .form .form-inputs { display: contents; }
#map .form .button { width: 100%; }
#map .form { display: flex; gap: 4rem; flex-wrap: wrap; }
#map .form .form-input,
#map .form .form-bottom { flex-basis: 40rem; flex-grow: 1; }
#map .form textarea { min-height: 13rem; }
#map .form { font-size: 1.5rem; }
#map input[type="text"],
#map textarea { background: transparent; border-bottom: 1px solid #fff3; outline: none; color: white; box-shadow: none !important; padding: 0; }
#map input[type="text"]::placeholder,
#map textarea::placeholder { color: #fff8; }



@media screen and (max-width:768px) {
	#map .map-container .objects-container { flex-grow: 1; align-items: stretch; }
}

.delivery-map { box-shadow: var(--shadow); border-left: 3px solid var(--color-green); }
.delivery-map .heading { display: flex; align-items: center; gap: 1rem; background: linear-gradient(to top, #0002, transparent 2rem), #f0f0f0; padding: 2rem; }
.delivery-map .heading h2 { font-size: 2.6rem; margin: 0;  }
.delivery-map .heading i { background: var(--color-green); width: 4rem; height: 4rem; }

.delivery-map .popular { padding: 2rem; border-bottom: 1px solid #e0e0e0; }
.delivery-map .popular h3 { font-size: 2.3rem; }
.delivery-map .popular .cities { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.delivery-map .popular .cities-row { display: unset; margin-bottom: 0.5rem; }
.delivery-map .popular .cities-row .ui-button:first-child { font-weight: bold; }
.delivery-map .popular .cities-row.-all .ui-button { font-weight: bold; }
.delivery-map .popular .cities-row:not(.-all) .ui-button:first-child:not(:hover) { background: linear-gradient(#00bf0050, transparent), #f0f0f0;}
.delivery-map .popular .ui-button { --button-color: #f0f0f0; --button-text-color: #333; height: 3rem; border-bottom: 3px solid var(--color-light-green); font-size: 1.5rem; }
.delivery-map .popular .ui-button:hover { --button-color: var(--color-light-green); --button-text-color: white; }

.delivery-map .controls { padding: 1rem; position: absolute; left:2rem; right:2rem; top: 1rem; z-index: 2; background: #fff8; box-shadow: var(--shadow); }
.delivery-map .controls .form { display: flex; gap: 1rem; align-itsms: center; flex-wrap: wrap; }
.delivery-map .controls .input { display: flex; align-items: center; gap: 1rem; flex-grow: 1; margin-bottom: 0; }
.delivery-map .controls .ui-button { height: 4rem; }
.delivery-map .controls .input i { background: #333; width: 2.5rem; height: 2.5rem; }
.delivery-map .controls input,
.delivery-map .controls select { background: white; margin-bottom: 0; font-size: 1.5rem; padding: 0.5rem 1rem; min-height: 4rem; font-weight: bold; border: 1px solid #ddd; }

.delivery-map .map {  background: #333; position: relative; position: relative; }
.delivery-map .map #delivery-map { width: 100% !important; height: 45rem !important; position: relative; z-index: 2; }

.delivery-map .result  { position: absolute; background: #0008; color: white;  padding: 1rem; position: absolute; left: 2rem; bottom: 1rem ;  z-index: 5; display: none; }
.delivery-map .result .item { display: flex; gap: 0.5rem; align-items: center; }
.delivery-map .result .data { display: flex; align-items: center; font-size: 1.9rem; gap: 2rem; flex-wrap: wrap; }
.delivery-map .result .title { font-weight: bold; }
.delivery-map .result .value { font-weight: bold; padding: 0.5rem; background: var(--color-green); display: inline-block; }
.delivery-map .result .comment { font-size: 1.4rem; font-style: italic; margin-top: 0.5rem; }



.page-id-28 .banner { margin-bottom: 3rem; width: 100%; }
.page-template-5 #managers { background: var(--color-biege); }

.product-top { display: flex; gap: 2rem;  width: 100%; flex-wrap: wrap; }
.product-top > * {  flex-grow: 1; flex-basis: 40rem; }
.product-top .product-images { overflow: hidden;  }
.product-top .images-part { width: 60%; flex-grow: 4; }
.product-top .full-image { margin-bottom: 2rem; border-radius: 0.5rem; overflow: hidden; }
.product-top .full-image .swiper-slide { padding: 0; }

.product-top .preview-images .swiper-wrapper { gap: 1rem; }
.product-top .preview-images .slider-container {}
.product-top .preview-images .swiper-slide {  padding: 0rem; display: block; flex-basis:18rem; }
.product-top .preview-images .swiper { margin-left: 4rem; margin-right: 4rem; }
.product-top .preview-images .image { background: #eee; border: 1px solid #eee; display: block; opacity: 0.5; transition: .3s; display: inline-block; cursor: pointer; }
.product-top .preview-images .image:hover { border-color: var(--color-green); opacity: 1; }
.product-top .preview-images .image img { width: auto; display: block; object-fit: cover; max-height: 10rem; } 

.product-top .preview-images .swiper-slide-active .image { opacity: 1; }

.product-top .preview-images .swiper-button-prev,
.product-top .preview-images .swiper-button-next { border-radius: 0; height: 100%; }
.product-top .preview-images .swiper-button-prev { left: 0; }
.product-top .preview-images .swiper-button-next { right: 0; }

#product-properties { width: 30%; flex-basis: 30rem; }
#product-properties > *:not(:last-child) { margin-bottom: 1rem; }
#product-properties .line-property { display: flex; align-items: center; font-size: 1.6rem; gap: 1rem; }
#product-properties .line-property:not(:last-child) { margin-bottom: 1.5rem; }
#product-properties .line-property .title { flex-grow: 1; font-weight: bold; display: flex; gap: 1rem; }
#product-properties .line-property i { width: 2.5rem; height: 2.5rem; }
#product-properties .group .size { padding-bottom: 1.5rem; margin-bottom: 1.5rem; border-bottom: 1.5px solid #00000017; }
#product-properties .group { background: #f6f6f6; border-bottom: 3px solid #63b733; padding: 2rem; border-radius: 5px; font-size: 1.4rem; }
#product-properties .property:not(:last-child) { margin-bottom: 1.5rem; }
#product-properties .property .heading { display: flex; align-items: center; gap: 1rem; font-weight: bold;  margin-bottom: 0.5rem; }
#product-properties .order-button { width: 100%; font-weight: 500; margin-top: 1rem; }
#product-properties .property .heading i { width: 3rem; height: 3rem; }
#product-properties .property .values a { color: var(--link-color); text-decoration: underline; }
#product-properties .group-heading { font-size: 1.6rem; font-weight: bold; margin-bottom: 0.5rem; display: flex; align-items: center; gap: 1rem; }

#product-properties .group .button { margin-top: 1rem; width: 100%; }

#product-properties .price-line { display: flex; align-items: center; gap: 1rem; font-size: 1.5rem; padding: 0.5rem 0; color: #666; }
#product-properties .price-line .title { flex-grow: 1; }
#product-properties .price-line .value { font-weight: bold; color: black; }
#product-properties .price-line:not(:last-child) { border-bottom: 1px dashed #0001; margin-bottom: 0.5rem; }
#product-properties .price-group-heading { display: flex; align-items: center; gap: 1rem; padding: 1rem 0; font-weight: 500; line-height: 1.3; }
#product-properties .price-group-heading .title { font-size: 1.8rem; font-weight: 500;  flex-grow: 1; }
#product-properties .price-group-heading .switch { flex-basis: 10rem; font-size: 1.3rem; display: flex; gap: 1rem; align-items: center; cursor: pointer; }
#product-properties .price-group-heading .switch .toggle { border-radius: 99rem; background: #444; width: 5rem; height: 1.5rem; flex-shrink: 0; position: relative; }
#product-properties .price-group-heading .switch .toggle::before { content: ''; width: 4.5rem; height: 4.5rem; transition: .3s; 
	background: url(../img/icons/checkbox-active.svg) center/contain no-repeat; display: block; position: absolute; left: -25%; top: 50%; 
	transform: translate(0, -50%); z-index: 4; right: auto; }
#product-properties .price-group-heading .switch.-toggle .toggle::before  { background-image: url(../img/icons/checkbox.svg); left: 40%; }
#product-properties .price-group:not(:last-child) { margin-bottom: 1.5rem; border-bottom: 1px solid #0002; padding-bottom: 1.5rem; }

#product-properties .product-price { font-size: 2rem; display: flex; align-items: center; gap: 0.5rem; }
#product-properties .product-price strong { color: var(--color-green); font-size: 2.4rem; font-weight: 500; }
#product-properties .open-group-button { border-top: 1px solid #0003; padding-top: 1rem; font-size: 1.7rem; margin-top: 1rem; }

#product-properties #gifts .inner-content { border: 1px solid #0001; padding: 2rem; }

.open-group .open-group-content { overflow: hidden; max-height: 0; transition: .5s; }
.open-group .open-group-button { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; }
.open-group .open-group-button .icon { width: 3rem; height: 3rem; border-radius: 50%; background: white; display: flex; align-items: center; justify-content: center; }
.open-group .open-group-button .icon i { background: black; width: 1.5rem; height: 1.5rem; }
.open-group.-open .open-group-content { max-height: 100rem;   }
.open-group.-open .open-group-button .icon { background: #444; }
.open-group.-open .open-group-button .icon i { --image: url('../img/icons/arrow-up.png'); background: white;  }

#product-specs .tabs .tabs-navigation a { background: #ffffff8f; }
#product-specs .tabs .tabs-navigation a:hover { background: #fffa;  }
#product-specs .tabs .tabs-navigation a i { background: black; }
#product-specs .tabs .tabs-navigation a.-active { background: white; color: black; }
#product-specs .tabs-content { background: white;}
#product-specs .table { font-weight: 500; line-height: 1.2; }
#product-specs .table a.photo { --image: url(../img/icon/photo.png); width: 3rem; height: 3rem; background: var(--color-green); display: inline-block; float: right; transition: .3s; mask: var(--image) center/contain no-repeat; -webkit-mask: var(--image) center/contain no-repeat; }
#product-specs .table a.photo.-line { margin-left: 1.5rem; }
#product-specs .table a.photo:hover { background: black; }
#product-specs .grid-container.-variants  { margin-bottom: 2rem;  }


.card-teasers { display:flex; padding: 6rem 0; flex-wrap:wrap;position: relative;gap:1rem;}
.card-teasers .item { display:flex;align-items:center;font-size:18px;font-weight:600; flex-basis: 220px;flex-grow:1;}
.card-teasers .item .content { margin-left:1rem; line-height: 1.2; }
.card-teasers .item .comment { font-size: 1.2rem; color: red; }
.card-teasers .item .image { flex-shrink:0; }

@media screen and (max-width:768px) {
	.card-teasers { padding: 2rem 0; justify-content:center; }
	.card-teasers .item {justify-content: center;}
}

@media screen and (max-width:640px) {
	.card-teasers .item .image { width: 4rem; }
	.card-teasers .item .content { flex-grow: 1; }
}

.product-teasers-block .card-teasers { padding: 1rem 0;  }
.product-teasers-block { margin-bottom: 2rem; padding: 1rem; background: linear-gradient(210deg, #0001, transparent 10rem), #fff; padding-left: 2rem; border-left: 3px solid #e0e0e0; box-shadow: 0 0 4px 0 #0002; }
.product-teasers-block h2 { font-size: 25px; margin-bottom: 0;}
.product-teasers-block.-first { margin-top: 3rem; }


.adaptive-wrapper-outer { position: relative; }

@media (max-width:767px) {
	.adaptive-wrapper-outer { overflow: auto; border: 1px solid #ccc; }
	.adaptive-wrapper { min-width:700px; }	
}


.order-form .form-input { flex-basis: 20rem; }
.order-form .form-bottom { margin-top: 2rem; }
.order-form .button { margin-top: 2rem; }

.clearfix { clear: both; }

