@font-face { font-family: Lato; font-weight: 400; font-style: normal; src: url(../fonts/Lato-Regular.woff); font-display: swap } @font-face { font-family: Lato; font-weight: 600; font-style: normal; src: url(../fonts/Lato-SemiBold.woff); font-display: swap } @font-face { font-family: Lato; font-weight: 700; font-style: normal; src: url(../fonts/Lato-Bold.woff); font-display: swap } @font-face { font-family: Lato; font-weight: 900; font-style: normal; src: url(../fonts/Lato-Black.woff); font-display: swap } @font-face { font-family: Inter; font-weight: 700; font-style: normal; src: url(../fonts/Inter-Bold.woff); font-display: swap } :root { --color-white: #fff; --color-black: #000 } :focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px } html { scroll-behavior: smooth; margin: 0; padding: 0 } body { color: #3d3d3d; margin: 0; padding: 0; font-family: Lato, Arial, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.3 } u { border-bottom: 1px solid; padding-bottom: 1px; line-height: 1.4; text-decoration: none } h1, h2, h3, h4, h5, h6, p { margin: 0 } a { color: inherit; text-decoration: none } img { box-sizing: border-box; display: block } button { all: unset } svg { display: block } .container { box-sizing: border-box; max-width: 1440px; margin: 0 auto; padding: 0 6.9vw } .hover-scale { position: relative } .hover-scale:after { content: ""; z-index: -1; background-color: inherit; border-radius: inherit; width: 100%; height: 100%; transition: .2s ease-in; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) } .hover-scale:hover:after { width: calc(100% + 8px); height: calc(100% + 8px) } .section-title { margin: 0 0 40px; font-size: 36px; font-weight: 900; line-height: 1.2 } .green-text { color: #097359 } .orange-text { color: #ff7f23 } .input { box-sizing: border-box; box-shadow: none; background-color: #f5f5f5; border: 1px solid #f5f5f5; border-radius: 8px; outline: 0; height: 48px; padding: 0 12px; font-family: inherit; font-size: 16px; transition: .1s linear; display: block } .input:focus { background-color: #fff; border-color: #939393 } .input:not(:-moz-placeholder-shown), .input:not(:placeholder-shown) { color: #3d3d3d; background-color: #fff } .input::-moz-placeholder { color: #939393; font-size: 16px } .input::placeholder { color: #939393; font-size: 16px } .download-link { grid-auto-flow: column; -moz-column-gap: 8px; column-gap: 8px; width: -moz-max-content; width: max-content; display: grid } .download-link:before { content: ""; background-image: url(../img/svg/download-icon.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 20px } .download-link span { color: #097359; font-weight: 700 } .section { padding-top: 60px; padding-bottom: 60px } .section-inner { padding-top: 40px; padding-bottom: 60px } .button { box-sizing: border-box; cursor: pointer; border: 1px solid; border-radius: 8px; flex-shrink: 0; justify-content: center; align-items: center; max-width: 100%; padding: 8px 20px; font-weight: 700; transition: .2s linear; display: flex } .button--outline { color: #097359; background-color: rgba(0, 0, 0, 0) } .button--outline:hover { opacity: .6 } .button--orange { color: #fff; background-color: #ff7f23; border-color: #ff7f23 } .completed-objects { background-color: #f5f5f5; border-radius: 60px; } .button--orange:hover { background-color: #ff8a35 } .button--ghost { color: #097359; border: none; padding: 0 } .button--catalog svg { margin-left: 8px } .button-video { position: relative } .button-video:hover img { width: 72px; height: 72px } .button-video img { width: 62px; height: 62px; transition: .3s ease-in } .header { z-index: 10; margin: 0 auto; padding-top: 20px; padding-bottom: 24px; transition: background-color .2s linear; position: relative } .header__menu { border-bottom: 1px solid #f5f5f5; justify-content: space-between; align-items: center; margin: 0 auto; padding-bottom: 20px; display: flex } .header__logo { align-items: center; margin-right: 25px; display: flex } .header__logo img { display: block } .header_location-wrap { position: relative } .header_location-wrap.is-active .header__location-select { display: block } .header__location { align-items: center; font-weight: 700; display: flex } .header__location:after { content: ""; background-image: url(../img/svg/arrow.svg); background-repeat: no-repeat; background-size: contain; width: 12px; height: 12px; margin-top: 3px; margin-left: 4px } .header__location span { pointer-events: none } .header__location-select { z-index: 1; font-size: inherit; background-color: #fff; border: 1px solid #e2e2e2; border-radius: 12px; width: 100%; min-width: -moz-max-content; min-width: max-content; max-width: 100vw; display: none; position: absolute; top: 0; left: 0 } .header__location-select option { padding: 10px } .menu { margin-left: auto; position: relative } .menu__list { grid-auto-flow: column; -moz-column-gap: 20px; column-gap: 20px; margin: 0; padding: 0; list-style: none; display: grid } .menu__list a { text-decoration: none; transition: color .3s } .menu__list a:hover { color: #097359 } .menu__item { white-space: nowrap } .menu__more { color: #939393; align-items: center; display: none; position: relative } .menu__more:focus, .menu__more:hover { color: #097359 } .menu__more:focus .menu__more-list, .menu__more:hover .menu__more-list { color: #3d3d3d; opacity: 1; pointer-events: auto } .menu__more-list { z-index: 1; box-sizing: border-box; opacity: 0; pointer-events: none; background-color: #f5f5f5; border-radius: 16px; grid-auto-flow: row; row-gap: 20px; min-width: 180px; padding: 24px 28px; list-style: none; transition: opacity .2s; display: grid; position: absolute; top: 100%; right: -16px } .menu__more-list .menu__item { display: none } .header__bottom { justify-content: space-between; align-items: center; padding-top: 20px; display: flex } .header__bottom .button { margin-right: 8px } .header__bottom form { flex-grow: 1 } .header__bottom .input { width: 100%; height: 40px; padding: 0 50px 0 20px } .header__search { position: relative } .header__search:after { content: ""; background-image: url(../img/svg/search-img.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 20px; position: absolute; top: 50%; right: 20px; transform: translateY(-50%) } .header__search .input:focus+.header__search-block { display: block } .header__search-block { z-index: 1; box-sizing: border-box; background-color: #fff; border: 1px solid #f5f5f5; border-radius: 12px; width: 100%; max-width: 100%; max-height: 50vh; padding: 0 20px; display: none; position: absolute; top: calc(100% + 4px); left: 0; overflow-y: auto; box-shadow: 0 4px 24px rgba(65, 65, 65, .1215686275) } .header__search-top { justify-content: space-between; -moz-column-gap: 10px; column-gap: 10px; margin-bottom: 12px; padding-top: 16px; font-weight: 700; display: flex } .header__search-top .button { margin: 0 } .header__search-history { grid-template-columns: 1fr 20px; gap: 12px; padding: 16px 0; display: grid } .header__search-history+.header__search-history { border-top: 1px solid #e2e2e2 } .header__search-history span { white-space: nowrap; text-overflow: ellipsis; max-width: calc(100% - 28px); overflow: hidden } .header__search-btn { cursor: pointer; flex-shrink: 0; align-items: center; gap: 8px; display: flex; overflow: hidden } .header__search-btn:hover { color: #097359 } .header__search-btn svg { flex-shrink: 0; width: 20px; height: 20px } .header__search-found { grid-template-columns: 40px 1fr auto; align-items: center; gap: 8px; padding: 16px 0; display: grid; overflow: hidden } .header__search-found:hover { color: #097359 } .header__search-found+.header__search-found { border-top: 1px solid #e2e2e2 } .header__search-found span { text-overflow: ellipsis; overflow: hidden } .header__search-price { color: #939393 } .header__search-empty { color: #939393; justify-content: center; align-items: center; height: 100px; display: flex } .header__phone { margin-left: 40px; font-size: 24px; font-weight: 700; transition: color .2s linear } .header__phone:hover { color: #097359 } .header__cart { width: 24px; height: 24px; margin-left: 40px; position: relative } .header__cart:has(.header__cart-value:not(:empty)) { padding-right: 11px } .header__cart-value { color: #fff; background-color: #097359; border-radius: 20px; padding: 4px; font-size: 12px; font-weight: 700; line-height: 9px; position: absolute; top: -3px; right: 0 } .header__cart-value:empty { display: none } .cart .header__cart svg { fill: #ff7f23; stroke: #ff7f23 } .cart .header__cart svg path { stroke: #ff7f23 } body.show-catalog .header { background-color: #fff } body.show-catalog .catalog { z-index: 1; visibility: visible; opacity: 1; pointer-events: auto } body.show-catalog .overflow { z-index: 5; opacity: 1; pointer-events: auto } .catalog { z-index: -1; box-sizing: border-box; visibility: hidden; opacity: 0; pointer-events: none; background-color: #f5f5f5; border-bottom-right-radius: 16px; padding: 12px; transition: opacity .2s linear; position: absolute; top: 100%; left: 0 } .catalog:has(.catalog__item:hover) { border-radius: 0 } .catalog-overflow { opacity: 0; pointer-events: none; background-color: rgba(61, 61, 61, .4); transition: opacity .2s linear; position: fixed; inset: -20px } .catalog__top { grid-template-columns: 40px 1fr 40px; align-items: center; gap: 12px; margin-bottom: 16px; display: none } .catalog__top-name { text-align: center; grid-column: 2/3; font-size: 24px; font-weight: 700 } .catalog__top-btn { padding: 9px } .catalog__top-btn svg { width: 20px; height: 20px; display: block } .catalog__list { grid-auto-flow: row; row-gap: 8px; display: grid } .catalog__item { box-sizing: border-box; cursor: pointer; background-color: #fff; border-radius: 16px; align-items: center; min-height: 78px; padding: 4px 32px 4px 16px; display: flex } .catalog__item:after { width: 12px; height: 100%; display: block; position: absolute; top: 0; right: 0 } .catalog__item:hover { color: #097359 } .catalog__item:hover:after { content: "" } .catalog__item:hover .catalog__inner-wrap { opacity: 1; pointer-events: auto } .catalog__item img { -o-object-fit: contain; object-fit: contain; width: 60px; height: 70px; margin-right: 12px; display: block } .catalog__item-name { font-size: 20px; font-weight: 700 } .catalog__inner-wrap { z-index: -1; box-sizing: border-box; opacity: 0; pointer-events: none; background-color: #fff; border-bottom-right-radius: 16px; width: -moz-max-content; width: max-content; min-width: 350px; height: -moz-max-content; height: max-content; min-height: 100%; padding: 24px 40px 24px 24px; transition: opacity .2s linear; position: absolute; top: 0; left: 100% } .catalog__inner { box-sizing: border-box; grid-auto-flow: row; row-gap: 16px; display: grid } .catalog__link { color: #3d3d3d } .catalog__link:hover { color: #097359 } .footer { box-sizing: border-box; background-color: #f5f5f5; border-radius: 60px 60px 0 0 } .footer .container { padding: 0 5.56vw } .footer__top { border-bottom: 2px solid #e3e3e3; justify-content: space-between; gap: 30px; margin-bottom: 65px; padding-bottom: 65px; display: flex } .footer__btn { margin-bottom: 16px; font-size: 20px; font-weight: 700; transition: color .3s linear } .footer__btn svg { width: 12px; height: 15px; transition: transform .3s linear; display: none } .footer__list { grid-auto-flow: row; row-gap: 12px; margin: 0; padding: 0; list-style: none; transition: .3s linear; display: grid } .footer__top-item+.footer__btn { margin-top: 60px } .footer__bottom { gap: 70px; display: flex } .footer__logo { margin-right: auto } .footer__bottom-item { width: -moz-max-content; width: max-content; max-width: 170px } .footer__bottom-name { margin-bottom: 12px; font-size: 20px; font-weight: 700 } .footer__social { gap: 15px; display: flex } .footer__social img { width: 46px; height: 46px } .info-block { background-color: #f5f5f5; border-radius: 24px; flex-direction: column; height: 100%; padding: 32px; display: flex } .info-block__content { background-color: #f5f5f5; border-radius: 24px; flex-grow: 1 } .info-block__content ol li { margin-bottom: 0 } .info-block__title { margin: 0 0 12px; font-size: 24px; transition: color .3s } .info-block__title:hover { color: #ff7f23 } .info-block__title a { color: #3d3d3d; text-decoration: none; transition: color .3s } .info-block__title a:hover { color: #ff7f23 } .info-block__text { margin-bottom: 22px } .info-block__text a { color: #ff7f23; text-decoration: none } .info-block__text:last-child { margin-bottom: 0 } .no-animation { pointer-events: none } .info-block__icon { background-color: #ff7f23; border-radius: 12px; justify-content: center; align-items: center; width: 52px; height: 52px; margin-bottom: 28px; display: flex } .info-block__list { margin-top: 32px; margin-bottom: 0; padding-left: 25px } .info-block__list-item:not(:last-child) { margin-bottom: 18px } .tap-bar { z-index: 10; background-color: #fff; border-radius: 24px 24px 0 0; justify-content: space-between; padding: 12px 80px; display: none; position: sticky; bottom: 0; box-shadow: 0 4px 24px rgba(65, 65, 65, .1215686275) } .tap-bar__item { color: #939393 } .tap-bar__link { color: inherit; flex-direction: column; align-items: center; font-size: 12px; font-weight: 600; display: flex } .tap-bar__link svg { margin-bottom: 4px } body.show-catalog .tap-bar__item--catalog, body.show-menu .tap-bar__item--menu { color: #ff7f23 } .breadcrumbs { -webkit-overflow-scrolling: touch; padding-top: 20px; padding-bottom: 20px; overflow-x: auto } .breadcrumbs::-webkit-scrollbar { background: 0 0; width: 0; display: none } .breadcrumbs::-webkit-scrollbar-button { background: 0 0; width: 0; display: none } .breadcrumbs::-webkit-scrollbar-track { background: 0 0; width: 0; display: none } .breadcrumbs::-webkit-scrollbar-thumb { background: 0 0; width: 0; display: none } .breadcrumbs__list { align-items: center; margin: 0; padding-left: 0; display: flex } .breadcrumbs__item { color: #939393; white-space: nowrap; align-items: center; padding-right: 12px; font-size: 16px; line-height: 1.3; list-style: none; display: flex } .breadcrumbs__item:after { content: "/"; margin-left: 12px } .breadcrumbs__item:last-child { color: #3d3d3d } .breadcrumbs__item:last-child:after { content: none } .documents__items { grid-column-gap: 24px; grid-row-gap: 44px; grid-template-columns: repeat(3, 1fr); display: grid } .documents__wrapper { cursor: pointer; position: relative } .documents__image { box-sizing: border-box; border: 4px solid #f5f5f5; border-radius: 24px; max-width: 100%; height: auto } .documents__description { text-align: left; margin-bottom: 20px } .documents__link { margin-bottom: 20px } .documents__wrapper:before { content: ""; opacity: 0; pointer-events: none; background-color: rgba(0, 0, 0, .3215686275); border-radius: 24px; width: 100%; height: 100%; transition: .3s; position: absolute; top: 0; left: 0 } .documents__wrapper:hover:before { opacity: 1; transform: scale(.98) } .documents__zoom { visibility: hidden; opacity: 0; pointer-events: none; width: 50px; height: 50px; transition: .3s; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) } .documents__wrapper:hover .documents__zoom { visibility: visible; opacity: 1 } .menu-mobile { z-index: 10; box-sizing: border-box; background-color: #fff; max-height: 100vh; padding: 40px 40px 110px; display: none; position: fixed; inset: 0; overflow-y: auto } .menu-mobile .footer { background-color: #fff; border-radius: 0; padding: 0; display: block } .menu-mobile .container { padding: 0 } .menu-mobile .footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 60px; margin-bottom: 40px; padding-bottom: 40px } .menu-mobile .footer__bottom { grid-template-rows: repeat(2, minmax(0, 1fr)); grid-template-columns: 200px 1fr 1fr; gap: 28px 40px; display: grid } .menu-mobile .footer__logo { grid-row: 1/-1; align-items: center; display: flex } .menu-mobile__top { align-items: center; margin-bottom: 40px; display: flex; position: relative } .menu-mobile__top form { flex-grow: 1 } .menu-mobile__top>.button { display: none } .menu-mobile__top form:has(input:focus) { width: 100%; position: absolute } .menu-mobile__phone { margin-right: 28px; font-size: 24px; font-weight: 700; transition: color .2s linear } .menu-mobile__search { position: relative } .menu-mobile__search input { width: 100%; height: 40px; margin-bottom: 0; padding: 9px 20px } .menu-mobile__search input:focus { background-color: #fff; border: 1px solid #939393 } .menu-mobile__search input:focus+.header__search-block { display: block } .menu-mobile__search:after { content: ""; background-image: url(../img/svg/search-img.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 20px; position: absolute; top: 50%; right: 20px; transform: translateY(-50%) } .menu-mobile__location { align-items: center; margin-bottom: 40px; font-weight: 700; display: flex } .menu-mobile__location:after { content: ""; background-image: url(../img/svg/arrow.svg); background-repeat: no-repeat; background-size: contain; width: 12px; height: 12px; margin-top: 3px; margin-left: 4px } .filter { grid-auto-flow: row; row-gap: 40px; height: -moz-max-content; height: max-content; display: grid } .filter__top { grid-column: 1/-1; grid-template-columns: 40px 1fr 40px; align-items: center; gap: 12px; display: none } .filter__title { text-align: center; grid-column: 2/3; font-size: 24px; font-weight: 700 } .filter__top-btn { padding: 9px } .filter__top-btn svg { width: 20px; height: 20px; display: block } .filter__wrap { grid-auto-flow: row; row-gap: 40px; display: grid } .filter__item--btns { grid-auto-flow: row; row-gap: 8px; display: grid } .filter__item--btns .button { width: 100%; min-height: 40px } .filter__item--list { grid-auto-flow: row; row-gap: 8px; display: grid } .filter__item.is-opened .filter__item-wrap { display: flex } .filter__item.is-opened .filter__more { display: none } .filter__item.is-opened .filter__less { display: block } .filter__item-wrap:nth-of-type(n+9) { display: none } .filter__item-name { margin-bottom: 20px; font-weight: 700; position: relative } .filter__category { align-items: center; transition: color .1s ease-in; display: flex } .filter__category--base~.filter__category { margin-left: 28px } .filter__category.is-active { color: #ff7f23; font-weight: 700 } .filter__category:hover { color: #ff7f23 } .filter__category span { color: #939393; margin-left: 8px } .filter__item-list { grid-auto-flow: row; row-gap: 12px; display: grid } .filter__less, .filter__more { color: #939393; cursor: pointer; border-bottom: 1px solid #939393; width: -moz-max-content; width: max-content; padding-bottom: 4px; font-size: 12px } .filter__less:hover, .filter__more:hover { color: inherit } .filter__less { display: none } .switcher { cursor: pointer; align-items: center; width: -moz-max-content; width: max-content; display: flex; position: relative } .switcher:before { content: ""; background-color: #e2e2e2; border-radius: 50px; align-self: flex-start; width: 44px; height: 24px; margin-right: 12px; transition: background-color .2s linear } .switcher:after { content: ""; background-color: #fff; border-radius: 50%; width: 20px; height: 20px; transition: transform .2s linear; position: absolute; top: 2px; left: 2px } .switcher:hover:before { background-color: #cdcdcd } .checkbox, .radio { cursor: pointer; align-items: center; display: flex; position: relative } .checkbox:before, .radio:before { content: ""; box-sizing: border-box; border: 1.5px solid #939393; border-radius: 4px; align-self: flex-start; width: 20px; height: 20px; margin-right: 8px } .checkbox:after, .radio:after { content: ""; background-color: #fff; border-radius: 2px; width: 12px; height: 12px; transition: background-color .1s linear; position: absolute; top: 4px; left: 4px } .checkbox span, .radio span { color: #939393; margin-left: 8px } .radio:after, .radio:before { border-radius: 50% } input:checked+.switcher:before { background-color: #ff7f23 } input:checked+.switcher:after { transform: translateX(20px) } input:checked+.checkbox:after, input:checked+.radio:after { background-color: #ff7f23 } .range { flex-direction: column; width: 260px; display: flex } .range__control { color: #9f9f9f; justify-content: space-between; margin-bottom: 24px; display: flex; position: relative } .range__control-item { white-space: nowrap; flex-grow: 1; align-items: center; display: flex } .range__control-item:first-child { margin-right: 5px } .range__control-input { flex-grow: 1; margin-left: 8px; text-align: center; color: #9f9f9f; -moz-appearance: textfield; background-color: #f5f5f5; border: none; border-radius: 12px; width: 70px; padding: 10px 12px; font-size: 16px; line-height: 1.3 } .range__control-input::-webkit-inner-spin-button { opacity: 1; -webkit-appearance: none; margin: 0 } .range__control-input::-webkit-outer-spin-button { opacity: 1; -webkit-appearance: none; margin: 0 } .range__sliders { min-height: 12px; margin-bottom: 20px; position: relative } .range__slider::-moz-range-thumb { cursor: pointer; -webkit-appearance: none; pointer-events: all; background-color: #ff7f23; border-radius: 50%; width: 16px; height: 16px } .range__slider::-webkit-slider-thumb { cursor: pointer; -webkit-appearance: none; pointer-events: all; background-color: #ff7f23; border-radius: 50%; width: 16px; height: 16px } .range__slider::-webkit-slider-thumb:hover { background: #ff7f23 } .range__slider { -webkit-appearance: none; -moz-appearance: none; appearance: none; pointer-events: none; background-color: #c6c6c6; width: 100%; height: 4px; position: absolute } .range__slider:first-of-type { z-index: 1; height: 0; top: 2px } .text-section { grid-template-columns: 2fr 1fr; align-items: end; gap: 130px; display: grid } .text-section__title { font-size: 40px; font-weight: 900; line-height: 1.2 } .text-section__text { margin-right: 0; font-size: 24px; line-height: 1.3 } .consultation { padding-top: 40px; padding-bottom: 100px } .consultation .consultation__title { text-align: center; color: #3d3d3d; margin: 0 0 40px; font-size: 36px; font-weight: 900; line-height: normal } .consultation__form { justify-content: space-between; align-items: center; gap: 12px; display: flex } .consultation__form input { background-color: #f5f5f5; border: 0; border-radius: 8px; outline: 0; width: 40%; padding: 13.5px 12px; font-size: 16px } .consultation__form input::-moz-placeholder { color: #939393; font-size: 16px } .consultation__form input::placeholder { color: #939393; font-size: 16px } .consultation__form .button { white-space: nowrap; justify-content: center; align-items: center; width: 28%; min-width: -moz-min-content; min-width: min-content; padding: 13.5px 12px; display: flex } .consultation__info { text-align: end; color: #939393; margin-top: 16px; font-size: 11px; line-height: 1.3 } .consultation__info--link { color: #ff7f23; font-size: 11px; line-height: 1.3; text-decoration: none; position: relative } .rating { color: #939393; align-items: center; display: flex } .rating:before { content: ""; background-image: url(../img/svg/star.svg); background-position: 0; background-repeat: space; background-size: 16px 16px; order: -1; width: 16px; height: 16px; display: block } .rating:after { content: ""; background-image: url(../img/svg/star-gray.svg); background-position: 0; background-repeat: space; background-size: 16px 16px; order: -1; width: 16px; height: 16px; margin-left: 4px; margin-right: 8px; display: block } .rating--1:before { width: 16px } .rating--1:after { width: 76px } .rating--2:before { width: 36px } .rating--2:after, .rating--3:before { width: 56px } .rating--3:after { width: 36px } .rating--4:before { width: 76px } .rating--4:after { width: 16px } .rating--5:before { width: 76px } .rating--5:after { background-image: url(../img/svg/star.svg); width: 16px } .rating--small:after, .rating--small:before { background-size: 12px 12px; width: 12px; height: 12px } .rating--small.rating--1:before { width: 28px } .rating--small.rating--1:after { width: 44px } .rating--small.rating--2:before { width: 28px } .rating--small.rating--2:after, .rating--small.rating--3:before { width: 44px } .rating--small.rating--3:after { width: 28px } .rating--small.rating--4:before { width: 44px } .rating--small.rating--4:after { background-image: url(../img/svg/star.svg); width: 28px } .rating--small.rating--5:before { width: 44px } .rating--small.rating--5:after { background-image: url(../img/svg/star.svg); width: 28px } .chips { gap: 16px; margin-right: 16px; display: flex } .chips__item { background-color: #e2e2e2; border-radius: 22px; align-items: center; padding: 11px 20px; display: flex } .chips__close { color: #3d3d3d; cursor: pointer; margin-left: 8px } .chips__close:hover { color: #097359 } .pagination { width: -moz-max-content; width: max-content; margin: 0 auto } .more__btn { min-height: 48px; margin: 0 auto 20px } .pagination-list { grid-auto-flow: column; gap: 12px; display: grid } .pagination-item { color: inherit; border-color: #e2e2e2; width: -moz-max-content; width: max-content; min-width: 48px; min-height: 48px; padding: 8px } .pagination-item.is-active { color: #097359; border-color: #097359 } .about-service { padding-top: 80px } .about-service__video { background-position: center; background-size: cover; border-radius: 24px; justify-content: center; align-items: center; min-height: 560px; display: flex; position: relative } .about-service__video:hover:before { background-color: rgba(0, 0, 0, .2784313725) } .about-service__video:before { content: ""; border-radius: inherit; background-color: rgba(0, 0, 0, .1019607843); transition: background-color .3s ease-in; position: absolute; inset: 0 } .accordion__item { cursor: pointer; background-color: #f5f5f5; border-radius: 24px; margin-bottom: 16px; padding: 28px 32px 28px 28px } .accordion__item:last-child { margin-bottom: 0 } .accordion__item.is-active .accordion__title:after { transform: translateY(-50%) rotate(180deg) } .accordion__item.is-active .accordion__data { opacity: 1; pointer-events: auto; max-height: 100% } .accordion__title { align-items: center; min-height: 60px; padding-left: 84px; font-size: 24px; display: flex; position: relative } .accordion__title:before { content: ""; background-image: url(../img/svg/icon-question.svg); background-repeat: no-repeat; background-size: contain; flex-shrink: 0; width: 63px; height: 68px; display: block; position: absolute; top: 0; left: -5px } .accordion__title:after { content: ""; background-image: url(../img/svg/arrow.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 20px; transition: transform .1s linear; position: absolute; top: 50%; right: 0; transform: translateY(-50%) } .accordion__data { box-sizing: border-box; opacity: 0; pointer-events: none; max-height: 0; padding: 0 84px } .accordion__data-content { padding-top: 12px } .faq { padding-top: 40px } .accordion__content-group { margin-bottom: 28px } .accordion__content-group:last-child { margin-bottom: 0 } .accordion__content-group h3 { margin-bottom: 16px; font-size: 16px } .accordion__list-title { margin-bottom: 20px } .accordion__img-box { margin-bottom: 40px } .accordion__img-box:last-child { margin-bottom: 0 } .accordion__img-box img { -o-object-fit: contain; object-fit: contain; border-radius: 20px; width: 100%; height: auto; margin-top: 12px } .accordion__img-box p { display: flex } .accordion__img-box p span { color: #097359; margin-right: 8px } .accordion__content-table { border-radius: 16px; display: grid; overflow: hidden } .accordion__table-row { border-top: 1px solid #e2e2e2; grid-template-columns: repeat(3, 1fr); display: grid } .accordion__table-row:first-child .accordion__table-data:first-child { border-radius: 16px 0 0 } .accordion__table-row:first-child .accordion__table-data:last-child { border-radius: 0 16px 0 0 } .accordion__table-row:last-child { border-bottom: 1px solid #e2e2e2 } .accordion__table-row:last-child .accordion__table-data:first-child { border-radius: 0 0 0 16px } .accordion__table-row:last-child .accordion__table-data:last-child { border-radius: 0 0 16px } .accordion__table-head .accordion__table-data { font-weight: 700 } .accordion__table-data { background-color: #fff; border-left: 1px solid #e2e2e2; padding: 16px 12px } .accordion__table-data:last-child { border-right: 1px solid #e2e2e2 } .progress__wrap { grid-template-columns: 60px 1fr; -moz-column-gap: 40px; column-gap: 40px; display: grid } .progress__bar { position: relative } .progress__bar:before { content: ""; background-color: #f5f5f5; width: 4px; height: 100%; position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%) } .progress__line { background-color: #ff7f23; width: 4px; margin: 0 auto; position: relative } .progress__item { gap: 16px; display: grid; position: relative } .progress__item--horizontal { grid-template-columns: 1fr 1fr } .progress__item--fix-big { grid-template-columns: 420px 1fr } .progress__item--big-fix { grid-template-columns: 1fr 420px } .progress__item:last-child:after { content: ""; background-color: #fff; width: 60px; height: calc(100% - 60px); position: absolute; top: 68px; left: -100px } .progress__item.is-active .progress__num { color: #fff; background-color: #ff7f23 } .progress__item+.progress__item { margin-top: 32px } .progress__item p+p { margin-top: 22px } .progress__num { color: #939393; background-color: #f5f5f5; border: 8px solid #fff; border-radius: 50%; justify-content: center; align-items: center; width: 60px; height: 60px; font-size: 24px; transition: background-color .2s linear; display: flex; position: absolute; top: -8px; left: -108px } .progress__card { background-color: #f5f5f5; border-radius: 24px; padding: 28px } .progress__card:nth-of-type(3n) { grid-column: 1/-1 } .progress__card ul { margin: 0; padding-left: 0; list-style: none } .progress__card li { padding-left: 13px; position: relative } .progress__card li:before { content: ""; background-color: #097359; border-radius: 50%; width: 5px; height: 5px; position: absolute; top: 10px; left: 0 } .progress__card li+li { margin-top: 8px } .progress__title { margin-bottom: 20px; font-size: 24px } .progress__name { margin-bottom: 20px } .audio { border: 1px solid #e2e2e2; border-radius: 24px; grid-template-columns: 52px 1fr auto; align-items: start; gap: 16px; height: 62px; padding: 20px 20px 16px; display: grid } .audio__play { cursor: pointer } .audio__timeline { justify-content: space-between; align-self: end; padding-top: 18px; display: flex; position: relative } .audio__timeline:before { content: ""; background-color: #f5f5f5; border-radius: 3px; width: 100%; height: 6px; position: absolute; top: 0; left: 0; right: 0 } .audio__line { background-color: #ff7f23; border-radius: 3px; height: 6px; transition: width 1s linear; position: absolute; top: 0; left: 0 } .audio__rate { color: #939393; cursor: pointer; background-color: #e2e2e2; border-radius: 58px; justify-content: center; align-items: center; width: 63px; height: 44px; margin-top: 3px; font-size: 20px; font-weight: 700; display: flex } .header-lead { grid-template-columns: repeat(2, minmax(0, 1fr)); -moz-column-gap: 60px; column-gap: 60px; padding-top: 76px; padding-bottom: 120px; display: grid } .header-lead__left { color: #fff } .header-lead__title { margin-bottom: 28px; font-size: 54px; font-weight: 900; line-height: 1.1 } .header-lead__subtitle { margin-bottom: 52px; margin-right: 100px; font-size: 24px; font-weight: 400; line-height: 34px } .header-lead__columns { justify-content: space-between; gap: 15%; max-width: 490px; margin-bottom: 52px; display: flex } .header-lead__item { width: -moz-max-content; width: max-content; max-width: 128px } .header-lead__value { margin: 0 0 4px; font-size: 44px; font-weight: 900; line-height: 1.2 } .header-lead__right { grid-template-rows: repeat(3, minmax(0, 1fr)); grid-template-columns: 57.5% minmax(0, 1fr); grid-auto-flow: column; gap: 12px; display: grid } .card { color: #939393; background-color: #fff; border-radius: 20px; flex-direction: column; justify-content: space-between; padding: 32px; transition: .5s ease-in-out; display: flex; position: relative; overflow: hidden } .card--main { background-position: center; background-repeat: no-repeat; background-size: 100%; grid-row: span 3 } .card--main:before { content: ""; border-radius: inherit; opacity: 0; background-color: #fff; transition: opacity .5s ease-in-out; position: absolute; inset: 0 } .card--main:hover { background-size: 120% } .card--main:hover:before { opacity: .5 } .card--little { border-radius: 24px; justify-content: flex-end; padding: 24px; font-size: 20px; font-weight: 700; position: relative } .card--little:after { content: ""; opacity: 0; background-image: url(../img/svg/arrow-card-left.svg); background-repeat: no-repeat; background-size: contain; width: 48px; height: 46px; transition: .5s ease-in-out; position: absolute; bottom: 32px; right: 60px } .card--little:hover { color: #fff; background-color: #ff7f23 } .card--little:hover:after { opacity: 1; transform: translateX(36px) } .card__title { color: #3d3d3d; font-size: 20px; font-weight: 700; position: relative } .card__description { font-size: 24px; font-weight: 400; transition: opacity .5s ease-in-out } .card__description span { position: relative } .card__description:before { content: ""; pointer-events: none; background-image: linear-gradient(rgba(255, 255, 255, 0) 35%, #fff 70%); position: absolute; inset: 0 } .reasons__examples { grid-template-columns: 295px 1fr; -moz-column-gap: 12px; column-gap: 12px; display: grid } .reasons__lead { color: #fff; background-color: #097359; border-radius: 24px; align-items: flex-end; padding: 32px 28px; font-size: 24px; font-weight: 700; line-height: 1.4; display: flex; position: relative; overflow: hidden } .reasons__lead:before { content: ""; background-image: url(../img/svg/reasons-star.svg); background-repeat: no-repeat; background-size: contain; width: 172px; height: 177px; transition: transform .2s linear; position: absolute; top: 0; left: 0; transform: translate3d(-30px, -40px, 0) rotate(-30deg) } .reasons__lead:hover:before { transform: translate3d(10px, 10px, 0) rotate(0) } .reasons__lead span { position: relative } .reasons__list { grid-template-columns: 1fr 1fr; gap: 20px; display: grid } .reasons__item { box-sizing: border-box; background-color: #f5f5f5; border-radius: 24px; min-height: 160px; padding: 28px } .reasons__item:hover .reasons__num { color: #097359 } .reasons__num { color: #939393; margin-bottom: 29px; font-size: 24px; font-weight: 700; transition: color .2s linear } .reasons__text { font-size: 16px } .sale__wrap-title { margin: 0 0 24px; font-size: 24px; line-height: 31px } .sale__products { grid-template-columns: repeat(3, minmax(0, 1fr)); -moz-column-gap: 32px; column-gap: 32px; margin-bottom: 60px; display: grid } .sale__list { grid-template-columns: repeat(4, 1fr) 1.25fr; gap: 20px; display: grid } .sale__item { box-sizing: border-box; color: inherit; background-color: #f5f5f5; border-radius: 24px; flex-direction: column; justify-content: space-between; align-items: flex-start; min-height: 220px; padding: 28px; font-size: 24px; font-weight: 700; line-height: 31px; text-decoration: none; transition: .5s ease-in-out; display: flex; position: relative } .sale__item:after { content: ""; opacity: 0; background-image: url(../img/svg/arrow-card-left.svg); background-repeat: no-repeat; background-size: contain; width: 60px; height: 57px; transition: .5s ease-in-out; position: absolute; bottom: 24px; right: 60px } .sale__item:hover { color: #fff; background-color: #ff7f23 } .sale__item:hover:after { opacity: 1; transform: translateX(36px) } .sale__item--green { color: #fff; background-color: #097359 } .sale__item--green:after { content: none } .sale__item-action { font-size: 20px; font-weight: 700 } .sale__item-action:after { content: ""; background-image: url(../img/svg/arrow-category.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 22px; margin-left: 8px; display: inline-block; position: relative; top: 6px } .stages__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; display: grid } .stages__item { background-color: #f5f5f5; border-radius: 24px; padding: 32px } .stages__item:before { content: ""; background-color: #f5f5f5; background-repeat: no-repeat; background-size: contain; width: 52px; height: 52px; margin-bottom: 28px; display: block } .stages__item--message:before { background-image: url(../img/svg/icon-message.svg) } .stages__item--phone:before { background-image: url(../img/svg/icon-phone.svg) } .stages__item--people:before { background-image: url(../img/svg/icon-people.svg) } .stages__item--bag:before { background-image: url(../img/svg/icon-bag.svg) } .stages__item--settings:before { background-image: url(../img/svg/icon-settings.svg) } .stages__item--book:before { background-image: url(../img/svg/icon-book.svg) } .stages__title { margin-bottom: 12px; font-size: 24px; line-height: 1.3 } .installation__list { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; display: grid } .installation__item { box-sizing: border-box; background-color: #f5f5f5; border-radius: 24px; flex-direction: column; grid-column: span 2; justify-content: space-between; min-height: 280px; padding: 32px; display: flex; position: relative } .installation__item:hover .installation__num { color: #097359 } .installation__item:nth-child(-n+2) { grid-column: span 3 } .installation__item:first-child { color: #fff; background-size: cover } .installation__item:first-child:hover .installation__num { color: inherit } .installation__item:first-child:before { content: ""; border-radius: inherit; pointer-events: none; background-color: rgba(0, 0, 0, .4); position: absolute; inset: 0 } .installation__item--icon { padding: 26px 24px; overflow: hidden } .installation__item--icon:hover:after { transform: rotate(0) translate(0) } .installation__item--icon:after { content: ""; pointer-events: none; background-position: 100% 100%; background-repeat: no-repeat; background-size: contain; width: 238px; height: 192px; transition: transform .5s ease-in-out; position: absolute; bottom: 0; right: 0; transform: rotate(15deg) translate(60px, 20px) } .installation__item--orange { background-color: #ff7f23 } .installation__item--orange:after { background-image: url(../img/svg/calculator.svg) } .installation__item--green { background-color: #097359 } .installation__item--green:after { background-image: url(../img/svg/estimates.svg) } .installation__num { margin-bottom: 8px; font-size: 24px; font-weight: 700; transition: color .2s ease-in; position: relative } .installation__title { font-size: 24px; font-weight: 700; position: relative } .installation__info { margin-top: auto; position: relative } .installation__link { color: #fff; font-size: 20px; font-weight: 700; position: relative } .installation__link:after { content: ""; background-image: url(../img/svg/arrow-category.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 22px; margin-left: 8px; display: inline-block; position: relative; top: 6px } .product { box-sizing: border-box; border: 1px solid #e2e2e2; border-radius: 24px; flex-direction: column; padding: 20px 28px 28px; transition: box-shadow .4s ease-in-out; display: flex } .product:hover { box-shadow: 0 4px 24px rgba(65, 65, 65, .1215686275) } .product:hover .product__image:after { opacity: 1 } .product:hover .product__btns { opacity: 1; pointer-events: auto } .product--sold .product__image { opacity: .6 } .product--sold .product__btns { color: #f13838; opacity: 1; transform: translateY(calc(-100% - 20px)) } .product__image { order: -1; align-items: center; height: 340px; display: flex; position: relative } .product__image:after { content: ""; opacity: 0; background-image: linear-gradient(rgba(255, 255, 255, 0) 40.59%, #fff 79.71%); transition: opacity .4s ease-in-out; position: absolute; inset: 0 } .product__image img { -o-object-fit: contain; object-fit: contain; width: 100%; height: auto; max-height: 100% } .product__rating { color: #939393; margin-bottom: 16px } .product__data { flex-direction: column; flex-grow: 1; justify-content: space-between; margin-top: 12px; display: flex; position: relative } .product__info { margin-bottom: 16px } .product__title { margin: 0 0 8px; font-size: 24px; font-weight: 700; line-height: 31px; display: block } .product__text { color: #939393; flex-wrap: wrap; -moz-column-gap: 4px; column-gap: 4px; display: flex } .product__text:not(:last-child) { margin-bottom: 8px } .product__price { color: #ff7f23; margin-top: auto; font-size: 24px; font-weight: 700; line-height: 31px } .product__btns { opacity: 0; pointer-events: none; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; width: 100%; transition: opacity .4s ease-in-out; display: flex; position: absolute; top: 0; transform: translateY(calc(-100% - 30px)) } .product__btns .button { text-align: center; flex-grow: 1; justify-content: center; padding: 8px 15px } .product__order { text-align: center; background-color: #f5f5f5; border-radius: 24px; flex-direction: column; justify-content: center; padding: 32px; display: flex } .product__order .input { background-color: #fff; width: 100%; margin-bottom: 24px } .product__order .button { width: 100%; margin-bottom: 12px } .product__order-title { margin-bottom: 40px } .product__order-info { margin-bottom: 24px } .product__order-sub { color: #939393; font-size: 12px } .product__order-sub a { color: #ff7f23 } .services__list { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; display: grid } .services__list--page .services__item { grid-column: span 4 } .services__item { box-sizing: border-box; background-color: #f5f5f5; border-radius: 24px; flex-direction: column; grid-column: span 3; justify-content: space-between; min-height: 200px; padding: 28px; transition: .4s ease-out; display: flex } .services__item:hover { color: #fff; background-color: #ff7f23 } .services__item:hover .services__info { color: #fff } .services__item:nth-child(-n+5) { grid-column: span 6 } .services__item:nth-child(-n+3) { grid-column: span 4 } .services__item--green { background-color: #097359; padding: 26px 24px; position: relative; overflow: hidden } .services__item--green:hover { background-color: #097359 } .services__item--green:hover:after { transform: rotate(0) translate(0) } .services__item--green:after { content: ""; pointer-events: none; background-image: url(../img/svg/settings.svg); background-position: 100% 100%; background-repeat: no-repeat; background-size: contain; width: 179px; height: 142px; transition: transform .5s ease-in-out; position: absolute; bottom: 0; right: 0; transform: rotate(15deg) translate(52px, 25px) } .services__name { margin-bottom: 6px; font-size: 24px } .services__info { color: #939393; margin-bottom: 10px; transition: color .4s ease-out } .services__data { margin-top: auto; font-weight: 700 } .services__data span:first-child { margin-right: 6px } .services__link { color: #fff; font-size: 20px; font-weight: 700; position: relative } .services__link:after { content: ""; background-image: url(../img/svg/arrow-category.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 22px; margin-left: 8px; display: inline-block; position: relative; top: 6px } .order-call__wrap { background-position: center; background-repeat: no-repeat; background-size: auto 100%; border-radius: 24px; padding: 40px 48px; transition: .2s ease-out } .order-call__wrap:hover { background-size: auto 105% } .order-call__data { box-sizing: border-box; background-color: #fff; border-radius: 24px; flex-direction: column; align-items: stretch; width: 472px; padding: 40px; display: flex } .order-call__data .section-title { text-align: center; margin-bottom: 40px } .order-call__data .section-title span { display: block } .order-call__data .input { margin-bottom: 24px } .order-call__data .button { margin-bottom: 12px } .order-call__info { text-align: center; margin-bottom: 24px } .order-call__personal { text-align: center; font-size: 12px } .order-call__personal a { color: #ff7f23 } .reviews { padding-bottom: 40px } .reviews--page { padding-bottom: 60px } .reviews--page .reviews__list { grid-template-columns: 1fr 1fr; gap: 40px; padding-bottom: 0; display: grid } .reviews--page .reviews__item { flex-direction: column; min-height: 480px; display: flex } .reviews--page .reviews__message { display: block } .reviews__top { justify-content: space-between; align-items: center; margin-bottom: 40px; display: flex } .reviews__top .section-title { margin-bottom: 0 } .reviews__swiper { position: relative; overflow: hidden } .reviews__list { padding-bottom: 20px } .reviews__btns { z-index: 2; flex-shrink: 0; grid-template-columns: repeat(2, minmax(0, 76px)); -moz-column-gap: 15px; column-gap: 15px; display: grid; position: relative } .reviews__btn { box-sizing: border-box; cursor: pointer; background-image: url(../img/svg/arrow-left.svg); background-position: center; background-repeat: no-repeat; background-size: 20px 20px; border: 1px solid #e2e2e2; border-radius: 8px; justify-content: center; align-items: center; width: 76px; height: 48px; transition: border-color .2s ease-out; display: flex } .reviews__btn--next { background-image: url(../img/svg/arrow-right.svg) } .reviews__btn:hover { border-color: #097359 } .reviews__btn.swiper-button-lock { display: flex } .reviews__item { box-sizing: border-box; border: 1px solid #e2e2e2; border-radius: 24px; min-height: 298px; padding: 32px; transition: box-shadow .3s ease-in; position: relative; overflow: hidden } .reviews__item:hover { box-shadow: 0 4px 24px rgba(65, 65, 65, .1215686275) } .reviews__item--video { color: #fff; background-position: center; background-repeat: no-repeat; background-size: 120%; flex-direction: column; justify-content: space-between; display: flex } .reviews__item--video:hover .reviews__poster-img { transform: scale(1.1) } .reviews__item--video:before { content: ""; background-color: rgba(0, 0, 0, .4); position: absolute; inset: 0 } .reviews__item--video .reviews__value { margin-bottom: 12px } .reviews__item--video .reviews__rating { color: inherit; font-size: 12px } .reviews__poster-img { z-index: -1; -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; transition: transform .3s ease-in; position: absolute; inset: 0 } .reviews__item-btn { z-index: 1; transition: transform .3s ease-in; position: relative } .reviews__item-btn:hover { transform: translate(-5px, -5px) } .reviews__value { color: inherit; flex-wrap: wrap; align-items: center; row-gap: 5px; margin-top: auto; display: flex; position: relative } .reviews__date { margin-right: 16px } .reviews__rating { color: #939393; align-items: center } .reviews__rating:after { margin-right: 12px } .reviews__author { color: inherit; position: relative } .reviews__author--with-icon { grid-template-columns: 48px 1fr; grid-auto-flow: row; -moz-column-gap: 20px; column-gap: 20px; margin-bottom: 28px; display: grid } .reviews__author-icon { color: #e2e2e2; background-color: #f5f5f5; border-radius: 50%; grid-row: span 2; justify-content: center; align-items: center; width: 48px; height: 48px; font-size: 24px; font-weight: 700; display: flex } .reviews__author-name { margin-bottom: 4px; font-weight: 700 } .reviews__name { margin-bottom: 12px; font-size: 24px } .reviews__message { text-overflow: ellipsis; -webkit-line-clamp: 3; -webkit-box-orient: vertical; margin-bottom: 24px; line-height: 1.3em; display: -webkit-box; overflow: hidden } .about-company { position: relative } .about-company:before { content: ""; z-index: -1; background-color: #f5f5f5; border-radius: 60px 60px 0 0; height: 246px; position: absolute; bottom: 0; left: 0; right: 0 } .about-company__wrap { grid-template-columns: minmax(0, 1fr) 300px; -moz-column-gap: 32px; column-gap: 32px; min-height: 460px; display: grid } .about-company__video { background-position: center; background-size: cover; border-radius: 24px; justify-content: center; align-items: center; display: flex; position: relative } .about-company__video:hover:before { background-color: rgba(0, 0, 0, .2784313725) } .about-company__video:before { content: ""; border-radius: inherit; background-color: rgba(0, 0, 0, .1019607843); transition: background-color .3s ease-in; position: absolute; inset: 0 } .about-company__green { box-sizing: border-box; color: #fff; background-color: #097359; border-radius: 24px; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: 24px; display: flex; position: relative; overflow: hidden } .about-company__green:hover:after { transform: translateX(0) } .about-company__green:after { content: ""; background-image: url(../img/svg/hand.svg); background-position: center; background-repeat: no-repeat; background-size: contain; width: 196px; height: 171px; transition: transform .4s ease-in-out; position: absolute; top: 55px; left: 0; transform: translateX(-70px) } .about-company__description { margin-bottom: 40px; font-size: 24px; font-weight: 700 } .about-company__link { font-size: 20px; font-weight: 700 } .about-company__link:after { content: ""; background-image: url(../img/svg/arrow-category.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 22px; margin-left: 5px; display: inline-block; position: relative; top: 6px } .blog { background-color: #f5f5f5; border-radius: 0 0 60px 60px } .blog__list { grid-template-rows: repeat(3, minmax(0, 1fr)); grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px; display: grid } .blog__item { grid-template-columns: 240px minmax(0, 1fr); gap: 20px; display: grid } .blog__item:hover .blog__detail, .blog__item:hover .blog__image:before { opacity: 1 } .blog__item:hover .blog__title { color: #ff7f23 } .blog__item--green { color: #fff; background-color: #097359; border-radius: 24px; flex-direction: column; justify-content: space-between; align-items: flex-start; padding: 28px; font-size: 24px; font-weight: 700; display: flex; position: relative; overflow: hidden } .blog__item--green:hover:after { transform: rotate(0) translate(0) } .blog__item--green:after { content: ""; pointer-events: none; background-image: url(../img/svg/information.svg); background-position: 100% 100%; background-repeat: no-repeat; background-size: contain; width: 241px; height: 194px; transition: transform .5s ease-in-out; position: absolute; bottom: 0; right: 0; transform: rotate(20deg) translate(50px, 15px) } .blog__image { box-sizing: border-box; background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 24px; align-items: flex-end; height: 240px; padding: 28px 24px; display: flex; position: relative } .blog__image:before { content: ""; border-radius: inherit; opacity: 0; background-image: linear-gradient(rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .7019607843) 100%); transition: opacity .2s ease-out; position: absolute; inset: 0 } .blog__content { flex-direction: column; justify-content: center; display: flex } .blog__tag-list { flex-wrap: wrap; margin-bottom: 8px; display: flex } .blog__tag-item { color: #fff; background-color: #ff7f23; border-radius: 8px; align-items: center; height: 24px; margin-right: 8px; padding: 0 8px; font-size: 12px; display: flex } .blog__title { margin-bottom: 16px; font-size: 24px; transition: opacity .2s ease-out } .blog__description { color: #939393; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.3em; display: -webkit-box; overflow: hidden } .blog__detail { color: #fff; opacity: 0; flex-wrap: wrap; justify-content: space-between; gap: 12px; width: 100%; transition: opacity .2s ease-out; display: flex; position: relative } .blog__link { font-weight: 700 } .blog__link:after { content: ""; background-image: url(../img/svg/arrow-category.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 14px; margin-left: 8px; display: inline-block; position: relative; top: 2px } .blog__more-link { font-size: 20px; font-weight: 700 } .blog__more-link:after { content: ""; background-image: url(../img/svg/arrow-category.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 22px; margin-left: 8px; display: inline-block; position: relative; top: 6px } .about-texts { flex-wrap: wrap; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; display: grid } .about-texts__item { background-color: #f5f5f5; border-radius: 24px; flex-direction: column; justify-content: space-between; padding: 28px; display: flex } .about-texts__item--big { background-color: #097359; flex: 0 100%; grid-column: 1/-1; gap: 35px; padding: 30px 28px } .about-texts__title { color: #939393; font-size: 24px; line-height: 1.3 } .about-texts__title--white { color: #fff; font-weight: 700 } .about-texts__text { color: #3d3d3d; margin-top: 20px; font-size: 16px } .about-company-video { padding-top: 19px } .about-company-video:before { display: none } .about-company-video .about-company__video { height: 100%; min-height: 580px } .about-requisites { flex-wrap: wrap; gap: 20px; padding-top: 80px; display: flex } .about-requisites__item { background-color: #f5f5f5; border-radius: 24px; width: 100%; max-width: calc(100% - 570px); padding: 40px } .about-requisites__item--small { width: 390px; max-width: 390px } .about-requisites__item--orange { background-color: #ff7f23 } .about-requisites__item--details .about-requisites__text:not(:last-child) { margin-bottom: 16px } .about-requisites__text--white { color: #fff } .about-requisites__text:not(:last-child) { margin-bottom: 20px } .about-requisites__title { color: #3d3d3d; margin-bottom: 32px; font-size: 20px; line-height: 1.3 } .guarantee { gap: 20px; display: flex } .guarantee__text { color: #fff; margin: 0; font-size: 24px; font-weight: 700; line-height: 1.3 } .guarantee__link { color: #fff; text-decoration: none } .guarantee__content { flex-direction: column; justify-content: space-between; gap: 20px; display: flex } .guarantee__title { color: #097359; margin: 0 0 40px; font-size: 24px; line-height: 1.3 } .guarantee__description { color: #3d3d3d; font-size: 16px; line-height: 1.3 } .guarantee__description:not(:last-child) { padding-bottom: 20px } .guarantee__block { background-color: #f5f5f5; border-radius: 24px; padding: 28px } .guarantee__block--green { background-color: #097359; border-radius: 24px; flex-direction: column; flex: 0 0 324px; justify-content: space-between; padding: 30px 28px; display: flex } .promotion { grid-template-columns: repeat(2, 1fr); gap: 28px; display: grid } .promotion__item--no-image { background-color: #f5f5f5; border-radius: 24px } .promotion__item--no-image .promotion__text { padding: 0 } .promotion__item--no-image .promotion__text .promotion__title { margin-bottom: 32px } .promotion__item--no-image .promotion__wrapper { padding: 32px } .promotion__item { flex-direction: column; height: 100%; display: flex } .promotion__text { background-color: #f5f5f5; border-radius: 24px; flex-grow: 1; margin-bottom: 8px; padding: 28px 32px } .promotion__title { margin: 0 0 12px; font-size: 24px; transition: color .2s } .promotion__title:hover { color: #ff7f23 } .promotion__title a { color: #3d3d3d; text-decoration: none; transition: color .2s } .promotion__title a:hover { color: #ff7f23 } .promotion__description { margin: 0 } .promotion__list { padding-left: 25px } .promotion__list-item { margin-bottom: 18px } .promotion__image { width: 100% } .promotion__image img { -o-object-fit: cover; object-fit: cover; border-radius: 24px; max-width: 100%; height: auto; min-height: 260px } .promotion__icon { background-color: #ff7f23; border-radius: 12px; justify-content: center; align-items: center; width: 50px; height: 50px; margin-bottom: 28px; display: flex } .how-place-order { flex-direction: column; gap: 32px; display: flex } .how-place-order__step { align-items: flex-start; gap: 40px; display: flex; position: relative } .how-place-order__step:after { content: ""; background-color: #ff7f23; width: 4px; height: calc(100% - 43px); position: absolute; top: 68px; left: 28px } .how-place-order__step:last-child:after { display: none } .how-place-order__number { color: #fff; background-color: #ff7f23; border-radius: 50px; flex-direction: column; flex: 0 0 60px; justify-content: center; align-items: center; max-width: 40px; height: 40px; padding: 10px; font-size: 24px; font-weight: 700; display: flex } .how-place-order__wrap { gap: 16px; display: flex } .how-place-order__content { background-color: #f5f5f5; border-radius: 24px; flex-direction: column; flex: 1 0 0; align-self: stretch; align-items: flex-start; gap: 20px; padding: 28px; display: flex } .how-place-order__title { color: #3d3d3d; font-size: 24px; line-height: 1.3 } .how-place-order__title--sub { font-size: 16px } .how-place-order__description { color: #666; font-size: 16px } .how-place-order__list { margin: 0; padding: 0 } .how-place-order__list li { color: #3d3d3d; padding-left: 12px; font-size: 16px; line-height: 1.3; list-style: none; position: relative } .how-place-order__list li:before { content: ""; background-color: #097359; border-radius: 50%; width: 5px; height: 5px; position: absolute; top: .5em; left: 0 } .how-place-order__list li:not(:last-child) { padding-bottom: 8px } .support-center { flex-direction: column; gap: 80px; padding-bottom: 60px; display: flex } .support-center__blocks { flex-wrap: wrap; gap: 20px; display: flex } .support-center__block { background-color: #f5f5f5; border-radius: 24px; flex-direction: column; justify-content: space-between; width: 100%; max-width: calc(33.333% - 70px); padding: 28px; display: flex } .support-center__block--big { flex-direction: row; justify-content: start; gap: 28px; width: 100%; max-width: 100%; padding: 24px 32px } .support-center__image { -o-object-fit: contain; object-fit: contain; width: 52px; height: 52px; display: block } .support-center__content { flex-direction: column; display: flex } .support-center__title { color: #3d3d3d; margin-bottom: 12px; font-size: 20px; line-height: 1.3 } .support-center__title--sub { margin-bottom: 39px; font-size: 16px } .support-center__text { color: #3d3d3d; font-size: 16px; line-height: 1.3 } .support-consultation { gap: 20px; display: flex } .support-consultation__form { background-color: #fff; border: 1px solid #e2e2e2; border-radius: 24px; width: 100%; max-width: 436px; padding: 32px } .support-consultation__form .consultation__title { margin: 0 0 28px; font-size: 24px } .support-consultation__form .consultation__form { flex-direction: column; gap: 24px } .support-consultation__form .consultation__form .button { width: 100%; padding: 8px 12px } .support-consultation__form .consultation__form input { width: 100% } .support-consultation__form .consultation__info { text-align: center } .support-consultation__content { background-color: #097359; border-radius: 24px; flex-direction: column; flex: 1 0 0; justify-content: space-between; padding: 50px 40px; display: flex } .support-consultation__text { color: #fff; font-size: 20px; font-weight: 700; line-height: 1.3 } .partners { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; display: grid } .partners__item { background-color: #fff; border: 1px solid #e2e2e2; border-radius: 24px; align-items: center; padding: 19px 23px; transition: box-shadow .3s linear; display: flex } .partners__item:hover { box-shadow: 0 4px 24px rgba(65, 65, 65, .1215686275) } .partners__image { -o-object-fit: contain; object-fit: contain; width: 80px; height: 80px; margin-right: 20px; display: block } .partners__title { color: #3d3d3d; margin-bottom: 4px; font-size: 20px; line-height: 1.3 } .partners__text { color: #939393; font-size: 16px; line-height: 1.3 } .legal-data { gap: 20px; display: flex } .legal-data__item { background-color: #f5f5f5; border-radius: 24px; width: 100%; max-width: 360px; padding: 40px } .legal-data__item--big { max-width: 100% } .legal-data__title { color: #3d3d3d; margin-bottom: 32px; font-size: 20px; line-height: 1.3 } .legal-data__text { color: #3d3d3d; font-size: 16px; line-height: 1.3 } .legal-data__text:not(:last-child) { margin-bottom: 16px } .delivery { grid-gap: 20px; grid-template-columns: calc(61.5% - 10px) calc(38.5% - 10px); display: grid } .delivery__item { flex-direction: column; height: 100%; display: flex } .refund { grid-gap: 20px; grid-template-columns: repeat(2, 1fr); display: grid } .refund__item { flex-direction: column; height: 100%; display: flex } .agreement-desc { margin-bottom: 13px } .stock-card-block { align-items: stretch; gap: 20px; display: flex } .stock-card-text { flex: 50%; height: auto } .stock-card-image { flex: 50%; align-items: stretch; height: auto } .stock-card-image img { -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; width: 100%; height: 100%; min-height: 330px } .customers { flex-wrap: wrap; gap: 20px; display: flex } .customers__item { color: #3d3d3d; background-color: #f5f5f5; border-radius: 24px; flex: 0 calc(33.333% - 78px); align-items: center; padding: 40px 32px; font-size: 20px; font-weight: 700; line-height: 1.3; display: flex } .customers__image { -o-object-fit: contain; object-fit: contain; height: 60px; margin-right: 32px } .catalog-page, .catalog-page__services { padding-top: 40px } .catalog-page__title { margin-bottom: 60px; font-size: 40px; font-weight: 900; line-height: 1.2 } .catalog-page__wrap { grid-template-columns: 260px 1fr; gap: 40px; display: grid } .catalog-page__wrap .sale__products { gap: 16px } .catalog-page__wrap .product { padding: 8px 20px 20px } .catalog-page__wrap .product__image { height: 280px } .catalog-page__sale .product__data-list { display: none } .catalog-page__top { flex-wrap: wrap; justify-content: space-between; align-items: center; row-gap: 12px; margin-bottom: 32px; display: flex } .catalog-page__top .select { margin-right: 16px } .catalog-page__filters-btn { background-color: #f5f5f5; border-radius: 8px; justify-content: center; align-items: center; width: 48px; height: 48px; margin-right: auto; display: none } .catalog-page__seo { grid-template-columns: 380px 1fr; grid-auto-flow: row; gap: 20px; display: grid } .catalog-page__seo-item { background-color: #f5f5f5; border-radius: 24px; flex-direction: column; justify-content: space-between; padding: 28px; font-size: 24px; display: flex } .catalog-page__seo-item:first-child { color: #fff; background-color: #097359; grid-row: 1/3; padding: 30px 28px; font-weight: 700 } .catalog-page__seo-item:first-child .catalog-page__seo-name { color: inherit } .catalog-page__seo-item:first-child .catalog-page__seo-text { font-size: inherit } .catalog-page__seo-name { color: #097359; margin-bottom: 40px; font-weight: 700 } .catalog-page__seo-text { font-size: 16px } .product-page { grid-template-columns: 320px 1fr 1fr; gap: 40px; padding-top: 40px; padding-bottom: 40px; display: grid } .product-page__slider { overflow: hidden } .product-page__slider-top { margin-bottom: 20px } .product-page__slider-top .swiper-slide img { -o-object-fit: contain; object-fit: contain; width: 100%; height: auto; max-height: 100% } .product-page__slider-bottom .swiper-slide { cursor: pointer; opacity: .4; width: 60px; height: 60px } .product-page__slider-bottom .swiper-slide img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover } .product-page__slider-bottom .swiper-slide-thumb-active { opacity: 1 } .product-page__title { margin-bottom: 20px; font-size: 40px; font-weight: 900; line-height: 1.2 } .product-page__about { color: #939393; flex-wrap: wrap; margin-bottom: 32px; display: flex } .product-page__rating { margin-right: 16px } .product-page__rating-count { margin-right: 28px } .product-page__descr { margin-bottom: 32px } .product-page__list { grid-auto-flow: row; row-gap: 8px; display: grid } .product-page__list dl { justify-content: space-between; align-items: flex-end; margin: 0; display: flex; position: relative } .product-page__list dl:nth-child(n+7) { display: none } .product-page__list dl:before { content: ""; border-bottom: 1px dotted #939393; position: absolute; bottom: 4px; left: 0; right: 0 } .product-page__list dd, .product-page__list dt { background-color: #fff; position: relative } .product-page__list dt { padding-right: 3px } .product-page__list dd { margin-left: 10px; padding-left: 3px } .product-page__link { color: #097359; font-weight: 700; display: none } .product-page__link:nth-child(n+8) { display: block } .product-page__price { border-radius: 24px; margin-bottom: 28px; padding: 40px; box-shadow: 0 4px 24px rgba(65, 65, 65, .1215686275) } .product-page__price .button { width: 100%; margin-bottom: 8px } .product-page__price .button:last-of-type { margin-bottom: 0 } .product-page__price-line { flex-wrap: wrap; font-size: 36px; font-weight: 900; line-height: 1.2; display: flex } .product-page__price-line span { white-space: nowrap; margin-bottom: 28px } .product-page__new-price { color: #ff7f23; margin-right: 20px } .product-page__old-price { color: #939393; text-decoration: line-through } .product-page__delivery { background-color: #f5f5f5; border-radius: 24px; align-items: center; padding: 20px 24px; display: flex } .product-page__delivery:before { content: ""; background-color: #ff7f23; background-image: url(../img/svg/vectortruck.svg); background-position: center; background-repeat: no-repeat; background-size: 28px 20px; border-radius: 12px; flex-shrink: 0; width: 52px; height: 52px; margin-right: 20px; display: block } .product-page__delivery-data { grid-auto-flow: row; row-gap: 4px; display: grid } .product-tabs { padding-top: 40px; padding-bottom: 40px } .product-tabs__list { -webkit-overflow-scrolling: touch; grid-template-columns: repeat(5, 1fr); display: grid; overflow-x: auto } .product-tabs__list::-webkit-scrollbar { background: 0 0; width: 0; display: none } .product-tabs__list::-webkit-scrollbar-button { background: 0 0; width: 0; display: none } .product-tabs__list::-webkit-scrollbar-track { background: 0 0; width: 0; display: none } .product-tabs__list::-webkit-scrollbar-thumb { background: 0 0; width: 0; display: none } .product-tabs__item { text-align: center; cursor: pointer; border-bottom: 1px solid #e2e2e2; padding: 0 5px 16px; transition: .2s linear } .product-tabs__item:hover { color: #097359; border-color: #097359 } .product-tabs__data-item { margin-top: 32px; display: none } .product-tabs__data-item .product-page__list { max-width: 500px } .product-tabs__data-item .product-page__list dl:nth-child(n+7) { display: flex } .product-tabs__data-item .documents__item { box-sizing: border-box } .product-tabs__radio:first-of-type:checked~.product-tabs__list .product-tabs__item:first-of-type { color: #097359; border-color: #097359 } .product-tabs__radio:first-of-type:checked~.product-tabs__data .product-tabs__data-item:first-of-type { display: block } .product-tabs__radio:nth-of-type(2):checked~.product-tabs__list .product-tabs__item:nth-of-type(2) { color: #097359; border-color: #097359 } .product-tabs__radio:nth-of-type(2):checked~.product-tabs__data .product-tabs__data-item:nth-of-type(2) { display: block } .product-tabs__radio:nth-of-type(3):checked~.product-tabs__list .product-tabs__item:nth-of-type(3) { color: #097359; border-color: #097359 } .product-tabs__radio:nth-of-type(3):checked~.product-tabs__data .product-tabs__data-item:nth-of-type(3) { display: block } .product-tabs__radio:nth-of-type(4):checked~.product-tabs__list .product-tabs__item:nth-of-type(4) { color: #097359; border-color: #097359 } .product-tabs__radio:nth-of-type(4):checked~.product-tabs__data .product-tabs__data-item:nth-of-type(4) { display: block } .product-tabs__radio:nth-of-type(5):checked~.product-tabs__list .product-tabs__item:nth-of-type(5) { color: #097359; border-color: #097359 } .product-tabs__radio:nth-of-type(5):checked~.product-tabs__data .product-tabs__data-item:nth-of-type(5) { display: block } .product-page__images { grid-auto-flow: column; justify-content: start; gap: 32px; display: grid } .product-page__docname { flex-wrap: wrap; gap: 12px 8px; margin-top: 20px; font-weight: 700; display: flex } .product-page__text { grid-template-columns: 392px 1fr; -moz-column-gap: 68px; column-gap: 68px; display: grid } .product-page__article-name { margin-bottom: 20px; font-size: 20px } .product-page__article-text p { margin-bottom: 22px } .product-page__article-text p:last-of-type { margin-bottom: 0 } .product-review, .product-sale { padding-top: 40px; overflow: hidden } .product-sale .sale__products { margin-bottom: 0 } .product-review { padding-bottom: 60px } .product-review .section-title { font-size: 28px; line-height: 1.3 } .product-review .reviews__list { padding-bottom: 0; display: flex } .product-review .reviews__btns { display: none } .product-review .reviews__btns button { border-color: #097359 } .choose { padding-bottom: 0 } .choose__descr { color: #fff; background-color: #ff7f23; border-radius: 24px; flex-direction: column; row-gap: 26px; margin-bottom: 24px; padding: 28px; font-size: 20px; font-weight: 700; display: flex } .choose__descr a { white-space: nowrap } .choose__content { grid-template-columns: 36.2% 1fr; gap: 24px 20px; display: grid } .choose__content-item { background-color: #f5f5f5; border-radius: 24px; flex-direction: column; justify-content: space-between; padding: 40px; display: flex; position: relative } .choose__content-icon { width: 67px; height: 72px; margin-bottom: 30px } .choose__item-title { color: #3d3d3d; margin-bottom: 9px; font-size: 20px; font-weight: 700 } .choose__mini-container { background-color: rgba(0, 0, 0, 0); grid-template: repeat(4, 1fr)/repeat(2, 1fr); gap: 12px; padding: 0; display: grid } .choose__mini-item { background-color: #f5f5f5; border-radius: 20px; align-items: center; padding: 24px 28px; display: flex } .choose__mini-item p { display: flex } .choose__mini-item span { color: #939393; margin-right: 16px; font-weight: 700 } .manual { box-sizing: border-box; grid-template-columns: repeat(3, 1fr); gap: 20px; display: grid } .manual__item { background-color: #f5f5f5; border-radius: 24px; align-items: center; padding: 32px; font-size: 20px; font-weight: 700; display: flex } .manual__item img { margin-right: 32px } .principle { padding-top: 20px } .principle h1 { margin-top: 20px; margin-bottom: 40px; font-size: 40px; font-weight: 900; line-height: 1.2 } .principle__descr { background-color: #f5f5f5; border-radius: 24px; flex-direction: column; row-gap: 22px; margin-bottom: 52px; padding: 20px 24px; display: flex } .principle__descr h2 { font-size: 16px } .principle__descr a { color: #ff7f23 } .principle__content-wrapper { grid-template-columns: 360px 1fr; gap: 32px; display: grid; position: relative } .principle__aside { flex-shrink: 0; align-self: flex-start; display: flex; position: sticky; top: 20px } .principle__aside-scroll:before { content: ""; background-color: #e2e2e2; border-radius: 40px; width: 4px; height: 100%; margin-right: 12px; display: block; position: relative } .principle__aside-scroll:after { content: ""; background-color: #ff7f23; border-radius: 40px; width: 4px; height: 25%; position: absolute; top: 0 } .principle__aside-links { flex-direction: column; gap: 20px; display: flex } .principle__aside-links a { transition: .3s; display: block } .principle__aside-links a:hover { color: #ff7f23 } .principle__content-group { margin-top: -40px; margin-bottom: 80px; padding-top: 40px } .principle__content-group h2 { margin-bottom: 32px; font-size: 20px } .principle__content-group h3 { margin-bottom: 20px; font-size: 16px } .principle__content-group img { border: 1px solid #e2e2e2; border-radius: 20px; width: 100%; height: auto; margin-bottom: 20px } .principle__content-group ul { flex-direction: column; padding: 0; list-style: none; display: flex } .principle__content-group ul li { margin-bottom: 12px; display: flex } .principle__content-group ul li:last-child { margin-bottom: 0 } .principle__content-group p { margin-bottom: 22px } .principle__content-group p:last-child, .principle__content-group:last-child { margin-bottom: 0 } .principle__content-group .principle__img-text { margin-bottom: 40px } .principle__content-group .principle__list-title { margin-bottom: 16px } .principle__img-box { grid-template-columns: repeat(2, 1fr); gap: 20px; margin-bottom: 20px; display: grid } .principle__img-box img { -o-object-fit: contain; object-fit: contain; height: 100%; margin: 0 } .principle__dotted-list li:before { content: ""; background-color: #097359; border-radius: 100%; flex-shrink: 0; width: 5px; height: 5px; margin-top: 7px; margin-right: 12px; display: block } .principle__paragraph-container { flex-direction: column; gap: 22px; margin-bottom: 20px; display: flex } .principle__paragraph-container p { margin: 0 } .principle__paragraph-container a { color: #ff7f23 } .principle__paragraph-bold { color: #000; font-weight: 700 } .principle__content-subgroup { margin-bottom: 32px } .principle__content-subgroup:last-child { margin-bottom: 0 } .principle__numbered-list { padding: 0; list-style: none } .principle__numbered-list li { align-items: start; margin-bottom: 12px; display: flex } .principle__numbered-list li:last-child { margin-bottom: 0 } .principle__numbered-list li span { color: #097359; margin-right: 12px } .principle__numbered-list li:before { display: none } .principle__tel-link { white-space: nowrap } .principle__price-link { color: #097359; align-items: center; font-weight: 700; display: flex } .principle__price-link:after { content: ""; background-image: url(../img/svg/arrow-card-right-green.svg); background-size: contain; width: 14px; height: 12px; margin-left: 9px; display: inline-block } .principle__img-group h2 { margin-bottom: 32px; font-size: 20px } .principle__img-group .principle__img-text { margin-bottom: 32px } .principle__img-subgroup { margin-top: 32px } .principle__img-subgroup h2 { margin-bottom: 16px; font-size: 16px } .principle__img-subgroup p { margin-bottom: 12px } .principle__img-subgroup span { color: #097359; margin-right: 8px } .principle__subgroup-item { margin-bottom: 40px } .principle__subgroup-item img { width: 100%; height: auto } .principle__subgroup-item:last-child { margin-bottom: 0 } .principle__content-text { margin-top: 32px } .text-section__card { box-sizing: border-box; color: #fff; background-color: #097359; border-radius: 24px; flex-direction: column; justify-content: space-between; align-items: flex-start; min-height: 192px; padding: 20px 24px; font-size: 24px; font-weight: 700; text-decoration: none; display: flex; position: relative } .text-section__card a { align-items: center; font-size: 16px; display: flex } .text-section__card a:before { content: ""; background: url(../img/svg/download-icon-white.svg) no-repeat; width: 20px; height: 20px; margin-right: 8px; display: block } .text-section__card:before { content: ""; background: url(../img/svg/gost-white.svg) 0 0/cover no-repeat; width: 100px; height: 75px; position: absolute; bottom: 20px; right: 20px } .glossarium { grid-template-columns: repeat(2, 1fr); gap: 16px; padding-top: 40px; display: grid } .glossarium__card { background-color: #f5f5f5; border-radius: 24px; flex-direction: column; gap: 12px; padding: 20px 24px 24px; display: flex } .glossarium__card h2 { font-size: 20px; font-weight: 700 } .technology { padding-top: 40px } .technology h1 { font-size: 40px } .technology__content { grid-template-columns: repeat(2, 1fr); gap: 20px; display: grid } .technology__content div { background-color: #f5f5f5; border-radius: 24px; padding: 32px } .technology__content img { margin-bottom: 28px } .technology__content h2 { margin-bottom: 12px } .technology__content p { margin-bottom: 23px } .technology__content p:last-child { margin-bottom: 0 } .materials { padding-top: 40px } .materials h1 { margin-bottom: 40px; font-size: 40px; font-weight: 900; line-height: 1.2 } .materials a { color: #ff7f23 } .materials__descr { background-color: #f5f5f5; border-radius: 24px; margin-bottom: 32px; padding: 20px 24px } .materials__content-row { grid-template-columns: 1fr 432px; gap: 8px; margin-bottom: 32px; display: grid } .materials__content-row:last-child { margin-bottom: 0 } .materials__content-row img { -o-object-fit: cover; object-fit: cover; border: 1px solid #e2e2e2; border-radius: 24px; width: 100%; height: 100% } .materials__row-descr { background-color: #f5f5f5; border-radius: 24px; padding: 28px 28px 32px } .materials__row-descr h2 { margin-bottom: 12px } .materials__row-descr p { margin-bottom: 22px } .materials__row-descr p:last-child { margin-bottom: 0 } .blog-page { padding-top: 20px } .blog-page__title { margin-bottom: 24px } .blog-page__btn-list { flex-wrap: wrap; align-items: center; display: flex } .blog-page__btn-list button { color: #3d3d3d; background-color: #e2e2e2; border: none; border-radius: 58px; margin-right: 8px; padding: 11px 20px; font-weight: 700; display: inline-block } .blog-page__btn-list button:last-child { margin-right: 0 } .blog-page__btn-list .is-active { color: #fff; background-color: #097359 } .blog-page__content { grid-template-columns: repeat(2, 1fr); gap: 40px 52px; margin-top: 52px; margin-bottom: 40px; display: grid } .blog-page__content-item:hover .blog-page__item-title { color: #ff7f23 } .blog-page__content-item:hover .blog-page__img-box:before, .blog-page__content-item:hover .blog-page__img-info { opacity: 1 } .blog-page__img-box { margin-bottom: 20px; position: relative } .blog-page__img-box img { border-radius: 24px; width: 100%; height: auto } .blog-page__img-box:before { content: ""; opacity: 0; background-image: linear-gradient(rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%); border-radius: 24px; transition: opacity .2s ease-out; position: absolute; inset: 0 } .blog-page__img-info { color: #fff; opacity: 0; justify-content: space-between; align-items: center; width: calc(100% - 48px); transition: opacity .2s ease-out; display: flex; position: absolute; bottom: 28px; left: 24px } .blog-page__img-info a:last-child { align-items: center; font-weight: 700; display: flex } .blog-page__img-info a:last-child:after { content: ""; background-image: url(../img/svg/arrow-category.svg); background-repeat: no-repeat; width: 20px; height: 20px; margin-left: 8px; display: inline-block } .blog-page__item-category { align-items: center; margin-bottom: 8px; display: flex } .blog-page__item-category div { color: #fff; background-color: #ff7f23; border-radius: 8px; margin-right: 8px; padding: 4px 8px; font-size: 12px } .blog-page__item-category div:last-child { margin-right: 0 } .blog-page__item-title { margin-bottom: 16px; font-size: 24px; transition: color .2s ease-out } .blog-page__item-text { color: #939393; -webkit-line-clamp: 7; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden } .portfolio { background-color: #f5f5f5; border-radius: 60px } .portfolio--page { background-color: rgba(0, 0, 0, 0); border-radius: 0 } .portfolio--page .portfolio__list { gap: 40px } .portfolio__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 52px 60px; display: grid } .portfolio__item { box-sizing: border-box } .portfolio__item:hover .portfolio__image .portfolio__image-details, .portfolio__item:hover .portfolio__image:before { opacity: 1 } .portfolio__item:hover .portfolio__title { color: #ff7f23 } .portfolio__item--green { color: #fff; background-color: #097359; border-radius: 24px; flex-direction: column; justify-content: space-between; height: -moz-max-content; height: max-content; min-height: 280px; padding: 28px; display: flex; position: relative; overflow: hidden } .portfolio__item--green:hover:after { transform: rotate(0) translate(0) } .portfolio__item--green:hover .portfolio__title { color: inherit } .portfolio__item--green:after { content: ""; pointer-events: none; background-image: url(../img/svg/blocknote.svg); background-position: 100% 100%; background-repeat: no-repeat; background-size: contain; width: 227px; height: 185px; transition: transform .5s ease-in-out; position: absolute; bottom: 0; right: 0; transform: rotate(15deg) translate(70px, 50px) } .portfolio__item--green .portfolio__link { z-index: 1; font-size: 20px; position: relative } .portfolio__item--green .portfolio__link:after { height: 20px; top: 5px } .portfolio__image { box-sizing: border-box; background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 24px; align-items: flex-end; min-height: 280px; margin-bottom: 20px; padding: 32px; display: flex; position: relative } .portfolio__image:before { content: ""; border-radius: inherit; opacity: 0; background-image: linear-gradient(rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%); transition: opacity .2s ease-out; position: absolute; inset: 0 } .portfolio__image-details { color: #fff; opacity: 0; justify-content: space-between; align-items: center; width: 100%; transition: opacity .2s ease-out; display: flex; position: relative } .portfolio__link { font-weight: 700 } .portfolio__link:after { content: ""; background-image: url(../img/svg/arrow-category.svg); background-repeat: no-repeat; background-size: contain; width: 20px; height: 14px; margin-left: 8px; display: inline-block; position: relative; top: 2px } .portfolio__title { margin-bottom: 8px; font-size: 24px; transition: color .2s ease-out } .portfolio__info { margin-bottom: 16px; line-height: 1.3em } .portfolio__sub { color: #939393; margin-bottom: 8px; line-height: 1.3em } .portfolio__data { color: #939393; max-height: 2.6em; margin: 0; padding: 0; list-style: none; overflow: hidden } .portfolio__data-item { line-height: 1.3 } .portfolio__data-item:before { content: "-"; margin-right: 3px; display: inline-block } .text-section__article-page { grid-template-rows: 1fr 44px; row-gap: 28px } .text-section__info { grid-column: 1; align-items: center; display: flex } .text-section__info time { margin-right: 20px; font-size: 24px } .text-section__info-wrapper { align-items: center; display: flex } .text-section__info-item { color: #939393; background-color: #f5f5f5; border-radius: 58px; align-items: center; margin-right: 8px; padding: 8px 16px; font-size: 20px; font-weight: 700; display: flex } .text-section__info-item:last-child { margin-right: 0 } .text-section__info-item:before { content: ""; background-repeat: no-repeat; background-size: contain; width: 24px; height: 24px; margin-right: 8px; display: block } .text-section__info-item--views:before { background-image: url(../img/svg/views-icon.svg) } .text-section__info-item--comments:before { background-image: url(../img/svg/chat-icon.svg) } .text-section__info-item--likes:before { background-image: url(../img/svg/like-icon.svg) } .text-section__info-item--share:before { background-image: url(../img/svg/share-icon.svg) } .article { grid-template-columns: 360px 1fr; gap: 32px; padding-top: 20px; padding-bottom: 30px; display: grid } .article__img-box { height: -moz-max-content; height: max-content; position: relative } .article__img-box img { -o-object-fit: cover; object-fit: cover; border-radius: 24px; width: 100%; height: auto; min-height: 260px } .article__img-box div { position: absolute; bottom: 28px; left: 24px } .article__img-box div span { color: #fff; background-color: #ff7f23; border-radius: 8px; margin-right: 8px; padding: 4px 8px; font-size: 12px } .article__descr p { background-color: #f5f5f5; border-radius: 24px; margin-bottom: 12px; padding: 22px 24px } .article__img-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px; display: grid } .article__img-grid img { -o-object-fit: cover; object-fit: cover; border: none; grid-column: span 6; max-height: 250px; margin-bottom: 0 } .article__img-grid img:nth-child(3) { grid-column: span 12; max-height: 340px } .principle-article .principle__list-title { margin-bottom: 20px } .comments { padding-top: 40px; padding-bottom: 50px } .comments h2 { margin-bottom: 40px; font-size: 36px; font-weight: 900 } .comments__wrapper { grid-template-columns: 1fr 392px; gap: 32px; margin-bottom: 20px; display: grid } .comments__wrapper:last-child { margin-bottom: 0 } .comments__comment-empty { box-sizing: border-box; background-color: #ff7f23; border-radius: 24px; height: 100%; padding-top: 80px; padding-left: 60px; position: relative } .comments__comment-empty p { z-index: 2; color: #fff; max-width: 376px; font-size: 36px; font-weight: 900; position: relative } .comments__comment-empty:before { content: ""; background-image: url(../img/svg/chat.svg); background-size: contain; width: 256px; height: 245px; display: block; position: absolute; top: 76px; right: 50px } .comments__comment { border: 1px solid #e2e2e2; border-radius: 24px; margin-bottom: 20px; padding: 40px } .comments__comment:last-child { margin-bottom: 0 } .comments__comment-info { align-items: start; margin-bottom: 40px; display: flex } .comments__comment-info img { margin-right: 20px } .comments__comment-info:nth-child(2) { padding-left: 64px } .comments__comment-info:last-child { margin-bottom: 0 } .comment__descr-name { margin-bottom: 4px; font-size: 16px; font-weight: 700 } .comment__descr-city { color: #939393; margin-bottom: 18px } .comments__form-wrapper { box-sizing: border-box; border: 1px solid #e2e2e2; border-radius: 24px; width: auto; max-height: 379px; padding: 28px; position: sticky; top: 20px } .comments__form-wrapper .section-title { text-align: center; margin-bottom: 28px; font-size: 24px; font-weight: 700; line-height: 1.3 } .comments__form-wrapper .input { margin-bottom: 16px } .comments__form-wrapper textarea.input { resize: none; height: 100px; padding: 8px 12px } .sale-page .sale__wrap-title { margin-bottom: 40px; font-size: 36px; font-weight: 900 } .sale-page .sale__products { margin-bottom: 0 } .blog__page-article { padding-bottom: 0 } .blog__page-article .blog-page__title { margin-bottom: 0; font-size: 36px; font-weight: 900 } .blog__page-article .blog-page__img-box img { max-height: 250px } .contacts { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; padding-bottom: 0; display: grid } .contacts__item { background-color: #f5f5f5; border-radius: 24px; grid-column: span 3; align-items: center; padding: 32px; display: flex } .contacts__item:nth-child(n+3) { grid-column: span 2 } .contacts__item img { margin-right: 24px } .contacts__item h2 { margin-bottom: 12px; font-size: 16px } .contacts__item p { color: #939393; flex-direction: column; display: flex } .map { padding-top: 80px; padding-bottom: 80px; overflow: hidden } .map>div { border-radius: 24px } .map iframe { border: none; width: 100%; height: 478px } .contacts-requisites { grid-template-columns: 470px 1fr; gap: 12px; padding-top: 0; display: grid } .contacts-requisites .about-requisites__item { width: auto; max-width: none; padding: 40px } .text-section__project-page { row-gap: 12px } .text-section__project-page h1 { flex-direction: column; display: flex } .text-section__project-page time { grid-column: 1; font-size: 24px; font-weight: 400 } .text-section__project-page .text-section__text { white-space: nowrap } .project-descr { grid-template-columns: repeat(2, 1fr); gap: 40px; padding-top: 20px; display: grid } .project-descr__card { background-color: #f5f5f5; border-radius: 24px; padding: 40px } .project-descr__card-item { margin-bottom: 32px } .project-descr__card-item h2 { margin-bottom: 8px; font-size: 20px } .project-descr__card-item:last-child { margin-bottom: 0 } .project-descr__item-price { color: #ff7f23; font-size: 20px; font-weight: 700 } .project-descr__img-box { gap: 12px; display: grid } .project-descr__img-box img { width: 100%; max-width: 141px; height: 100%; min-height: 100px; transition: .3s } .project-descr__img-box a { border-radius: 16px; overflow: hidden } .project-descr__img-box a:hover img { transform: scale(1.1) } .project-descr__main-img { border-radius: 20px; overflow: hidden } .project-descr__main-img:hover img { transform: scale(1.1) } .project-descr__main-img img { max-width: 600px; height: 100%; max-height: 331px } .project-descr__img-row { align-items: center; gap: 12px; display: flex } .project-descr__img-row a { width: 100% } .progress-project h2 { margin-bottom: 60px } .progress-project .progress__name { font-size: 20px } .progress-project .progress__item+.progress__item { margin-top: 20px } .reviews-page { grid-template-columns: 392px 1fr; gap: 60px; display: grid } .reviews-page h2 { margin-bottom: 32px; font-size: 24px } .reviews-page__product-container .product__btns { background-color: #fff; order: 1; margin-top: 0; margin-bottom: 19px } .reviews-page__product-container .product__rating { order: 2 } .reviews-page__product-container .product__info { order: 3 } .reviews-page__product-container .product__price { order: 4 } .product__info-mob { display: none } .reviews-page__review-container .reviews__item { height: 100%; max-height: 544px } .reviews__item-comment { flex-direction: column; display: flex } .reviews__item-comment .reviews__message { display: block } .documents-project { padding-top: 20px; padding-bottom: 60px } .documents-project h2 { margin-bottom: 32px } .document__content { display: flex } .document__content-container { margin-right: 32px } .document__content-container .documents__image { -o-object-fit: contain; object-fit: contain; border: none; width: 390px; height: 520px } .document__content-container h3 { margin-bottom: 20px; font-size: 16px } .document__content-container:last-child { margin-right: 0 } .services-page .index-lead+section { padding-top: 20px } .services-page .header-lead { padding-top: 55px; padding-bottom: 90px; overflow: hidden } .services-page .breadcrumbs__item { color: #fff; opacity: .8 } .services-page .breadcrumbs__item:last-child { opacity: 1 } .services-page .header-lead__title { margin-right: -95px } .services-page .header-lead__subtitle--middle { margin-bottom: 28px } .services-page .header-lead__image-wrap { align-self: end; margin-top: -70px; margin-bottom: -80px } .services-page .header-lead__image-wrap img { width: 650px; height: auto } .services-page .progress { padding-top: 40px } .services-page .progress .section-title { margin-bottom: 60px } .services-page .instruments, .services-page .reasons { padding-top: 40px } .services-page .instruments__orange { color: #fff; background-color: #ff7f23; border-radius: 24px; margin-bottom: 16px; padding: 28px; font-size: 20px; font-weight: 700 } .services-page .instruments__list { grid-template-columns: 1fr 1fr; -moz-column-gap: 16px; column-gap: 16px; display: grid } .services-page .instruments__list ul { background-color: #f5f5f5; border-radius: 24px; margin: 0; padding: 28px 32px; list-style: none } .services-page .instruments__list ul li { padding-left: 13px; position: relative } .services-page .instruments__list ul li:before { content: ""; background-color: #097359; border-radius: 50%; width: 5px; height: 5px; position: absolute; top: 10px; left: 0 } .services-page .instruments__list ul li+li { margin-top: 8px } .services-page .price-table { padding-top: 40px } .services-page .sale__products { margin-bottom: 0 } .services-page .faq { padding-top: 40px } .services-page .order-call { padding-top: 20px } .reasons-page .reasons__examples { grid-template-columns: 390px 1fr; gap: 16px } .reasons-page .reasons__examples+.reasons__examples { margin-top: 40px } .reasons-page .reasons__examples:first-child { min-height: 340px } .reasons-page .reasons__examples:first-child .reasons__item { flex-direction: column; justify-content: space-between; display: flex } .reasons-page .reasons__examples:last-child .reasons__lead { align-items: center; display: flex } .reasons-page .reasons__examples:last-child .reasons__lead:before { display: none } .reasons-page .reasons__examples:last-child p+p { margin-top: 22px } .reasons-page .reasons__examples:last-child a { white-space: nowrap } .reasons-page .reasons__list { gap: 12px } .reasons-page .reasons__num { color: #097359; margin-bottom: 0; font-size: 16px } .reasons-page .reasons__item { min-height: auto } .change h2 { margin-bottom: 60px; font-size: 36px; font-weight: 900; line-height: 1.2 } .change__row { grid-template-columns: 390px 1fr; gap: 20px; min-height: 320px; margin-bottom: 60px; display: grid } .change__row:last-child { margin-bottom: 0 } .change__item { background-color: #f5f5f5; border-radius: 24px; flex-direction: column; justify-content: end; padding: 40px; display: flex; position: relative } .change__item img { width: 71px; height: 74px; position: absolute; top: 40px; left: 30px } .change__item h3 { margin-bottom: 12px; font-size: 20px } .change__list { grid-auto-flow: row; gap: 12px; display: grid } .change__list--3 { grid-template-rows: repeat(3, minmax(0, 1fr)); display: grid } .change__subitem { background-color: #f5f5f5; border-radius: 20px; flex-grow: 1; align-items: center; padding: 24px 28px; display: flex } .change__subitem span { color: #939393; margin-right: 16px; font-weight: 700; transition: .3s } .change__subitem:hover span { color: #097359 } .offer h2 { margin-bottom: 40px; font-size: 36px; font-weight: 900; line-height: 1.2 } .offer__content { grid-template-columns: repeat(2, 1fr); gap: 20px; display: grid } .offer__content img { -o-object-fit: cover; object-fit: cover; border-radius: 24px; width: 100%; height: 100% } .offer__card { background-color: #f5f5f5; border-radius: 24px; padding: 32px } .offer__card h3 { margin-bottom: 20px; font-size: 20px; font-weight: 700 } .offer__card p+p { margin-top: 22px } .offer__card a { color: #097359; align-items: center; width: -moz-max-content; width: max-content; margin-top: 28px; font-size: 20px; font-weight: 700; display: flex } .offer__card a:after { content: ""; background-image: url(../img/svg/arrow-card-right-green.svg); background-repeat: no-repeat; background-size: contain; width: 22px; height: 17px; margin-left: 8px; display: block } .price-table__heading { justify-content: space-between; align-items: end; margin-bottom: 36px; display: flex } .price-table__heading h2 { font-size: 36px; font-weight: 900; line-height: 1.2 } .price-table__container { margin-bottom: 40px } .price-table__container:last-child { margin-bottom: 0 } .price-table__container h3 { color: #ff7f23; margin-bottom: 20px; font-size: 20px } .price-table__container p { margin-bottom: 20px } .price-table__container p:last-child { margin-bottom: 0 } .price-table__wrapper { border: 1px solid #e2e2e2; border-radius: 16px; margin-bottom: 20px; overflow: hidden } .price-table__table { border-collapse: collapse; width: 100% } .price-table__table--discount tbody td:nth-last-child(2) { color: #f13838 } .price-table__table thead { font-weight: 700 } .price-table__table thead td { vertical-align: top; border-top: none } .price-table__table tbody tr:nth-child(odd) { background-color: #fbfbfb } .price-table__table tr:first-child th { border-top: none } .price-table__table tr:last-child td { border-bottom: none } .price-table__table tr td:first-child { border-left: none } .price-table__table tr td:last-child { border-right: none } .price-table__table td { box-sizing: border-box; word-wrap: break-word; border: 1px solid #e2e2e2; width: 100vw; max-width: 176px; height: 60px; padding: 16px 12px } .price-table__table div { flex-direction: column; display: flex } .price-table__table .gray-text { color: #939393; margin-top: 4.45px } .cart-popup__wrapper { opacity: 1; visibility: visible; z-index: 20; background: rgba(0, 0, 0, .3019607843); justify-content: center; align-items: center; width: 100%; height: 100%; transition: .3s; display: flex; position: fixed; top: 0 } .cart-popup__wrapper--hidden { opacity: 0; visibility: hidden } .cart-popup { box-sizing: border-box; background-color: #fff; border-radius: 24px; flex-direction: column; align-items: center; max-width: 480px; height: auto; max-height: 100%; padding: 40px; display: flex; position: relative; overflow-y: auto; box-shadow: 0 4px 16px rgba(0, 0, 0, .0392156863) } .cart-popup::-webkit-scrollbar { display: none } .cart-popup h2 { text-align: center; margin-bottom: 40px; font-size: 40px; font-weight: 900 } .cart-popup__close { border: none; padding: 0; position: absolute; top: 20px; right: 20px } .cart-popup__form { flex-direction: column; width: 100%; display: flex } .cart-popup__form label { width: 100%; max-width: 400px; margin-bottom: 20px; position: relative } .cart-popup__form label:nth-last-child(3) { margin-bottom: 40px } .cart-popup__form .cart-popup__input-label { color: #939393; pointer-events: none; font-size: 16px; font-weight: 400; transition: .3s; position: absolute; top: 12px; left: 9px } .cart-popup__form input { box-sizing: border-box; border: 1px solid #e2e2e2; border-radius: 12px; width: 100%; padding: 12px; font-size: 16px; font-weight: 400 } .cart-popup__form input::-moz-placeholder { color: #939393 } .cart-popup__form input::placeholder { color: #939393 } .cart-popup__form input:focus { border: 1px solid #3d3d3d; outline: 0 } .cart-popup__form input:not(:-moz-placeholder-shown)+.cart-popup__input-label { background-color: #fff; padding: 0 3px; font-size: 12px; -moz-transition: .3s; transition: .3s; top: -7px; left: 9px } .cart-popup__form input:focus+.cart-popup__input-label, .cart-popup__form input:not(:placeholder-shown)+.cart-popup__input-label { background-color: #fff; padding: 0 3px; font-size: 12px; transition: .3s; top: -7px; left: 9px } .cart-popup__select { color: #939393; flex-direction: column; display: flex; position: relative } .cart-popup__select select { -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; border: 1px solid #e2e2e2; border-radius: 12px; padding: 12px; font-size: 16px; overflow: hidden } .cart-popup__select select:focus { outline: 0 } .cart-popup__select:after { content: ""; z-index: 20; background-image: url(../img/svg/arrow.svg); background-repeat: no-repeat; width: 12px; height: 12px; display: block; position: absolute; top: 14px; right: 12px } .cart-popup__select-label { background-color: #fff; padding: 0 3px; font-size: 12px; font-weight: 400; position: absolute; top: -7px; left: 9px } .cart-popup__self-delivery select { cursor: default; background-color: #f5f5f5; border: none; padding-top: 14px; padding-bottom: 14px; font-size: 12px } .cart-popup__self-delivery .cart-popup__select-label { z-index: 2; padding: 0; line-height: 80%; top: -5px } .cart-popup__self-delivery--hidden, .cart-popup__self-delivery:after { display: none } .cart-popup__label-delivery { display: block } .cart-popup__label-delivery--hidden { display: none } .cart-popup__form-submit { color: #fff; text-align: center; cursor: pointer; background-color: #ff7f23; border-radius: 8px; margin-bottom: 16px; padding: 13.5px; font-weight: 700 } .cart-page { padding-top: 40px; display: block } .cart-page .section-title { margin-bottom: 20px; font-size: 40px; line-height: 1.2; display: flex } .cart-page .section-title span { color: #939393; margin-left: 20px } .cart-page--hidden, .cart-page__quantity--hidden { display: none } .cart-page__content-wrapper { grid-template-columns: 2fr 372px; gap: 40px; padding-top: 40px; display: grid } .cart-page__content-wrapper--hidden { display: none } .cart-page__content-item { border-bottom: 1px solid #e2e2e2; grid-template-columns: 120px minmax(0, 360px) minmax(0, 268px); align-items: center; gap: 40px; padding: 20px 0; display: grid } .cart-page__content-item:first-child { padding-top: 0 } .cart-page__content-item:last-child { border: none; padding-bottom: 0 } .cart-page__content-item img, .cart-page__img-box { width: 120px; height: 120px } .cart-page__item-descr h2 { margin-bottom: 12px; font-size: 14px; font-weight: 600; line-height: 150% } .cart-page__descr-content { color: #939393; grid-template-columns: minmax(0, 124px) minmax(0, 190px); gap: 4px 24px; font-size: 12px; display: grid } .cart-page__descr-content p { min-width: 124px } .cart-page__btn-box { align-items: center; gap: 26px; width: 100%; margin-left: auto; display: flex } .cart-page__item-btns { align-items: center; display: flex } .cart-page__item-btns button { cursor: pointer } .cart-page__item-btns button path { transition: .3s } .cart-page__item-btns button:hover path { stroke: #097359 } .cart-page__btn-minus { margin-right: 12px } .cart-page__item-quantity { background-color: #f5f5f5; border-radius: 12px; padding: 9px 35px } .cart-page__btn-plus { margin-left: 12px } .cart-page__item-sum { white-space: nowrap; font-size: 20px; font-weight: 700 } .cart-page__aside-content { border-radius: 24px; margin-bottom: 28px; padding: 40px; box-shadow: 0 4px 24px rgba(65, 65, 65, .1215686275) } .cart-page__aside-content .button { width: 100% } .cart-page__total { justify-content: space-between; margin-bottom: 28px; font-size: 24px; font-weight: 700; display: flex } .cart-page__aside-btn { text-align: center; color: #fff; background-color: #ff7f23; border-radius: 8px; width: 100%; max-width: 292px; padding: 9.5px } .cart-page__aside-descr { background-color: #f5f5f5; border-radius: 24px; align-items: center; padding: 20px 20px 20px 24px; display: flex } .cart-page__aside-descr img { box-sizing: content-box; -o-object-fit: contain; object-fit: contain; background-color: #ff7f23; border-radius: 12px; width: 28px; height: 28px; margin-right: 20px; padding: 12px } .cart-page__aside-list--hidden { display: none } .cart-page__aside-list h2 { color: #939393; margin-top: 20px; font-size: 24px; font-weight: 400 } .cart-page__aside-list div { margin-bottom: 4px } .cart-page__aside-list div:last-child { margin-bottom: 0 } .cart-empty { flex-direction: column; justify-content: center; align-items: center; padding-top: 40px; padding-bottom: 0; display: flex } .cart-empty--hidden { display: none } .cart-empty h2 { color: #939393; margin-top: 20px; font-size: 24px; font-weight: 400 } .success-order { flex-direction: column; align-items: center; padding-top: 80px; display: none } .success-order h2 { margin: 20px 0; font-size: 28px; font-weight: 900 } .success-order p { text-align: center; font-size: 24px } .success-order--visible { display: flex } .sale--calc .sale__products { margin-bottom: 0 } .calc__title { margin-bottom: 60px; font-size: 40px; font-weight: 900; line-height: 1.2 } .calc__form+.calc__form { margin-top: 40px } .calc__form-title { margin-bottom: 20px; font-size: 20px } .calc__form-top { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-bottom: 20px; display: grid } .calc__form-top .select { width: 100%; min-width: auto } .calc__form-groups { grid-template-columns: repeat(6, 1fr); gap: 16px; display: grid } .calc__group { border: 1px solid #e2e2e2; border-radius: 24px; grid-column: 2 span; padding: 20px 28px 23px } .calc__group:nth-last-child(-n+2) { grid-column: 3 span } .calc__switcher { color: #939393; max-width: 100%; margin-bottom: 20px; font-weight: 700 } .calc__switcher:has(input:checked) { color: #3d3d3d } .calc__switcher:has(input:checked)+.calc__radios { color: #3d3d3d; pointer-events: auto } .calc__switcher:has(input:checked)+.calc__radios input:checked+.radio:after { background-color: #ff7f23 } .calc__switcher:has(input:checked)+.calc__radios .radio { width: -moz-max-content; width: max-content } .calc__switcher:has(input:checked)+.calc__radios .radio:before { border-color: #939393 } .calc__switcher .switcher { max-width: inherit } .calc__radios { color: #939393; pointer-events: none; grid-template-columns: repeat(3, 38px); gap: 12px 28px; display: grid } .calc__radios input:checked+.radio:after { background-color: #e2e2e2 } .calc__radios .radio:before { border-color: #e2e2e2 } .calc__form-bottom { grid-template-columns: 1fr 392px; gap: 32px; display: grid } .calc__sum { text-align: center; background-color: #f5f5f5; border-radius: 24px; flex-direction: column; justify-content: center; padding: 32px; display: flex } .calc__sum h3 { margin-bottom: 28px; font-size: 24px } .calc__sum .button { width: 100% } .calc__sum-price { color: #ff7f23; margin-bottom: 16px; font-size: 24px; font-weight: 700 } .calc__sum-desc { color: #939393; margin-bottom: 28px } .index-lead { background-position: center; background-repeat: no-repeat; background-size: cover; position: relative } .index-lead:after { content: ""; background: #fff; border-radius: 60px 60px 0 0; width: 100%; height: 60px; display: block; position: relative; bottom: -1px } .overflow { z-index: -1; opacity: 0; pointer-events: none; background-color: rgba(61, 61, 61, .4); transition: opacity .2s linear; position: fixed; inset: -50px } .visually-hidden { white-space: nowrap; -webkit-clip-path: inset(100%); clip-path: inset(100%); clip: rect(0 0 0 0); border: 0; width: 1px; height: 1px; margin: -1px; padding: 0; position: absolute; overflow: hidden } .select { border: 1px solid #e2e2e2; border-radius: 12px; width: -moz-max-content; width: max-content; min-width: 302px; position: relative } .select .select__name { color: #939393; background-color: #fff; padding: 3px; font-size: 12px; position: absolute; top: 0; left: 12px; transform: translateY(-50%) } .select select { color: inherit; text-overflow: ellipsis; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: rgba(0, 0, 0, 0); border: none; outline: 0; width: 100%; min-width: 100%; padding: 13px 40px 13px 12px; font-size: 16px; overflow: hidden } .select svg { width: 12px; height: 12px; position: absolute; top: 50%; right: 12px; transform: translateY(-50%) } .display-method { background-color: #f5f5f5; border-radius: 8px; grid-auto-flow: column; gap: 2px; margin-left: auto; padding: 2px 3px; display: grid } .display-method__item { color: #939393; cursor: pointer; background-color: rgba(0, 0, 0, 0); border-radius: 6px; padding: 16px } .display-method__item.is-active { color: inherit; cursor: auto; background-color: #fff } @media (max-width:744px) and (max-width:540px) { .about-requisites__item--details.about-requisites__item, .about-requisites__item--details.about-requisites__item--small { width: 100%; max-width: 100% } } @media (max-width:1440px) { .services-page .header-lead__image-wrap img { width: 45vw } } @media (max-width:1350px) { .menu__item:nth-child(n+9) { display: none } .menu__more { display: flex } .menu__more-list .menu__item:nth-child(n+3) { display: block } } @media (max-width:1300px) { .calc__group { grid-column: 1 span } .cart-page__content-wrapper { grid-template-columns: 1fr 300px } .cart-page__content-item { grid-template-columns: 120px minmax(0, 200px) minmax(0, 268px); gap: 20px } } @media (max-width:1250px) { .menu__more-list .menu__item:nth-child(n+2) { display: block } .menu__item:nth-child(n+8) { display: none } } @media (max-width:1200px) { .sale__list { grid-template-columns: repeat(12, minmax(0, 1fr)) } .sale__item:nth-child(-n+3) { grid-column: span 4 } .sale__item:nth-child(n+4) { grid-column: span 6 } } @media (max-width:1100px) { .menu__more-list .menu__item { display: block } .menu__item:nth-child(n+7) { display: none } } @media (max-width:1024px) { .container { padding-left: 28px; padding-right: 28px } .header-lead { grid-template-columns: auto; grid-auto-flow: row; row-gap: 40px; padding-top: 36px; padding-bottom: 80px } .header-lead__subtitle { margin-bottom: 28px; margin-right: 25% } .header-lead__columns { margin-bottom: 28px } .header-lead__right { grid-template-columns: 61% minmax(0, 1fr) } .section, .section-inner { padding-top: 40px; padding-bottom: 40px } .header__phone { margin-left: 28px } .filter { background-color: #f5f5f5; border-radius: 24px 24px 0 0; grid-template-columns: 1fr 1fr; gap: 16px; padding: 24px 28px } .filter__top { display: grid } .filter__wrap { background-color: #fff; border-radius: 16px; align-content: flex-start; row-gap: 0; padding: 20px } .filter__item--btns { grid-column: 1/-1; margin-top: 4px } .filter__item:not(:first-of-type):not(.filter__item--btns) { border-top: 1px solid #f0f0f0; padding-top: 28px } .filter__item:not(:last-of-type) { margin-bottom: 28px } .filter__item .checkbox:before, .filter__item .radio:before { order: 1; margin-left: auto; margin-right: 0 } .filter__item .checkbox:after, .filter__item .radio:after { left: auto; right: 4px } .filter__item-name { margin-bottom: 12px } .checkbox, .radio, .range { width: 100% } .range__sliders { font-size: 12px } .text-section { grid-template-columns: auto; grid-auto-flow: row; gap: 40px } .text-section__text br { display: none } .consultation { padding-top: 20px; padding-bottom: 80px } .consultation__form .button { width: 25% } .faq { padding-top: 20px } .progress__wrap { -moz-column-gap: 20px; column-gap: 20px } .progress__item--fix-big { grid-template-columns: 320px 1fr } .progress__item--big-fix { grid-template-columns: 1fr 320px } .progress__num { left: -88px } .card--main { background-position: top; background-size: 80%; min-height: 395px } .reasons { padding-top: 0 } .reasons__examples { grid-template-columns: 240px 1fr; -moz-column-gap: 16px; column-gap: 16px } .reasons__lead { padding: 24px } .reasons__list { gap: 12px } .reasons__item { min-height: auto; padding: 28px } .reasons__num { margin-bottom: 20px } .sale__products { gap: 20px } .sale__item { min-height: 180px } .sale__item-action { font-size: 16px } .sale__item-action:after { width: 14px; height: 16px } .stages__list { gap: 16px } .stages__item { padding: 28px; font-size: 15px } .installation__list { gap: 16px } .installation__link { font-size: 16px } .installation__link:after { width: 14px; height: 16px } .product { padding: 8px 20px 24px } .product:hover { box-shadow: 0 4px 24px rgba(65, 65, 65, .1215686275) } .product--sold .product__btns { transform: none } .product__image:after { content: none } .product__btns { opacity: 1; pointer-events: auto; flex-direction: column; align-items: stretch; row-gap: 8px; margin-top: 20px; position: static; transform: none } .services__list { gap: 16px } .services__item { min-height: 180px } .services__item .services__info { display: none } .services__item:nth-child(-n+5) .services__info { display: block } .services__item:nth-child(-n+3) .services__info { display: none } .services__link { font-size: 16px } .services__link:after { width: 14px; height: 16px } .order-call__wrap { padding: 20px } .reviews { padding-bottom: 20px } .reviews--page { padding-bottom: 40px } .reviews--page .reviews__list { gap: 32px } .about-company:before { border-radius: 40px 40px 0 0 } .about-company__wrap { min-height: 380px } .about-company__green:after { top: 25px } .about-company__link:after { width: 14px; height: 16px; top: 4px } .blog__list { grid-template-rows: auto; grid-template-columns: auto; grid-auto-flow: row; gap: 32px } .blog__item--green { gap: 42px } .blog__item--green:after { transform: rotate(20deg) translate(20px, 30px) } .blog__link:after { width: 14px; height: 16px; top: 5px } .blog__more-link { font-size: 16px } .blog__more-link:after { width: 14px; height: 16px } .about-texts { grid-template-columns: repeat(4, 1fr); gap: 10px; display: grid } .about-texts__item--big { gap: 34px } .about-texts__text { margin-top: 25px } .about-company-video { padding-top: 21px } .about-company-video .about-company__video { min-height: 520px } .about-requisites { gap: 12px; padding-top: 60px; padding-bottom: 60px } .about-requisites__item { max-width: calc(100% - 550px); padding: 32px } .about-requisites__item--small { width: 410px; max-width: 410px } .guarantee { padding-top: 40px; padding-bottom: 60px } .promotion { padding-top: 40px } .how-place-order { gap: 20px; padding-bottom: 60px } .how-place-order__step { gap: 20px } .support-center { gap: 60px; padding-bottom: 40px } .support-consultation { padding-bottom: 80px } .support-consultation__form { max-width: 410px } .support-consultation__content { padding: 32px 36px } .partners { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-bottom: 60px } .partners__item { flex: 0 calc(50% - 58px) } .legal-data__item { max-width: 297px } .delivery, .refund { grid-template-columns: repeat(2, 1fr) } .stock-card-image img { min-height: 423px } .customers { padding-bottom: 60px } .catalog-page, .catalog-page__services { padding-top: 20px } .catalog-page__wrap { grid-template-columns: 1fr } .catalog-page__wrap .product__image img { max-height: 100% } .catalog-page__sale .product { align-items: center; padding: 20px 20px 20px 16px } .catalog-page__sale .product .button { padding: 8px 10px } .catalog-page__filters-btn { display: flex } .catalog-page__filter { z-index: 10; pointer-events: none; transition: background-color .3s linear; position: fixed; inset: 0 } .catalog-page__filter.is-active { pointer-events: auto; background-color: rgba(0, 0, 0, .3019607843) } .catalog-page__filter.is-active .catalog-page__filter-wrap { transform: translateY(0) } .catalog-page__filter-wrap { -webkit-overflow-scrolling: touch; max-height: 100%; transition: transform .3s linear; position: absolute; bottom: 0; left: 0; right: 0; overflow-y: auto; transform: translateY(110vh) } .catalog-page__filter-wrap::-webkit-scrollbar { background: 0 0; width: 0; display: none } .catalog-page__filter-wrap::-webkit-scrollbar-button { background: 0 0; width: 0; display: none } .catalog-page__filter-wrap::-webkit-scrollbar-track { background: 0 0; width: 0; display: none } .catalog-page__filter-wrap::-webkit-scrollbar-thumb { background: 0 0; width: 0; display: none } .catalog-page__seo { padding-top: 40px } .product-page { grid-template-columns: 520px 1fr } .product-page__slider { grid-row: 1/3; height: -moz-max-content; height: max-content; position: sticky; top: 10px } .product-page__slider-bottom .swiper-slide { width: 140px; height: 140px } .product-tabs { padding-top: 20px } .product-tabs__data-item .documents__item, .product-tabs__data-item .documents__wrapper { max-width: 306px } .product-page__images { -moz-column-gap: 32px; column-gap: 32px } .product-page__text { grid-template-columns: 306px 1fr; -moz-column-gap: 32px; column-gap: 32px } .product-review, .product-sale { padding-top: 20px } .product-sale { padding-bottom: 20px } .product-review { padding-bottom: 40px } .choose__content { grid-template-columns: 1fr; gap: 24px 12px } .choose__content-item .choose__content-item:first-child, .choose__content-item .choose__content-item:nth-child(3) { margin-bottom: -12px } .choose__content-icon { margin-bottom: 24px } .choose__mini-container { flex-flow: column; display: flex } .choose__mini-item { padding: 20px 24px } .principle { padding-bottom: 60px } .principle__descr-page { margin-bottom: 40px } .principle__content-wrapper { grid-template-columns: 240px 1fr } .principle__content-group img { margin-bottom: 0 } .principle__content-group { margin-bottom: 60px } .principle__content-group .principle__content-img { margin-bottom: 20px } .principle__img-box img { max-height: 540px } .principle__img-box { grid-template-columns: 1fr 240px } .principle__subgroup-item img { max-height: 380px } .principle__kesson-text { margin-top: 20px } .text-section__card:before { width: 136px; height: 102px; display: inline-block } .text-section__card { min-height: 150px; margin-top: -7px } .glossarium { padding-top: 28px; padding-bottom: 60px } .technology { padding-bottom: 60px } .technology__content { grid-template-columns: repeat(2, 1fr); gap: 32px } .materials { padding-bottom: 60px } .materials__content-row { grid-template-columns: 1fr 380px } .blog-page__content { -moz-column-gap: 60px; column-gap: 60px } .blog-page__img-box img { -o-object-fit: cover; object-fit: cover; min-height: 250px } .blog-page__item-text { -webkit-line-clamp: 6 } .portfolio--page .portfolio__list { gap: 32px } .portfolio__list { gap: 44px 32px } .portfolio__item--green .portfolio__link { font-size: 16px } .portfolio__item--green .portfolio__link:after { height: 14px; top: 2px } .portfolio__link:after { width: 14px; height: 16px } .text-section__article-page { grid-template-rows: auto; gap: 33px } .text-section__info { order: 1 } .article { grid-template-columns: 240px 1fr; padding-bottom: 48px } .article__img-grid img { min-height: 250px } .principle-article { padding-bottom: 40px } .comments { padding-top: 40px; padding-bottom: 49px } .comments__wrapper { grid-template-columns: 1fr 380px; gap: 20px } .comments__comment-empty p { line-height: 1.2 } .comments__comment-empty:before { right: 32px } .comments__comment-empty { padding-top: 60px; padding-left: 40px } .blog__page-article .blog-page__content { margin-bottom: 55px } .contacts__item img { margin-bottom: 8px; margin-right: 0 } .contacts__item { flex-direction: column; align-items: start } .map { padding-top: 48px; padding-bottom: 48px } .map iframe { height: 380px } .contacts-requisites { grid-template-columns: 380px 1fr; gap: 20px; padding-bottom: 40px } .text-section__project-page time { margin-bottom: 28px } .text-section__project-page .text-section__text { margin-left: 3px } .text-section__project-page { grid-template-columns: 1fr } .project-descr { gap: 20px } .project-descr__main-img img { min-height: 373px } .progress-project h2 { margin-bottom: 52px } .reviews-page { grid-template-columns: 380px 1fr; gap: 40px } .reviews-page__product-container .product__data { flex-direction: column; margin-top: -95px; display: flex } .reviews-page__review-container .reviews__item { max-height: 531px } .documents-project { padding-bottom: 40px } .document__content-container { margin-right: 24px } .document__content-container .documents__image { width: 306px; max-height: 390px } .services-page .index-lead+section { padding-top: 0 } .services-page .header-lead { gap: 0; padding-top: 25px; padding-bottom: 40px } .services-page .header-lead__title { margin-right: 0 } .services-page .header-lead__image-wrap { margin-top: -105px; margin-bottom: 0 } .services-page .header-lead__image-wrap img { width: 64vw; margin-bottom: -45px; margin-left: auto } .services-page .instruments, .services-page .price-table, .services-page .progress { padding-top: 20px } .services-page .sale { padding-bottom: 20px } .services-page .faq { padding-top: 20px } .reasons-page { padding-bottom: 20px } .reasons-page .reasons__examples { grid-template-columns: 240px 1fr } .reasons-page .reasons__examples+.reasons__examples { margin-top: 28px } .reasons-page .reasons__examples:first-child { min-height: 352px } .reasons-page .reasons__examples:first-child .reasons__item { padding: 24px } .reasons-page .reasons__examples:first-child .reasons__list { grid-template-rows: auto } .reasons-page .reasons__examples:last-child .reasons__lead { padding: 24px } .reasons-page .reasons__examples .reasons__lead { padding-bottom: 32px } .reasons-page .reasons__item { padding: 24px } .change { padding-bottom: 20px } .change h2 { margin-bottom: 36px } .change__row { grid-template-columns: 290px 1fr; gap: 16px; min-height: auto; margin-bottom: 28px } .change__item img { top: 35px; left: 20px } .change__item { padding: 28px } .change__list--3 { grid-template-rows: auto } .change__subitem { align-items: start } .offer h2 { margin-bottom: 36px } .offer__content { grid-template-columns: 408px 1fr } .offer__card a { font-size: 16px } .offer__card { padding: 28px } .price-table__heading h2 { max-width: 640px } .price-table__table td { max-width: 137px } .cart-page { padding-bottom: 60px } .cart-page__descr-content { grid-template-columns: 1fr } .cart-page__btn-box { gap: 26px } .cart-page__aside-content { padding: 32px 28px } .cart-page__total { margin-bottom: 28px } .cart-page__aside-descr { flex-direction: column; align-items: start } .cart-page__aside-list { margin-top: 20px } .success-order { padding-top: 60px; padding-bottom: 60px } .sale--calc { padding-bottom: 20px } .calc__form+.calc__form { margin-top: 32px } .calc__form-top { grid-template-columns: repeat(2, minmax(0, 1fr)) } .calc__form-bottom { grid-template-columns: 1fr 309px; gap: 24px } .index-lead:after { border-radius: 40px 40px 0 0; height: 40px } .footer .container { padding-left: 28px; padding-right: 28px } .footer__top { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; display: grid } .footer__bottom { gap: 25px } } @media (max-width:1000px) { .cart-page__btn-box { flex-direction: column } } @media (max-width:900px) { body.show-catalog .overflow { opacity: 0; pointer-events: none } body.show-catalog .catalog-overflow { opacity: 1; pointer-events: auto } body.show-menu .menu-mobile { display: block } .header { z-index: 5; background-color: #fff; border-radius: 0 0 24px 24px; justify-content: space-between; align-items: center; padding: 20px 40px 24px; display: flex; position: sticky; top: 0; box-shadow: 0 4px 24px rgba(65, 65, 65, .1215686275) } .header__menu { border: none; margin: 0; padding: 0 } .header__location { display: none } .header__bottom { padding: 0 } .header__bottom form { display: none } .header__phone { color: transparent; background-color: #ff7f23; background-image: url(../img/svg/icon-phone.svg); background-repeat: no-repeat; background-size: contain; border-radius: 8px; width: 40px; height: 40px; margin-left: 0; font-size: 1px } .header__cart { display: none } .header-lead { padding-top: 130px } .index-lead .header { position: fixed; top: 0; left: 0; right: 0 } .menu { display: none } .catalog { border-radius: 24px 24px 0 0; max-height: 100vh; padding: 24px 28px 88px; position: fixed; inset: auto 0 0; overflow-y: auto } .catalog:has(.catalog__item:hover) { border-radius: 24px 24px 0 0 } .catalog__top { display: grid } .catalog__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px } .catalog__item { padding: 20px 32px 20px 16px } .catalog__item.is-active .catalog__inner-wrap { z-index: 1; transform: translateY(0) } .catalog__item:hover { color: inherit } .catalog__item img { width: 102px; height: 120px } .catalog__inner-wrap { background-color: #f5f5f5; border-radius: 24px 24px 0 0; width: auto; min-width: auto; max-height: 100vh; padding: 28px; position: fixed; bottom: 0; left: 0; right: 0; overflow: auto; transform: translateY(100%) } .catalog__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px } .catalog__link { background-color: #fff; border-radius: 16px; padding: 20px } .tap-bar { display: flex } .breadcrumbs { padding-bottom: 12px } .sale__products { grid-template-columns: repeat(2, minmax(0, 1fr)) } .product__image { max-width: 300px; margin-left: auto; margin-right: auto } .product__order { grid-column: 1/-1 } .services__list { grid-template-columns: repeat(2, minmax(0, 1fr)) } .services__list--page .services__item { grid-column: span 1 } .services__item { grid-column: span 1; min-height: 180px } .services__item:nth-child(-n+5) { grid-column: span 1 } .services__item:nth-child(-n+5) .services__info { display: none } .services__item:nth-child(-n+3) { grid-column: span 1 } .services__item--green { grid-column: span 2 } .services__info { display: none } .product-page { grid-template-columns: 450px 1fr } .product-page__slider { position: sticky; top: 100px } .manual { grid-template-columns: repeat(2, 1fr); gap: 16px } .comments__wrapper { grid-template-columns: 1fr } .comments__comment-empty:before { top: 69px; right: 40px } .comments__comment-empty { min-height: 359px; padding-top: 47px } .services-page .index-lead { padding-top: 84px } .calc__form-bottom { grid-template-columns: 1fr } .footer { display: none } } @media (max-width:850px) { .cart-page__content-wrapper { grid-template-columns: 1fr; padding-top: 20px } .cart-page__aside-btn { max-width: none } } @media (max-width:820px) { .product-page { grid-template-columns: 400px 1fr } } @media (max-width:747px) { .installation__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px } .installation__item, .installation__item:nth-child(-n+2) { grid-column: span 1 } } @media (max-width:744px) { .section-title { margin-bottom: 32px } .header-lead { padding-bottom: 40px } .header-lead__right { grid-template-columns: 64% minmax(0, 1fr) } .info-block__list { margin-top: 20px } .documents__items { grid-row-gap: 36px; grid-template-columns: repeat(2, 1fr) } .documents__link { margin-bottom: 16px } .menu-mobile .footer__bottom { row-gap: 24px } .filter { padding-bottom: 80px } .text-section { gap: 20px } .text-section__title { font-size: 36px } .consultation { padding-bottom: 60px } .about-service__video { min-height: 380px } .accordion__item { padding: 20px 32px 20px 28px } .accordion__title { padding-left: 76px; padding-right: 40px; font-size: 20px } .accordion__data { padding: 0 40px 0 76px } .progress__wrap { grid-template-columns: 48px 1fr } .progress__item { gap: 12px } .progress__item--big-fix, .progress__item--fix-big { grid-template-columns: 1fr } .progress__item+.progress__item { margin-top: 24px } .progress__num { width: 48px; height: 48px; font-size: 20px; left: -76px } .reasons__examples { grid-template-columns: none; grid-auto-flow: row; row-gap: 12px } .reasons__lead { padding: 32px 24px } .reasons__lead br { display: none } .reasons__lead:before { width: 126px; height: 121px; top: 0; left: auto; right: 0; transform: translate3d(-15px, -75px, 0) rotate(-30deg) } .reasons__lead:hover:before { transform: translate3d(0, -10px, 0) rotate(0) } .reasons__list { grid-template-columns: none; grid-auto-flow: row; gap: 8px } .reasons__num { margin-bottom: 21px } .sale__products { grid-template-columns: auto; grid-auto-flow: row; gap: 16px } .sale__list { gap: 12px } .sale__item { -webkit-hyphens: auto; hyphens: auto } .stages__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px } .product { flex-direction: row; padding: 20px 20px 20px 16px } .product__image { flex-shrink: 0; width: 240px; height: 100%; margin-right: 12px } .product__rating { margin-bottom: 20px } .product__data { margin-top: 0 } .product__info { margin-bottom: 20px } .product__btns { grid-template-columns: repeat(2, minmax(0, 1fr)); -moz-column-gap: 8px; column-gap: 8px; margin-top: 12px; display: grid } .product__order { padding: 40px 32px } .services__list { gap: 12px } .services__item--green:after { width: 270px; height: 210px } .order-call { padding-top: 20px } .order-call__wrap { padding: 0; background-image: none !important } .order-call__data { border: 1px solid #e2e2e2; width: 100%; padding: 40px 60px } .order-call__data .section-title { margin-bottom: 32px } .order-call__data .section-title span { display: inline } .order-call__info { margin-bottom: 20px } .reviews--page .reviews__list { grid-template-columns: 1fr; gap: 20px } .reviews--page .reviews__item { min-height: 400px } .reviews__top { margin-bottom: 32px } .about-company__wrap { grid-template-columns: auto; grid-auto-flow: row; row-gap: 12px; min-height: auto } .about-company__video { min-height: 380px } .about-company__green { justify-content: space-between; min-height: 180px } .about-company__green:hover:after { transform: rotateY(180deg) translateX(0) } .about-company__green:after { top: 10px; left: auto; right: -10px; transform: rotateY(180deg) translateX(-90px) } .blog__item--green { gap: 30px } .blog__more { padding-right: 100px } .blog__more-link:after { top: 5px } .about-texts { grid-template-columns: auto; grid-auto-flow: row; gap: 8px } .about-texts__item--big { gap: 22px; margin-bottom: 4px } .about-texts__text { margin-top: 12px } .about-company-video { padding-top: 0 } .about-company-video .about-company__video { min-height: 380px } .about-requisites { padding-top: 40px; padding-bottom: 40px } .about-requisites__item { max-width: calc(100% - 396px) } .about-requisites__item--small { width: 256px; max-width: 256px } .about-requisites__item--second .about-requisites__text:not(:last-child) { margin-bottom: 22px } .about-requisites__item--details .about-requisites__text:not(:last-child) { margin-bottom: 12px } .about-requisites__item--details { padding: 24px } .about-requisites__item--details.about-requisites__item { max-width: calc(100% - 378px) } .about-requisites__item--details.about-requisites__item--small { width: 270px; max-width: 270px } .about-requisites__text:not(:last-child) { margin-bottom: 12px } .about-requisites__title { margin-bottom: 16px } .guarantee { flex-direction: column; padding-bottom: 40px } .guarantee__text:not(:last-child) { padding-bottom: 72px } .guarantee__title { margin: 0 0 20px } .guarantee__block--green { flex: auto } .promotion { grid-template-columns: 1fr; gap: 40px } .promotion__image { width: 100%; height: 260px } .promotion__image img { width: 100%; height: 100% } .how-place-order { gap: 12px; padding-bottom: 40px } .how-place-order__step:after { height: calc(100% - 55px); top: 57px; left: 21px } .how-place-order__number { flex: 0 0 40px; max-width: 28px; height: 28px; font-size: 20px } .how-place-order__wrap { gap: 12px } .how-place-order__content { gap: 12px; padding: 24px } .how-place-order__title { font-size: 20px } .how-place-order__description:not(:last-child) { margin-bottom: 14px } .support-center { gap: 40px } .support-center__blocks { gap: 8px } .support-center__block { max-width: 100% } .support-center__block--big { margin-bottom: 4px } .support-center__title--sub { margin-bottom: 12px } .support-consultation { flex-direction: column-reverse; padding-bottom: 60px } .support-consultation__form { max-width: calc(100% - 64px) } .support-consultation__content { gap: 37px } .partners { gap: 16px; padding-bottom: 40px } .delivery { grid-template-columns: 1fr } .refund { grid-template-columns: 1fr; padding-top: 28px; padding-bottom: 28px } .agreement-desc { margin-bottom: 9px } .stock-card-image img { min-height: 380px } .stock-card-block { flex-direction: column } .stock-card-image { flex: 100%; width: 100%; height: auto } .customers { padding-bottom: 40px } .customers__item { flex: 0 calc(50% - 78px) } .catalog-page, .catalog-page__services { padding-top: 40px } .catalog-page__title { margin-bottom: 32px } .catalog-page__top { margin-bottom: 24px } .catalog-page__seo, .product-page { grid-template-columns: 1fr } .product-page__slider { grid-row: 1/2; position: static } .product-tabs__data-item .documents__item { max-width: 332px; height: -moz-max-content; height: max-content; position: sticky; top: 100px } .product-tabs__data-item .documents__wrapper { max-width: 332px } .product-page__images { -moz-column-gap: 24px; column-gap: 24px } .product-page__docname { margin-top: 16px } .product-page__text { grid-template-columns: 332px 1fr; -moz-column-gap: 24px; column-gap: 24px } .product-review, .product-sale { padding-top: 40px } .choose, .product-sale { padding-bottom: 40px } .choose__content-item { padding: 28px } .principle { padding-bottom: 40px } .principle__descr { margin-bottom: 32px } .principle__descr-page { margin-bottom: 20px } .principle__content-wrapper { display: block } .principle__aside { background-color: #fff; width: 100%; margin-bottom: 32px; padding: 20px 0; top: 70px } .principle__aside-page { margin-bottom: 20px } .principle__aside-scroll:after { top: 20px } .principle__aside-links { gap: 12px } .principle__content-group { margin-top: -200px; padding-top: 200px; margin-bottom: 40px } .principle__content-page img { -o-object-fit: contain; object-fit: contain; min-height: 440px } .principle__subgroup-item img { max-height: 340px } .text-section__card { margin-top: 12px } .text-section__card span { max-width: 400px } .glossarium { grid-template-columns: 1fr; padding-top: 20px; padding-bottom: 40px } .technology h1 { margin-bottom: 40px } .technology { padding-bottom: 40px } .technology__content { grid-template-columns: 1fr; gap: 24px } .materials { padding-bottom: 40px } .materials__descr { margin-bottom: 44px } .materials__content-row img { -o-object-fit: contain; object-fit: contain; max-height: 260px } .materials__content-row { grid-template-columns: 1fr; margin-bottom: 44px } .materials__content-row:nth-child(2) img { -o-object-fit: cover; object-fit: cover } .blog-page__content { -moz-column-gap: 32px; column-gap: 32px; margin-top: 32px } .blog-page__img-box img { min-height: 210px } .portfolio { border-radius: 40px } .portfolio--page .portfolio__list { row-gap: 40px } .portfolio__list { grid-template-columns: auto; grid-auto-flow: row; row-gap: 65px } .text-section__article-page .text-section__title { font-size: 40px } .article { grid-template-columns: 1fr } .article__img-box img { min-height: auto; max-height: 260px } .comments { padding-top: 20px; padding-bottom: 20px } .blog__page-article .blog-page__content { margin-bottom: 20px } .contacts { gap: 12px } .contacts__item { padding: 24px } .map { padding-top: 40px; padding-bottom: 40px } .map iframe { height: 280px } .contacts-requisites { grid-template-columns: 320px 1fr; gap: 12px } .contacts-requisites .about-requisites__item { padding: 24px } .text-section__project-page h1 { font-size: 40px } .project-descr { grid-template-columns: 1fr } .project-descr__card { padding: 28px } .project-descr__img-box img { max-width: 163px; max-height: 100px } .project-descr__main-img img { max-width: none; min-height: 373px } .progress-project .progress__name { margin-bottom: 17px } .progress-project .progress__item+.progress__item { margin-top: 16px } .progress-project { padding-top: 20px; padding-bottom: 20px } .reviews-page { grid-template-columns: 1fr; gap: 48px } .reviews-page h2 { margin-bottom: 24px } .reviews-page__product-container .product { max-height: 372px } .reviews-page__product-container .product__data { margin-top: 0; display: block } .reviews-page__product-container .product__btns { margin-top: 12px; margin-bottom: 0 } .reviews-page__product-container .product__image { height: 340px } .product__info-mob { display: block } .reviews-page__review-container .reviews__item-comment { max-height: 417px } .documents-project { padding-top: 8px; padding-bottom: 40px } .documents-project h2 { margin-bottom: 24px } .document__content-container .documents__image { width: 100%; max-height: 430px } .services-page .header-lead__image-wrap { margin-top: -75px } .services-page .header-lead__image-wrap img { width: 87vw; margin-bottom: -60px; margin-right: -27px } .services-page .services__item:last-child { grid-column: 1/-1 } .services-page .instruments .section-title, .services-page .progress .section-title { margin-bottom: 40px } .services-page .instruments__list { background-color: #f5f5f5; border-radius: 24px; grid-template-columns: 1fr; row-gap: 8px; padding: 28px 32px } .services-page .instruments__list ul { border-radius: 0; padding: 0 } .services-page .sale { padding-bottom: 40px } .reasons-page .reasons__examples { grid-template-columns: 1fr; gap: 12px } .reasons-page .reasons__examples+.reasons__examples { margin-top: 32px } .reasons-page .reasons__examples:last-child .reasons__lead { padding: 24px } .reasons-page .reasons__list { gap: 8px } .reasons-page .reasons__num { margin-bottom: 12px } .change { padding-top: 20px } .change__row { grid-template-columns: 1fr; gap: 12px; min-height: auto; margin-bottom: 33px } .change__item img { margin-right: 10px; position: relative; top: 5px; left: -10px } .change__item { flex-direction: row; justify-content: start; align-items: center; display: flex } .change__list { gap: 8px } .change__subitem { padding: 24px 28px } .offer { padding-top: 20px } .offer__content { grid-template-columns: 1fr; gap: 12px } .offer__content img { min-height: 220px; max-height: 260px } .offer__card a { margin-top: 20px } .price-table { padding-top: 20px } .price-table__heading { flex-direction: column; align-items: start; margin-bottom: 40px } .price-table__heading h2 { max-width: none; margin-bottom: 20px } .price-table__container { margin-bottom: 43px } .price-table__table td { max-width: 93px } .price-table__table td:first-child { max-width: 120px } .cart-page { padding-bottom: 40px } .cart-page__content-item { grid-template-columns: 120px minmax(0, 360px) minmax(0, 144px); gap: 32px } .cart-page__descr-content { grid-template-columns: 124px 190px } .cart-page__aside { grid-template-columns: 294px 1fr; gap: 28px; display: grid } .cart-page__aside-content { margin-bottom: 0 } .cart-page__total { margin-bottom: 28px } .cart-page__aside-descr { flex-direction: row; align-items: center } .cart-page__aside-list { padding-bottom: 20px } .cart-page__aside-list div { margin-top: 0 } .cart-empty { padding-bottom: 20px } .success-order { padding-top: 225px; padding-bottom: 225px } .sale--calc { padding-bottom: 40px } .calc__group { border-radius: 20px } .calc__sum { padding: 40px 32px } .display-method { display: none } .footer__bottom-item p { line-height: 1.6 } .footer__btn.is-active { color: #ff7f23 } .footer__btn.is-active svg { transform: rotate(180deg) } .footer__btn.is-active+.footer__list { visibility: visible; opacity: 1; pointer-events: auto; max-height: 500px; padding-top: 20px } .footer__top-item+.footer__btn { margin-top: 40px } } @media (max-width:740px) { .legal-data { gap: 12px } .legal-data__item { max-width: 272px; padding: 24px } .legal-data__title { margin-bottom: 16px } .legal-data__text:not(:last-child) { margin-bottom: 12px } } @media (max-width:700px) { .menu-mobile .footer__bottom { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: row } .catalog-page__sale .product__btns { grid-template-columns: 1fr } .services-page .price-table { padding-bottom: 20px } .price-table__wrapper { border: none } .price-table__table thead { display: none } .price-table__table tr { border: 1px solid #e2e2e2; border-radius: 16px; margin-bottom: 12px; padding: 16px 16px 20px; display: block } .price-table__table tr:last-child { margin-bottom: 0 } .price-table__table tr:last-child td { border-bottom: 1px solid #e2e2e2 } .price-table__table tr:last-child td:first-child, .price-table__table tr:last-child td:last-child { border-bottom: none } .price-table__table td { border: none; border-bottom: 1px solid #e2e2e2; justify-content: space-between; align-items: center; width: 100%; max-width: none; height: auto; padding: 8px 0 7px; font-size: 12px; display: flex } .price-table__table td:before { content: attr(data-label); color: #939393 } .price-table__table td:first-child { border: none; max-width: none; padding-top: 0; padding-bottom: 12px; display: block } .price-table__table td:nth-child(2) { padding-top: 0 } .price-table__table td:last-child { border-bottom: none; padding-bottom: 0 } .price-table__table div { flex-direction: row; font-size: 16px } .price-table__table .gray-text { margin-top: 0; margin-left: 8px } } @media (max-width:650px) { .reviews__item { min-height: auto; padding: 24px } .reviews__item--video { height: auto } .reviews__author--with-icon { margin-bottom: 20px } .reviews__name { font-size: 20px } } @media (max-width:630px) { .how-place-order { gap: 28px; padding-top: 20px; padding-bottom: 20px } .how-place-order__step:after { height: calc(100% - 27px); top: 48px; left: 16px } .how-place-order__step { gap: 12px } .how-place-order__number { flex: 0 0 36px; max-width: 16px; height: 16px; font-size: 16px } .how-place-order__wrap { flex-direction: column; gap: 8px } .how-place-order__content { padding: 20px } .how-place-order__title { font-size: 16px } } @media (max-width:600px) { .consultation .consultation__info { text-align: center; max-width: 300px; margin-top: 20px; margin-left: auto; margin-right: auto; font-size: 12px } .legal-data { flex-direction: column } .legal-data__item { box-sizing: border-box; max-width: 100% } } @media (max-width:540px) { .container { padding-left: 12px; padding-right: 12px } .header { padding: 16px 28px } .header__logo img { width: 60px; height: 28px } .header__bottom .button { display: none } .header-lead { row-gap: 32px; padding-top: 110px } .header-lead__left .button { width: 100% } .header-lead__title { font-size: 28px; line-height: 1.3 } .header-lead__subtitle { box-sizing: border-box; margin-bottom: 24px; margin-right: 15%; font-size: 20px; line-height: 1.4 } .header-lead__columns { justify-content: space-between; gap: 15px; margin-bottom: 24px; display: flex } .header-lead__item { width: auto } .header-lead__value { font-size: 36px } .header-lead__right { grid-template-columns: auto; grid-auto-flow: row; row-gap: 8px } .section-inner { padding-top: 20px; padding-bottom: 20px } .section-title { margin-bottom: 24px; font-size: 24px; font-weight: 700; line-height: 31px } .input { margin-bottom: 16px } .catalog { padding: 20px 12px 96px } .catalog__inner { grid-template-columns: auto; gap: 8px } .catalog__inner-wrap { padding: 20px 12px 96px } .catalog__top-name { font-size: 20px } .catalog__list { grid-template-columns: auto; gap: 8px } .catalog__item { padding: 4px 8px } .catalog__item img { width: 56px; height: 66px } .catalog__item-name { -webkit-hyphens: auto; hyphens: auto } .catalog__link { border-radius: 12px; padding: 12px 16px } .info-block__title { font-size: 20px } .info-block__icon { margin-bottom: 16px } .info-block__list { margin-top: 12px } .tap-bar { padding: 12px 24px } .tap-bar__item--tablet { display: none } .documents { padding-top: 20px; padding-bottom: 20px } .documents__items { grid-template-columns: 1fr; gap: 32px } .menu-mobile { z-index: 2; padding: 100px 16px } .menu-mobile .footer__top { grid-template-columns: 1fr; gap: 20px } .menu-mobile .footer__bottom { grid-template-columns: 1fr; row-gap: 38px } .menu-mobile .footer__logo { display: none } .menu-mobile__top>.button { min-height: 40px; margin-right: 12px; display: flex } .menu-mobile__phone { display: none } .filter { border-radius: 0; grid-template-columns: 1fr; gap: 0; padding: 12px 12px 80px } .filter__top { margin-bottom: 12px } .filter__title { font-size: 20px } .filter__wrap { padding: 16px } .filter__wrap--left { border-radius: 16px 16px 0 0; margin-bottom: 1px } .filter__wrap--right { border-radius: 0 0 16px 16px } .filter__item:not(:first-of-type):not(.filter__item--btns) { padding-top: 20px } .filter__item--btns { margin-top: 12px } .text-section { padding-top: 20px; padding-bottom: 20px } .text-section__title { font-size: 28px; line-height: 1.3 } .text-section__text { font-size: 16px } .consultation { padding: 32px 20px 52px } .consultation__title { margin: 0 0 20px; font-size: 24px } .consultation__form { flex-direction: column; gap: 16px } .consultation__form input { width: 100%; margin-bottom: 0 } .consultation__form .button { width: 100% } .chips { order: 1 } .more__btn { width: 100% } .about-service__video { min-height: 320px } .accordion__item { padding: 20px } .accordion__item.is-active .accordion__title:after { transform: translateY(0) rotate(180deg) } .accordion__title { min-height: none; padding: 75px 0 0 } .accordion__title:after { top: 0; transform: translateY(0) } .accordion__data { padding: 0 } .accordion__data-content { padding-top: 10px } .faq .accordion__data-content { padding-top: 12px } .faq .accordion__title { padding-top: 80px } .accordion__content-group { margin-bottom: 12px } .accordion__img-box img { border-radius: 12px } .accordion__table-row { background-color: #fff; border: 1px solid #e2e2e2; border-radius: 16px; grid-template-columns: 1fr; max-height: 116px; margin-bottom: 12px; padding: 16px 16px 20px } .accordion__table-row:last-child { margin-bottom: 0 } .accordion__table-head { display: none } .accordion__table-data { border: none; border-bottom: 1px solid #e2e2e2; justify-content: space-between; align-items: center; padding: 8px 0; font-size: 12px; display: flex } .accordion__table-data:first-child { padding-top: 0 } .accordion__table-data:last-child { border: none; padding-bottom: 0 } .accordion__table-data:before { content: attr(data-label); color: #939393 } .progress__item--horizontal { grid-template-columns: 1fr } .card--main { min-height: 295px } .card--little { border-radius: 20px; padding-right: 50px } .card--little:after { width: 38px; height: 36px; top: 50%; right: 20px; transform: translateY(-50%) } .card--little:hover:after { transform: translateY(-50%) } .card__description { font-size: 16px } .reasons__lead { border-radius: 20px; padding: 20px; font-size: 20px; line-height: 1.3 } .reasons__num { margin-bottom: 15px; font-size: 20px } .sale__wrap-title { font-size: 20px } .sale__list { grid-template-columns: auto; grid-auto-flow: row } .sale__item { min-height: 110px; padding: 24px; font-size: 20px; line-height: 26px } .sale__item:nth-child(-n+3), .sale__item:nth-child(n+4) { grid-column: span 1 } .sale__item:after { width: 38px; height: 36px; top: 50%; right: 20px; transform: translateY(-50%) } .sale__item:hover:after { transform: translateY(-50%) } .sale__item--green span:first-child { max-width: 200px } .sale__item-action { margin-top: 34px } .stages { padding-top: 20px; padding-bottom: 20px } .stages__list { grid-template-columns: minmax(0, 1fr) } .stages__item { padding: 24px } .stages__title { font-size: 20px } .installation__list { grid-template-columns: auto; grid-auto-flow: row } .installation__item { min-height: auto; padding: 24px } .installation__item:first-child { min-height: 230px } .installation__item--icon { padding: 24px } .installation__item--icon:after { content: none } .installation__num { font-size: 20px } .installation__title { margin-bottom: 20px; font-size: 20px } .installation__link { line-height: 26px } .product { flex-direction: column; width: 100%; padding: 8px 20px 24px } .product__image { justify-content: center; width: auto; max-width: 300px; height: 340px; margin-bottom: 12px; margin-left: auto; margin-right: auto } .product__rating { margin-bottom: 16px } .product__data { width: 100% } .product__info { margin-bottom: 16px } .product__btns { flex-wrap: wrap; row-gap: 8px; width: 100%; margin-top: 20px; display: flex } .product__order-title { font-size: 36px; line-height: 1.2 } .services__list { grid-template-columns: none; grid-auto-flow: row } .services__item { min-height: auto; padding: 24px } .services__item--green { grid-column: span 1; min-height: auto; padding: 24px } .services__item--green:after { content: none } .services__name { margin-bottom: 20px; font-size: 20px } .services__link { line-height: 26px } .order-call { padding-top: 0; padding-bottom: 40px } .order-call__data { padding: 24px } .order-call__data .section-title { margin-bottom: 20px } .order-call__data .section-title span { display: block } .order-call__data .input, .order-call__info { margin-bottom: 16px } .reviews--page { padding-top: 20px; padding-bottom: 20px } .reviews--page .reviews__item { min-height: 320px; padding: 28px } .reviews__top { margin-bottom: 24px } .reviews__list { padding-bottom: 72px } .reviews__btns { grid-template-columns: repeat(2, minmax(0, 135px)); -moz-column-gap: 20px; column-gap: 20px; width: -moz-max-content; width: max-content; margin: 0 auto; position: absolute; bottom: 0; left: 0; right: 0 } .reviews__btn { width: 135px } .reviews__item { border-radius: 20px } .reviews__author--with-icon { -moz-column-gap: 12px; column-gap: 12px } .about-company:before { border-radius: 24px 24px 0 0 } .about-company__video { min-height: 320px } .about-company__green { justify-content: space-between; min-height: 192px } .about-company__green:after { width: 140px; height: 109px; top: 50px; right: -10px; transform: rotateY(180deg) translateX(0) } .about-company__description { padding-right: 90px; font-size: 20px } .blog { padding-top: 20px; padding-bottom: 20px } .blog__item { grid-template-columns: auto; grid-auto-flow: row } .blog__item:hover .blog__title { color: inherit } .blog__item--green { padding: 24px } .blog__item--green:after { width: 153px; height: 115px; transform: rotate(0) translate(0) } .blog__image { padding: 24px } .blog__image:before { opacity: 1 } .blog__title { font-size: 20px } .blog__detail { opacity: 1 } .blog__more { margin-bottom: 40px; padding-right: 0; font-size: 20px } .about-texts { padding-top: 20px } .about-texts__item { padding: 24px } .about-texts__item--big { gap: 26px; padding: 20px 24px } .about-requisites { padding-top: 32px; padding-bottom: 20px } .about-requisites__item { max-width: 100%; padding: 24px } .about-requisites__item--small { width: 100%; max-width: 100% } .about-requisites__title { font-size: 16px } .guarantee { padding-top: 20px; padding-bottom: 20px } .support-consultation { gap: 12px; padding-bottom: 52px } .support-consultation__form { padding: 24px } .support-consultation__form .consultation__form input { margin-bottom: 0 } .partners { grid-template-columns: minmax(0, 1fr); gap: 12px; padding-top: 20px; padding-bottom: 20px } .partners__item { flex: 0 100% } .delivery, .legal-data, .refund, .stock-card { padding-top: 20px; padding-bottom: 20px } .stock-card-block { gap: 12px } .stock-card-image img { min-height: 260px } .customers { gap: 16px; padding-top: 20px; padding-bottom: 20px } .catalog-page, .catalog-page__services { padding-top: 20px; padding-bottom: 20px } .catalog-page__title { font-size: 24px; line-height: 1.3 } .catalog-page__seo { padding-top: 20px; padding-bottom: 20px } .catalog-page__seo-item { font-size: 20px } .product-page { padding-bottom: 20px } .product-page__slider-bottom .swiper-slide { width: 100px; height: 100px } .product-page__title { font-size: 36px } .product-page__about { row-gap: 8px } .product-page__price { padding: 20px } .product-page__price-line { font-size: 28px; line-height: 1.3 } .product-page__price-line span { margin-bottom: 20px } .product-page__delivery { padding: 16px } .product-page__delivery:before { margin-right: 16px } .product-tabs__item { padding: 0 16px 14px } .product-tabs__data-item .documents__item { width: 100%; max-width: 100%; position: static } .product-tabs__data-item .documents__wrapper { max-width: 100% } .product-page__images { grid-auto-flow: row; row-gap: 52px; padding-top: 0; padding-bottom: 0 } .product-page__text { grid-template-columns: 1fr; row-gap: 24px; padding-top: 0; padding-bottom: 0 } .product-review, .product-sale { padding-top: 20px } .product-review { padding-bottom: 20px } .product-review .section-title { font-size: 20px } .product-review .reviews__btns { margin-top: 24px; display: flex; position: static } .choose__descr { margin-bottom: 20px; padding: 20px; font-size: 16px } .choose__content { gap: 20px } .choose__content-item { padding: 24px } .choose__content-item .choose__content-item:first-child, .choose__content-item .choose__content-item:nth-child(3) { margin-bottom: -8px } .manual { grid-template-columns: 1fr; padding-top: 20px } .manual__item { padding: 28px 32px } .principle h1 { margin-top: 0; margin-bottom: 36px; font-size: 36px } .principle__descr { margin-bottom: 20px; padding: 16px } .principle__descr-page { margin-bottom: 12px } .principle__aside { margin-bottom: 22px; padding: 20px 0 10px } .principle__content-group { margin-top: -260px; padding-top: 260px; margin-bottom: 32px } .principle__content-group h2 { margin-bottom: 20px } .principle__content-group h3 { margin-bottom: 12px } .principle__img-box { grid-template-columns: 1fr } .principle__content-page h2 { margin-bottom: 32px } .principle__content-page img { min-height: 260px } .principle__subgroup-item img { max-height: 200px } .text-section__card { border-radius: 20px; min-height: 180px; padding: 16px 20px; font-size: 20px } .glossarium { gap: 12px; padding-bottom: 20px } .glossarium__card h2 { font-size: 16px } .glossarium__card { padding: 16px 20px 20px } .technology { padding-top: 20px } .technology h1 { margin-bottom: 36px; font-size: 36px; line-height: 1.2 } .technology__content div { border-radius: 20px; padding: 24px } .technology__content img { margin-bottom: 16px } .technology__content h2 { font-size: 20px } .materials { padding-top: 20px } .materials__descr { padding: 16px } .materials h1 { margin-bottom: 36px; font-size: 36px } .materials__content-row img { height: 200px } .materials__row-descr h2 { font-size: 20px } .materials__row-descr { padding: 16px } .blog-page__btn-list { row-gap: 8px } .blog-page__content { grid-template-columns: 1fr; gap: 24px } .blog-page__img-box img { min-height: 190px } .portfolio { border-radius: 24px; padding-top: 20px } .portfolio--page { padding-top: 20px; padding-bottom: 20px } .portfolio__list { row-gap: 40px } .portfolio__item--green { min-height: 192px; padding: 24px } .portfolio__item--green:after { content: none } .portfolio__item--green .portfolio__link { display: block } .portfolio__image { border-radius: 20px; margin-bottom: 12px; padding: 20px } .portfolio__image:before { opacity: 1; background-image: linear-gradient(rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .4) 100%) } .portfolio__image-details { opacity: 1 } .portfolio__link { display: none } .portfolio__title { font-size: 20px } .portfolio__sub { margin-bottom: 10px } .portfolio__date { display: block } .text-section__article-page .text-section__title { font-size: 36px; line-height: 1.2 } .text-section__info { flex-direction: column; align-items: start; row-gap: 12px } .text-section__info-item { padding: 11px 16px; font-size: 16px } .text-section__info-item:before { width: 20px; height: 20px } .article { gap: 20px } .article__img-box img { min-height: 260px; max-height: none } .article__descr p { padding: 16px } .article__img-grid img { grid-column: span 12; min-height: 240px } .article__img-grid { gap: 20px } .comments { padding-top: 20px; padding-bottom: 20px } .comments h2 { margin-bottom: 24px; font-size: 24px; font-weight: 700 } .comments__wrapper { gap: 12px } .comments__comment-empty p { font-size: 28px } .comments__comment-empty:before { width: 190px; height: 181px; top: 158px; right: 28px } .comments__comment-empty { padding: 28px } .comments__comment { padding: 20px } .comments__comment-info { margin-bottom: 20px } .comment__descr-text { margin-left: -67px } .sale-page .sale__wrap-title { margin-bottom: 24px; font-size: 24px } .blog__page-article .blog-page__title { margin-bottom: 32px; font-size: 24px } .blog__page-article .blog-page__content { gap: 40px; margin-bottom: 39px } .contacts { grid-template-columns: 1fr; padding-top: 20px } .contacts__item img { margin-bottom: 0; margin-right: 20px } .contacts__item { flex-direction: row; align-items: center; padding: 24px 20px } .map { padding-top: 32px; padding-bottom: 32px } .map iframe { height: 240px } .contacts-requisites { grid-template-columns: 1fr; padding-bottom: 20px } .text-section__project-page h1 { font-size: 28px } .text-section__project-page time { margin-bottom: 14px; font-size: 16px } .project-descr { padding-bottom: 20px } .project-descr__card { padding: 20px } .project-descr__card-item h2 { font-size: 16px } .project-descr__card-item { margin-bottom: 24px } .project-descr__item-price { font-size: 16px } .project-descr__img-box img { min-height: 80px; max-height: none } .project-descr__img-box { gap: 8px } .project-descr__main-img img { min-height: 272px } .project-descr__img-row a:last-child { display: none } .project-descr__img-row { gap: 8px } .progress-project h2 { margin-bottom: 28px } .progress-project .progress__name { margin-bottom: 14px; font-size: 16px } .reviews-page h2 { margin-bottom: 20px; font-size: 20px } .reviews-page__product-container .product { max-height: none } .reviews-page__product-container .product__btns { margin-top: 20px } .product__info-mob { display: none } .reviews-page__review-container .reviews__item { height: auto; max-height: none; padding: 32px } .reviews-page__review-container .reviews__item-comment { height: auto; max-height: none } .reviews-page__review-container .reviews__author { -moz-column-gap: 20px; column-gap: 20px; margin-bottom: 28px } .reviews-page__review-container .reviews__name { font-size: 24px } .documents-project { padding-bottom: 20px } .documents-project h2 { font-size: 20px } .document__content { flex-direction: column; gap: 32px } .document__content-container { margin-right: 0 } .document__content-container .documents__image { max-height: 440px } .services-page .index-lead { padding-top: 72px } .services-page .header-lead { gap: 32px; padding-top: 15px } .services-page .header-lead__subtitle--middle { margin-bottom: 24px } .services-page .header-lead__image-wrap { margin-top: 0 } .services-page .header-lead__image-wrap img { width: 110%; margin-top: -25px; margin-bottom: -47px; margin-left: -25px } .services-page .faq, .services-page .sale { padding-bottom: 20px } .reasons-page { padding-top: 20px } .reasons-page .reasons__examples .reasons__lead, .reasons-page .reasons__examples:first-child .reasons__item, .reasons-page .reasons__examples:last-child .reasons__lead { padding: 20px } .reasons-page .reasons__num { margin-bottom: 8px } .reasons-page .reasons__item { padding: 20px } .change h2 { margin-bottom: 24px; font-size: 24px } .change__item h3 { margin-bottom: 14px; font-size: 16px } .change__item, .change__subitem { padding: 20px } .offer { padding-bottom: 20px } .offer h2 { margin-bottom: 36px; font-size: 24px } .offer__content { gap: 8px } .offer__content .offer__card a { margin-bottom: 0 } .offer__card h3 { font-size: 16px } .offer__card { padding: 20px } .price-table__heading { margin-bottom: 28px } .price-table__heading h2 { font-size: 24px; font-weight: 700; line-height: 1.3 } .price-table__container { margin-bottom: 28px } .cart-popup__wrapper { z-index: 10; background: 0 0; align-items: start } .cart-popup h2 { margin-bottom: 29px; padding-top: 10px; font-size: 20px } .cart-popup { border-radius: 0; padding: 20px 12px 100px } .cart-popup__close { border: 1px solid #097359; padding: 10px; right: 12px } .cart-popup__form { height: 100% } .cart-popup__form-submit { margin-top: auto } .cart-page .section-title { margin-bottom: 16px; font-size: 36px } .cart-page { padding-top: 20px } .cart-page__content-item img { -o-object-fit: contain; object-fit: contain; width: 100px; height: 120px } .cart-page__content-item { grid-template-columns: 100px minmax(0, 240px); gap: 12px; margin-bottom: 20px; padding: 0 0 20px } .cart-page__content-item:last-child { margin-bottom: 0 } .cart-page__item-descr { margin-bottom: auto } .cart-page__descr-content { grid-column: 2; grid-template-columns: 1fr; margin-bottom: auto } .cart-page__btn-box { flex-direction: row; grid-column: 2 } .cart-page__item-btns { order: 1 } .cart-page__item-quantity { padding: 10px 30px } .cart-page__item-sum { font-size: 16px } .cart-page__aside { grid-template-columns: 1fr; gap: 20px } .cart-page__aside-descr { padding: 16px 16px 16px 12px } .cart-page__aside-descr img { margin-right: 16px } .success-order h2 { font-size: 24px } .success-order p { font-size: 16px } .success-order { padding-top: 60px; padding-bottom: 60px } .sale--calc { padding-bottom: 20px } .calc__title { margin-bottom: 36px; font-size: 36px } .calc__form-title { margin-bottom: 24px } .calc__form-top { grid-template-columns: 1fr; gap: 24px; margin-bottom: 24px } .calc__form-groups { grid-template-columns: 1fr } .calc__group { border-radius: 12px; grid-column: 1 span; padding: 20px 24px 22px } .calc__group:nth-last-child(-n+2) { grid-column: 1 span } .index-lead:after { height: 20px } .select { flex-grow: 1; min-width: auto } .footer__btn { justify-content: space-between; align-items: center; width: 100%; margin-bottom: 0; display: flex; position: relative } .footer__btn svg { display: block } .footer__list { visibility: hidden; opacity: 0; pointer-events: none; row-gap: 16px; max-height: 0 } .footer__list-item a { line-height: 1.5 } .footer__top-item { border-bottom: 1px solid #e2e2e2; padding-bottom: 20px } .footer__top-item+.footer__btn { margin-top: 20px } .footer__bottom-name { margin-bottom: 10px } } @media (max-width:375px) { .info-block { padding: 24px } .progress__wrap { grid-template-columns: 36px 1fr; -moz-column-gap: 12px; column-gap: 12px } .progress__num { width: 36px; height: 36px; font-size: 16px; left: -56px } .progress__card { padding: 20px } .progress__title { margin-bottom: 12px; font-size: 16px } .progress__name { margin-bottom: 12px } .about-texts__title { font-size: 20px } .about-company-video { margin-top: -9px } .about-company-video .about-company__video { min-height: 320px } .guarantee__text, .guarantee__title { font-size: 20px } .guarantee__description { font-size: 16px } .guarantee__description:not(:last-child) { padding-bottom: 23px } .guarantee__block, .guarantee__block--green { border-radius: 20px; padding: 24px } .promotion { box-sizing: border-box; gap: 28px; padding-top: 20px; padding-bottom: 20px } .support-center { gap: 32px; padding-bottom: 20px } .support-center__blocks { gap: 10px } .support-center__block { padding: 24px } .support-center__block--big { flex-direction: column; gap: 20px; padding: 24px } .support-center__title { margin-bottom: 8px; font-size: 16px } .support-consultation__content { gap: 45px; padding: 24px 28px } .legal-data__title { font-size: 16px } .customers__item { flex: 100%; padding: 32px } .reviews-page { gap: 40px; padding-top: 20px } .services-page .index-lead+section, .services-page .progress { padding-bottom: 20px } .services-page .instruments .section-title, .services-page .progress .section-title { margin-bottom: 24px } .services-page .instruments__orange { padding: 20px } .services-page .instruments__list { padding: 20px 24px } .offer__card a { margin-bottom: 16px } } @media (max-width:370px) { .pagination-item { display: none } .pagination-item.is-middle, .pagination-item:nth-child(-n+2), .pagination-item:nth-last-child(-n+2) { display: flex } } @media (max-width:365px) { .agreement-desc { margin-bottom: 8px } } @media (min-width:371px) and (max-width:540px) { .pagination-item { display: none } .pagination-item.is-middle, .pagination-item:nth-child(-n+3), .pagination-item:nth-last-child(-n+2) { display: flex } } @media (min-width:541px) and (max-width:744px) { .pagination-item { display: none } .pagination-item.is-middle, .pagination-item:nth-child(-n+4), .pagination-item:nth-last-child(-n+2) { display: flex } } @media (max-width:900px) and (min-width:541px) { .catalog-page__services .services__list { grid-template-columns: repeat(2, minmax(0, 1fr)) } .catalog-page__services .services__item:last-child { grid-column: 1/-1 } } @media (min-width:745px) { .catalog-page__sale.is-list .sale__products { grid-template-columns: 1fr } .catalog-page__sale.is-list .product { grid-template-columns: 240px auto 29.3%; align-items: center; gap: 12px; padding: 20px 28px 20px 16px; display: grid } .catalog-page__sale.is-list .product__image { align-self: center; max-height: 240px } .catalog-page__sale.is-list .product__image img { max-height: 100% } .catalog-page__sale.is-list .product__data-list { display: block } .catalog-page__sale.is-list .product__data-list .product__info { margin-top: 28px; margin-bottom: 28px } .catalog-page__sale.is-list .product__data { margin-top: 0; display: block } .catalog-page__sale.is-list .product__data .product__rating, .catalog-page__sale.is-list .product__data .product__text { display: none } .catalog-page__sale.is-list .product__rating { margin-bottom: 0 } .catalog-page__sale.is-list .product__btns { opacity: 1; margin-top: 44px; position: static; transform: none } } @media (min-width:745px) and (max-width:1024px) { .catalog-page__sale.is-list .product { grid-template-columns: 240px auto 28.5% } } @media (min-width:745px) and (max-width:1100px) { .catalog-page__sale.is-list .product { grid-template-columns: 160px auto 40% } } @media (min-width:745px) and (max-width:1200px) { .catalog-page__sale.is-list .product { grid-template-columns: 200px auto 35% } } @media (min-width:1025px) { .checkbox:hover:after, .radio:hover:after { background-color: #ff7f23 } .blog__item:nth-child(2) { grid-row: span 2; grid-template-columns: auto; grid-auto-flow: row } .blog__item:nth-child(2) .blog__content { display: block } .blog__item:nth-child(2) .blog__description { -webkit-line-clamp: 7 } } @media (min-width:1440px) { .container { padding-left: 100px; padding-right: 100px } .container--big-tb-padding { padding-top: 60px; padding-bottom: 60px } .footer .container { padding-left: 80px; padding-right: 80px } }