html {
    font-size: 62.5%;
}

body {
    font-size: 1.5rem;
    font-family: "Roboto", Arial, sans-serif;
    line-height: 1.55;
    min-height: 100vh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    max-width: 100%;
    overflow-x: hidden;
}

.dropdown-menu {
    --bs-dropdown-font-size: 1.5rem;
}

a {
    color: #008bd8;
    text-decoration: none;
    transition: all 0.3s;
}

.dark-link {
    color: #000;
}

.grey-link {
    color: #808d9a;
}

a:hover,
.dark-link:hover,
.grey-link:hover {
    color: #f93c00;
}

svg {
    transition: all 0.3s;
    max-width: 100%;
    max-height: 100%;
}

img {
    max-width: 100%;
}

.wrapper {
    max-width: 116rem;
    margin: 0 auto;
}

.btn {
    position: relative;
    font-size: 1.6rem;
    border-radius: 10px;
    padding: 0.62rem 2.5rem;
    font-weight: 500;
    border: 3px solid transparent;
    transition: all 0.3s;
}

.btn--white {
    background: #fff;
}

.admin-h3 {
    text-transform: uppercase;
    color: #CCC
}

.btn--white:hover,
.btn--white:focus,
.btn--white:active,
:not(.btn-check) + .btn.btn--white:active,
.btn.btn--white:first-child:active {
    background: #f0f7ff;
    color: #000;
}

.btn--red {
    background: #f93c00;
    color: #fff;
}

.btn--red:hover,
.btn--red:focus,
:not(.btn-check) + .btn.btn--red:active,
.btn.btn--red:first-child:active {
    background: #db3500;
    color: #fff;
}

.btn--black {
    background: #000;
    color: #fff;
}

.btn--black:hover,
.btn--black:focus,
:not(.btn-check) + .btn.btn--black:active,
.btn.btn--black:first-child:active {
    background: #494949;
    color: #fff;
}

.btn--green {
    background: #5cb894;
    color: #fff;
}

.btn--green:hover,
.btn--green:focus,
:not(.btn-check) + .btn.btn--green:active,
.btn.btn--green:first-child:active {
    background: #589f83;
    color: #fff;
}

.btn--empty-grey {
    background: #fff;
    border: 3px solid #808d9a;
}

.btn--empty-grey:hover,
.btn--empty-grey:focus,
:not(.btn-check) + .btn.btn--empty-grey:active,
.btn.btn--empty-grey:first-child:active {
    background: #808d9a;
    border: 3px solid #808d9a;
    color: #fff;
}

.btn--empty-green {
    background: #fff;
    border: 3px solid #5cb894;
}

.btn--empty-green:hover,
.btn--empty-green:focus,
:not(.btn-check) + .btn.btn--empty-green:active,
.btn.btn--empty-green:first-child:active {
    background: #5cb894;
    border: 3px solid #5cb894;
    color: #fff;
}

.dark-section {
    background: #fafafa;
}

h1 {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 2.6rem;
}

h2,
.like-h2 {
    font-size: 2.2rem;
    font-weight: 700;
    max-width: 53rem;
    line-height: 1.55;
    margin-bottom: 4rem;
}

h2 span {
    display: inline-block;
    position: relative;
}

h2 span:before {
    content: "";
    position: absolute;
    bottom: -0.2rem;
    left: 0;
    width: 100%;
    height: 3px;
    background: #f93c00;
}

h3,
.h3 {
    font-size: 1.7rem;
    font-weight: 500;
    line-height: 1.55;
    margin-bottom: 1.3rem;
}

input[type="text"]:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.mb0 {
    margin-bottom: 0;
}

table {
    width: 100%;
    margin-bottom: 2rem;
}

/*table tr td {
  padding: 1.7rem 2rem;
  font-size: 1.7rem;
  font-weight: 500;
  vertical-align: top;
}

table tr td:last-child {
  text-align: right;
  white-space: nowrap;
}

table tr td span {
  display: inline-block;
  margin-top: 1rem;
  line-height: 1.5;
  font-size: 1.5rem;
  font-weight: 400;
  color: #808d9a;
}*/

table tr:nth-child(2n-1) {
    background: #f6f6f6;
    border-top: 1px solid #eeeeef;
    border-bottom: 1px solid #eeeeef;
}

.table-comment {
    color: #808d9a;
    font-size: 1.4rem;
    padding: 0 2rem;
}

.ul {
    list-style: none;
    margin: 0;
    padding: 0;
    color: #808d9a;
    font-size: 1.4rem;
}

.ul li {
    position: relative;
    padding-left: 3rem;
}

.ul li:before {
    content: "";
    width: 2rem;
    height: 0.1rem;
    background: #b8c4d0;
    position: absolute;
    left: 0;
    top: 0.9rem;
}

.page h2 {
    margin-bottom: 2rem;
}

/*----------HEADER----------*/

header.header {
    margin-bottom: 2rem;
}

.top-panel {
    border-bottom: 1px solid #f6f6f6;
}

.top-panel__nav {
    margin: 0;
    padding: 0;
    list-style-type: none;
    height: 3.7rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 28px;
}

.top-panel__nav a {
    font-size: 1.4rem;
}

.top-panel__nav a svg {
    width: 1.5rem;
    height: 1.5rem;
    fill: #808d9a;
    margin-right: 0.5rem;
    transition: all 0.3s;
}

.top-panel__nav a:hover svg,
.header__email a:hover svg,
.header__cart:hover svg,
.header__favorites:hover svg,
.region:hover svg {
    fill: #f93c00;
}

.header__info {
    padding: 1.6rem 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header__rating {
    margin-right: 4.8rem;
    display: flex;
    align-items: center;
}

.header__rating iframe {
    transform: scale(1.07) translate(6px, -1px);
}

.header__contacts {
    margin: 0 auto 0 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 0.8rem;
}

.region {
    transition: all 0.3s;
    display: flex;
    align-items: center;
    cursor: pointer;
    width: fit-content;
}

.region span {
    position: relative;
    display: inline-block;
    margin: -0.5rem 1rem 0 0.1rem;
}

.region span:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 0.1rem;
    bottom: 0.3rem;
    border-bottom: 1px dashed #808d9a;
}

.region svg {
    width: 1.1rem;
    height: 1.1rem;
    margin-top: -0.4rem;
    fill: #828ea5;
}

.region:hover {
    color: #f93c00;
}

.header__phone a {
    font-size: 1.7rem;
    font-weight: 500;
}

.header__email {
    margin: auto auto auto 8.2rem;
}

.header__email svg {
    width: 2rem;
    height: 2rem;
    fill: #008bd8;
    margin: -0.4rem 0.5rem 0 0;
}

.messenger {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    color: #000;
    font-weight: 500;
    margin: auto 4.8rem auto auto;
}

.header__info .messenger {
    margin: 0;
    justify-content: flex-end;
}


.messenger svg {
    width: 2rem;
    height: 2rem;
    margin-top: -0.3rem;
}

.header__wa .messenger svg {
    width: 2.5rem;
    height: 2.5rem;
    margin-top: -4.3rem;
    transform: translateY(12px);
}

.header__wa {
    margin: auto 0.8rem auto auto;
}

.header__wa span {
    color: #808d9a;
    font-size: 1.2rem;
    display: block;
    text-align: right;
    margin-top: -0.3rem;
}

.header__shop {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4.3rem;
    padding: 0.9rem 1.8rem;
}

.header__favorites,
.header__cart {
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
    align-items: center;
    font-size: 1.4rem;
    position: relative;
    gap: 0.3rem;
}

.header__cart:after {
    display: none;
}

.header__cart-drop {
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
    border: 1px solid #eeeeef;
    border-radius: 10px;
    padding: 2rem;
}

.header__cart-drop.show {
    right: -2rem;
    left: auto;
    width: 76rem;
    top: calc(100% + 0.6rem);
}

.header__cart-drop.show .btn-close {
    position: absolute;
    right: 1rem;
    top: 1rem;
}

.header__cart-drop-item {
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    align-items: center;
}

.calc-carousel__goods-img.header__cart-img {
    width: 6.1rem;
    margin-right: 0;
}

.calc-carousel__goods-info.header__cart-drop-info {
    margin-right: auto;
}

.header__cart-drop-price {
    font-weight: 700;
    font-size: 1.7rem;
    color: #f93c00;
    background: rgba(249, 60, 0, 0.05);
    border-radius: 10px;
    padding: 0.1rem 0.7rem;
    margin-right: 0;
}

.header__cart-drop-count {
    margin-right: auto;
}

.header__cart-drop-unit {
    color: #808d9a;
    font-size: 1.3rem;
    max-width: 8rem;
    margin-right: auto;
}

.header__cart-drop-result-price {
    font-size: 1.9rem;
    font-weight: 500;
    margin-right: auto;
}

.header__cart-drop-delete {
    font-size: 1.3rem;
    color: #808d9a;
    cursor: pointer;
    margin-right: 2rem;
    transition: all 0.3s;
}

.header__cart-drop-delete:hover {
    color: #f93c00;
}

.header__cart-drop-item {
    margin-bottom: 2rem;
}

.header__cart-drop .btn {
    font-size: 1.7rem;
    width: 100%;
}

.header__shop-icon {
    position: relative;
}

.header__shop svg {
    width: 2.7rem;
    height: 2.7rem;
    transition: all 0.3s;
    fill: #848d9f;
}

.cart__num {
    position: absolute;
    top: -0.6rem;
    right: -1.2rem;
    display: inline-block;
    width: 1.9rem;
    height: 1.9rem;
    line-height: 1.7rem;
    font-size: 1.1rem;
    background: #f93c00;
    font-weight: 500;
    color: #fff;
    border-radius: 50%;
    border: 2px solid #fff;
}

.header__menu {
    position: relative;
    display: grid;
    grid-template-columns: 16.6rem 1fr 19.9rem;
    gap: 3.3rem;
    padding: 1rem 0.5rem 1rem 0;
    align-items: center;
}

.header__nav-ul {
    margin: -0.4rem 0 0 0.2rem;
    padding: 0;
    display: flex;
    list-style: none;
    justify-content: space-between;
}

.header__nav-ul li {
    flex-shrink: 0;
}

.header__nav a {
    font-size: 1.7rem;
    font-weight: 500;
}

.menu-catalog {
    color: #f93c00;
    display: flex;
    align-items: center;
    gap: 1.6rem;
}

.header__nav-ul li {
    flex-shrink: 0;
}

.menu-catalog svg {
    fill: #f93c00;
    width: 1.7rem;
    height: 1.7rem;
}

.header__nav .menu-catalog:before {
    content: "";
    position: absolute;
    bottom: 0;
    width: 13.7rem;
    height: 0.3rem;
    background: #f93c00;
    transform: translateX(-2rem);
    border-radius: 10px;
    opacity: 0;
    transition: all 0.3s;
}

.header__nav .menu-catalog.show:before,
.header__nav .menu-catalog:hover:before {
    opacity: 1;
}

.header__nav .menu-catalog:after {
    display: none;
}

.header__nav-ul .dropdown {
    position: initial;
}

.header__nav-ul .dropdown-menu.show {
    display: grid;
    grid-template-columns: 1fr 31.5rem;
    width: 100%;
    left: 0;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
    border: 1px solid #eeeeef;
    border-radius: 10px;
    padding: 3rem;
    background: linear-gradient(to right,
            #fff 22.5%,
            #eeeeef 22.5%,
            #fff 22.7%,
            #fff 47%,
            #eeeeef 47%,
            #fff 47.2%,
            #fff 70%,
            #eeeeef 70%,
            #fff 70.1%);
}

.nav__drop,
.nav__drop ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav__drop {
    columns: 3;
}

.nav__drop ul {
    padding-left: 1rem;
    margin-top: 1rem;
}

.drop-catalog h3 {
    font-size: 2.2rem;
    font-weight: 700;
}

.nav__drop li {
    margin-bottom: 1rem;
}

.nav__drop a {
    font-size: 1.5rem;
    color: #000;
    font-weight: 500;
}

.nav__drop ul a {
    font-size: 1.5rem;
    color: #808d9a;
    font-weight: 400;
}

.nav__drop a:hover,
.nav__drop ul a:hover {
    color: #f93c00;
}

.drop-adv {
    padding-left: 3rem;
    font-weight: 400;
    color: #000;
}

.drop-adv__img {
    position: relative;
    width: 100%;
    height: 14.2rem;
    border-radius: 10px;
    overflow: hidden;
}

.drop-adv__img img {
    position: absolute;
    min-height: 100%;
    max-width: 100%;
    object-fit: cover;
}

.drop-adv__txt {
    display: flex;
    align-items: center;
    color: #808d9a;
    font-size: 1.5rem;
    gap: 1rem;
    margin-top: 1rem;
    font-weight: 400;
}

.drop-adv__discount {
    font-size: 1.3rem;
    color: #fff;
    background: #ff0000;
    border-radius: 10px;
    font-weight: 500;
    padding: 0.3rem 0.7rem;
}

.header__search {
    position: relative;
}

.search-btn {
    position: absolute;
    right: 1.2rem;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    outline: none;
    background: transparent;
}

.header__search svg {
    width: 2rem;
    height: 2rem;
}

.search-btn:hover svg {
    fill: #ff0000;
}

.header__search input {
    border-radius: 10px;
    background-color: #f6f6f6;
    outline: none;
    border: none;
    padding: 0.74rem 2rem;
    box-sizing: border-box;
    max-width: 100%;
}

.header__search input::placeholder {
    color: #808d9a;
    font-size: 1.5rem;
}


.desctop .header__info .messenger {
    align-items: flex-start;
    gap: 0.3rem;
}

.desctop .messenger__icons.messenger {
    margin: -2px 0 0 0;
    gap: 0.3rem;
}

.desctop .messenger__icons.messenger .messenger--img.dark-link img {
    width: 2rem;
    height: 2rem;
    margin-right: 0.5rem;
}

.desctop .messenger__phones.messenger {
    align-items: flex-start;
    gap: 0.3rem;
}

.desctop .messenger__phones.messenger .messenger__icons {
    margin: -2px 0 0 0;
    gap: 0.3rem;
}

.desctop .messenger__phones.messenger .messenger__icons .messenger--img img {
    width: 2rem;
    height: 2rem;
    margin-right: 0.5rem;
}

/*----------MAIN----------*/

.content {
    padding: 0 0 3.7rem;
}

.content.main {
    padding: 0 0 3.7rem;
}

.breadcrumbs {
    margin: -0.3rem 0 3.6rem 0.3rem;
}

.breadcrumbs a {
    position: relative;
    display: inline-block;
    font-size: 1.3rem;
    padding-right: 2rem;
    margin-right: 0.6rem;
}

.breadcrumbs a:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    display: block;
    width: 0.8rem;
    height: 0.8rem;
    background: url("/images/down-arrow.svg") no-repeat;
    background-size: contain;
    background-position: center;
    transform: rotate(-90deg) translateX(50%);
}

.breadcrumbs a:last-child:before {
    display: none;
}

.content-hero {
    margin-bottom: 3.4rem;
}

.desc {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: 1rem;
    margin-bottom: 3.5rem;
}

.desc__txt {
    max-width: 68rem;
}

.desc__adv {
    padding: 1.8rem 1.4rem;
    background: linear-gradient(0.602turn,
            rgba(255, 243, 243, 1) 0%,
            rgba(240, 247, 255, 1) 100%);
    border-radius: 10px;
    margin-top: -1.9rem;
}

.desc__adv-item {
    margin-bottom: 1rem;
}

.desc__adv-item:last-child {
    margin-bottom: 0;
}

.desc__adv-item svg {
    width: 2.5rem;
    height: 2.5rem;
    margin-right: 0.7rem;
}

.desc__adv-item span {
    border-bottom: 1px dashed #808d9a;
    padding-bottom: 0.2rem;
}

/*----------HERO SECTION----------*/

.hero__banners {
    display: grid;
    grid-template-columns: 76rem 1fr;
    gap: 2rem;
}

.hero__bigbanner {
    position: relative;
    background: url("/images/decking-hero.jpeg") no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 10px;
    padding: 1.4rem 3.3rem;
    color: #fff;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr 16rem;
    height: 26rem;
    align-items: flex-start;
    align-content: end;
    grid-column-start: 1;
    grid-row-start: 1;
    grid-row-end: 3;
}

.hero__bigbanner:before,
.hero__smallbanner:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.35);
    top: 0;
    left: 0;
}

.hero__bigbanner .btn {
    margin-top: 0.4rem;
}

.hero__banners-txt {
    position: relative;
}

.hero__banners-txt h2 {
    font-size: 2.9rem;
    font-weight: 700;
    margin-bottom: 0.3rem;
    line-height: 1.1;
}

.hero__banners-txt p {
    font-size: 1.6rem;
}

.hero__smallbanner--instal {
    background: url(/images/montazh-hero.jpg) no-repeat;
    background-position: 0 80%;
}

.hero__smallbanner--calc {
    background: url(/images/calc-bg-hero.jpg) no-repeat;
    background-position: bottom;
}

.hero__smallbanner {
    position: relative;
    display: grid;
    grid-template-columns: 5fr 4fr;
    align-items: center;
    justify-items: flex-start;
    gap: 1.6rem;
    border-radius: 10px;
    overflow: hidden;
    color: #fff;
    font-size: 1.8rem;
    text-transform: uppercase;
    line-height: 1.1;
    font-weight: 700;
    padding: 2.5rem;
    height: 12rem;
    background-size: cover;
}

.hero__smallbanner h2 {
    font-size: 1.8rem;
    margin-bottom: 0;
}

.hero__smallbanner .btn {
    width: 5.7rem;
    padding: 0.4rem;
}

.hero__tags {
    padding: 3rem 0 3.3rem;
}

.hero__tags-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.1rem;
    color: #808d9a;
    font-size: 1.4rem;
    text-align: center;
}

.hero__tags-item svg {
    width: 3.6rem;
    height: 3.5rem;
}

.col-lg-2:first-child .hero__tags-item {
    padding-right: 1.7rem;
}

.col-lg-2:nth-child(2) .hero__tags-item {
    padding-right: 1rem;
}

.col-lg-2:nth-child(5) .hero__tags-item {
    padding-left: 1.6rem;
}

.col-lg-2:nth-child(6) .hero__tags-item {
    padding-left: 2.3rem;
}

.hero__tags-item:hover svg {
    transform: scale(1.1);
}

/*----------SECTION ASSORTMENT----------*/

.assortment {
    padding: 2.5rem 0 3.5rem;
}

.assortment--bot {
    padding: 5.5rem 0;
    margin-bottom: 1rem;
}

.tags {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.9rem;
}

.tags a {
    background: #f0f7ff;
    padding: 0.4rem 1.8rem;
    border-radius: 10px;
}

.tags a:hover {
    background: #e0efff;
    color: #0076b7;
}

.assortment p {
    max-width: 96rem;
    margin-bottom: 1rem;
}

.assortment__container {
    gap: 2rem 0;
}

.assortment__item {
    display: block;
    background: #f6f6f6;
    border-radius: 10px;
    text-align: center;
    padding-bottom: 1.5rem;
}

.assortment__item:hover {
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
    color: #000;
}

.assortment__item img {
    width: 27.5rem;
    height: 19.9rem;
    border-radius: 10px;
    object-fit: cover;
}

.assortment__item h3 {
    font-size: 1.7rem;
    margin: 1.5rem 0 0.2rem;
}

/*----------SECTION ADVANTAGES----------*/

.advantages {
    padding: 3rem 0;
}

.advantages__container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 3rem 4rem;
}

.advantages__item {
    border-radius: 10px;
    border: 2px dashed #808d9a;
    padding: 1.6rem 1.8rem;
}

.advantages__item p {
    color: #808d9a;
    margin-bottom: 0;
}

/*----------SECTION BESTSELLERS----------*/

.bestsellers {
    padding: 4.2rem 0;
}

.bestsellers h2 {
    margin-bottom: 2.5rem;
}

.bestsellers .nav-pills .nav-link {
    color: #008bd8;
    padding: 0.5rem 1rem;
    margin-bottom: 0.7rem;
    border-radius: 10px;
}

.bestsellers .nav-pills .nav-link.active,
.bestsellers .nav-pills .show > .nav-link {
    background: #008bd8;
    padding: 0.5rem 1.3rem;
    margin-bottom: 1.7rem;
    color: #fff;
}

.bestsellers .nav-pills .nav-link:hover {
    background: #f0f7ff;
}

.bestsellers .nav-pills .nav-link.active:hover {
    background: #008bd8;
}

.bestsellers__container {
    position: relative;
    display: grid;
    /*grid-template-columns: 26rem 1fr;*/
    grid-template-columns: 1fr;
    gap: 4rem;
}

.bestsellers .nav-pills .nav-link {
    display: inline-block;
}

.bestsellers__carousel-tab {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem 1rem;
    margin-bottom: 4rem;
}

.bestsellers__container .btn.btn--empty-grey {
    /*position: absolute;
    left: 0;
    bottom: 3.1rem;*/
    width: 26rem;
    margin: 0 auto;
    display: block;
}

.bestsellers__container .flickity-button {
    width: 4.1rem;
    height: 4.1rem;
    background: #fff;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.3);
    border-radius: 50%;
}

.bestsellers__container .flickity-prev-next-button.previous {
    left: 0;
    transform: translateX(-150%);
}

.bestsellers__container .flickity-prev-next-button.next {
    right: 0;
    transform: translateX(120%);
}

/*----------CARDS----------*/

.goods-carousel .carousel-cell {
    width: 34%;
}

.card svg {
    width: 2rem;
    height: 2rem;
}

.card {
    display: grid;
    position: relative;
    border: none;
    width: 100%;
    padding-right: 1.1rem;
}

.card__img a {
    display: block;
}

.card__img img {
    width: 100%;
}

.card__top {
    position: relative;
    margin-bottom: 2.3rem;
}

.card__marks-container {
    position: absolute;
    left: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    align-items: flex-start;
    justify-content: flex-start;
    z-index: 3;
}

.card__marks-container--top {
    top: 2.1rem;
}

.card__marks-container--bottom {
    bottom: 1rem;
}

.card__marks {
    color: #fff;
    padding: 0.3rem 1.2rem;
    display: inline-block;
    border-radius: 10px;
    font-size: 1.3rem;
    font-weight: 500;
}

.card__marks--hit {
    background: #f93c00;
}

.card__marks--green {
    background: #5cb894;
}

.card__marks--sale {
    background: #ff0000;
}

.card-spec {
    color: #808d9a;
    font-size: 1.3rem;
}

.card__fav {
    position: absolute;
    right: 1rem;
    top: 2rem;
}

.card__fav svg {
    width: 2.9rem;
    height: 2.9rem;
    cursor: pointer;
}

.card__fav svg:hover {
    transform: scale(1.1);
}

.card__head {
    display: grid;
    grid-template-columns: 5.2rem 1fr;
    gap: 1rem;
    margin-top: 0.3rem;
    margin-bottom: 0.5rem;
    align-items: flex-start;
    align-content: center;
}

.card__rating {
    border-radius: 10px;
    background: rgba(246, 195, 68, 0.1);
    font-weight: 600;
    margin-top: 0.3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
}

.card__rating svg {
    width: 1.6rem;
    height: 1.6rem;
}

.card__title {
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.card__color-container {
    margin: 0.8rem 0;
    padding: 0 0 0 0.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.card__color-item {
    position: relative;
    width: 2rem;
    height: 2rem;
    background: #ccc;
    border-radius: 50%;
}

.card__color-item:not(.active):hover {
    transform: scale(1.1);
}

.card__color-item.active:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    border: 2px solid #f93c00;
}

.card__color-item[data-color="chocolate"],
.category__filter-color[data-color="chocolate"]:before,
.modal-card__color[data-color="chocolate"]:before {
    background: #8c6b46;
}

.card__color-item[data-color="black"],
.category__filter-color[data-color="black"]:before,
.modal-card__color[data-color="black"]:before {
    background: #000;
}

.card__color-item[data-color="grey"],
.category__filter-color[data-color="grey"]:before,
.modal-card__color[data-color="grey"]:before {
    background: #ccc;
}

.card__color-item[data-color="anthracite"],
.category__filter-color[data-color="anthracite"]:before,
.modal-card__color[data-color="anthracite"]:before {
    background: #323534;
}

.card__color-item[data-color="beige"],
.category__filter-color[data-color="beige"]:before,
.modal-card__color[data-color="beige"]:before {
    background: #99824a;
}

.card__color {
    margin-bottom: 1.2rem;
}

.card__size-container {
    display: grid;
    grid-template-columns: 9.3rem 1fr;
    align-items: center;
    gap: 1.6rem;
    margin-bottom: 2rem;
}

.card__size {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 0.35rem 0;
    background: #eeeeef;
    border-radius: 10px;
    font-size: 1.3rem;
    font-weight: 500;
}

.card__size svg {
    width: 0.9rem;
    height: 0.9rem;
}

.card__purpose {
    font-size: 1.3rem;
}

.card__purpose svg {
    width: 1.8rem;
    height: 1.7rem;
    margin-right: 0.5rem;
}

.card__length-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 1rem;
    margin: 0.8rem 0;
}

.card__length-item span {
    display: inline-block;
    border: 2px solid #b8c4d0;
    border-radius: 10px;
    padding: 0.1rem 0.9rem;
    font-size: 1.4rem;
    cursor: pointer;
    transition: all 0.3s;
}

.card__length-item span:hover {
    border-color: #8d96a0;
}

.card__length-list input {
    display: none;
}

.card__length-list input:checked + span {
    border-color: #f93c00;
    font-weight: 600;
}

.card__length {
    margin-bottom: 0.6rem;
}

.card__length svg {
    width: 2.3rem;
}

.card__price-block ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: none;
}

.card__price-block .nav-link {
    border-radius: 10px 10px 0 0;
    text-align: center;
    width: 100%;
    display: inline-block;
    font-size: 1.4rem;
    font-weight: 500;
    border: none;
    padding: 1rem 0.5rem;
}

.card__price-block .nav-link.active {
    background: #f6f6f6;
}

.card__price-block .tab-content {
    background: #f6f6f6;
    border: none;
}

.card__add-block {
    background: #f6f6f6;
    padding: 0.5rem 0.5rem 0.6rem;
    border-radius: 0 0 10px 10px;
    margin-top: -0.9rem;
}

.card__add-block .btn--red {
    width: 100%;
    justify-content: center;
}


.card-in .card__add-block {
    background: transparent;
    padding: 0;
    margin: 0 5px !important;
}

.card-in .card__add-block .btn--red.add-to-cart {
    margin: 0 24px;
    max-width: 30.5rem;
    justify-content: center;
}

.card__price {
    font-size: 2.6rem;
    color: #5cb894;
    font-weight: 700;
    white-space: nowrap;
    padding: 0 0.9rem;
}

.card__price-block .card__pricetab {
    display: flex;
    padding: 1.5rem 0.5rem;
    gap: 1.1rem;
    line-height: 1.4;
    align-items: center;
    min-height: 6.8rem;
}

.card__discount {
    text-align: left;
}

.card__discount-percent {
    display: block;
    color: #f93c00;
    font-size: 1.2rem;
    font-weight: 500;
    white-space: nowrap;
}

.card__old-price {
    color: #808d9a;
    font-size: 1.4rem;
    white-space: nowrap;
}

.card__price--discount {
    background: rgba(249, 60, 0, 0.05);
    color: #f93c00;
    border-radius: 10px;
}

.card__unit {
    max-width: 10rem;
}

.card__delivery {
    text-align: center;
    margin-top: 0.5rem;
}

.card__added {
    display: flex;
    align-items: center;
}

.card__added.active {
    display: flex;
}

.hidden {
    display: none;
}

.hideaway {
    opacity: 0;
    height: 0;
    overflow: hidden;
    padding: 0 !important;
}

.card__buy.card__buy--added {
    padding: 0.62rem 1.5rem;
    margin-right: 1rem;
}

.card__count {
    display: inline-block;
    width: 4.2rem;
    height: 4.2rem;
    text-align: center;
    background: #b8c4d0;
    color: #fff;
    font-size: 2.2rem;
    color: #fff;
    border-radius: 10px;
    font-weight: 500;
    border: none;
    transition: all 0.3s;
}

.card__count:hover {
    background: #8d96a0;
}

.card__number {
    margin: 0 auto;
    display: inline-block;
    max-width: 3rem;
    text-align: center;
    border: none;
    background: transparent;
    font-size: 1.7rem;
    font-weight: 500;
}

/*----------SECTION INSTALLATION----------*/

.installation {
    padding: 3.8rem 0;
}

.installation__container {
    border-radius: 10px;
    background: url(/images/cta-bg.jpg) no-repeat;
    background-size: cover;
    background-position: bottom;
    color: #fff;
    padding: 2.4rem 3.4rem 3rem;
    position: relative;
}

.installation__container:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.45);
    border-radius: 10px;
}

.installation__container * {
    position: relative;
}

.installation h2 {
    font-size: 2.9rem;
    max-width: 100%;
    margin-bottom: 1.5rem;
}

.installation p {
    max-width: 88rem;
    line-height: 1.6;
    letter-spacing: 0.53px;
    margin-bottom: 2rem;
}

.installation .btn {
    padding: 0.62rem 2.5rem;
}

.installation p a {
    color: #fff;
    text-decoration: underline;
}

.installation p a:hover {
    text-decoration: none;
}

/*----------SECTION CALCULATION----------*/

.calculation {
    padding: 1.5rem 0;
}

.calculation__info {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 2rem;
}

.calculation__calc {
    background: linear-gradient(0.093turn,
            rgba(246, 223, 174, 0.5) 0%,
            rgba(249, 60, 0, 0.11) 100%);
    padding: 3rem 0.9rem 0 3rem;
    display: grid;
    grid-template-columns: 1fr 23.3rem;
    gap: 1rem;
    height: max-content;
    border-radius: 10px;
}

.calculation__calc-txt h2 {
    font-size: 2.3rem;
    max-width: 25rem;
    line-height: 1.1;
    margin-bottom: 1.7rem;
}

.calculation__img {
    margin-top: -2rem;
}

.calculation__calc-txt p {
    line-height: 1.4;
    margin-bottom: 2.3rem;
}

.calculation__calc-txt .btn {
    padding: 0.62rem 2.2rem;
}

.calculation__callback {
    border-top: 2px solid #eeeeef;
    border-bottom: 2px solid #eeeeef;
    padding: 1.7rem 0;
    margin-left: 2rem;
}

.calculation__callback h3 {
    line-height: 1.5;
    margin-bottom: 2rem;
}

.calculation__callback p {
    font-size: 1.4rem;
    line-height: 1.6;
    margin-bottom: 2rem;
}

.calculation__phone {
    font-size: 2rem;
    font-weight: 500;
}

.calculation__callback .btn--empty-green {
    padding: 0.62rem 2.2rem;
    margin-top: 2rem;
}

.calculation__measure svg {
    width: 4.7rem;
    height: 4.7rem;
}

.calculation__measure {
    background: #f0f7ff;
    border-radius: 10px;
    margin-left: 2rem;
    padding: 1.2rem 1.8rem;
    text-align: center;
}

.calculation__measure h3 {
    line-height: 1.3;
    margin-bottom: 1.8rem;
}

.calculation__measure p {
    font-size: 1.4rem;
    margin-bottom: 2rem;
}

/*----------SECTION CALCULATOR----------*/

.calculator {
    padding: 3.2rem 0;
}

h2.calculator__title {
    position: relative;
    padding-left: 7.8rem;
    max-width: 60rem;
    margin-bottom: 2rem;
}

h2.calculator__title:before {
    content: "";
    position: absolute;
    width: 5.4rem;
    height: 5.4rem;
    background: url(/images/calc-g.svg) no-repeat;
    background-size: contain;
    background-position: center;
    left: 0;
    top: 0.6rem;
}

.calculator p {
    max-width: 100rem;
    margin-bottom: 2.7rem;
}

.calculator__compute h3 span {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background: #f0f7ff;
    border-radius: 50%;
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 2rem;
    text-align: center;
    margin-right: 0.6rem;
    transform: translateY(-2px);
}

.calculator__options {
    display: grid;
    grid-template-columns: 27.5rem 27.5rem 1fr;
    gap: 2rem;
    margin-bottom: 3rem;
}

.calculator__options div {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.calculator input,
.calculator select {
    width: 100%;
    border: 1px solid #b8c4d0;
    border-radius: 10px;
    background: #fcfcfc;
    font-size: 1.5rem;
    font-weight: 500;
    padding: 0.8rem 1rem;
    height: 4rem;
}

.calculator select {
    background: url(/images/down-arrow.svg), #fcfcfc;
    background-size: 1rem;
    background-repeat: no-repeat;
    background-position: calc(100% - 1.2rem) 48%;
}

.calculator label {
    font-size: 1.4rem;
    color: #808d9a;
    margin-bottom: 0.5rem;
}

.calculator h3 {
    margin-bottom: 1.7rem;
}

.calculator__options .calculator__square {
    font-size: 1.7rem;
    font-weight: 500;
    color: #808d9a;
    margin-left: 1rem;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-end;
    margin-bottom: 0.8rem;
}

.calculator__square span {
    color: #000;
    margin-left: 0.9rem;
}

.calculator__options .calculator__counter {
    flex-direction: row;
    max-width: 12rem;
}

.calculator__count {
    display: inline-block;
    width: 4.2rem;
    height: 4.2rem;
    text-align: center;
    background: #f0f7ff;
    color: #fff;
    font-size: 2.2rem;
    color: #008bd8;
    border-radius: 10px;
    font-weight: 500;
    border: none;
    transition: all 0.3s;
}

.calculator__count:hover {
    background: #b8c4d0;
}

.calculator__counter input {
    border: none;
    background: transparent;
    max-width: 3rem;
    text-align: center;
    margin: 0 auto;
    font-size: 1.7rem;
}

.calculator__options--foundation {
    grid-template-columns: 57rem 1fr;
}

.calculator__btn {
    margin-top: 0.7rem;
    font-size: 1.7rem;
    font-weight: 600;
    width: 27.5rem;
    max-width: 100%;
}

.calculator__result {
    opacity: 0;
    height: 0;
    overflow: hidden;
    padding-bottom: 2rem;
}

.calculator__result.active {
    opacity: 1;
    height: auto;
    overflow: visible;
    padding-top: 3.6rem;
}

.calculator__result h2 {
    margin-bottom: 2rem;
}

.calculator__total {
    padding: 0;
    list-style: none;
    margin: 0;
}

.calculator__total li {
    display: grid;
    grid-template-columns: 29rem 1fr;
    margin-bottom: 1.3rem;
    gap: 0.5rem;
}

.calculator__total-title {
    color: #808d9a;
    display: flex;
    overflow: hidden;
    gap: 0.5rem;
}

.title-dots {
    flex-shrink: 0;
}

.dots {
    min-width: 100%;
    flex-shrink: 1;
    background: url(/images/dot.png);
    background-size: 8px;
    background-position: 5px 12px;
    background-repeat: repeat-x;
}

.calculator__value {
    font-weight: 500;
}

.calculator__result-options {
    padding-top: 1.6rem;
    margin-bottom: 5.3rem;
}

.calculator__result-options .carousel-cell {
    width: 39%;
    margin-right: 2rem;
}

.calc-carousel__goods {
    display: grid;
    grid-template-columns: 6.1rem 1fr 1fr;
    gap: 1rem;
    border: 2px dashed #b8c4d0;
    border-radius: 10px;
    padding: 2rem 2rem 2rem 0.5rem;
    align-items: center;
    background: #fff;
}

.calc-carousel__goods-img {
    position: relative;
    height: 6.1rem;
}

.calc-carousel__goods-img img {
    position: absolute;
    min-height: 100%;
    max-width: 100%;
    object-fit: cover;
}

.calc-carousel__goods-type {
    font-size: 1.3rem;
    color: #808d9a;
}

.calc-carousel__goods-head {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 0.3rem;
}

.card__rating.calc-carousel__goods-rating {
    width: 5.2rem;
}

.calc-carousel__goods-title {
    font-size: 1.7rem;
    font-weight: 500;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.calc-carousel__goods-price {
    text-align: right;
}

.calc-carousel__goods-price span {
    display: inline-block;
    border-radius: 10px;
    padding: 0.5rem 1rem;
    font-size: 1.7rem;
    color: #5cb894;
    background: rgba(92, 184, 148, 0.05);
}

.calc-carousel__result {
    list-style: none;
    margin-top: 0.3rem;
    padding-left: 0;
    color: #808d9a;
}

.calc-carousel__result li {
    margin-bottom: 0.7rem;
}

.calc-carousel__result-b {
    color: #000;
    font-weight: 500;
    display: inline-block;
    margin-left: 2rem;
}

.calc-carousel__price {
    display: inline-block;
    padding: 0 1rem;
    font-size: 2.6rem;
    font-weight: 700;
    color: #f93c00;
    background: rgba(249, 60, 0, 0.05);
    border-radius: 10px;
}

.calc-carousel__bg {
    background: #fcfcfc;
    border-radius: 10px;
}

.calc-carousel__block {
    padding: 2rem;
}

.calc-carousel__price-block {
    display: flex;
    align-items: center;
    gap: 2rem;
    padding-top: 0.7rem;
}

.calc-carousel__old-price {
    color: #808d9a;
}

.calc-carousel__discount {
    font-size: 1.2rem;
    font-weight: 500;
    color: #f93c00;
    margin: 0.5rem 1.3rem 0;
}

.calculator__result-options .flickity-button {
    width: 4.1rem;
    height: 4.1rem;
    background: #fff;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.3);
    border-radius: 50%;
}

.calculator__result-options .flickity-prev-next-button.next {
    right: -3rem;
}

.calculator__result-options .flickity-prev-next-button.previous {
    left: -3rem;
}

.calculator__result-cta p {
    margin-bottom: 1.3rem;
}

/*----------SECTION DECKING----------*/

.decking {
    padding-top: 2.8rem;
}

.decking .wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.decking__left h2 {
    margin-bottom: 2rem;
}

.decking__info {
    background: #f6f6f6;
    border-radius: 10px;
    padding: 2rem 2.1rem;
    margin-top: 1.8rem;
    margin-bottom: 1.9rem;
}

.decking__info h3 {
    margin-bottom: 2.8rem;
}

.decking__info p {
    margin-bottom: 2.3rem;
}

.decking__info p:last-child {
    margin-bottom: 0;
}

.decking__left {
    max-width: 55.4rem;
}

.decking__right {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1.7rem;
}

.decking__item img {
    width: 13rem;
    border-radius: 50%;
    margin: auto;
    margin-bottom: 3.4rem;
}

.decking__item {
    position: relative;
    text-align: center;
    padding-top: 2.5rem;
}

.decking__item p {
    font-size: 1.2rem;
    color: #808d9a;
    margin-bottom: 0;
}

.decking__item h3 {
    margin: auto;
    margin-bottom: 2rem;
    max-width: 15rem;
}

.decking__item:before {
    content: "";
    position: absolute;
    right: -1.3rem;
    top: 7rem;
    font-size: 2.2rem;
    font-weight: 700;
}

.decking__item:first-child:before {
    content: "+";
}

.decking__item:nth-child(2):before {
    content: "=";
}


/*----------SECTION PROPERTIES----------*/

.properties {
    padding-top: 4.9rem;
}

.properties h2 {
    margin-bottom: 2rem;
}

.properties__item {
    position: relative;
    font-size: 1.4rem;
    color: #808d9a;
    line-height: 1.4;
}

.properties__item:after {
    content: "";
    position: absolute;
    width: 10rem;
    height: 0.5rem;
    background: #5cb894;
    bottom: -1.4rem;
    left: 0;
}

.properties__item--right:after {
    left: auto;
    right: 0;
}

.properties__item--right {
    text-align: right;
}

.properties__container {
    position: relative;
    display: grid;
    grid-template-columns: 13rem 1fr 13rem;
    align-items: center;
}

.properties__img {
    grid-column-start: 2;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 4;
    width: 38.3rem;
    margin: auto;
    transform: translateY(2.7rem);
    position: relative;
}

.properties__img:after {
    content: "";
    position: absolute;
    width: 43rem;
    height: 0.5rem;
    background: #808d9a;
    bottom: 3rem;
    left: 50%;
    transform: translateX(-50%);
}

.properties__item span {
    white-space: nowrap;
}

.properties__lines {
    position: absolute;
    width: 33%;
    height: 2px;
    border: 1px dashed #ccc;
}

.properties__lines:before {
    content: "";
    position: absolute;
    height: 1.6rem;
    width: 1.6rem;
    background: #fff;
    border: 3px solid #f93c00;
    border-radius: 50%;
}

.properties__lines:nth-child(8) {
    top: 7.7rem;
    left: 12.6rem;
    transform: rotate(10deg);
}

.properties__lines:nth-child(8):before {
    top: -0.8rem;
    right: -1.8rem;
}

.properties__lines:nth-child(9) {
    top: 18.4rem;
    left: 12.7rem;
}

.properties__lines:nth-child(9):before {
    top: -1rem;
    right: -1.5rem;
}

.properties__lines:nth-child(10) {
    top: 29.3rem;
    left: 12.6rem;
    transform: rotate(-8deg);
}

.properties__lines:nth-child(10):before {
    top: -0.9rem;
    right: -2rem;
}

.properties__lines:nth-child(11) {
    top: 7.7rem;
    right: 13.3rem;
    transform: rotate(-11deg);
}

.properties__lines:nth-child(11):before {
    top: -0.8rem;
    left: -1.9rem;
}

.properties__lines:nth-child(12) {
    top: 17.7rem;
    right: 12.9rem;
    transform: rotate(-2deg);
}

.properties__lines:nth-child(12):before {
    top: -0.8rem;
    left: -1.9rem;
}

.properties__lines:nth-child(13) {
    top: 27.9rem;
    right: 13rem;
    transform: rotate(7deg);
}

.properties__lines:nth-child(13):before {
    top: -0.9rem;
    left: -1.9rem;
}

.properties__item.properties__item--right:nth-child(3) {
    margin-top: -3rem;
}

/*-----------SECTION GUARANTEE----------*/

.guarantee {
    padding: 5rem 0;
}

.guarantee .wrapper {
    border-radius: 10px;
    background: linear-gradient(0.602turn,
            rgba(255, 243, 243, 1) 0%,
            rgba(240, 247, 255, 1) 100%);
    padding: 1.9rem 2.5rem;
}

.guarantee h2 {
    margin-bottom: 2rem;
}

.guarantee p {
    max-width: 95rem;
    margin-bottom: 0;
}

/*----------SECTION SERVICES----------*/

.services {
    background: #fafafa;
    padding: 2.7rem 0;
}

.services h2 {
    margin-bottom: 3rem;
}

.services__container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
}

.services__item {
    display: block;
    border-radius: 10px;
    background: #f6f6f6;
}

.services__item:hover {
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
    color: #000;
}

.services__img {
    position: relative;
    height: 12.3rem;
    overflow: hidden;
    border-radius: 10px;
}

.services__img img {
    position: absolute;
    min-height: 100%;
    max-width: 100%;
    object-fit: cover;
}

.services__item .h3 {
    text-align: center;
    margin: 1.5rem 0;
}

.service-adv__item svg {
    width: 7rem;
    height: 7rem;
    margin-bottom: 0rem;
}

.advantages__container--promo .service-objects {
    margin: 6.1rem 0 7.9rem;
}

.advantages__container--promo .services__img {
    height: 20rem;
}

.advantages__container--promo .services__item h3 {
    text-align: center;
    line-height: 1.4;
    margin: 1rem;
}

/*----------SECTION ABOUT----------*/

.about {
    padding: 4.3rem 0;
}

.title-tag {
    background: #5cb894;
    display: inline-block;
    color: #fff;
    font-size: 1.3rem;
    font-weight: 500;
    border-radius: 10px;
    padding: 0.4rem 1.4rem;
    margin-bottom: 1rem;
}

.about h2 {
    margin-bottom: 2rem;
}

.about p {
    max-width: 100rem;
}

.about__container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-auto-flow: column;
    gap: 2.4rem 4rem;
    margin-top: 3rem;
}

.about__item {
    padding: 1.1rem 1.3rem 1.1rem 1.1rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: #f6f6f6;
    border-radius: 10px;
    overflow: hidden;
}

.about__img {
    position: relative;
    flex-shrink: 0;
}

.about__img:before {
    content: "1";
    position: absolute;
    color: #fff;
    font-size: 17rem;
    opacity: 0.5;
    font-weight: 700;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.about__item:nth-child(2) .about__img:before {
    content: "2";
}

.about__item:nth-child(3) .about__img:before {
    content: "3";
}

.about__item:nth-child(4) .about__img:before {
    content: "4";
}

.about__item:nth-child(5) .about__img:before {
    content: "5";
}

.about__item:nth-child(6) .about__img:before {
    content: "6";
}

.about__item:nth-child(7) .about__img:before {
    content: "7";
}

.about__item:nth-child(8) .about__img:before {
    content: "8";
}

.about__img svg {
    position: relative;
    width: 7.5rem;
    height: 7.5rem;
    fill: #949494;
}

.about__item p {
    margin: 0;
    position: relative;
}

/*----------SECTION PORTFOLIO----------*/

.portfolio {
    padding: 3.7rem 0 0;
}

.portfolio h2 {
    margin-bottom: 0;
}

.portfolio__title {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-bottom: 2.8rem;
}

.portfolio__img {
    display: block;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    height: 16.9rem;
    margin-bottom: 2rem;
}

.portfolio__img img {
    position: absolute;
    min-height: 100%;
    max-width: 100%;
    object-fit: cover;
}

.portfolio-carousel .carousel-cell {
    width: 34%;
}

.portfolio__item {
    margin: 0 2.5rem 0 0;
}

.portfolio__tags {
    color: #808d9a;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.portfolio__item-title {
    margin-bottom: 0.5rem;
}

.portfolio__container {
    margin-bottom: 2.8rem;
}

.portfolio__container .flickity-prev-next-button.previous {
    left: -2.2rem;
    top: 36%;
}

.portfolio__container .flickity-prev-next-button.next {
    right: -2.2rem;
    top: 36%;
}


/*-----------FOOTER-----------*/

.footer {
    background: #f6f6f6;
    padding: 4.5rem 0;
}

.footer__container {
    display: grid;
    grid-template-columns: 16rem 16rem 32.4rem 26.1rem;
    justify-content: space-between;
}

.footer__nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.footer__nav li {
    margin-bottom: 1rem;
}

.footer__nav a {
    color: #808d9a;
}

.footer__nav strong a {
    color: #000;
    font-size: 1.7rem;
    font-weight: 500;
}

.footer__nav a:hover,
.footer__nav strong a:hover {
    color: #f93c00;
}

.footer__logo {
    color: #808d9a;
    font-size: 2.3rem;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 1.5rem;
}

.footer__txt {
    color: #808d9a;
    font-size: 1.4rem;
    margin-bottom: 2.3rem;
}

.footer__phone a {
    font-size: 1.7rem;
    font-weight: 500;
}

.footer__copyright {
    color: #808d9a;
    font-size: 1.2rem;
}

.footer__contacts {
    display: flex;
    align-items: center;
    /*justify-content: space-between;
    margin-bottom: 1.3rem;*/
    justify-content: flex-start;
    gap: 0.7rem;
    margin-bottom: 0.5rem;
}

.footer__block .region {
    margin-bottom: 1rem;
}

.footer__address,
.footer__schedule {
    font-weight: 500;
}

.footer__schedule {
    margin: -0.7rem 0 1.9rem;
}

.footer__contacts div {
    white-space: nowrap;
}

.footer__copyright p {
    margin-bottom: 1.5rem;
}

.footer__copyright p:last-child span {
    display: inline-block;
    width: 100%;
}

.footer__messenger .messenger {
    margin: 0;
}

.footer__messenger--sp span {
    color: #808d9a;
    font-size: 1.4rem;
}

.footer__messenger--sp {
    /*margin-top: -0.6rem;*/
    margin-top: 0;
}

/*----------MODAL----------*/

.modal-dialog .modal-content {
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
    border: #eeeeef;
    border-radius: 10px;
    padding: 1.5rem;
}

.modal-content .btn-close {
    position: absolute;
    right: 1.5rem;
    width: 1.4rem;
    height: 1.4rem;
    z-index: 2;
}

.modal--region {
    --bs-modal-width: 54rem;
}

.modal-body .like-h2 {
    margin-bottom: 2rem;
}

.modal-body .btn--black {
    padding: 0.62rem 4rem;
}

.modal__input {
    width: 100%;
    border: 1px solid #b8c4d0;
    border-radius: 10px;
    background: #fcfcfc;
    padding: 0.7rem 1.5rem;
    font-weight: 500;
}

.modal__regions {
    margin: 3rem 0;
    list-style: none;
    padding: 0 0 0 1.5rem;
    columns: 3;
}

.modal__regions li {
    margin-bottom: 1rem;
}

.modal--cart {
    --bs-modal-width: 84rem;
}

.modal-card__container {
    display: grid;
    grid-template-columns: 18.1rem 21.8rem 1fr;
}

.modal--cart .modal-content {
    padding: 1rem 1.2rem;
}

.modal-card__info {
    padding: 0.7rem 1.7rem;
}

.modal-card__option-title {
    font-size: 1.4rem;
    color: #808d9a;
}

.modal-card__info .calc-carousel__goods-info {
    margin-bottom: 2rem;
}

.modal-card__item {
    /*
    display: grid;
    grid-template-columns: 45px auto auto;
*/
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.6rem;
    font-size: 1.4rem;
}

.modal-card__color {
    display: inline-block;
    position: relative;
    /*
    padding-left: 2.7rem;
    transform: translateY(-2px);
*/
}

.modal-card__color:before {
    content: "";
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.modal-card__info .card__size {
    width: 9.6rem;
    margin-top: 2.2rem;
}

.modal-card__info .grey-link {
    text-decoration: underline;
    margin-top: 3.5rem;
    display: inline-block;
    cursor: pointer;
}

.modal-card__buy p {
    font-size: 1.4rem;
    margin-bottom: 0.5rem;
}

.modal-card__buy .tab-content {
    padding: 2.3rem 2.3rem 1.5rem;
    border-radius: 0 0 10px 10px;
    margin-bottom: 2.5rem;
}

.modal-card__buy .card__price-block .card__pricetab {
    padding: 0.5rem 0;
    min-height: 3.8rem;
}

.modal-card__buy .card__add-block {
    background: #fff;
}

.modal-card__buy .card__added {
    justify-content: center;
    gap: 1.5rem;
}

.modal-card__buy .card__number {
    margin: 0 0;
}

.modal-card__buy .card__buy.card__buy--added {
    padding: 0.62rem 2rem;
}

.modal-card__buy .card__price {
    padding-left: 0;
}

.modal--callback {
    --bs-modal-width: 36rem;
    max-width: 100%;
}

.modal--callback .like-h2 {
    margin-bottom: 2.5rem;
}

.policу {
    color: #808d9a;
    font-size: 1.1rem;
    text-align: center;
    margin: 2rem auto 0;
    max-width: 29rem;
}

.modal--callback input {
    margin-bottom: 2.1rem;
    padding: 0.83rem 1.5rem;
    margin-top: 0.5rem;
    width: 100%;
    font-weight: 400;
    font-size: 1.5rem;
    color: #000;
}

.modal--callback input::placeholder {
    font-weight: 400;
    font-size: 1.5rem;
    color: #000;
}

.modal--callback .modal-dialog .modal-content {
    padding: 1rem;
}

.modal--callback .btn {
    width: 100%;
    padding: 0.8rem 2.5rem;
    margin-top: 0.7rem;
}

.modal--callback label {
    width: 100%;
    color: #808d9a;
    font-size: 1.4rem;
}

.modal--callback label span {
    color: #f93c00;
}

.modal--video {
    --bs-modal-width: 61rem;
}

.video-block {
    position: relative;
    padding-top: 56%;
}

.video-block-in {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

/*----------PAGE CATEGORY----------*/

.category {
    margin-bottom: 2rem;
}

.category__container {
    display: grid;
    grid-template-columns: 26.9rem 1fr;
    gap: 3rem;
}

.category__side {
    order: -1;
}

.category__phone {
    display: grid;
    grid-template-columns: 1fr 4.9rem;
    background: rgba(92, 184, 148, 0.05);
    border-radius: 10px;
    padding: 0.9rem 2rem;
    align-items: center;
    margin-bottom: 2.9rem;
}

.category__phone-call {
    position: relative;
    display: inline-block;
    font-size: 1.3rem;
    padding-left: 2rem;
    padding-top: 0.2rem;
}

.category__mob-filters {
    display: flex;
    gap: 2rem;
    align-items: center;
}

.category__mob-filters-btn {
    width: 3rem;
    cursor: pointer;
    display: none;
}

.category__phone-call:before {
    content: "";
    width: 1rem;
    height: 1rem;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #5cb894;
}

.category__phone-number {
    font-size: 2rem;
    font-weight: 500;
    padding-top: 0.2rem;
}

.category__phone svg {
    width: 4.4rem;
    height: 4.4rem;
    grid-row: 1 / 3;
    grid-column: 2 / 3;
}

.category__phone--discount {
    background: rgba(249, 60, 0, 0.05);
    grid-template-columns: 1fr;
    font-size: 1.3rem;
    /*    padding-left: 0.5rem;*/
}

.category__phone--discount-b {
    font-size: 2rem;
    font-weight: 500;
    color: #f93c00;
    /*
    align-self: flex-end;
    line-height: 1;
*/
}

.category__phone--discount svg {
    width: 6rem;
    height: 6rem;
    fill: #f93c00;
    grid-row: 1 / 3;
    grid-column: 1;
}

.category__phone--discount .category__phone-call:before {
    background: #f93c00;
}

.category__nav {
    background: rgba(246, 246, 246, 0.8);
    border-radius: 10px;
    padding: 2rem;
}

.category__nav h3 {
    margin-bottom: 2rem;
}

.category__nav-base {
    list-style: none;
    padding: 0;
    margin: 0;
}

.category__nav .active {
    font-weight: 500;
    color: #f93c00;
}

.category__nav a {
    position: relative;
    display: inline-block;
    margin-bottom: 1rem;
    color: #000;
}

.category__nav-base li:last-child a {
    margin-bottom: 0;
}

.category__nav-base-link {
    padding-right: 2rem;
    position: relative;
}

.category__nav-base-link:after {
    content: "";
    position: absolute;
    top: 35%;
    right: 0;
    display: block;
    width: 1.1rem;
    height: 1.1rem;
    background: url(/images/down-arrow.svg) no-repeat;
    background-size: contain;
    background-position: center;
    transform: rotate(-90deg) translateX(50%);
}

.category__nav-sub {
    display: none;
    list-style: none;
    padding-left: 1.2rem;
    margin-bottom: 1rem;
}

.category__nav-sub a {
    color: #808d9a;
}

.category__nav a:hover,
.category__nav-sub a:hover {
    color: #f93c00;
}

.category__nav .active ~ .category__nav-sub {
    display: block;
}

.category__sort {
    font-size: 1.5rem;
    color: #808d9a;
    display: inline-block;
    width: auto;
    border-radius: 10px;
    border: 1px solid #b8c4d0;
    padding: 0.275rem 2.65rem 0.275rem 0.95rem;
}

.category__sort-filter {
    margin-top: 1.4rem;
}

.category__sort-filter-item {
    display: inline-block;
    position: relative;
    background: #808d9a;
    color: #fff;
    border-radius: 10px;
    font-size: 1.4rem;
    padding: 0.4rem 3rem 0.4rem 1.1rem;
    margin-right: 1rem;
}

.category__sort-filter-item svg {
    position: absolute;
    right: 1.1rem;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

.category__showcase {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 3rem 0.5rem;
    margin-top: 3.2rem;
}

.category__filter {
    margin-top: 3rem;
}

.category__filter .btn-close {
    display: none;
}

.category__filter-title {
    display: inline-block;
    font-size: 1.6rem;
    font-weight: 500;
    margin-bottom: 1rem;
}

.category__filter-list {
    padding: 0;
    list-style: none;
    margin-bottom: 3rem;
}

.category__filter-list li {
    margin-bottom: 0.2rem;
}

.category__filter-list label {
    cursor: pointer;
}

.category__filter-color {
    display: inline-block;
    position: relative;
    padding-left: 2.7rem;
    transform: translateY(-2px);
}

.category__filter-color i {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
}

input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    width: 1.9rem;
    height: 1.9rem;
    border: 2px solid #b8c4d0;
    transform: translateY(0.4rem);
    border-radius: 4px;
    cursor: pointer;
    padding: 2px;
    margin-right: 1rem;
}

.clear-filter {
    position: absolute;
    right: 8px;
    top: 7px;
    cursor: pointer;
}

input[type="checkbox"]::before {
    display: block;
    content: "";
    width: 1.1rem;
    height: 1.1rem;
    transition: 120ms all ease-in-out;
    transform-origin: bottom left;
    background: #f93c00;
    border-radius: 4px;
    opacity: 0;
}

input[type="checkbox"]:checked::before {
    opacity: 1;
}

.category__filter-reset {
    width: 100%;
    border: 1px solid #000;
    font-size: 1.6rem;
    font-weight: 500;
    padding: 0.8rem 2.5rem;
}

.category__filter-reset:hover,
.category__filter-reset:active {
    background: #000;
    color: #fff;
}

.category__side-adv {
    margin-top: 6rem;
}

.category__side-adv-item {
    color: #808d9a;
    font-size: 1.4rem;
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-bottom: 2.1rem;
}

.category__side-adv-item svg {
    width: 4rem;
    height: 4rem;
    flex-shrink: 0;
}

.category__side-montage {
    position: relative;
    background: url(/images/cta-bg.jpg) no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 10px;
    margin-top: 6rem;
    padding: 2rem 2rem 2.8rem;
}

.category__side-montage h2 {
    line-height: 1.15;
    margin-bottom: 2rem;
}

.category__side-montage p {
    margin-bottom: 1.8rem;
}

.category__side-montage:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.9;
    background: #fff;
    border-radius: 10px;
}

.category__side-montage * {
    position: relative;
}

.category__pagination {
    margin: 6rem auto;
}

.category__pagination .pagination {
    display: flex;
    justify-content: center;
    gap: 1rem;
}

.category__pagination .page-item .page-link {
    font-size: 1.9rem;
    font-weight: 600;
    border-radius: 10px;
    border: 1px solid #808d9a;
    color: #000;
    padding: 0.45rem 1.45rem;
}

.category__pagination .page-item .page-link:hover {
    background: #808d9a;
    border: 1px solid #808d9a;
    color: #fff;
}

.category__pagination .page-item:last-child .page-link {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.category__pagination .page-item:first-child .page-link {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.category__pagination .active > .page-link,
.category__pagination .page-link.active {
    color: #fff;
    background-color: #808d9a;
    border-color: #808d9a;
}

.category__tags a {
    display: inline-block;
    background: #f6f6f6;
    border-radius: 10px;
    padding: 0.3rem 1.2rem;
    color: #000;
    margin: 0 0.5rem 1rem 0;
}

.category__tags a:hover {
    background: #f0f7ff;
    color: #008bd8;
}

.category__content {
    margin-top: 3.2rem;
    margin-bottom: 3rem;
}

.category__guarantee-txt h2 {
    margin-bottom: 2rem;
}

.category__content p {
    margin-bottom: 2rem;
}

.category__content-adv {
    margin-top: 4rem;
}

.category__content-adv-item h3,
.category__content-montage h3 {
    position: relative;
    padding-left: 3.6rem;
    margin-bottom: 0.9rem;
}

.category__content-adv-item h3:before,
.category__content-montage h3:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.1rem;
    width: 2.6rem;
    height: 2.6rem;
    background: url(/images/best-price.svg) no-repeat;
    background-size: contain;
}

.category__content-adv-item:first-child {
    padding-left: 0.7rem;
    padding-right: 3rem;
}

.category__content-adv-item:nth-child(2) {
    padding-left: 1.3rem;
}

.category__content-adv-item:nth-child(3) {
    padding-left: 2rem;
}

.category__content-adv-item:last-child {
    padding-left: 2.6rem;
}

.category__content-adv-item p {
    color: #808d9a;
    font-size: 1.4rem;
}

.category__content-montage {
    background: #f0f7ff;
    border-radius: 10px;
    margin-top: 5rem;
    padding: 2.1rem;
}

.category__content-montage-title {
    display: flex;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1rem;
}

.category__content-montage-title a {
    font-weight: 500;
}

.category__content-montage-title h3 {
    margin-bottom: 0;
}

.category__content-montage p {
    font-size: 1.4rem;
    margin-bottom: 1.4rem;
}

.category__content-montage .leadgen {
    font-size: 1.7rem;
    font-weight: 500;
    margin-bottom: 0;
}

.category__guarantee {
    margin-top: 6.5rem;
    display: grid;
    grid-template-columns: 15fr 14fr;
}

.category__guarantee-txt h2 {
    margin-bottom: 2.5rem;
}

.category__guarantee-block {
    display: grid;
    grid-template-columns: 21rem 1fr;
    gap: 2.7rem 3.8rem;
}

.category__guarantee-img {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    grid-row: 1 / 3;
}

.category__guarantee-img img {
    width: 13.4rem;
}

.category__guarantee-svg {
    position: absolute;
    background: #fff;
    border-radius: 50%;
    border: 3px solid #f93c00;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 10rem;
    height: 10rem;
    top: -1rem;
    left: 0;
}

.category__guarantee-svg svg {
    width: 7.8rem;
    height: 7.8rem;
}

.category__guarantee-line {
    width: 100%;
    height: 0.5rem;
    background-color: #808d9a;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.9);
    position: absolute;
    bottom: 0;
}

.category__content p:last-child {
    margin-bottom: 0;
}

.category__guarantee-block .hero__smallbanner {
    grid-template-columns: 9fr 4fr;
    padding: 2.1rem;
}

.category__adv {
    margin: 6.4rem 0 3.6rem;
}

.category__adv h2 {
    margin-bottom: 2.9rem;
}

.category__adv-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 3.1rem 4rem;
}

.category__adv-item {
    display: grid;
    grid-template-columns: 7rem 1fr;
    align-items: flex-start;
    background: linear-gradient(0.072turn,
            rgba(26, 83, 10, 0.075) 0%,
            rgba(216, 154, 0, 0.125) 100%);
    border-radius: 10px;
    padding: 1.2rem 2rem 1.2rem 0.6rem;
    gap: 0.5rem;
}

.category__adv-item svg {
    height: 7rem;
    margin-top: -1rem;
}

.category__adv-txt h3 {
    margin-bottom: 1rem;
}

.category__adv-txt p {
    font-size: 1.4rem;
    margin-bottom: 0;
}

/*----------PAGE CARD----------*/

.desc__txt.desc__card {
    display: flex;
    gap: 3.1rem;
    margin-top: -2.6rem;
    align-items: center;
}

.desc__card .desc__rating {
    display: grid;
    grid-template-columns: 6.7rem 1fr;
    gap: 1rem;
    align-items: center;
}

.desc__card .card__rating {
    font-size: 2rem;
    font-weight: 600;
    color: #000;
    margin-top: -0.2rem;
}

.desc__card .card__rating svg {
    width: 2rem;
    height: 2rem;
}

.desc__card .desc__rating span {
    font-weight: 500;
}

.desc__fav {
    display: flex;
    gap: 1rem;
    cursor: pointer;
}

.desc__fav svg {
    width: 2rem;
    height: 2rem;
    fill: #008bd8;
}

.desc__fav:hover svg {
    fill: #f93c00;
}

.desc__fav span {
    font-weight: 500;
    color: #008bd8;
    transition: all 0.3s;
}

.desc__fav:hover span {
    color: #f93c00;
}

.desc__card-adv {
    margin-top: -0.4rem;
}

.desc__card-adv .desc__adv-item {
    margin-bottom: 0.7rem;
}

.desc-card h1 {
    margin-bottom: 3.6rem;
    margin-top: 0;
}

.card-in {
    margin-top: -1rem;
    margin-bottom: 4.7rem;
}

.card-in__img .nav-pills .nav-link.active,
.card-in__img .nav-pills .show > .nav-link {
    background-color: transparent;
    border-color: #f93d00;
}

.card-in__img .nav-pills .nav-link {
    width: 7rem;
    height: 7rem;
    border: 2px solid #b8c4d0;
    border-radius: 10px;
    margin-bottom: 2rem;
    flex-shrink: 0;
}

.card-in__img .nav-pills .nav-link:hover {
    border-color: #f93d00;
}

.card-in__img .tab-content > .tab-pane {
    position: relative;
    width: 35rem;
    height: 43rem;
}

.card-in__img .tab-content > .tab-pane img {
    position: absolute;
    min-height: 100%;
    max-width: 100%;
    object-fit: cover;
    padding: 1rem;
}

.card-in__img .nav-pills .nav-link svg {
    width: 6rem;
    height: 6rem;
}

.card-in__img #v-pills-tab-img {
    overflow-y: scroll;
    overscroll-behavior: contain;
    height: 42rem;
    flex-wrap: nowrap;
    overflow-x: hidden;
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */

}

#v-pills-tab-img::-webkit-scrollbar {
    display: none;
}

.card-in__img #v-pills-tab-img::-webkit-scrollbar {
    display: none;
}

.icon-container {
    width: 26px;
    height: 26px;
    position: relative;
}

.icon-container svg {
    width: 26px;
    height: inherit;
    position: absolute;
    top: 0;
    left: 0;
}

.card-in .card {
    display: grid;
    grid-template-columns: 43rem 1fr 1fr;
    padding-right: 0;
    margin-bottom: 7.7rem;
}

.card-in .card__marks-container {
    left: 10rem;
    top: 0;
}

.card-in__info {
    padding: 1.3rem 1.1rem;
}

.card-in-spec {
    display: inline-block;
    margin-bottom: 0.3rem;
}

.card-in .card__color {
    margin-bottom: 2.7rem;
}

.card-in .card__length {
    margin-bottom: 3.6rem;
}

.card-in-spec strong {
    display: inline-block;
    margin-bottom: 0.8rem;
    font-size: 1.7rem;
}

.card-in__parameters ul {
    padding: 0;
    list-style: none;
    margin: 0 0 2rem;
}

.parameter-list li {
    display: grid;
    grid-template-columns: 18rem 1fr;
    margin-bottom: 0.8rem;
    gap: 0.5rem;
}

.card-in__parameters-title {
    color: #808d9a;
    display: flex;
    overflow: hidden;
    gap: 0.5rem;
}

.card-in__parameters-value {
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.card-in__parameters-value img {
    width: 1.9rem;
    height: 1.9rem;
}

.card-in__parameters {
    margin-bottom: 2.5rem;
}

.card-in .card__purpose {
    font-size: 1.5rem;
}

.card-in__buy {
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    margin-top: 2.2rem;
}

.card-in .card__price-block ul {
    border-radius: 10px 10px 0 0;
    background: #eeeeef;
    overflow: hidden;
}

.card-in .card__price-block .tab-content {
    background: #fff;
}

.card-in .card__price-block .nav-link {
    font-size: 1.5rem;
    color: #808d9a;
    background: #eeeeef;
    border-radius: 0;
    padding: 1.7rem 0.5rem;
}

.card-in .card__price-block .nav-link.active {
    font-size: 1.7rem;
    color: #000;
    background: #fff;
    border-radius: 10px 10px 0 0;
}

.card-in .card__price-block .card__pricetab {
    flex-wrap: wrap;
    padding: 0.9rem 2.5rem;
    gap: 0.8rem 1.1rem;
}

.card-in .card__discount-percent {
    width: 100%;
    font-size: 1.3rem;
}

.card-in .card__added {
    padding: 1.3rem 2.5rem;
    display: grid;
    grid-template-columns: 19rem 1fr 1fr 1fr;
}

.card-buy__wrap {
    margin-top: 0.6rem;
    padding: 0 2.9rem;
}

.btn--click {
    background: #f0f7ff;
    width: 100%;
    font-size: 1.5rem;
}

.btn--click:hover {
    background: #b8c4d0;
}

.card-in__buy .dark-link.scroll-to {
    border-bottom: 1px dashed #808d9a;
}

.card-in__buy .dark-link.scroll-to {
    border-bottom: 1px dashed #808d9a;
    margin-bottom: 1.7rem;
    display: inline-block;
}

.card-in .card__unit {
    max-width: 9rem;
}



.card-in__delivery {
    font-size: 1.4rem;
    color: #808d9a;
    margin-bottom: 2.3rem;
}

.card-in__delivery p {
    margin-bottom: 0.5rem;
}

.card-in .card__price-block {
    margin-bottom: 2.1rem;
}

.card-in .category__phone {
    display: grid;
    grid-template-columns: 16.7rem 5.4rem 2rem 2rem;
    justify-content: space-around;
    padding: 0.9rem 2rem 0.9rem 1.6rem;
    margin-bottom: 0;
}

.card-in .category__phone-number {
    width: 100%;
    display: inline-block;
}

.card-in .category__phone svg {
    fill: #008bd8;
}

.card-in .category__phone a svg:hover {
    transform: scale(1.2);
}

.card-in__about {
    display: grid;
    grid-template-columns: 9fr 8fr 7fr;
    gap: 2rem;
}

.card-in__about h2 {
    margin-bottom: 2.1rem;
}

.card-in__about-txt p {
    max-width: 40rem;
}

.card-in__texture-item img {
    width: 4.7rem;
    opacity: 0.2;
}

.card-in__texture {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    margin-top: 1.5rem;
}

.card-in__texture-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: 1.4rem;
    color: #808d9a;
    line-height: 1.15;
}

.card-in__parameters--all li {
    display: grid;
    grid-template-columns: 22rem 1fr;
    margin-bottom: 0.7rem;
    gap: 0.5rem;
}

.card-in__parameters--all {
    padding-top: 0.4rem;
}

.card-in__adv-list {
    list-style: none;
    margin: 0;
    padding: 1rem 0 0;
}

.card-in__adv-list li {
    display: grid;
    grid-template-columns: 2.7rem 1fr;
    align-items: flex-start;
    gap: 1.6rem;
    margin-bottom: 1.2rem;
}

.card-in__adv-list svg {
    width: 2.7rem;
    height: 2.7rem;
    fill: #5cb894;
    margin: 0 auto;
}

.calculator ~ .category__adv {
    margin-top: 3rem;
}

/*----------SECTION CTA----------*/

.cta__container {
    display: grid;
    grid-template-columns: 1fr 27rem 24rem;
    border: 2px dashed #b8c4d0;
    border-radius: 10px;
    padding: 2.6rem 2.8rem 2rem;
    gap: 2rem;
}

.cta__txt h2 {
    position: relative;
    padding-left: 4.4rem;
    margin: -1.6rem 0 1.8rem;
    font-size: 2.3rem;
}

.cta__txt h2:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 2.6rem;
    height: 2.6rem;
    background: url(/images/best-price.svg) no-repeat;
    background-size: contain;
}

.cta__img {
    position: relative;
}

.cta__img img {
    max-width: 21rem;
    position: absolute;
    top: -6.3rem;
    left: 4.2rem;
}

.leadgen {
    font-size: 1.7rem;
    font-weight: 500;
}

.cta__txt p {
    margin-bottom: 1.7rem;
}

.cta__txt p:last-child {
    margin-bottom: 0;
}

.cta__call .leadgen {
    position: relative;
    padding-left: 2rem;
    margin-bottom: 0.5rem;
}

.cta__call .leadgen:before {
    content: "";
    width: 1rem;
    height: 1rem;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #5cb894;
}

.cta__phone {
    display: inline-flex;
    align-items: center;
    position: relative;
    border-radius: 10px;
    border: 3px solid #5cb894;
    padding: 0.5rem 1.5rem;
    gap: 1.4rem;
    font-size: 1.7rem;
    color: #000;
    font-weight: 500;
}

.cta__phone svg {
    width: 2.2rem;
    height: 2.2rem;
}

.cta__phone:after {
    content: "";
    width: 3.2rem;
    height: 3.2rem;
    position: absolute;
    background: url(/images/cursor.svg) no-repeat;
    background-size: contain;
    background-position: center;
    bottom: 0.7rem;
    right: 0.6rem;
    transform: translateY(100%);
    transition: all 0.3s;
}

.cta__phone:hover {
    color: #000;
    background: rgba(92, 184, 149, 0.2);
}

.cta__phone:hover:after {
    transform: translateY(80%);
}

.cta__contact {
    display: block;
    margin-top: 2rem;
}

.cta {
    margin-bottom: 4rem;
}

/*----------SECTION ACCESSORIES----------*/

.accessories {
    background: #f6f6f6;
    margin-top: 2rem;
    padding: 3.2rem 0 4.2rem;
}

.accessories h2 {
    margin-bottom: 2rem;
}

.accessories .card {
    background: #fff;
    border: 1px solid #eeeeef;
    border-radius: 10px;
    padding-right: 0;
}

.accessories__item {
    display: grid;
    grid-template-columns: 8.2rem 1fr;
    gap: 0 0.7rem;
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 1.7rem 1.9rem;
    width: 100%;
}

.accessories__img {
    grid-row: 1 / 3;
}

.accessories__item .card__add-block {
    grid-column: 1 / 3;
    background: transparent;
    padding: 0;
    margin-top: 0.8rem;
}

.accessories__item .card__price {
    font-size: 1.8rem;
    background: #f7fbf9;
    border-radius: 10px;
}

.accessories__item .card__pricetab {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.accessories__item .card__unit {
    line-height: 1.2;
}

.accessories__item .card__buy.card__buy--added {
    flex-shrink: 0;
    padding: 0.3rem 1.5rem;
}

.accessories__item .calculator__count {
    width: 3.5rem;
    height: 3.5rem;
    font-size: 2rem;
}

.accessories__item .card__buy {
    padding: 0.3rem 1.5rem;
}

.accessories-carousel-cell {
    width: 28rem;
    padding-right: 2rem;
}

.flickity-button {
    width: 4.1rem;
    height: 4.1rem;
    background: #fff;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.3);
    border-radius: 50%;
}

.flickity-button svg {
    fill: #828ea5;
}

.flickity-button:hover svg {
    fill: #5cb894;
}

.flickity-prev-next-button .flickity-button-icon {
    left: 50%;
    transform: translate(-50%, -50%);
    top: 50%;
    width: 50%;
    height: 50%;
}

.accessories .flickity-prev-next-button.previous {
    left: -2.2rem;
}

.accessories .flickity-prev-next-button.next {
    right: -2.2rem;
}

/*----------SECTION CARD MORE----------*/

.card-more {
    padding: 3.3rem 0;
}

.card-more__container {
    display: grid;
    grid-template-columns: 1fr 36rem;
    gap: 3rem;
    align-items: flex-start;
}

.category__content h2,
.category__content .like-h2,
.card-more h2,
.gallery-in-hero h2 {
    margin-bottom: 2rem;
    margin-top: 3rem;
}

.card-more__desc p {
    margin-bottom: 2.2rem;
}

.card-more .calc-carousel__goods {
    grid-template-columns: 6.4rem 1fr 9rem;
    padding: 2rem 1rem 2rem 0.5rem;
    margin-bottom: 2rem;
}

.card-more__buy-discount {
    color: #fff;
    background: #ff0000;
    border-radius: 10px;
    font-size: 1.3rem;
    font-weight: 500;
    text-align: center;
    padding: 0.3rem;
}

.card-more__delivery-item span:first-child {
    color: #808d9a;
}

.card-more__delivery-item {
    padding: 0 2rem;
    display: grid;
    grid-template-columns: 16.2rem 1fr;
    gap: 2rem;
    margin-bottom: 0.6rem;
}

.card-more__delivery {
    margin-bottom: 1.9rem;
}

.card-more .card__pricetab {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 0 2rem;
}

.card-more .card__unit {
    max-width: 9rem;
}

.card-more__buy {
    background: #fcfcfc;
    border-radius: 10px;
}

.card-more .card__added {
    padding: 1.8rem 2rem;
}

.card-more .card__buy.card__buy--added {
    min-width: 56%;
    font-size: 1.7rem;
}

.card-more__adv {
    display: flex;
    gap: 3rem;
    align-items: flex-start;
    margin-top: 4rem;
}

.card-more__item {
    width: 10rem;
    border-radius: 10px;
    background: #f6f6f6;
    text-align: center;
}

.card-more__item svg {
    width: 8rem;
    height: 8rem;
    fill: #a0a0a0;
}

.card-more__item:nth-child(4) svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 9rem;
    height: 9rem;
    max-height: none;
}

.card-more__item:last-child svg {
    width: 6.5rem;
}

.card-more__txt {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
    padding: 1rem;
    font-size: 1.2rem;
}

.card-more__adv-img {
    position: relative;
    width: 100%;
    height: 8rem;
    overflow: hidden;
    text-align: center;
}

.card-more__txt strong {
    display: inline-block;
    width: 100%;
}

/*----------PAGE GALLERY----------*/

.gallery {
    padding-top: 1rem;
}

.gallery__container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 4rem;
}

.gallery__container .portfolio__item {
    margin-right: 0;
}

.portfolio__img:hover ~ a {
    color: #f93c00;
}

/*----------PAGE BLOG----------*/

.blog {
    padding-top: 1rem;
}

.blog__container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 4rem;
}

.blog__container .portfolio__item {
    background: #f6f6f6;
    padding: 2rem;
    border-radius: 10px;
    margin: 0;
}

.blog__container .portfolio__img {
    width: calc(100% + 4rem);
    margin: -2rem -2rem 2rem -2rem;
}

.blog__img-info {
    position: absolute;
    bottom: 1rem;
    right: 1.2rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.blog__img-info div {
    font-size: 1.2rem;
    background: #fff;
    border-radius: 10px;
    padding: 0.5rem 0.8rem;
    color: #000;
}

.blog__img-info svg {
    width: 1.7rem;
    height: 1.7rem;
}

.blog__img-info .blog__img-view {
    color: #808d9a;
    padding: 0.5rem 1.1rem;
}

.blog__img-time {
    font-weight: 500;
}

.blog__link {
    display: grid;
    grid-template-columns: 1fr 4.2rem;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 0.7rem;
}

.blog__link span {
    display: inline-block;
    font-size: 1.9rem;
    border: 1px solid #808d9a;
    border-radius: 10px;
    text-align: center;
    padding: 0.2rem 0.5rem 0.3rem;
    margin-top: 1rem;
    transition: all 0.2s;
}

.blog__link:hover span,
.portfolio__img:hover ~ .blog__link span {
    border-color: #f93c00;
    background: #f93c00;
    color: #fff;
}

.blog__preview {
    -webkit-line-clamp: 5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/*----------PAGE GALLERY / BLOG INNER----------*/

.gallery-in-hero h1 {
    margin-bottom: 1.5rem;
}

.gallery-in-hero .hashtags {
    margin-bottom: 4rem;
}

.desc-in {
    display: grid;
    grid-template-columns: 39rem 1fr;
    gap: 3rem;
}

.desc-in__txt h2 {
    margin: 1rem 0 2rem;
}

.desc-in__links {
    list-style: none;
    padding: 0;
}

.desc-in__links li {
    margin-bottom: 0.4rem;
}

.desc-in__links a {
    text-decoration: underline;
}

.project-goods__container {
    display: grid;
    grid-template-columns: repeat(4, auto);
    gap: 1.5rem;
}

.project-goods__container .card {
    padding-right: 0;
}

.project-goods {
    margin-bottom: 8rem;
}

.desc-in-carousel .carousel-cell {
    width: 90%;
    margin-right: 10px;
    transform: translateX(calc(5% + 5px));
}

.desc-in__item a {
    display: block;
    position: relative;
    height: 35.8rem;
    border-radius: 10px;
    overflow: hidden;
}

.desc-in__item img {
    position: absolute;
    min-height: 100%;
    max-width: 100%;
    object-fit: cover;
}

.desc-in .flickity-viewport {
    border-radius: 10px;
}

.desc-in .carousel-cell {
    z-index: 1;
}

.desc-in .carousel-cell.is-selected {
    z-index: 2;
}

.desc-in .carousel-cell.is-selected:before,
.desc-in .carousel-cell.is-selected:after {
    content: "";
    width: 6%;
    position: absolute;
    left: 0;
    transform: translateX(-100%);
    background: #fff;
    height: 100%;
    z-index: 4;
    border-radius: 10px;
    opacity: 0.85;
}

.desc-in .carousel-cell.is-selected:after {
    left: auto;
    top: 0;
    right: 0;
    transform: translateX(100%);
}

.desc-in .flickity-prev-next-button.next {
    right: -2.1rem;
}

.desc-in .flickity-prev-next-button.previous {
    left: -2.1rem;
}

.lightbox {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 10000;
    text-align: center;
    line-height: 0;
    font-weight: normal;
    outline: none;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: column-reverse;
    height: 90vh;
    overflow: hidden;
    top: 0;
}

.lb-nav a.lb-prev,
.lb-nav a.lb-next {
    opacity: 1;
}

.hashtags {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.hashtags .blog__img-view {
    color: #808d9a;
    margin-left: 4rem;
}

.hashtags .blog__img-view svg {
    width: 2.1rem;
    height: 2.1rem;
}

.hashtags .blog__img-time {
    font-weight: 400;
    margin-left: 2rem;
}

.article {
    margin: 6.3rem 0 5rem;
}

.article h2 {
    margin: 4.3rem 0 2rem;
}

.desc-in__preview {
    -webkit-line-clamp: 5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.desc-in__preview--article {
    margin-bottom: 2rem;
}

/*----------PAGE CART----------*/

.cart-header .header__logo {
    width: 16.3rem;
    margin-right: auto;
}

.cart-header .header__email {
    margin: auto 3.2rem auto auto;
}

.cart-header .messenger {
    margin: auto 3.3rem auto 0;
}

.cart-header .category__phone {
    margin-bottom: 0;
}

.cart-header .header__info {
    padding: 2.9rem 0 0;
}

.cart-header .category__phone {
    gap: 0 1.2rem;
}

header.header.cart-header {
    margin-bottom: 2.7rem;
}

.cart__container {
    display: grid;
    grid-template-columns: 28fr 10fr;
    gap: 2rem;
    margin-bottom: 1.4rem;
    align-items: flex-start;
}

.cart__goods .modal-card__container {
    position: relative;
    margin-right: 3.6rem;
    border-bottom: 1px solid #eeeeef;
    padding-bottom: 0.8rem;
    padding-top: 2.7rem;
}

.cart__goods .modal-card__container:last-child {
    border-bottom: none;
}

.cart__goods .modal-card__container:first-child {
    padding-top: 0;
}

.cart__delete {
    position: absolute;
    width: 1.6rem;
    height: 1.6rem;
    right: -3.8rem;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

.cart__delete svg {
    fill: #cfd4d9;
}

.cart__delete svg:hover {
    fill: #f93c00;
}

.cart__goods .card__price-block ul {
    grid-template-columns: 14rem 14rem;
}

.cart__goods .modal-card__buy .card__added {
    margin-left: auto;
    width: 12.4rem;
    gap: 0.3rem;
}

.cart__goods .modal-card__buy .tab-content {
    padding: 2.1rem 1.4rem 0.9rem 2.6rem;
    margin-bottom: 0;
}

.cart__good-result {
    display: grid;
    grid-template-columns: 1fr 7.9rem;
    padding-right: 1.5rem;
    grid-column: 1 / 4;
    text-align: right;
    font-size: 1.4rem;
    font-weight: 500;
    margin-top: -0.1rem;
}

.cart__goods .modal-card__container {
    grid-template-columns: 17.2rem 22.1rem 1fr;
}

.card__unit--ed {
    max-width: 100%;
}

.card__unit--ed .card__price {
    display: inline;
    color: #808d9a;
    font-size: 1.2rem;
    padding-right: 0;
}

.card__unit--ed .card-spec {
    font-size: 1.2rem;
}

.card__unit--ed .cart__good-result {
    font-size: 1.7rem;
    color: #000;
    margin-top: 0.5rem;
}

.cart__delivery-container {
    display: grid;
    grid-template-columns: 30rem 30rem 1fr;
    gap: 4rem;
}

.cart__delivery h2 {
    margin-bottom: 3rem;
}

.cart__delivery-way {
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    border: 2px solid #fff;
    padding: 1.8rem;
    transition: all 0.3s;
}

.cart__delivery-container label {
    position: relative;
    cursor: pointer;
}

.cart__delivery-container input {
    position: absolute;
    display: none;
}

.cart__delivery-container input:checked + .cart__delivery-way {
    border-color: #5cb894;
    box-shadow: 0px 0px 20px 0px rgba(92, 184, 148, 0.1);
}

.cart__delivery-title {
    font-size: 1.7rem;
    font-weight: 500;
}

.cart__delivery-time {
    font-size: 1.4rem;
}

.cart__delivery-price {
    color: #808d9a;
}

.cart__delivery-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.cart__delivery-flex:last-child {
    margin-bottom: 0;
}

.cart__delivery-mark {
    position: relative;
    width: 1.9rem;
    height: 1.9rem;
    border: 2px solid #b8c4d0;
    border-radius: 50%;
}

.cart__delivery-container input:checked + .cart__delivery-way .cart__delivery-mark:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 50%;
    background: #5cb894;
}

.cart__pay {
    border-radius: 10px;
    padding: 2.2rem 2rem;
    background: linear-gradient(0.602turn,
            rgba(255, 243, 243, 0.5) 0%,
            rgba(240, 247, 255, 0.5) 100%);
}

.cart__pay-title {
    margin-bottom: 0.8rem;
}

.cart__pay-txt {
    color: #808d9a;
    font-size: 1.4rem;
    margin-bottom: 0;
}

.cart__delivery {
    margin-bottom: 3.6rem;
}

.cart__form-container label {
    color: #808d9a;
    font-size: 1.4rem;
}

.cart__form-container span {
    color: #f93c00;
}

.cart__form-container input {
    background: #fcfcfc;
    border: 1px solid #b8c4d0;
    border-radius: 10px;
    padding: 0.7rem 1.2rem;
}

.cart__form h2 {
    margin-bottom: 2.9rem;
}

.cart__form-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    max-width: 98rem;
    gap: 3rem 4rem;
}

.cart__form-container div {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

/* .cart__form-container div:nth-child(3) {
    opacity: 0;
} */

.cart__form-container input {
    width: 100%;
    color: #000;
}

.cart__form-container input::placeholder {
    color: #808d9a;
}

.cart__form-container input[name="phone"]::placeholder {
    font-weight: 500;
}

.cart__form-container input:required::placeholder {
    color: #000;
}

.cart__form-container .policy {
    color: #808d9a;
    font-size: 1.1rem;
    margin: 1.4rem 0 0;
}

.cart__form-container .btn {
    font-size: 1.7rem;
}

.cart__buy {
    display: grid;
    grid-template-columns: 1fr 1fr;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    padding: 2rem;
    gap: 1rem;
    align-items: center;
}

.cart__buy .btn {
    grid-column: 1 / 3;
    font-size: 1.7rem;
    width: 100%;
    margin-top: 0.5rem;
}

.cart__buy span:nth-child(2n) {
    text-align: right;
}

.cart__weight {
    color: #808d9a;
    font-size: 1.4rem;
    display: inline-block;
    margin-left: 1rem;
}

.cart__discount {
    color: #f93c00;
}

.cart__result {
    display: inline-block;
    font-size: 1.7rem;
    font-weight: 500;
    margin-top: 2rem;
}

.cart__result--price {
    font-size: 2rem;
}

.cart__form-container #add_order:disabled {
    background: #b8c4d0;
    border-color: transparent;
    color: #212529;
    color: #fff;
    opacity: 1;
}

.cart__form-container .policy__label .policy__checkbox {
    width: auto;
    padding: 3px;
}

.cart__form-container .policy__label .policy__checkbox[type="checkbox"]::before {
    border-radius: 50%;
    background: #5cb894;
}

.policy__label {
    display: flex;
    align-items: flex-start;
    margin: 0.5rem 0 0;
    cursor: pointer;
}

.policy__label .policy {
    margin: 0.5rem 0 0;
    font-size: 1.2rem;
}

/*----------PAGE SERVICE----------*/

.service-hero {
    position: relative;
    margin-top: -1rem;
    padding: 2rem 0 6rem;
    background: url(/images/cta-bg.jpg) no-repeat;
    background-position: bottom;
    background-size: cover;
    color: #fff;
}

.service-hero:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.6;
    z-index: 0;
}

.service-hero * {
    position: relative;
}

.service-hero .breadcrumbs {
    margin-bottom: 5rem;
}

.service-hero .breadcrumbs a {
    color: #fff;
}

.service-hero .breadcrumbs a:hover {
    color: #f93c00;
}

.service-hero h1 {
    font-size: 4.6rem;
    text-align: center;
}

.service-hero p {
    font-size: 1.9rem;
    text-align: center;
    max-width: 80rem;
    margin: 0 auto 4rem;
}

.service-hero__btn {
    display: flex;
    justify-content: center;
    gap: 4rem;
    align-items: center;
}

.btn--transparent {
    color: #fff;
    font-weight: 500;
    font-size: 1.6rem;
    border: 3px solid rgba(255, 255, 255, 0.35);
}

.btn--transparent:hover {
    color: #000;
    background: #fff;
    border: 3px solid #fff;
}

.service-adv {
    background: #f6f6f6;
    margin: 4.6rem 0;
    padding: 4rem 0 5rem;
}

.service-adv__item {
    text-align: center;
}

.service-adv__item svg {
    width: 4.6rem;
    height: 4.6rem;
    margin-bottom: 2rem;
}

.service-adv__item:first-child svg {
    padding: 0.4rem;
}

.service-adv__txt {
    color: #808d9a;
    font-size: 1.4rem;
    max-width: 23rem;
    margin: 0 auto;
}

.service-adv__title {
    margin-bottom: 0.8rem;
}

.service-price {
    margin-bottom: 3.5rem;
}

.service-price h2 {
    margin-bottom: 2.3rem;
}

.service-price__att {
    position: relative;
    display: inline-block;
    background: rgba(92, 184, 148, 0.1);
    padding: 0.8rem 1.5rem 0.7rem 4.3rem;
    border-radius: 10px;
    margin-bottom: 3rem;
}

.service-price__att:before {
    content: "";
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    width: 2.6rem;
    height: 2.6rem;
    background: url(/images/best-price.svg) no-repeat;
    background-size: contain;
}

.service-objects {
    margin: 3.1rem 0 7.9rem;
}

.service-objects h2 {
    margin-bottom: 2rem;
}

.service-objects__desc {
    display: grid;
    grid-template-columns: 10fr 9fr;
    gap: 2rem;
    margin-bottom: 3.2rem;
}

.service-objects__recomend {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.4rem;
}

.service-objects__recomend img:last-child {
    margin-top: -1.2rem;
}

.service-objects__container {
    display: grid;
    grid-template-columns: 1fr 49.4rem;
    gap: 2rem;
    border: 1px solid #b8c4d0;
    background: #fafafa;
    border-radius: 10px;
    padding: 2rem;
    margin-bottom: 3rem;
}

.service-objects__types {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 3.6rem 1.2rem;
    text-align: center;
    padding-top: 0.7rem;
}

.service-objects__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    max-width: 12rem;
    font-size: 1.4rem;
    color: #808d9a;
}

.service-objects__item svg {
    width: 3.7rem;
    height: 3.5rem;
}

.service-objects__video {
    position: relative;
    border: 3px solid #808d9a;
    border-radius: 10px;
    overflow: hidden;
}

.service-objects__video iframe {
    position: absolute;
    width: 100%;
    height: 100%;
}

.service-objects__doc {
    display: grid;
    grid-template-columns: 5.8rem 1fr;
    gap: 0 1rem;
}

.service-objects__doc svg {
    width: 5.8rem;
    height: 5.8rem;
    fill: #808d9a;
    grid-row: 1 / 3;
}

.service-objects__doc h3 {
    margin: 0.7rem 0 0;
}

.service-objects__doc a {
    display: inline-block;
    font-size: 1.4rem;
    max-width: 20rem;
    text-decoration: underline;
}

.service-last {
    margin-bottom: 4rem;
}

.service-last h2 {
    margin-bottom: 2.7rem;
}

.service-last__item-bg {
    border-radius: 10px;
    background: #f6f6f6;
    padding-bottom: 2rem;
}

.service-last__img {
    position: relative;
    display: block;
    border-radius: 10px;
    overflow: hidden;
    height: 16.9rem;
    margin-bottom: 1.9rem;
}

.service-last__img:hover ~ .dark-link {
    color: #f93c00;
}

.service-last__img img {
    position: absolute;
    min-height: 100%;
    max-width: 100%;
    object-fit: cover;
}

.service-last__container .flickity-prev-next-button.previous {
    left: -2.2rem;
    top: 50%;
}

.service-last__container .flickity-prev-next-button.next {
    right: -2.2rem;
    top: 50%;
}

.service-last__item-title,
.service-last__desct {
    padding: 0 2rem;
}

.service-tech {
    background: #f6f6f6;
    padding: 4rem 0 4.9rem;
    margin-bottom: 4rem;
}

.service-tech h2 {
    margin-bottom: 2rem;
}

.service-tech p {
    max-width: 90rem;
    margin-bottom: 3.2rem;
}

.service-tech__item h3 {
    position: relative;
    padding-left: 3.5rem;
    max-width: 20rem;
}

.service-tech__item h3:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 2.6rem;
    height: 2.6rem;
    background: url(/images/best-price.svg) no-repeat;
    background-size: contain;
}

.service-tech__item .ul {
    padding: 0 0.7rem;
}

.service-info h2 {
    margin-bottom: 2rem;
}

.service-info__container p {
    margin-bottom: 3rem;
}

.service-info__guarantee {
    border-radius: 10px;
    background: linear-gradient(0.602turn,
            rgba(255, 243, 243, 1) 0%,
            rgba(240, 247, 255, 1) 100%);
    padding: 2rem 3rem 3rem;
    margin-left: 3rem;
}

.service-info__guarantee .ul {
    font-size: 1.7rem;
    color: #000;
    font-weight: 500;
}

.service-info__guarantee .ul li:before {
    top: 1.3rem;
}

.service-materials {
    background: #fafafa;
    margin-top: 1rem;
    padding: 3.6rem 0;
    margin-bottom: 2.4rem;
}

.service-materials h2 {
    margin-bottom: 2rem;
}

.service-materials p {
    margin-bottom: 4rem;
    max-width: 105rem;
}

.service-materials__container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    align-items: flex-start;
}

.service-materials__item {
    background: #f6f6f6;
    border-radius: 10px;
}

.service-materials__item:hover {
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
    color: #000;
}

.service-materials__img {
    position: relative;
    height: 12.2rem;
    border-radius: 10px;
    overflow: hidden;
}

.service-materials__img img {
    position: absolute;
    min-height: 100%;
    max-width: 100%;
    object-fit: cover;
}

.service-materials__item h3 {
    margin: 1.5rem 2rem 2rem;
    text-align: center;
}

.service-decking {
    margin: 3.3rem 0 4.2rem;
}

.service-decking__container {
    display: grid;
    grid-template-columns: 46.1rem 1fr 30.1rem;
    gap: 4rem;
    align-items: flex-start;
}

.service-decking__container .calculation__callback {
    margin: 0;
}

.service-decking h2 {
    margin-bottom: 2.6rem;
}

.service-decking__compound {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    border: 2px dashed #808d9a;
    border-radius: 10px;
    padding: 1.3rem 2.4rem 1.7rem;
}

.service-decking__compound-img {
    grid-row: 1 / 5;
    padding-right: 2rem;
}

.service-decking__compound-item {
    display: grid;
    grid-template-columns: 7rem 1fr;
    justify-items: flex-start;
    align-items: center;
    gap: 0.3rem 2rem;
}

.service-decking__compound-item img {
    border-radius: 50%;
    grid-row: 1 / 3;
}

.service-decking__compound-item p {
    align-self: flex-end;
    margin-bottom: 0;
    font-size: 1.4rem;
    color: #808d9a;
}

.service-decking__compound-item span {
    align-self: flex-start;
    display: inline-block;
    padding: 0.5rem 1.1rem 0.4rem 1.2rem;
    line-height: 1;
    font-weight: 700;
    background: #5cb894;
    border-radius: 10px;
    color: #fff;
}

.service-decking-desc p {
    margin-bottom: 2rem;
}

.service-decking-desc p:nth-child(2) {
    margin-bottom: 3rem;
}

.service-decking__articles svg {
    width: 4.1rem;
    height: 4.1rem;
    fill: #5cb894;
}

.service-decking__articles {
    display: flex;
    align-items: flex-start;
    gap: 2rem;
    background: #f0f7ff;
    border-radius: 10px;
    padding: 1.8rem 2rem;
}

.service-decking__articles ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.service-decking__articles li {
    margin-bottom: 0.4rem;
}

.service-decking__articles a {
    text-decoration: underline;
    font-size: 1.4rem;
}

.service-steps {
    background: #f6f6f6;
    padding: 3rem 0 4rem;
    margin-bottom: 3.1rem;
}

.service-steps h2 {
    margin-bottom: 2rem;
}

.service-steps p {
    max-width: 85rem;
}

.service-steps__container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 3rem 4.4rem;
    margin-top: 3.9rem;
    align-items: flex-start;
}

.service-steps__item {
    display: grid;
    grid-template-columns: 4.7rem 1fr;
    gap: 0 5rem;
    align-items: flex-start;
}

.service-steps__item svg {
    grid-row: 1 / 3;
    width: 4.7rem;
    height: 4.7rem;
    fill: #5cb894;
}

.service-steps__item p {
    color: #808d9a;
    font-size: 1.4rem;
    line-height: 1.65;
    margin-bottom: 0;
}

.service-more {
    margin-bottom: 3rem;
}

.service-more h2 {
    margin-bottom: 3rem;
}

.service-tooltips__container {
    display: grid;
    grid-template-columns: repeat(5, 16rem) 1fr;
    gap: 2rem;
}

.service-tooltip {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    background: #f0f7ff;
    border-radius: 10px;
    padding: 1rem;
    font-weight: 500;
    text-align: center;
    border: 3px solid transparent;
    transition: all 0.3s;
}

.service-tooltip:hover {
    border-color: #008bd8;
}

.custom-tooltip {
    --bs-tooltip-bg: #fff;
    --bs-tooltip-color: #808d9a;
    --bs-tooltip-opacity: 1;
    --bs-tooltip-padding-x: 2rem;
    --bs-tooltip-padding-y: 1.2rem;
    --bs-tooltip-border-radius: 10px;
    border-radius: 10px;
    transform: translate(2rem, 50%);
    font-size: 1.4rem;
    margin-bottom: -2rem !important;
    line-height: 1.55 !important;
}

.tooltip-inner {
    width: 100%;
    max-width: 28.5rem;
    text-align: left;
    margin-left: 50% !important;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
}

.tooltip-arrow {
    display: none !important;
}

.service-tooltip__inst {
    display: flex;
    align-items: center;
    padding-left: 2.2rem;
    gap: 1rem;
    color: #808d9a;
}

.service-tooltip__inst svg {
    width: 3.1rem;
    height: 3.1rem;
    flex-shrink: 0;
}

.empty {
    padding: 20px 0
}

.main .portfolio__container {
    margin-bottom: 0;
}

.project-goods__container {
    grid-template-columns: repeat(4, 1fr);
}

.desc__adv {
    height: fit-content;
}

table {
    width: 100%;
    margin-bottom: 2rem;
}

table tr td {
    padding: 1.7rem 2rem;
}

table tr:nth-child(2n-1) {
    background: #f6f6f6;
    border-top: 1px solid #eeeeef;
    border-bottom: 1px solid #eeeeef;
}

.table-price tr td {
    font-size: 1.7rem;
    font-weight: 500;
    vertical-align: top;
}

.table-price tr td:last-child {
    text-align: right;
    white-space: nowrap;
}

.table-time tr td:last-child {
    text-align: center;
}

.table-price tr td span {
    display: inline-block;
    margin-top: 1rem;
    line-height: 1.5;
    font-size: 1.5rem;
    font-weight: 400;
    color: #808d9a;
}

.mb0 {
    margin-bottom: 0 !important;
}

.mb10 {
    margin-bottom: 1rem !important;
}

.mb20 {
    margin-bottom: 2rem !important;
}

.mb30 {
    margin-bottom: 3rem !important;
}

.mb40 {
    margin-bottom: 4rem !important;
}

.mb50 {
    margin-bottom: 5rem !important;
}

.mb60 {
    margin-bottom: 6rem !important;
}

.mb70 {
    margin-bottom: 7rem !important;
}

.mb80 {
    margin-bottom: 8rem !important;
}

.mb90 {
    margin-bottom: 9rem !important;
}

.mt0 {
    margin-top: 0 !important;
}

.mt10 {
    margin-top: 1rem !important;
}

.mt20 {
    margin-top: 2rem !important;
}

.mt30 {
    margin-top: 3rem !important;
}

.mt40 {
    margin-top: 4rem !important;
}

.mt50 {
    margin-top: 5rem !important;
}

.mt60 {
    margin-top: 6rem !important;
}

.mt70 {
    margin-top: 7rem !important;
}

.mt80 {
    margin-top: 8rem !important;
}

.mt90 {
    margin-top: 9rem !important;
}

.service-decking__container .calculation__callback .calculation__phone {
    width: 100%;
    display: inline-block;
}

.service-steps__item {
    gap: 0 3rem;
}

.land_catalog-goods {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 1rem;
}

.land_catalog-goods-item svg {
    width: 5rem;
    height: 5rem;
    fill: #5cb894;
}

.land_catalog-goods p {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 1rem;
}

.land_catalog-goods-item {
    line-height: 1.3;
    color: #000;
    transition: all 0.3s;
}

.land_catalog-goods-item:hover {
    color: #f93c00;
}

.land_catalog {
    background: #f6f6f6;
    padding: 3rem 0 4rem;
    margin-bottom: 5rem;
}

.service-steps {
    margin-top: 5rem;
}

.land_catalog-railing {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 2rem;
    margin-bottom: 4rem;
}

.service-navesy .service-decking__container {
    grid-template-columns: 32rem 1fr 30.1rem;
}

.service-navesy .service-decking__compound {
    grid-template-columns: 1fr;
}

.service-navesy .service-decking__compound-item {
    grid-template-columns: 10rem 1fr;
}

.service-navesy .service-decking__compound-item img {
    grid-row: 1;
}

.service-navesy .service-decking__compound-item p {
    align-self: center;
    font-size: 1.6rem;
    font-weight: 600;
}

.card-more__item {
    width: 10.3rem;
}

.nav__drop li {
    margin-top: 1rem;
}

.nav__drop > li:first-child {
    margin-top: 0;
}

.service-hero {
    background-position: center;
}

.desc__adv--contacts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    padding: 3rem;
}

.desc__adv--contacts h3 {
    font-size: 2rem;
}

.desc__adv-contactitem p {
    font-size: 1.7rem;
    margin-bottom: 2rem;
}

.desc__adv-contactitem h4 {
    font-size: 1.7rem;
    margin-bottom: 1.2rem;
}

.advantages__container--product {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.advantages__p {
    padding: 0 2rem 1rem;
    text-align: center;
    color: #808d9a;
    font-size: 1.4rem;
}

.advantages__container--product .services__img {
    height: 15.3rem;
}

.advantages__container--product .services__img img {
    top: 50%;
    transform: translateY(-50%);
}

.hero__banners-txt h2 {
    margin: 0;
}

/*-----------SECTION PRICE MAIN-----------*/

.table-price--main {
    margin-bottom: 4rem;
}

.table-price--main tr td {
    vertical-align: middle;
    text-align: center;
}

.table-price--main tr td {
    padding: 1.2rem 2rem;
}

.table-price--main tr td h3 {
    margin-bottom: 0;
    font-weight: 600;
}

.table-price--main tr td:first-child {
    text-align: left;
    width: 55%;
}

.table-price--main .btn--empty-green {
    background: transparent;
    padding: 0.55rem 2.5rem;
}

.table-price--main .btn--empty-green:hover {
    background: #5cb894;
}

.price h2 {
    margin-bottom: 2rem;
}

#cookieAcceptBar.cookieAcceptBar {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100vw;
    border-radius: 3px;
    color: #202020;
    background: #f6f6f6;
    box-shadow: 0 0 5px #b4b4b4;
    z-index: 9999999;
    font-family: sans-serif;
    min-height: 5vh;
    padding: 15px 15px;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 15px;
    line-height: 1.2;
}

#cookieAcceptBar a {
    font-size: 15px;
}

#cookieAcceptBar a:hover {
    text-decoration: underline !important;
}

#cookieAcceptBar button {
    cursor: pointer;
    border: none;
    background-color: #5cb894;
    color: #fff;
    border-radius: 10px;
    margin-top: 0;
    line-height: 1;
    padding: 10px 20px;
    flex-shrink: 0;
    transition: all 0.3s;
}

#cookieAcceptBar button:hover {
    background-color: #49a17f;
}

.cookie-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    max-width: 116rem;
    margin: 0 auto;
}

@media screen and (max-width: 1570px) {
    .cookie-container {
        max-width: 77rem;
    }
}

@media screen and (max-width: 800px) {
    .cookie-container {
        flex-wrap: wrap;
        text-align: center;
    }
}

.mobile {
    display: none;
}

@media screen and (max-width: 993px) {
    .desctop {
        display: none;
    }

    .mobile {
        display: block;
    }
}

/*----------MOBILE----------*/

/* .more-btn {
  display: flex;
  align-items: flex-start;
  width: 3rem;
  height: 3rem;
  background: #b8c4d0;
  border-radius: 50%;
  text-align: center;
  justify-content: center;
  line-height: 1.2;
  color: #fff;
  margin-top: -0.2rem;
}
.auto-nav-more {
  position: relative;
}
.auto-nav-more-list {
  position: absolute;
  right: 0;
  opacity: 0;
  visibility: hidden;
  transition: 0.2s;
  text-align: right;
  padding: 0;
  list-style: none;
  background: #fff;
  padding: 1rem 2rem;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
  border-radius: 10px;
  z-index: 8;
}
.auto-nav-more:hover .auto-nav-more-list {
  opacity: 1;
  visibility: visible;
} */

@media screen and (max-width: 1180px) {
    .wrapper {
        max-width: 94%;
    }

    .header__rating,
    .header__contacts,
    .header__email,
    .messenger,
    .header__shop {
        margin: initial;
    }

    nav.header__nav {
        max-width: 64rem;
    }

    .header__nav-ul li a {
        white-space: nowrap;
    }

    .header__nav a {
        font-size: 1.5rem;
    }

    .header__nav-ul {
        gap: 2rem;
        display: inline-flex;
    }

    .header__menu {
        grid-template-columns: 16.6rem minmax(0, 1fr) 19.9rem;
    }

    .nav__drop {
        columns: 2;
    }

    .menu-catalog {
        position: relative;
    }

    a.drop-adv {
        border-left: 1px solid #eeeeef;
    }

    .header__nav .menu-catalog:before {
        bottom: -2rem;
        width: 120%;
        transform: translateX(-10%);
    }

    .header__nav-ul .dropdown-menu.show {
        background: #fff;
    }

    .menu-catalog svg {
        flex-shrink: 0;
    }

    .hero__banners {
        grid-template-columns: 2fr 1fr;
    }

    .hero__bigbanner {
        gap: 0 2rem;
    }

    .hero__smallbanner {
        grid-template-columns: 3fr 1fr;
    }

    .card__buy.card__buy--added {
        margin-right: auto;
        white-space: nowrap;
    }

    .card__unit {
        -webkit-line-clamp: 2;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .btn {
        padding: 0.62rem 1.2rem;
    }

    .goods-carousel .carousel-cell {
        width: 50%;
    }

    .bestsellers__carousel-tab {
        grid-template-columns: repeat(3, 1fr);
    }

    .bestsellers__container .flickity-prev-next-button.next {
        right: 0;
        transform: translateX(50%);
    }

    .col-lg-2 .hero__tags-item {
        padding: 0 !important;
    }

    .calculation__calc-txt .btn {
        padding: 0.62rem 1.2rem;
    }

    .calculation__calc {
        grid-template-columns: 1fr 16.3rem;
        padding-bottom: 6rem;
        height: auto;
    }

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

    .header__mob-icon {
        display: block;
        color: #000;
        border-right: 1px solid #eeeeef;
        width: 100%;
        text-align: center;
        padding: 2rem;
        font-size: 2rem;
    }

    .nav-bar {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 100;
        display: flex;
        justify-content: space-between;
        align-items: center;
        background: rgba(255, 255, 255, 0.95);
        box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
        min-height: 7rem;
        padding: 0;
    }

    .nav-bar a:hover {
        background: #eeeeef;
    }

    .nav-branding {
        font-size: 2rem;
        font-weight: 600;
        transition: color 500ms ease;
    }

    .nav-branding:hover,
    .nav-branding:focus {
        color: dodgerblue;
    }

    .nav-menu {
        position: absolute;
        left: -100%;
        top: 100%;
        flex-direction: column;
        background-color: rgba(255, 255, 255, 0.95);
        width: 100%;
        list-style: none;
        transition: 750ms;
        padding: 2rem;
        overflow-y: scroll;
        overscroll-behavior: none;
        max-height: 100vh;
        min-height: 98vh;
        box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
    }

    .nav-menu::-webkit-scrollbar {
        display: none;
    }

    .nav-menu.active {
        left: 0;
    }

    .nav-menu ul {
        padding: 0;
        list-style: none;
        border-left: 1px solid #eeeeef;
    }

    .nav-menu ul li {
        padding-left: 2rem;
    }

    .nav-menu a {
        display: block;
        color: #000;
        padding: 2rem;
        font-size: 1.8rem;
    }

    .hamburger {
        border-right: 1px solid #eeeeef;
        width: 100%;
        text-align: center;
        padding: 2rem;
        cursor: pointer;
    }

    .bar {
        display: block;
        background-color: #000;
        width: 24px;
        height: 2px;
        margin: 6px auto;
        transition: all 300ms ease-in-out;
    }

    .hamburger.active .bar:nth-child(2) {
        opacity: 0;
    }

    .hamburger.active .bar:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

    .hamburger.active .bar:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

    .header__mob-top {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 9rem;
    }

    .cta__container {
        grid-template-columns: 1fr 21rem 12rem;
    }

    .cta__img img {
        top: -4rem;
        left: 0;
    }

    .card-in .card {
        grid-template-columns: 1fr 1fr;
    }

    .card-in__about {
        grid-template-columns: 1fr 1fr;
    }

    .card-more__container {
        grid-template-columns: 2fr 1fr;
    }

    .card-more__buy-discount {
        position: absolute;
        top: 0.4rem;
        right: 0.4rem;
    }

    .card-more .calc-carousel__goods {
        grid-template-columns: 6.4rem 1fr;
        position: relative;
    }

    .card-in__info {
        order: 2;
    }

    .cart__container {
        grid-template-columns: 1fr;
        gap: 4rem;
    }

    .desc {
        grid-template-columns: 1fr 43rem;
        align-items: center;
    }

    .category__guarantee-block {
        gap: 2.7rem 3.8rem;
    }

    .category__guarantee-block .hero__smallbanner {
        grid-template-columns: 1fr;
        height: auto;
    }

    .category__guarantee-block .hero__smallbanner .btn {
        width: 100%;
    }

    .service-objects__types {
        grid-template-columns: repeat(3, 1fr);
    }

    .service-decking__container {
        grid-template-columns: 1fr 1fr;
    }

    .service-decking__container .calculation__callback {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
    }

    .service-tooltips__container {
        grid-template-columns: repeat(4, 1fr);
    }

    .mobile-search__block {
        position: absolute;
        width: 100%;
        height: 10rem;
        background: #fff;
        top: 7.1rem;
        left: 0;
        padding: 2rem;
        box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
        transition: all 0.3s;
        transform: translateY(-200%);
        z-index: -1;
        opacity: 0;
    }

    .mobile-search__block input {
        width: 100%;
        padding: 1.4rem 2rem;
        font-size: 1.6rem;
    }

    .mobile-search__block.active {
        transform: translateY(0);

        opacity: 1;
    }

    .nav-menu .messenger__icons {
        display: flex;
        margin: -2px 0 0 0;
        gap: 0.3rem;
    }

    .nav-bar .messenger__phones {
        display: flex;
        align-items: center;
        gap: 1rem;
    }

    .nav-bar .messenger__phones span {
        color: #808d9a;
    }

    .nav-menu .messenger {
        padding: 1rem 2rem;

    }

    .nav-menu .messenger__icons .messenger--img.dark-link:first-child {
        padding: 0 0 0 2rem;
    }

    .nav-menu .messenger__icons .messenger--img.dark-link img {
        width: 2.3rem;
        height: 2.3rem;
    }

    .nav-menu .messenger__icons .messenger--img.dark-link {
        padding: 0;
    }

}

/*----------992 px----------*/

@media screen and (max-width: 992px) {
    .wrapper {
        max-width: 96%;
    }

    header.header {
        margin-bottom: 3rem;
    }

    .mob-dropdown {
        display: grid;
        grid-template-rows: auto 0;
        transition: all 0.4s;
    }

    .mob-dropdown ul {
        opacity: 0;
        overflow: hidden;
        transition: all 0.4s;
    }

    .mob-dropdown.active {
        grid-template-rows: auto 1fr;
    }

    .mob-dropdown.active ul {
        opacity: 1;
    }

    .header__contacts {
        width: 100%;
        margin: 0 0 0 0;
        flex-direction: row;
        gap: 2.8rem;
        align-items: center;
    }

    .region {
        font-size: 2rem;
    }

    .region span {
        margin: 0rem 1rem 0 0.1rem;
    }

    .region svg {
        width: 1.2rem;
        margin-top: 0;
        flex-shrink: 0;
    }

    .header__phone a {
        font-size: 3rem;
    }

    .header__mob-logo {
        max-width: 25rem;
        flex-shrink: 0;
    }

    .header__mob-top {
        gap: 2rem;
        margin-top: 5rem;
        flex-wrap: wrap;
        justify-content: center;
    }

    .modal__regions {
        columns: 2;
    }

    .header__mob-top .header__phone.messenger__phones.messenger {
        align-items: center;
        gap: 0.3rem;
        white-space: nowrap;
    }

    .header__mob-top .messenger__icons.messenger {
        margin: -2px 0 0 0;
        gap: 0.3rem;
        flex-shrink: 0;
    }

    .header__mob-top .header__phone a img {
        width: 2rem;
        height: 2rem;
        margin-right: 0.5rem;
    }

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

    .hero__bigbanner {
        grid-column: 1/3;
    }

    .hero__tags .row {
        gap: 3rem 0;
        justify-content: center;
    }

    .hero__tags .row .col-lg-2 {
        width: 46%;
    }

    .assortment__item {
        display: inline-block;
        margin: auto;
    }

    .assortment__container {
        text-align: center;
    }

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

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

    .bestsellers__container .nav-pills {
        flex-direction: row !important;
        gap: 1rem;
    }

    .bestsellers .nav-pills .nav-link {
        display: inline-flex;
    }

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

    .calculation__calc {
        grid-column: 1/3;
    }

    .calculation__calc {
        grid-template-columns: 1fr 19.3rem;
        padding-bottom: 0;
    }

    .calculation__calc-txt .btn {
        margin-bottom: 2rem;
    }

    .calculation__callback {
        display: grid;
    }

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

    .calculator__result-options .carousel-cell {
        width: 49%;
    }

    .calculator__result-options .flickity-prev-next-button.next {
        right: -1rem;
    }

    .calculator__result-options .flickity-prev-next-button.previous {
        left: -2rem;
    }

    .calc-carousel__goods {
        grid-template-columns: 6.1rem 1fr;
    }

    .calc-carousel__goods-price {
        grid-column: 1/3;
        text-align: left;
        padding-left: 1rem;
    }

    .decking .wrapper {
        grid-template-columns: 1fr;
    }

    .decking__item p {
        font-size: 1.4rem;
    }

    .decking__right {
        gap: 2rem;
    }

    .properties__lines {
        width: 23%;
    }

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

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

    .portfolio-carousel .carousel-cell {
        width: 49%;
    }

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

    .cta__container {
        grid-template-columns: 1fr 21rem;
    }

    .cta__img {
        display: none;
    }

    .desc-in {
        grid-template-columns: 1fr;
    }

    .project-goods__container {
        grid-template-columns: repeat(2, auto);
        gap: 4rem 2.5rem;
    }

    .desc-card {
        grid-template-columns: 1fr;
    }

    .desc__card-adv {
        margin-top: 1rem;
    }

    .desc__txt.desc__card {
        margin-top: -1.6rem;
    }

    .card-in__buy {
        grid-column: 1/3;
    }

    .card-in__info {
        order: 0;
    }

    .card-in__about {
        grid-template-columns: 1fr;
    }

    .card-more__container {
        grid-template-columns: 1fr;
    }

    .card-more__buy {
        max-width: 50rem;
    }

    .category__adv-container {
        grid-template-columns: 1fr 1fr;
    }

    .accessories-carousel-cell {
        width: 49%;
    }

    .card .category__phone svg {
        width: 4rem;
        height: 4rem;
    }

    .card-in .category__phone {
        display: grid;
        grid-template-columns: 17rem 6rem 1fr 1fr;
    }

    .card-in .category__phone a {
        justify-self: flex-end;
    }

    .card-in .card__added {
        grid-template-columns: 1fr 5rem 5rem 5rem;
        justify-items: center;
    }

    .card__buy.card__buy--added {
        min-width: 20rem;
    }

    .cart-header .header__email,
    .cart-header .messenger {
        margin: auto;
    }

    .cart__goods {
        padding-right: 7rem;
    }

    .cart__goods .modal-card__container {
        margin-right: 0;
        grid-template-columns: 11.2rem 22.1rem 1fr;
        align-items: center;
    }

    .cart-header .header__logo {
        position: absolute;
        top: 1rem;
    }

    .cart__order {
        margin-top: 4rem;
    }

    .cart__delivery-container {
        display: grid;
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .cart__form-container {
        grid-template-columns: 1fr 1fr;
    }

    .category__side .category__phone,
    .category__side .category__nav {
        display: none;
    }

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

    .category__filter {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        align-items: flex-start;
        margin-top: 0;
        gap: 2rem;
        grid-column: 1/3;
        order: 2;
    }

    .category__filter-reset {
        grid-column: 1/3;
    }

    .category__side {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 2rem;
        align-items: center;
    }

    .category__side-montage,
    .category__side-adv {
        margin-top: 0;
    }

    .category__guarantee-block {
        grid-template-columns: 1fr;
    }

    .category__guarantee-block .hero__smallbanner {
        grid-template-columns: 2fr 1fr;
    }

    .category__guarantee {
        gap: 4rem;
        grid-template-columns: 1fr 1fr;
    }

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

    .parameter-list li {
        grid-template-columns: 16rem 1fr;
    }

    .card-in .card__purpose {
        -webkit-line-clamp: 1;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .bestsellers__container .btn.btn--empty-grey {
        position: relative;
        left: 0;
        bottom: 0;
        width: 100%;
        margin-top: 5rem;
    }

    .service-objects__container {
        grid-template-columns: 1fr;
    }

    .service-objects__video {
        padding-bottom: 56%;
    }

    .service-objects__types {
        grid-template-columns: repeat(4, 1fr);
    }

    .service-tech__container {
        gap: 3rem 0;
    }

    .service-info__guarantee {
        margin-left: 0;
    }

    .service-materials__container {
        grid-template-columns: repeat(2, 1fr);
        gap: 3rem;
    }

    .service-decking__container {
        grid-template-columns: 1fr;
    }

    .service-steps__container {
        grid-template-columns: 1fr 1fr;
    }

    .service-tooltips__container {
        grid-template-columns: repeat(3, 1fr);
    }

    .tooltip-inner {
        margin-left: auto !important;
    }

    .footer__container {
        grid-template-columns: 1fr 1fr;
        gap: 2rem 5rem;
    }

    .category__mob-filters-btn {
        display: block;
    }

    .category__side {
        order: 2;
    }

    .category__filter {
        display: none;
    }

    .category__filter.active {
        display: grid;
        position: fixed;
        top: 0;
        left: 0;
        background: #fff;
        width: 100%;
        height: 100%;
        z-index: 3;
        align-items: flex-start;
        align-content: flex-start;
        padding: 10rem 2rem 2rem;
    }

    .category__filter.active button.btn-close {
        display: block;
        position: absolute;
        top: 9rem;
        right: 2rem;
    }

    .desc__adv--contacts {
        grid-template-columns: 1fr;
    }

    .land_catalog-goods {
        grid-template-columns: repeat(4, 1fr);
    }

    .service-navesy .service-decking__container {
        grid-template-columns: 32rem 1fr;
    }

    .land_catalog-railing {
        grid-template-columns: repeat(3, 1fr);
    }
}

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

    header.header {
        margin-bottom: 0;
    }

    .header__mob-logo {
        max-width: 45%;
        margin: 0 auto;
    }

    .header__contacts {
        flex-wrap: nowrap;
        gap: 1rem;
        justify-content: space-between;
        width: 100%;
    }

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

    .hero__bigbanner {
        grid-column: 1;
        grid-template-columns: 1fr;
        height: auto;
        padding: 5.3rem 3.3rem;
    }

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

    main.main.content .advantages {
        display: none;
    }

    .goods-carousel .carousel-cell {
        width: 100%;
    }

    .hero__tags .row .col-lg-2 {
        width: 46%;
    }


    .calculation__calc {
        grid-template-columns: 1fr;
        padding-bottom: 0;
        grid-column: 1;
    }

    .calculation__img {
        max-width: 25rem;
    }

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

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

    .calculator__result-options .carousel-cell {
        width: 95%;
    }

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

    .decking__item {
        display: grid;
        grid-template-columns: 10rem 1fr;
        gap: 2rem;
        text-align: left;
    }

    .decking__item img {
        grid-row: 1/3;
    }

    .decking__item h3 {
        margin: 0;
        max-width: 100%;
    }

    .decking__item:before {
        display: none;
    }

    .properties__img {
        grid-column-start: 1;
        grid-column-end: 3;
        grid-row-start: 1;
        grid-row-end: 1;
        width: 100%;
        margin: auto;
        transform: translateY(0);
    }

    .properties__container {
        grid-template-columns: 1fr 1fr;
        align-items: center;
        gap: 2rem;
    }

    .properties__lines {
        display: none;
    }

    .properties__item--right {
        text-align: left;
        margin: 0 !important;
    }

    .properties__item--right:after {
        left: 0;
        right: 0;
    }

    .about__container {
        grid-template-columns: repeat(1, 1fr);
        grid-template-rows: repeat(8, 1fr);
    }

    .portfolio-carousel .carousel-cell {
        width: 100%;
    }

    .footer__container {
        grid-template-columns: 1fr;
        gap: 2rem 5rem;
    }

    .footer__contacts {
        flex-wrap: wrap;
    }

    .footer__messenger {
        width: 100%;
        margin: 1rem 0;
    }

    .modal-card__container {
        grid-template-columns: 1fr 2fr;
    }

    .modal-card__buy {
        grid-column: 1/3;
    }

    .bestsellers__container .flickity-prev-next-button.next {
        transform: translateX(0);
    }

    .bestsellers__container .flickity-prev-next-button.previous {
        transform: translateX(0);
    }

    .bestsellers__container .flickity-button {
        top: 47%;
    }

    .bestsellers__carousel-tab .card__length-item span {
        padding: 0.1rem 0.6rem;
        white-space: nowrap;
    }

    .bestsellers__carousel-tab {
        grid-template-columns: 49% 49%;
        gap: 2rem 1rem;
    }

    .bestsellers__carousel-tab .card {
        padding: 0;
    }

    .bestsellers__carousel-tab .card__purpose {
        font-size: 1.2rem;
        display: none;
    }

    .bestsellers__carousel-tab .card__size-container {
        grid-template-columns: 1fr;
        margin-bottom: 1rem;
    }

    .bestsellers__carousel-tab .card__unit {
        display: none !important;
    }

    .bestsellers__carousel-tab .card__length-list {
        flex-wrap: wrap;
    }

    .bestsellers__carousel-tab .card__price-block .card__pricetab {
        padding: 0.5rem 0.5rem;
        min-height: 5.8rem;
    }

    .bestsellers__carousel-tab .card__price-block .nav-link {
        padding: 0.7rem 0.1rem;
    }

    .bestsellers__carousel-tab h3,
    .bestsellers__carousel-tab .h3 {
        margin-bottom: 0.3rem;
    }

    .category__showcase .card__img img {
        width: 60%;
        margin: 0 auto;
        display: block;
    }

    .table-price--main tr td {
        padding: 0.5rem 1rem;
    }

    .table-price--main .btn--empty-green {
        padding: 0.55rem 1rem;
    }

    .table-price tr td {
        font-size: 1.6rem;
    }

    .project-goods__container {
        grid-template-columns: repeat(1, auto);
        gap: 4rem 2.5rem;
    }

    .cta__container {
        grid-template-columns: 1fr;
        position: relative;
    }

    .cta__img {
        display: block;
        position: absolute;
        bottom: 0;
        right: 0;
        width: 15rem;
        height: 15rem;
        z-index: -10;
    }

    .cta__img img {
        top: 0;
        left: 0;
        max-width: 100%;
    }

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

    .desc__adv {
        margin-top: 1.4rem;
    }

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

    .header__phone a {
        font-size: 1.8rem;
    }

    .region {
        font-size: 1.8rem;
    }

    .card-in .card {
        grid-template-columns: 1fr;
    }

    .card-in__buy {
        grid-column: 1;
    }

    .accessories-carousel-cell {
        width: 95%;
    }

    .card-more__adv {
        flex-wrap: wrap;
    }

    .card-more__buy {
        max-width: 100%;
    }

    .category__adv-container {
        grid-template-columns: 1fr;
    }

    .cart-header .header__info {
        padding: 4.9rem 0 0;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 2rem;
    }

    .cart__goods {
        padding-right: 0;
    }

    .cart__delete {
        position: absolute;
        width: 1.8rem;
        height: 1.8rem;
        right: 1rem;
        top: 2rem;
        transform: translateY(-50%);
        cursor: pointer;
    }

    .cart__goods .modal-card__container {
        grid-template-columns: 1fr 2fr;
        gap: 1rem;
    }

    .category__side {
        grid-template-columns: 1fr;
        order: 2;
    }

    .category__filter {
        grid-template-columns: 1fr 1fr;
        grid-column: 1;
    }

    .category__showcase {
        grid-template-columns: 1fr;
        gap: 5rem;
    }

    .category__guarantee {
        gap: 4rem;
        grid-template-columns: 1fr;
    }

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

    .service-objects__desc {
        grid-template-columns: 1fr;
    }

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

    .service-materials__container {
        grid-template-columns: repeat(1, 1fr);
    }

    .service-steps__container {
        grid-template-columns: 1fr;
    }

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

    .service-hero h1 {
        font-size: 3.6rem;
    }

    .service-adv .wrapper {
        gap: 3rem;
    }

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

    .service-navesy .service-decking__container {
        grid-template-columns: 1fr;
    }

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

    .service-hero__btn {
        gap: 2rem;
        flex-wrap: wrap;
    }

    .table-price--main tr td:first-child {
        width: auto;
    }

}