/*!
Theme Name: LPK Sibir
Author: devStonks
Author URI: https://devstonks.xyz/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: lpk-sibir
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

@import 'fonts_new/stylesheet.css';

:root {
    --green: #6DA640;
    --black: #343434;
    --gray: #9E9999;
    --light-gray: #E6E6E6;
    --brightest-gray: #F7F7F7;
}

*{
    box-sizing: border-box;
}

details summary {
    cursor: pointer;
    list-style: none;
}

details summary::-webkit-details-marker {
    display: none;
}

.none{
    display: none !important;
}
.txt-block > *:nth-child(1) {
    margin-top: 0;
}

.txt-block > *:last-child {
    margin-bottom: 0;
}

.cross {
    --width: 10px;
    --weight: 1px;
    --color: black;
    --angle: 45deg;
    grid-template-rows: var(--width);
    grid-template-columns: var(--width);
    overflow: hidden;
    border: none;
    background: none;
    display: grid;
    align-items: center;
    justify-content: center;
    justify-items: center;
    padding: 0;
}

.cross:before, .cross:after {
    content: '';
    width: calc(var(--width)*1.14);
    height: var(--weight);
    background: var(--color);
    transform-origin: center;
    grid-area: 1/1;
}

.cross:before {
    transform: rotate(var(--angle));
}

.cross:after {
    transform: rotate(calc(var(--angle) + 90deg));
}

.custom-dropdown{
    box-shadow: 0 0 0 1px var(--light-gray);
    background: white;
    font-size: 14px;
    min-width: 190px;
}
.custom-dropdown_value{
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    padding: 20px;
}
.custom-dropdown_value:after{
    content: '';
    width: 7px;
    height: 7px;
    flex-shrink: 0;
    border-right: 1px solid var(--gray);
    border-bottom: 1px solid var(--gray);
    transform: translate(-17%, 0) rotate(45deg);
}
[open] .custom-dropdown_value{
    padding: 20px 20px 15px 20px;
}
.custom-dropdown_content{
    color: var(--gray);
    padding: 0 20px 20px 20px;
}

[data-popup]>*{
    pointer-events: none;
}
#popup{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,.5);
    display: none;
    grid-template-columns: 100%;
    align-items: center;
    justify-items: center;
}
#popup.active{
    display: grid;
    z-index: 99;
}
.popup_content{
    background: white;
    width: 100%;
    max-width: 930px;
    max-height: 100%;
    overflow: auto;
    position: relative;
    padding: 25px 15px;
}
.popup_close{
    --color: var(--gray);
    --width: 12px;
    --weight: 1px;
    padding: 0;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}
#popup{
    .product-filters_title-wrapper{
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 0 40px 0;
    }
    .product-filters_title{
        font-size: 18px;
    }
    .product_filter .sort{
        margin: 0 0 60px 0;
        width: 100%;
    }
    .mobile-filter-list{
        display: grid;
        grid-template-columns: 100%;
        gap: 25px;
    }
    .filter_title-wrapper{
        display: flex;
        align-items: center;
        gap: 15px;
        font-size: 18px;
        font-weight: 500;
    }
    .filter_title-wrapper .popup_close{
        margin: 0 0 0 auto;
    }
    .filter_back{
        box-shadow: none;
        padding: 0;
        border: none;
        background: transparent;
        flex-shrink: 0;
    }
    .filter_back>*{
        pointer-events: none;
    }
    .filter_back :where(img, svg){
        width: 15px;
        height: auto;
        object-fit: contain;
    }
    .filter_back path{
        fill: var(--gray);
    }
    .filter_value-list{
        margin: 40px 0 0 0;
        display: grid;
        grid-template-columns: 100%;
        gap: 25px;
    }
    .value-item{
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .value-item_marker{
        width: 18px;
        height: 18px;
        border-radius: 50%;
        flex-shrink: 0;
        background: #FCFCFC;
        box-shadow: inset 0 0.32px 2.57px 0 #70707052, 0 0 0 1px #D3D3D3;
    }
    :checked+.value-item_marker{
        box-shadow: inset 0 0 0 4px var(--green);
    }
    .mobile-filter-item{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0;
        background: transparent;
        color: inherit;
        box-shadow: none;
    }
    .mobile-filter-item:hover{
        background: transparent;
        box-shadow: none;
    }
    .mobile-filter-item:after{
        content: '';
        width: 7px;
        height: 7px;
        flex-shrink: 0;
        border-right: 1px solid #9E9999;
        border-bottom: 1px solid #9E9999;
        transform: translate(-17%, 0) rotate(-45deg);
        margin: 0 0 0 auto;
    }
    .mobile-filter-item.sort{
        margin: 0 0 35px 0;
    }
    .mobile-filter-item.from-to{
        display: grid;
        grid-template-columns: 100%;
        gap: 10px;
    }
    .mobile-filter-item.from-to:after{
        display: none;
    }
    .from-to .mobile-filter-item_input{
        padding: 15px 20px;
        box-shadow: 0 0 0 1px var(--light-gray);
        border: none
    }
    .mobile-filter-item_input-grid{
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }
    .filter_footer{
        display: grid;
        grid-template-columns: 100%;
        gap: 10px;
        margin: 260px 0 0 0;
    }
    .filter_purge{
        background: var(--brightest-gray);
        color: var(--black);
        border-radius: 8px;
        font-size: 14px;
        padding: 1em;
        display: flex;
        justify-content: center;
        box-shadow: none;
    }
    .filter_apply{
        background: var(--green);
        color: white;
        border-radius: 8px;
        font-size: 14px;
        padding: 1em;
        display: flex;
        justify-content: center;
        box-shadow: none;
    }
}

.pagination{
    display: flex;
    gap: 5px;
    align-items: center;
}
.pagination_item{
    border: 1px solid var(--light-gray);
    font-size: 14px;
    height: 60px;
    width: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--black);
    text-decoration: none;
}
.pagination_item:visited{
    border-bottom-color: var(--light-gray);
    color: var(--black);
}
.pagination_item.active{
    border-color: var(--black);
}
.pagination_nav{
    width: 85px;
    border-color: var(--light-gray);
}
.pagination_nav :where(img, svg){
    width: 15px;
    height: auto;
    object-fit: contain;
}
.pagination_next{
    transform: scale(-1, 1);
}
.pagination_ellipses{
    border: 1px solid var(--light-gray);
    font-size: 14px;
    height: 60px;
    width: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--black);
}

     /* основное */
.modalbuttons {
    display: flex;
    gap: 10px;
    flex-flow: row;
    margin-top: 15px;
    flex-flow: row;
    justify-content: center;
}

.modalbuttons .btn1 {
    padding: 10px;
}

.mobmenuwrap {
    display: none;
}

input[type="number"] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
}

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    cursor: pointer;
}

.slct {
    position: relative;
}

.slct:after {
    content: "";
    position: absolute;
    bottom: 21px;
    right: 20px;
    display: block;
    width: 8px;
    height: 2px;
    transition: all 0.3s ease-out;
    background-color: #fff;
    transform: translate(-3px, -50%) rotate(45deg);
    z-index: 10;
}

.slct:before {
    content: "";
    position: absolute;
    bottom: 21px;
    right: 20px;
    display: block;
    width: 8px;
    height: 2px;
    transition: all 0.3s ease-out;
    background-color: #fff;
    transform: translate(3px, -50%) rotate(-45deg);
    z-index: 10;
}

.slct select {
    font-size: 14px;
    font-weight: 400;
    width: 95px;
    outline: 0;
    border: 0;
    padding: 0;
    color: #fff;
    border-radius: 8px;
    padding: 15px 10px;
    cursor: pointer;
    background-color: transparent;
    font-family: 'Klimat', sans-serif;
}

.slct:focus:after {
    transform: translate(3px, -50%) rotate(-90deg);
}

.slct:focus:before {
    transform: translate(3px, -50%) rotate(-90deg);
}

select::-ms-expand {
    display: none;
}

.edin2 {
    width: 100% !important;
    max-width: 54px;
    margin-left: 10px;
    display: inline-block;
}

.edin2 select {
    width: auto;
    padding: 7px 8px 7px 8px;
    max-width: 54px;
    margin-left: 0;
    width: 100%;
}

.edin2:after {
    content: "";
    position: absolute;
    bottom: 12px;
    right: 10px;
    display: block;
    width: 8px;
    height: 2px;
    transition: all 0.3s ease-out;
    background-color: #fff;
    transform: translate(-3px, -50%) rotate(45deg);
    z-index: 10;
}

.edin2:before {
    content: "";
    position: absolute;
    bottom: 12px;
    right: 10px;
    display: block;
    width: 8px;
    height: 2px;
    transition: all 0.3s ease-out;
    background-color: #fff;
    transform: translate(3px, -50%) rotate(-45deg);
    z-index: 10;
}

body {
    background: #ffffff;
    -webkit-text-size-adjust: 100%;
}

html, body, div, table, tr, td, li, ul, p {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 16px;
    font-weight: 400;
    font-family: 'Klimat', sans-serif;
    vertical-align: top;
}

img {
    border: 0;
    max-width: 100%;
    height: auto;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    margin: 0;
    text-align: left;
    display: block;
    font-family: 'Klimat', sans-serif;
    font-weight: 700;
    color: #000;
}

.cl {
    clear: both
}

.wrap {
    width: 100%;
    height: auto;
}

.wr {
    margin: auto;
    position: relative;
}

a, a:visited {
    /* text-decoration: none;
    color: #549733;
    border-bottom: 1px solid;
    transition: .5s; */
}

a:hover, a:visited:hover, a:focus {
    text-decoration: none;
    color: #3a791b;
}

.tphone {
    display: none;
}

.tphone a {
    color: #000 !important
}

input {
    font-family: inherit;
}

.thx {
    background: #fff;
}

button {
    position: relative;
    cursor: pointer;
    font-family: 'Klimat', sans-serif;
    border: 0;
    outline: 0;
    color: #fff;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    transition: all 0.5s;
}

.bounce {
    animation-name: bounce;
    animation-timing-function: ease;
    animation-duration: 6s;
    animation-iteration-count: infinite;
}

.nalichiye {
    display: flex;
    align-items: center;
    gap: .5em;
    font-size: 16px;
    color: var(--black, #343434);   /* контрастнее #9E9999 — заметнее сигнал «в наличии» */
    margin: 5px 0 0 0;
}

.nalichiye:before {
    content: '';
    width: 12px;
    height: 12px;
    background: var(--green);
    flex-shrink: 0;
    border-radius: 50%;
}

@keyframes bounce {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(20px);
    }
    100% {
        transform: translateY(0);
    }
}


@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(112, 168, 66, 0.6);
    }
    70% {
        box-shadow: 0 0 0 30px rgba(112, 168, 66, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(112, 168, 66, 0);
    }
}



/* база */
h1, .h1 {
    font-size: 44px;
    color: #fff;
}

h2, .h2 {
    font-size: 32px;
    font-weight: 600;
}

h3, .h3 {
    font-size: 24px;
}

h4, .h4 {
    font-size: 18px;
}

h5, .h5 {
    font-size: 17px;
}

.wrap {
    width: 100%;
    height: auto;
}

.wr {
    max-width: 1360px;
    padding-right: 50px;
    padding-left: 50px;
    margin: auto;
}

button {
    transition: all 0.4s ease;
    font-size: 17px;
    font-weight: 400;
    padding: 25px 44px;
    background: linear-gradient(to bottom, #70a842, #418123);
    border-radius: 7px;
    box-shadow: 0 10px 20px rgba(65, 130, 40, 0.4);
}

button:hover {
    background: linear-gradient(to bottom, #70a842, #4c8e2d);
    box-shadow: 0 10px 20px rgba(65, 130, 40, 0.6);
}

fancybox-button:hover {
    box-shadow: 0 !important
}

/* видео */
.is_overlay {
    display: block;
    width: 100%;
    height: auto;
    overflow: hidden;
    min-height: 930px;
}

#trailer {
    position: absolute;
    text-align: center;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: 950px;
    z-index: -9999999;
    overflow: hidden;
    max-height: 950px;
}

#trailer video {
    position: relative;
    height: 100%;
    width: 100%;
    height: auto;
    min-width: 2000px;
    min-height: 950px;
    z-index: -9999999;
    overflow: hidden !important;
    object-fit: cover;
}

.over {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    min-height: 950px;
    background: url('/wp-content/uploads/2022/08/point.png');
    z-index: -99999;
    max-height: 950px;
}

.line {
    position: absolute;
    height: 382px;
    background: url('/wp-content/uploads/2022/08/grtop.png') top center repeat-x;
    text-align: center;
    top: 0;
    right: 0;
    left: 0;
    overflow: hidden;
    width: 100%;
    z-index: -999;
}

.ver {
    overflow: hidden;
}

.thrdpage {
    overflow: hidden;
}

.thrdpage #trailer {
    min-height: 400px;
    max-height: 520px;
}

.thrdpage .over {
    min-height: 400px;
    max-height: 520px;
}

/* хедер */
.catalogbg {
    min-height: 950px;
    margin-bottom: 30px;
}

.catalogbg2 {
    min-height: 520px;
    margin-bottom: 50px;
}


.header {
    padding-top: 50px;
    padding-bottom: 40px;
}

.header .wr {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.topline {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15)
}

.topline .wr {
    display: flex;
    justify-content: space-between;
}

.topright {
    display: flex;
    justify-content: space-between;
}

.email {
    color: #fff;
    margin-right: 50px;
    font-size: 16px;
}

.email a {
    color: #fff;
}

.perezvonite {
    cursor: pointer;
    border-bottom: 1px solid;
    color: #fff;
    font-size: 16px;
}


.location {
    cursor: pointer;
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 13px;
}

.location img {
    margin-right: 10px;
}

.location p {
    border-bottom: 1px dotted #fff;
    font-size: 16px;
}

.loc p {
    font-size: 18px;
    font-weight: 500;
}

.loc ul {
    list-style-type: none;
    padding-bottom: 10px;
    margin-top: 30px;
}

.loc ul li {
    padding-left: 24px;
    background: url('/wp-content/uploads/2022/08/metka2.png') no-repeat;
    background-position: 0 4px;
    margin-bottom: 12px;
}

.loc ul li a {
    color: #418123
}

.logo img {
    display: block;
    float: left;
}

.logo p {
    line-height: 20px;
    font-weight: 400;
    color: #eee;
    font-size: 16px;
    margin-left: 140px;
    margin-top: 20px;
}

.adr {
    max-width: 220px;
}

.adr span {
    color: #fff;
    display: block;
    font-weight: 500;
    font-size: 17px;
}

.adr p {
    color: #fff;
    margin-top: 6px;
}

.topbtn {
    cursor: pointer;
    text-align: center;
    color: #fff;
}

.topbtn p {
    color: #fff;
    margin-left: 7px;
}

.topbtn img {
    display: block;
    margin: auto;
    margin-bottom: 12px;
}

.cont {
    text-align: right
}

.cont div {
    background: #558132;
    color: #fff;
    font-size: 13px;
    border-radius: 4px;
    padding: 5px 10px;
    display: inline-block;
    margin-bottom: 12px;
}

.cont span {
    display: block;
    margin-bottom: 5px;
}

.cont span a {
    color: #fff;
    font-size: 25px;
    font-weight: 600;
    border: 0;
}

.cont p {
    font-size: 14px;
    color: #fff;
    margin-top: 1px;
}

/* верхнее меню */
.topmenu {
    min-height: 66px;
}

.menu {
    display: flex;
    background: #558132;
    border-radius: 10px;
    margin-left: -5px;
    margin-right: -5px;
}

.menu div {
    font-size: 17px;
    flex-basis: auto;
    flex-grow: 1;
    min-height: 66px;
}

.menu div a {
    border-bottom: 0;
    text-decoration: none;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.menu div:first-child a {
    border-radius: 10px 0 0 10px;
}

.menu div:last-child a {
    border-radius: 0 10px 10px 0;
}

.menu div a:hover {
    color: #fff;
    background: #456828;
}

.menu div a span {
    border-bottom: 1px solid;
}

.rmenu {
    position: absolute;
    min-width: 700px;
    top: 100%;
    height: auto !important;
    background: #fff !important;
    z-index: 10;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    height: auto;
    border-radius: 0 0 10px 10px;
}

.rmenu ul {
    list-style-type: none;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    padding: 40px 30px 0 30px;
}

.rmenu ul li {
    text-align: center;
    width: 33%;
    margin-bottom: 30px;
}

.rmenu ul li img {
    display: block;
    margin: auto;
    margin-bottom: 2px;
}

.rmenu ul li a {
    display: inline-block;
    margin: 8px 22px 8px 22px;
    border: 0;
    cursor: pointer;
    font-weight: 500;
    color: #000;
    width: auto;
    height: auto;
    border-radius: 0 !important
}

.rmenu ul li a:hover {
    background: none;
    color: #000
}

.rmenu ul li a span {
    font-size: 16px;
    border-bottom: 1px solid #999
}

.fixedmenu {
    justify-content: center !important;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 20;
    border-radius: 0 0 0 0 !important;
    margin: 0;
}

.fixedmenu div a {
    border-bottom: 0;
    text-decoration: none;
    border-radius: 0 0 0 0 !important;
}

.slidemenu {
    position: relative
}

.slidemenu div {
    padding-top: 12px !important;
    padding-bottom: 22px !important;
}

.slidemenu a {
    position: relative
}

.fixedmenu .slidemenu div {
    margin: 0 0 0 0;
}

/* главный экран */
.main {
    padding-top: 40px;
}

.main .wr {
    display: flex;
    justify-content: space-between;
}

.arr {
    margin-left: 12px;
}

.breadcrumbs {
    display: flex;
    align-items: center;
    color: #ddd;
    margin-bottom: 60px;
    margin-left: 2px;
}

.breadcrumbs a {
    border-bottom: 1px solid;
    color: #72b33e !important;
}

.rep {
    margin-left: 10px;
    margin-right: 10px;
}

h1 {
    font-weight: 500;
    line-height: 120%;
    margin-bottom: 20px;
}

.leftmain p {
    color: #fff;
    font-size: 24px;
    line-height: 120%;
    margin-top: 8px;
}

.leftmain ul {
    margin-top: 60px;
    margin-bottom: 50px;
    list-style-type: none;
    display: flex;
}

.leftmain ul li {
    color: #fff;
    line-height: 130%;
    background: url('/wp-content/uploads/2022/08/venok.png') no-repeat;
    background-position: 0 0;
    margin-right: 40px;
    min-height: 50px;
    padding-left: 80px;
    font-size: 14px;
}

.leftmain ul li:last-child {
	margin-right: 14px;
}

.leftmain ul li:nth-child(1) {
    max-width: 300px;
}

.leftmain ul li:nth-child(2) {
    max-width: 240px;
}

.leftmain ul li:nth-child(3) {
    max-width: 300px;
}


.mainbtns {
    margin-top: 80px;
}

.mainbtns button {
    font-size: 18px;
    margin-right: 10px;
}

/* о компании */
.about {
    padding-top: 100px;
    padding-bottom: 70px;
    background: url('/wp-content/uploads/2022/08/lispng.png') no-repeat;
    background-position: 0 100px;
    position: relative;
}

.aboutwrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding-top: 40px;
    column-gap: 70px;
}

.leftabout {
    padding-top: 10px;
}

.leftabout p {
    margin-top: 18px;
    margin-bottom: 18px;
    line-height: 140%;
    font-size: 17px;
}

.leftabout span {
    font-size: 22px;
    font-weight: 500;
    line-height: 130%;
}

.leftabout ul {
    list-style-type: none;
    margin-top: 30px;
    margin-bottom: 40px;
}

.leftabout ul li {
    padding-left: 28px;
    position: relative;
    margin-bottom: 12px;
    line-height: 140%;
    font-size: 17px;
}

.leftabout ul li::after {
    content: '';
    display: flex;
    position: absolute;
    top: 8px;
    left: 0px;
    width: 6px;
    height: 6px;
    background: #70a842;
    border-radius: 50%;
    border: solid 4px rgba(112, 168, 66, 0.2);
    box-sizing: border-box;
}

.rightabout {
    margin-top: 25px;
}

.rightaboutbg {
    background: url('/wp-content/uploads/2022/08/lispng2.png') no-repeat;
    width: 158px;
    height: 436px;
    z-index: -1;
    position: absolute;
    right: 0;
    top: 50px;
}

.aboutwrap a {
    display: block;
    border: 0
}

.rightvideo {
    cursor: pointer;
    height: 440px;
    border-radius: 15px;
    background: url('/wp-content/uploads/2022/08/bg.jpg') no-repeat top center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.videobtn {
    margin-top: 20px;
    animation: pulse 2s infinite;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    box-shadow: 0 0 0 25px rgba(112, 168, 66, 0.1);
    border: 10px solid rgba(112, 168, 66, 0.2);
    background: linear-gradient(to bottom, #70a842, #519531);
    background-clip: padding-box;
    display: flex;
    justify-content: center;
    align-items: center;
}

.rightvideo p {
    color: #8ec366;
    font-weight: 500;
    font-size: 18px;
    max-width: 220px;
    text-align: center;
    margin-top: 34px;
}

.eks p {
    font-weight: 500;
    text-align: center;
    font-size: 18px;
    margin-top: 20px;
}

.zoobl {
    padding-top: 60px;
}

.zoobl2 {
    padding-top: 20px;
}

.zoozag {
    font-weight: bold;
    font-size: 28px;
    margin-bottom: 10px;
    margin-left: -2px;
}

.zooopis {
    margin-top: 10px;
    font-size: 18px;
}

.aboutimages {
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.aboutimages a {
    border: 0;
    width: 16%;
    display: block;
}

.aboutimages img {
    border-radius: 10px;
}

/* каталог */
.catalog {
    padding-top: 20px;
    padding-bottom: 50px;
}

.catalog h2 {
    margin-left: -3px;
}

.catalog h3 {
    margin-left: -2px;
    font-size: 36px;
}

.catwrap {
    padding-top: 70px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 80px;
    align-items: flex-start;
}

.catwrap div {
    position: relative;
}

.catwrap div img {
    transition: all 0.5s ease;
}

.catwrap div:hover img {
    transform: scale(1.02);
}

.nob {
    border: 0;
    display: block;
}

.catbg {
    display: block;
    margin: auto;
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    z-index: -2;
    border-radius: 10px;
}

.cat-img {
    max-width: 600px;
    width: 114%;
    margin-left: -7%;
    position: absolute;
    z-index: 1;
    top: 8%;
}

.cat-akciya {
    transition: all 0.5s ease;
    border-radius: 50%;
    width: 90px;
    height: 90px;
    background: linear-gradient(to top, #dd0000, #c21c1c, #ff2121);
    color: #fff;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: -20px;
    top: -20px;
    z-index: 5;
    text-transform: uppercase;
}

.catwrap div:hover .cat-akciya {
    transform: scale(1.02);
}

.cat-zag {
    font-size: 19px;
    text-align: center;
    font-weight: 500;
    margin-top: 30px;
    margin-bottom: 20px;
}

.cat-zag a {
    color: #000;
    border-bottom: 1px solid #bbb
}

.cat-sort {
    text-align: center;
    margin-top: 10px;
}

.cat-sort a {
    border-bottom: 1px solid #b4d099
}

.cat-size {
    text-align: center;
    margin-top: 5px;
    margin-bottom: 5px;
}

.cat-price {
    text-align: center;
    font-weight: 600;
    font-size: 24px;
    color: #549733;
    margin-top: 6px;
    margin-bottom: 12px;
}

.catwrap div button {
    display: block;
    margin: auto;
    margin-top: 20px;
    padding: 20px 40px;
}

.cat-tiles {
    list-style-type: none;
    display: flex;
    margin-top: 20px;
    margin-bottom: 14px;
    flex-wrap: wrap;
    justify-content: center;
}

.cat-tiles li {
    margin: 3px 3px;
}

.cat-tiles li a {
    background: #ddd;
    color: #777;
    display: block;
    border-radius: 5px;
    padding: 8px 12px;
    font-size: 14px;
    border: 0;
}

.cat-tiles li a:hover {
    background: #777;
    color: #fff;
}


.catwrap2 {
    padding-top: 50px;
    padding-bottom: 50px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}

.catwrap2 .cat-zag {
    font-size: 16px;
    margin-top: 20px;
}

.cat-img3 {
    width: 100%;
    max-width: 600px;
}

/* товар */
.tovar {
    padding-top: 24px;
    padding-bottom: 40px;
}

.tovar .wr {
    display: grid;
    grid-template-columns: 570px 1fr;
    align-items: flex-start;
    column-gap: 70px;
}

.tovar-mainimg {
    position: relative;
}

.tovar-images {
    max-width: 480px;
    margin: auto;
    margin-top: 1rem;
    display: flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 1rem;
}

.tovar-images a {
    border: 0;
    display: block;
}

.tovar-images img {
    border-radius: 8px;
}

.cat-img2 {
    width: 100%;
    max-width: 570px;
    position: absolute;
    top: 8%;
}

.thrpagebg {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 500px;
    width: 480px;
    margin: auto;
    z-index: -2;
    border-radius: 10px;
    border: 1px solid #ddd;
}

.cat-img2x {
    width: 80%;
    max-width: 570px;
    margin: auto;
    display: block;
}

.tovar-mainimg .cat-akciya {
    left: 30px;
}

.tovarright h3 {
    margin-bottom: 10px;
    line-height: 110%;
}

.calclink{
    color: var(--green);
    border-bottom: none;
    margin: 10px 0 0 0;
    display: flex;
    width: fit-content;
}

.akciya {
    border-radius: 4px;
    background: linear-gradient(to top, #dd0000, #c21c1c);
    padding: 10px 18px;
    color: #fff;
    margin-top: 22px;
    margin-bottom: 10px;
    margin-left: 10px;
    display: inline-block;
}

.tovarright p {
    font-size: 16px;
    line-height: 140%;
    margin-bottom: 20px;
}

.tovarright-cena {
    font-weight: 600;
    font-size: 24px;
    color: #549733;
    margin: 18px 0 0 0;
    line-height: 1em;
}

.opistable {
    width: 100%;
    background: #fff;
    border-collapse: collapse;
    padding: 0;
    margin: 22px 0 60px 0;
}

.opistable tr:nth-child(odd) td {
    background: #f0f0f0;
}

.opistable tr:first-child td:first-child {
    border-radius: 8px 0 0 0;
}

.opistable tr:first-child td:last-child {
    border-radius: 0 8px 0 0;
}

.opistable tr:last-child td:first-child {
    border-radius: 0 0 0 8px;
}

.opistable tr:last-child td:last-child {
    border-radius: 0 0 8px 0;
}

.opistable td {
    background: #f9f9f9;
    padding: 12px 20px;
    vertical-align: middle;
}

.opistable tr td:last-child {
    text-align: right;
}

/* цены */
.price {
    background: #e6e6e6;
    padding-top: 120px;
    padding-bottom: 90px;
}

.price h2 {
    margin-left: -3px;
}

.price-opis {
    margin-top: 30px;
    font-size: 18px;
}

.price-opis a {
    border-bottom: 1px dotted;
}

.pricetable {
    width: 100%;
    background: #fff;
    border-radius: 20px;
    border-collapse: collapse;
    padding: 0;
    margin: 60px 0 0 0;
}

.pricetable th {
    background: linear-gradient(to top, #70a842, #519531);
    padding: 20px 26px;
    color: #fff;
    font-weight: 500;
    text-align: left;
}

.pricetable tr:nth-child(odd) td {
    background: #f6f6f6;
}

.pricetable th:first-child {
    border-radius: 10px 0 0 0;
}

.pricetable th:last-child {
    border-radius: 0 10px 0 0;
}

.pricetable tr:last-child td:first-child {
    border-radius: 0 0 0 10px;
}

.pricetable tr:last-child td:last-child {
    border-radius: 0 0 10px 0;
}

.pricetable th a {
    color: #fff;
}

.pricetable td {
    background: #fff;
    padding: 20px 26px;
    vertical-align: middle;
}

.pricetable tr th:last-child {
    text-align: right;
}

.pricetable tr td:last-child {
    text-align: right;
    font-weight: 600;
    color: #3a791b;
    width: 20%;
}

.price .btn {
    display: block;
    margin: auto;
    margin-top: 40px;
}

.edinica2 {
    margin-left: 10px;
    font-size: 14px;
    font-weight: 400;
    max-width: 54px;
    outline: 0;
    border: 0;
    padding: 7px 8px 7px 8px;
    background: linear-gradient(to bottom, #515151, #7b7b7b);
    border-radius: 5px;
    cursor: pointer;
    font-family: 'Klimat', sans-serif;
    color: #fff;
    text-align: left;
}

.edinica2 option {
    color: #000;
}

/* калькулятор */
.calculator {
    padding-top: 110px;
    padding-bottom: 150px;
}

.calculator h3 {
    font-size: 40px;
    margin-left: -2px;
    margin-bottom: 30px;
}

.calc-opis {
    font-size: 18px;
    margin-top: 5px;
}

.calcformwrap {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: flex-end;
}

.calcleft {
    display: flex;
    align-items: center;
    position: relative;
}

.calcleft div {
    margin-right: 30px;
}

.calcleft p {
    font-weight: 500;
    font-size: 17px;
    margin-left: 5px;
    margin-bottom: 5px;
}

.calcform {
    margin-top: 60px;
}

.err-calc {
}

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

.calcright div {
    margin-right: 30px;
}

.calcright p {
    font-weight: 500;
    font-size: 17px;
    margin-left: 5px;
    margin-bottom: 5px;
}

.calcright .inpt2 {
    width: 50px;
    padding: 14px 20px;
    background: linear-gradient(to bottom, #515151, #7b7b7b);
    color: #fff;
}

.slct {
    font-size: 14px;
    font-weight: 400;
    width: 95px;
    outline: 0;
    border: 0;
    background: linear-gradient(to bottom, #515151, #7b7b7b);
    color: #fff;
    border-radius: 8px;
    cursor: pointer;
    font-family: 'Klimat', sans-serif;
}

.slct::placeholder {
    color: #fff;
}

.slct option {
    color: #000;
}

.calc-cena p {
    font-weight: 500;
    font-size: 24px;
    margin-bottom: 10px;
}

.calc-cena span {
    font-weight: 600;
    font-size: 30px;
    color: #3a791b
}

/* преимущества */
.preim {
    padding-top: 110px;
    padding-bottom: 110px;
    background: url('/wp-content/uploads/2022/08/preimbg.jpg') no-repeat center center #3c3533;
}

.preim h3 {
    color: #fff;
    font-size: 46px;
    font-weight: 500;
}

.preimwrap {
    padding-top: 100px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.preimcenter {
    margin-left: 40px;
    margin-right: 40px;
    width: 32%;
    max-width: 432px;
}

.preimwrap ul {
    list-style-type: none;
    width: 32%;
    flex-grow: 1;
}

.preimwrap ul li {
    padding-left: 86px;
    color: #fff;
    position: relative;
    margin-bottom: 60px;
    line-height: 130%;
}

.preimwrap ul li:last-child {
    margin-bottom: 0;
}

.preimwrap ul li span {
    font-size: 20px;
    font-weight: 500;
    color: #fff;
    margin-bottom: 8px;
    display: block;
    margin-left: -1px
}

.preimwrap ul li img {
    position: absolute;
    left: 23px;
    top: 22px;
}

.preimwrap ul li::before {
    position: absolute;
    content: '';
    left: 0px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    box-shadow: 0 0 0 5px rgba(112, 168, 66, 0.1);
    border: 7px solid rgba(112, 168, 66, 0.2);
    background: linear-gradient(to bottom, #70a842, #519531);
    background-clip: padding-box;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* грузовик */
.gruz {
    padding-top: 100px;
    padding-bottom: 100px;
    background: url('/wp-content/uploads/2022/08/map.png') no-repeat bottom center;
}

.gruz h3 {
    font-size: 36px;
    max-width: 900px;
    line-height: 120%;
}

.gruzwrap {
    padding-top: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.gruzovik {
    margin-left: -40px;
    margin-top: 40px;
    width: 64%;
    max-width: 832px;
}

.rightgruz {
    width: 37%;
    margin-top: 10px;
}

.gruzpoint {
    background: linear-gradient(to top, #519531, #70a842);
    display: flex;
    width: 100%;
    justify-content: flex-start;
    height: 120px;
    border-radius: 10px;
    align-items: center;
    margin-bottom: 20px;
}

.gruzicon {
    background: url('/wp-content/uploads/2022/08/circle.png') no-repeat center right;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 100px;
    height: 100%;
    border-radius: 10px 0 0 10px;
    flex-grow: 1;
}

.gruzpoint p {
    font-weight: 500;
    font-size: 17px;
    line-height: 120%;
    color: #fff;
    margin-left: 30px;
    margin-right: 30px;
    flex-grow: 1;
}


/* оплата и доставка */
.semipage {
    min-height: 540px !important;
    max-height: 540px !important;
}

.semipage video {
    margin-top: -350px;
}

.dostavka {
    padding-top: 20px;
    padding-bottom: 60px;
}

.dostavka .wr {
    position: relative
}

.dostavka h2 {
    margin-bottom: 40px;
    margin-left: -3px;
}

.dostavka-opis {
    font-size: 17px;
    line-height: 140%;
}

.dostwrap h3 {
    margin-top: 60px;
    margin-bottom: 20px;
    margin-left: -2px;
}

.gazel {
    display: block;
    margin: auto;
    height: auto;
    max-width: 832px;
    margin-top: 60px;
}

.dost-zag {
    font-weight: 500;
    font-size: 20px;
    margin-bottom: 20px;
    line-height: 140%;
}

.dosttbl {
    border-collapse: collapse;
    width: 76%;
    margin: 0;
    padding: 0;
    margin-bottom: 40px;
}

.dosttbl tr:first-child td {
    border-bottom: 2px solid #fff;
}

.dosttbl tr td:last-child {
    font-size: 18px;
    font-weight: 600;
    color: #519531;
    text-align: right;
    min-width: 130px;
}

.dosttbl td {
    padding: 14px 20px;
    background: #f0f0f0;
    vertical-align: middle;
    border-bottom: 2px solid #fff;
}

.dosttbl tr:first-child td:first-child {
    border-bottom: 2px solid #fff;
    border-radius: 10px 0 0 0;
}

.dosttbl tr:first-child td:last-child {
    border-bottom: 2px solid #fff;
    border-radius: 0 10px 0 0;
}

.dosttbl tr:last-child td:first-child {
    border-bottom: 2px solid #fff;
    border-radius: 0 0 0 10px;
}

.dosttbl tr:last-child td:last-child {
    border-bottom: 2px solid #fff;
    border-radius: 0 0 10px 0;
}

.dosttbl tr:last-child td::first-child {
    font-size: 18px;
    font-weight: 600;
    color: #519531;
    text-align: right;
    min-width: 130px;
}

.oplata {
    padding-top: 40px;
    padding-bottom: 140px;
}

.opl {
    background: #f0f0f0;
    border-radius: 25px;
    padding: 90px 30px 80px 30px;
    text-align: center;
}

.opl h2 {
    text-align: center;
}

.opl-opis {
    text-align: center;
    font-size: 18px;
    margin-top: 19px;
}

.oplwrap {
    padding-top: 50px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.oplwrap div {
    text-align: center;
    width: 25%;
}

.oplwrap div img {
    margin: auto;
    display: block;
}

.oplwrap div p {
    margin-top: 10px;
    text-align: center;
    font-size: 17px;
    font-weight: 500;
}

/* Галерея */
.gallery {
    padding-top: 60px;
    padding-bottom: 0px;
}

.gallery h2 {
    margin-left: -3px;
    line-height: 120%;
}

.gallery .opis {
    font-size: 20px;
    line-height: 130%;
    margin-top: 16px;
}

.galwrap {
    margin-top: 50px;
}

.galpoint {
    padding: 40px 50px 30px 50px;
    margin-bottom: 50px;
    border-radius: 20px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1)
}

.galzag {
    font-weight: 500;
    font-size: 24px;
    line-height: 120%;
}

.galdate {
    font-size: 14px;
    color: #999;
    margin-top: 5px;
}

.galphotos {
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    gap: 2%;
}

.galphotos a {
    border: 0;
    width: 32%;
    display: block;
    margin-bottom: 2%;
}

.galphotos img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
}

.galimage {
    width: 100%;
    min-height: 300px;
    max-width: 32%;
    cursor: pointer;
    border-radius: 10px;
    margin-bottom: 2%;
    background-size: cover;
    background-repeat: no-repeat;
}

/* Акции */
.akcii {
    padding-top: 60px;
    padding-bottom: 20px;
}

.akcii h2 {
    margin-left: -2px;
    line-height: 120%;
}

.akcii .opis {
    font-size: 20px;
    line-height: 130%;
    margin-top: 12px;
}

.akc {
    margin-top: 50px;
    position: relative;
    width: 100%;
    height: auto;
}

.akctext {
    color: #fff;
    font-size: 36px;
    font-weight: 500;
    position: absolute;
    z-index: 1;
    top: 60px;
    left: 60px;
    max-width: 530px;
}

.akcdate {
    color: rgba(255, 255, 255, 0.5);
    position: absolute;
    bottom: 60px;
    left: 60px;
}

.akc span {
    color: #74bd3b
}

.akc img {
    border-radius: 15px;
}


/* Контакты */

.contacts__tabs{
    display: flex;
    justify-content: flex-start;
    align-items: center;

}

.contacts__tab:not(:last-child){
    margin-right: 12px;
}

.contacts__tab{
    width: 200px;
    padding: 18px 0;
    background-color: #fff;
    border: 1px solid #E6E6E6;
    border-radius: 8px;
    text-align: center;
    font-weight: 500;
    cursor: pointer;
}

.contacts__tab:hover{
    background: linear-gradient(to bottom, #70a842, #4c8e2d);
    box-shadow: 0 10px 20px rgba(65, 130, 40, 0.6);
    border: none;
    color: #fff;
}

.contacts__tab.active{
    background: linear-gradient(to bottom, #70a842, #4c8e2d);
    color: #fff;
}

.kontakty {
    padding-top: 20px;
    padding-bottom: 120px;
}

.kontakty h2 {
    line-height: 120%;
}

.ofiswrap {
    display: flex;
    justify-content: space-between;
    padding-bottom: 100px;
}

.ofis-left,
.ofis-right{
    max-width: 50%;
    width: 100%;
}

.ofis-left {
    margin-right: 24px;
    margin-top: 30px;
}
.ofis-block{
    padding: 24px;
    margin-bottom: 12px;
    background-color: #F7F7F7;
    border-radius: 20px;
}
.ofis-block_title{
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    color: #777777;
    margin-bottom: 12px;
}
.ofis-block h3{
    font-size: 20px !important;
    font-weight: 700;
    line-height: 24px;
    color: #777777;
    margin-bottom: 12px;
}

.ofis-zag {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 8px;
}

.ofis-opis {
    font-size: 16px;
    margin-bottom: 40px;
}

.ofis-opis span {
    font-size: 24px;
    font-weight: 600;
    display: block;
    margin-top: 6px;
    margin-bottom: 5px;
}

.ofis-opis span a {
    border: 0;
}

.ofis-photos {
    display: flex;
    justify-content: space-between;
    /*flex-wrap: wrap*/
}

.ofis-photos a {
    display: block;
    /*width: 32%;*/
    border: 0;
}

.ofis-photos img {
    border-radius: 8px;
    margin-top: 20px;
}

.kont-map {
    border-radius: 15px;
    overflow: hidden;
    border: 1px solid #ddd;
    margin: 30px 0 12px;
}

.kontakty h3 {
    font-size: 40px;
}

.cont-wrap {
    display: flex;
    margin-top: 50px;
    gap: 2%;
}

.cont-wrap div {
    padding: 34px 3% 37px 3%;
    background: #f6f6f6;
    border-radius: 10px;
    width: 18%;
}

.cont-zag {
    font-size: 16px;
    font-weight: 400;
    color: #111111;
}

.cont-zag:not(:last-child),
.cont-opis:not(:last-child){
    margin-bottom: 8px;
}
.cont-opis.download{
    display: inline-block;
    margin-top: 7px;
    position: relative;
    padding-left: 28px;
    font-weight: 500;
}
.cont-opis.download::before{
    content: '';
    position: absolute;
    background-image: url('/wp-content/uploads/2024/05/download-icon.png');
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    left: 0;
    top: -3px;
}

.cont-opis a{
    border-bottom: none;
    color: #111111;
    font-size: 16px;
}

.cont-opis a:hover{
    color: #7AA44D;
}

[data-tabs-block] [data-containers] [data-container]:not(.active) {
    display: none !important;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled{
  opacity: 0;
}

.swiper-button-next,
.swiper-button-prev{
    display: flex;
    margin-top: -8px;
    width: 32px;
    height: 32px;
    background-color: #fff;
    border-radius: 50%;
    color: #1E2942;
    box-shadow: 0px 4.8px 6.4px 0px #00000014;
}

.swiper-button-next::after,
.swiper-button-prev::after{
    font-size: 16px;
    font-weight: 800;
}

/* Тех условия */
.uslovia {
    padding-top: 60px;
    padding-bottom: 90px;
}

.uslovia h2 {
    line-height: 120%;
    margin-bottom: 5px;
    font-size: 28px;
}

.uslovia h3 {
    font-size: 24px;
    margin-top: 90px;
    margin-bottom: 30px;
}

.uslovia .opis {
    font-size: 18px;
    font-style: italic;
    margin-bottom: 20px;
}

.usl {
    font-size: 18px;
    margin-bottom: 40px;
    line-height: 130%;
}

.usl p {
    margin-top: 7px;
    margin-bottom: 7px;
}

.uslovia ol {
    list-style: none;
    counter-reset: li;
    margin: 10px 0 30px 0;
    padding: 0;
}

.uslovia ol span {
    font-weight: 500;
    font-size: 16px;
}

.uslovia ol li {
    margin: 10px 0 10px 0;
    line-height: 140%;
    font-size: 16px;
}

.uslovia ol li ol {
    margin-left: 10px;
}

.uslovia li:before {
    counter-increment: li;
    content: counters(li, ".") ". ";
}

.teh-table {
    border-collapse: collapse;
    margin-top: 30px;
    margin-bottom: 50px;
}

.teh-table td {
    border: 1px solid #ddd;
    padding: 15px 20px;
    font-size: 14px;
}

.teh-table img {
    width: 100%;
    height: auto;
}

/* ── Таблица сравнения в тексте страницы (.lpk-cmp) ───────────────────────────
   Отдельно от .teh-table: тот класс стоит и на /teh-usloviya, где таблицы другой
   структуры (с картинками), и менять его стиль ради одной страницы значит
   править вслепую вторую.

   Оформление повторяет таблицы прайса — тонкая сетка, шапка капителью, цифры и
   значения крупнее подписей, — чтобы таблицы сайта читались как одна система.
   Цвета заданы литералами, а не переменными: палитра прайса объявлена внутри
   .pl-section (и .pl-summary), сюда она не достаёт, а невалидный var() не падает
   ошибкой — свойство тихо наследуется. Этой ловушкой 2026-10-04 ссылки в таблице
   ассортимента вышли чёрными. */
.lpk-cmp {
    width: 100%;
    border-collapse: collapse;
    margin: 24px 0 34px;
    background: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 12px;
    overflow: hidden;
    font-size: 15px;
    font-variant-numeric: tabular-nums;
}

/* Шапка — ровно те же величины, что у `.pl-table thead th` в css/price-list.css:
   белый фон (не серая плашка), 13px, межбуквенное .12em, капитель, цвет подписи.
   Владелец на бою 2026-10-04 сравнил две таблицы одной страницы и увидел разницу
   — значит повторять параметры на глаз нельзя, их надо переносить числами. */
.lpk-cmp thead th {
    padding: 13px 16px;
    background: #fff;
    border-bottom: 1px solid #e6e6e6;
    text-align: left;
    vertical-align: middle;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #707070;
}

/* 10px по вертикали — столько же, сколько у ячеек таблицы ассортимента на той же
   странице (замер вычисленных стилей, а не подбор на глаз). */
.lpk-cmp tbody th,
.lpk-cmp tbody td {
    padding: 10px 16px;
    border-bottom: 1px solid #efefef;
    text-align: left;
    vertical-align: top;
    font-size: 15px;
    line-height: 1.45;
}

.lpk-cmp tbody tr:last-child th,
.lpk-cmp tbody tr:last-child td {
    border-bottom: 0;
}

/* Первая колонка — что сравниваем: это вопрос, а не ответ, поэтому она тише и
   уже остальных. */
.lpk-cmp tbody th {
    width: 22%;
    font-weight: 600;
    color: #343434;
}

/* Форма */
.midforma {
    background: url('/wp-content/uploads/2022/08/bg2.jpg') no-repeat center center;
    /* Внешний отступ сверху: блок примыкает к разным блокам на разных страницах,
       и вплотную к предыдущему выглядел приклеенным. На брейкпоинте 750-979 px
       ниже уже стоит свой margin-top: 30px — он и продолжит действовать там. */
    margin-top: 40px;
    padding-top: 100px;
    padding-bottom: 90px;
}
.midforma .pers{
    margin: 0;
}

.midform-zag {
    color: #fff;
    font-size: 30px;
    font-weight: 500;
    max-width: 600px;
    margin-bottom: 10px;
}

.midform-zag2 {
    color: #96e457;
    font-size: 24px;
    font-weight: 500;
}

.iphone {
    position: absolute;
    right: 100px;
    top: -140px;
}

.phoneformwrap {
    display: grid;
    gap: 10px;
    grid-template-columns: 1fr 1fr auto;
    padding-top: 40px;
    max-width: 800px;
}

.phoneform .inpt2 {
    margin-right: 10px;
    background: linear-gradient(to top, #ddd, #fff);
    width: auto;
}

.phoneform .btn2 {
    width: 240px;
    font-weight: 500;
}

.phoneform .pers {
    width: 600px;
}

.phoneform .pers label {
    justify-content: flex-start;
    align-items: center;
}

.phoneform .pers span {
    margin: 0
}

/* статья */
.article {
    padding-top: 100px;
    padding-bottom: 80px;
}

.article2 {
    padding-top: 60px;
    padding-bottom: 40px;
}

.article h2 {
    font-size: 40px;
    font-weight: 600;
    margin-top: 50px;
    margin-bottom: 30px;
    margin-left: -3px;
    line-height: 120%;
}

.article h3 {
    font-size: 36px;
    font-weight: 600;
    margin-top: 50px;
    margin-bottom: 30px;
    margin-left: -3px;
    line-height: 120%;
}

.article h4 {
    font-size: 30px;
    font-weight: 500;
    margin-top: 40px;
    margin-bottom: 20px;
    margin-left: -3px;
    line-height: 120%;
}

.article h5 {
    font-size: 24px;
    font-weight: 500;
    margin-top: 40px;
    margin-bottom: 20px;
    margin-left: -2px;
    line-height: 120%;
}

.article h2:first-child {
    margin-top: 0;
}

.article h3:first-child {
    margin-top: 0;
}

.article p {
    font-size: 17px;
    line-height: 140%;
    margin-top: 20px;
    margin-bottom: 20px;
}

.article ol {
    list-style-type: none;
    counter-reset: num;
    margin: 40px 0 70px 0;
    padding: 0;
}

.article ol li {
    font-size: 17px;
    margin-bottom: 28px;
    line-height: 140%;
    position: relative;
    padding-left: 54px
}

.article ol li span {
    font-weight: 500;
    color: #000;
    font-size: 18px;
    display: block;
    margin-bottom: 6px;
}

.article ol li:before {
    content: counter(num);
    counter-increment: num;
    border: 5px solid rgba(112, 168, 66, 0.2);
    display: flex;
    font-size: 16px;
    position: absolute;
    top: -6px;
    left: 0px;
    width: 26px;
    height: 26px;
    align-items: center;
    justify-content: center;
    background: linear-gradient(to top, #70a842, #418123);
    background-clip: padding-box;
    color: #fff;
    font-weight: 600;
    border-radius: 50%;
}

.article ul {
    list-style-type: none;
    margin: 40px 0 70px 0;
    padding: 0;
}

.article ul li {
    font-size: 17px;
    margin-bottom: 34px;
    line-height: 140%;
    position: relative;
    padding-left: 32px
}

.article ul li span {
    font-weight: 500;
    color: #000;
    font-size: 18px;
    display: block;
    margin-bottom: 6px;
}

.article ul li:before {
    content: '';
    display: flex;
    position: absolute;
    top: 5px;
    left: 0px;
    width: 6px;
    height: 6px;
    background: linear-gradient(to top, #70a842, #418123);
    background-clip: padding-box;
    border-radius: 50%;
    border: 5px solid rgba(112, 168, 66, 0.2);
}

.article-images {
    margin-top: 50px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.article-images a {
    border: 0;
    width: 24%;
    display: block;
    margin-right: 1%;
    margin-bottom: 1%;
}

.article-images img {
    border-radius: 10px;
}

/* футер */
.footer {
    background: #222222;
    border-bottom: 1px solid #282828;
    padding-top: 100px;
    padding-bottom: 100px;
}

.footer .wr {
    display: flex;
    justify-content: space-between;
}

.botlogo img {
    display: block;
}

.botlogo p {
    line-height: 20px;
    font-weight: 400;
    color: #aaa;
    font-size: 14px;
    margin-top: 20px;
}

.botadr {
    max-width: 220px;
    text-align: right;
    margin-top: 30px;
}

.botadr span {
    color: #fff;
    display: block;
    font-weight: 500;
    font-size: 17px;
}

.botadr p {
    color: #fff;
    margin-top: 6px;
}

.bottopbtn {
    cursor: pointer;
    text-align: center;
    color: #fff;
}

.bottopbtn p {
    color: #fff;
    margin-left: 7px;
}

.bottopbtn img {
    display: block;
    margin: auto;
    margin-bottom: 12px;
}

.botcont {
    text-align: right
}

.botcont div {
    background: #558132;
    color: #fff;
    font-size: 13px;
    border-radius: 4px;
    padding: 5px 10px;
    display: inline-block;
    margin-bottom: 12px;
}

.botcont span {
    display: block;
    margin-bottom: 5px;
}

.botcont span a {
    color: #fff;
    font-size: 25px;
    font-weight: 600;
    border: 0;
}

.botcont p {
    font-size: 14px;
    color: #fff;
    margin-top: 1px;
}

.botmenu {
    list-style-type: none;
}

.botmenu li {
    margin-bottom: 12px;
}

.botmenu li a {
    color: #fff;
}

.botmenu li a:hover {
    color: #ddd;
}

.footercopy {
    background: #232323;
    padding-top: 26px;
    padding-bottom: 28px;
    border-top: 1px solid #555
}

.footercopy .wr {
    text-align: center;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.footleft p {
    display: flex;
    flex-wrap: wrap;
    color: #999;
}

.footleft p:first-child {
    margin-bottom: 5px;
}

.footleft p a {
    margin-right: 20px;
    color: #fff !important;
}

.footright {
    text-align: right;
}

.footright p {
    text-align: right;
    color: #999
}

.footright a {
    color: #fff !important;
}

.footleft {
    width: 40%;
}

/* фиксированные кнопки */
.fixedbtns {
    position: fixed;
    right: 30px;
    bottom: 30px;
    z-index: 10;
}

.fixedbtns div {
    cursor: pointer;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-top: 12px;
}

.fixedbtns div a {
    border: 0;
    display: block;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.up {
    background: linear-gradient(to top, #757575, #a5a5a5);
    margin-bottom: 25px;
}

.tg {
    background: linear-gradient(to top, #3b8cc5, #68baff)
}

.tg img {
    margin-left: -6px;
}

.wa {
    background: linear-gradient(to top, #38ab28, #7fec3d)
}

.max {
   background: linear-gradient(45deg,rgba(72, 206, 255, 1) 0%, rgba(43, 72, 193, 1) 50%, rgba(154, 50, 223, 1) 100%);
}

.max img {
    max-width: 40px;
}

.bc {
    background: linear-gradient(to top, #549024, #9ece41);
    position: relative;
}

.bc div {
    border-radius: 50%;
    width: 24px;
    height: 24px;
    font-weight: bold;
    font-size: 14px;
    background: #fff;
    display: flex;
    position: absolute;
    right: -2px;
    bottom: -2px;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
}

.bc img {
    margin-left: -4px;
    margin-top: 1px
}

/* формы и модальные окна */
.inpt {
    font-size: 17px;
    font-weight: 400;
    width: 145px;
    margin-bottom: 8px;
    outline: 0;
    border: 0;
    padding: 25px 38px;
    background: linear-gradient(to bottom, #515151, #7b7b7b);
    border-radius: 8px;
    cursor: pointer;
    font-family: 'Klimat', sans-serif;
    color: #fff;
}

.inpt::placeholder {
    color: #fff;
}

.formzag2 {
    font-weight: 500;
    font-size: 36px;
    color: #fff;
    text-align: left;
}

.formopis2 {
    text-align: left;
    margin-top: 12px;
    margin-bottom: 37px;
    font-size: 18px;
    color: #fff;
}

.inpt2 {
    font-size: 17px;
    font-weight: 400;
    width: 145px;
    outline: 0;
    border: 0;
    padding: 25px 38px;
    background: linear-gradient(to bottom, #ddd, #bbb);
    border-radius: 8px;
    cursor: pointer;
    font-family: 'Klimat', sans-serif;
    color: #000;
}

.inpt2::placeholder {
    color: #000;
}

.popup {
    display: none;
    position: fixed;
    z-index: 900;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: auto;
}

.modal {
    background: #fff;
    z-index: 1200;
    width: 440px;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 16vh;
    border-radius: 10px;
}

.overlaypop {
    position: fixed;
    z-index: 1000;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding-bottom: 10vh;
    background: rgba(0, 0, 0, 0.4);
    cursor: pointer;
}

.clsbtn {
    position: absolute;
    color: #000;
    right: 20px;
    top: 20px;
    font-size: 20px;
    cursor: pointer;
    transition: 0.5s;
}

.clsbtn:hover {
    transform: rotate(90deg);
}

.modal{
    width: 100%;
    max-width: 580px;
}
.modaltext {
    min-height: 435px;
    background: white;
    border-radius: 8px;
    border: 1px solid #C7C7C7;
    display: grid;
    grid-template-columns: 100%;
    align-items: center;
    align-content: center;
}
.bask .modaltext{
    padding: 0 20px;
    border: none;
    align-items: flex-start;
    align-content: flex-start;
}
.bask .clsbtn>* {
    pointer-events: none;
}
.loc .modaltext{
    display: block;
    padding: 20px;
    min-height: 0;
}
.modalform{
    max-width: 280px;
    width: 100%;
    margin: 0 auto;
}

.modaltext a {
    color: #000;
}

.pers {
    margin: 20px auto 0;
    max-width: 280px;
}
.pers .pol {
    margin-top: 10px;
    display: flex;
    justify-content: flex-start;
}

.pers2 label {
    margin-top: 10px;
    display: flex;
    justify-content: flex-start;
}

.checkpol {
    flex: 0 0 13px;
    display: block;
    width: 13px;
    height: 13px;
    border: 1px solid #777;
    margin-right: 10px;
}

.pers a {
    color: #888 !important;
    pointer-events: all;
}

.pers span {
    font-size: 12px;
    color: #999;
    margin-bottom: 8px;
    line-height: 130%;
}

.formopis {
    text-align: center;
    margin: auto;
    max-width: 220px;
    margin-top: 10px;
    margin-bottom: 27px;
    font-size: 16px;
    line-height: 120%;
}

.form {
    margin-top: 40px;
}

.modalform .btn2 {
    display: flex;
    margin: 20px auto 0 auto;
    width: 100%;
    background: var(--green);
    color: white;
    font-size: 14px;
    padding: 20px;
}

.modalform .inpt2 {
    margin: 20px auto 0 auto;
    width: 100%;
    min-width: 0;
    background: white;
    border: 1px solid #E6E6E6;
    border-radius: 8px;
    font-size: 14px;
    padding: 20px;
}

.modalform .pers {
    margin: auto;
    margin-top: 25px;
}

.modalform .pers span {
    color: #aaa;
}

.modalform .pers span a {
    color: #aaa;
}

.modalzag {
    font-weight: bold;
    text-align: center;
    font-size: 24px;
    color: #000
}

.modalopis {
    margin: 20px auto 0 auto;
    max-width: 240px;
    line-height: 120%;
    font-size: 14px;
    text-align: center;
    color: #343434
}

.modalform .otmetka {
    margin: 0 auto;
    margin-top: 30px;
    max-width: 230px;
}

/* Корзина */
.cart_added .modalform{
    max-width: 100%;
}
.cart_added .modaltext{
    min-height: 0;
    padding: 30px;
}
.modal2 {
    background: #fff;
    z-index: 1200;
    width: 740px;
    max-width: 100%;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    min-height: 100vh;
}

.basketzag {
    font-weight: 600;
    font-size: 30px;
    margin-bottom: 30px;
}

.basket {
    border-top: 1px solid #ddd;
}

.basketform {
    display: none;
}

.basket-itog {
    padding-top: 30px;
    padding-bottom: 30px;
}

.basket-position {
    border-bottom: 1px solid #ddd;
    padding-top: 24px;
    padding-bottom: 24px;
    position: relative;
    display: flex;
    align-items: center;
}

.basket-position-zag {
    font-weight: 500;
    font-size: 17px;
}

.basket-position-right {
    margin-left: 40px;
}

.basket-position-kolvo {
    display: flex;
    margin-top: 10px;
    margin-bottom: 8px;
    align-items: center;
}

.basket-kolvo {
    font-size: 15px;
    font-weight: 400;
    max-width: 64px;
    margin-right: 8px;
    outline: 0;
    border: 0;
    padding: 12px 18px;
    background: linear-gradient(to bottom, #515151, #7b7b7b);
    border-radius: 8px;
    cursor: pointer;
    font-family: 'Klimat', sans-serif;
    color: #fff;
    text-align: right;
}

.edinica {
    font-size: 15px;
    font-weight: 400;
    max-width: 80px;
    margin-right: 8px;
    outline: 0;
    border: 0;
    padding: 11px 17px 11px 17px;
    background: linear-gradient(to bottom, #515151, #7b7b7b);
    border-radius: 8px;
    cursor: pointer;
    font-family: 'Klimat', sans-serif;
    color: #fff;
    text-align: left;
}

.edinica option {
    color: #000;
}

.basket-position-price {
    font-size: 20px;
    font-weight: 600;
    color: #418123;
    margin-left: 12px;
}

.basket-clsbtn {
    position: absolute;
    color: #777;
    right: 10px;
    top: 24px;
    font-size: 16px;
    cursor: pointer;
    transition: 0.5s;
}

.basket-clsbtn:hover {
    transform: rotate(90deg);
}
.basket-clsbtn>*{
    pointer-events: none;
}

.basket-itog-zag {
    font-size: 18px;
    font-weight: 500;
}

.basket-itog-price {
    font-size: 30px;
    font-weight: 600;
    margin-top: 4px;
    color: #418123
}

@media screen and (max-width: 1619px) and (min-width: 1320px) {
    .about {
        background: none;
    }
}

@media (max-width: 1320px) {
    /* база */
    html, body, div, table, tr, td, li, ul, p {
        font-size: 15px;
    }

    h1 {
        font-size: 40px;
        color: #fff;
    }

    h2 {
        font-size: 30px;
        font-weight: 600;
    }

    h3 {
        font-size: 22px;
    }

    h4 {
        font-size: 18px;
    }

    h5 {
        font-size: 16px;
    }

    .wrap {
        width: 100%;
        height: auto;
    }

    .wr {
        max-width: 1360px;
        padding-right: 40px;
        padding-left: 40px;
        margin: auto;
    }

    button {
        transition: all 0.4s ease;
        font-size: 15px;
        font-weight: 400;
        padding: 24px 38px;
        background: linear-gradient(to bottom, #70a842, #418123);
        border-radius: 7px;
        box-shadow: 0 10px 20px rgba(65, 130, 40, 0.4);
    }

    button:hover {
        background: linear-gradient(to bottom, #70a842, #4c8e2d);
        box-shadow: 0 10px 20px rgba(65, 130, 40, 0.6);
    }

    fancybox-button:hover {
        box-shadow: 0 !important
    }

    /* видео */
    .is_overlay {
        display: block;
        width: 100%;
        height: auto;
        overflow: hidden;
        min-height: 880px;
    }

    #trailer {
        position: absolute;
        text-align: center;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        min-height: 880px;
        z-index: -9999999;
        overflow: hidden;
        max-height: 880px;
    }

    #trailer video {
        position: relative;
        height: 100%;
        width: 100%;
        height: auto;
        min-width: 2000px;
        min-height: 950px;
        z-index: -9999999;
        overflow: hidden !important;
    }

    .over {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        overflow: hidden;
        min-height: 880px;
        background: url('/wp-content/uploads/2022/08/point.png');
        z-index: -99999;
        max-height: 880px;
    }

    .line {
        position: absolute;
        height: 382px;
        background: url('/wp-content/uploads/2022/08/grtop.png') top center repeat-x;
        text-align: center;
        top: 0;
        right: 0;
        left: 0;
        overflow: hidden;
        z-index: -999;
    }

    .ver {
        overflow: hidden;
    }

    .thrdpage {
        overflow: hidden;
    }

    .thrdpage #trailer {
        min-height: 480px;
        max-height: 480px;
    }

    .thrdpage .over {
        min-height: 480px;
        height: 480px;
    }

    /* хедер */
    .catalogbg {
        min-height: 880px;
        margin-bottom: 20px;
    }

    .catalogbg2 {
        margin-bottom: 20px;
    }

    .header {
        padding-top: 50px;
        padding-bottom: 40px;
    }

    .header .wr {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .topline {
        padding-top: 20px;
        padding-bottom: 20px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15)
    }

    .topline .wr {
        display: flex;
        justify-content: space-between;
    }

    .topright {
        display: flex;
        justify-content: space-between;
    }

    .email {
        color: #fff;
        margin-right: 50px;
        font-size: 14px;
    }

    .email a {
        color: #fff;
    }

    .perezvonite {
        cursor: pointer;
        border-bottom: 1px solid;
        color: #fff;
        font-size: 14px;
    }


    .location {
        cursor: pointer;
        display: flex;
        align-items: center;
        color: #fff;
        font-size: 13px;
    }

    .location img {
        margin-right: 10px;
    }

    .location p {
        border-bottom: 1px dotted #fff;
        font-size: 14px;
    }

    .loc p {
        font-size: 18px;
        font-weight: 500;
    }

    .loc ul {
        list-style-type: none;
        padding-bottom: 10px;
        margin-top: 30px;
    }

    .loc ul li {
        padding-left: 24px;
        background: url('/wp-content/uploads/2022/08/metka2.png') no-repeat;
        background-position: 0 4px;
        margin-bottom: 12px;
    }

    .loc ul li a {
        color: #418123
    }

    .logo img {
        display: block;
        float: left;
    }

    .logo p {
        display: none;
        line-height: 20px;
        font-weight: 400;
        color: #aaa;
        font-size: 14px;
        margin-left: 140px;
        margin-top: 20px;
    }

    .adr {
        max-width: 220px;
    }

    .adr span {
        color: #fff;
        display: block;
        font-weight: 500;
        font-size: 17px;
    }

    .adr p {
        color: #fff;
        margin-top: 6px;
    }

    .topbtn {
        cursor: pointer;
        text-align: center;
        color: #fff;
    }

    .topbtn p {
        color: #fff;
        margin-left: 7px;
    }

    .topbtn img {
        display: block;
        margin: auto;
        margin-bottom: 12px;
    }

    .cont {
        text-align: right
    }

    .cont div {
        background: #558132;
        color: #fff;
        font-size: 13px;
        border-radius: 4px;
        padding: 5px 10px;
        display: inline-block;
        margin-bottom: 12px;
    }

    .cont span {
        display: block;
        margin-bottom: 5px;
    }

    .cont span a {
        color: #fff;
        font-size: 25px;
        font-weight: 600;
        border: 0;
    }

    .cont p {
        font-size: 14px;
        color: #fff;
        margin-top: 1px;
    }

    /* верхнее меню */
    .topmenu {
        min-height: 62px;
    }

    .menu {
        display: flex;
        background: #558132;
        border-radius: 10px;
        margin-left: -5px;
        margin-right: -5px;
    }

    .menu div {
        font-size: 14px;
        flex-basis: auto;
        flex-grow: 1;
        min-height: 62px;
    }

    .menu div a {
        border-bottom: 0;
        text-decoration: none;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
    }

    .menu div:first-child a {
        border-radius: 10px 0 0 10px;
    }

    .menu div:last-child a {
        border-radius: 0 10px 10px 0;
    }

    .menu div a:hover {
        color: #fff;
        background: #456828;
    }

    .menu div a span {
        border-bottom: 1px solid;
    }

    .rmenu {
        position: absolute;
        min-width: 700px;
        top: 100%;
        height: auto !important;
        background: #fff !important;
        z-index: 10;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
        height: auto;
        border-radius: 0 0 10px 10px;
    }

    .rmenu ul {
        list-style-type: none;
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        padding: 20px 15px 0 15px;
    }

    .rmenu ul li {
        text-align: center;
        width: 33%;
        margin-bottom: 30px;
    }

    .rmenu ul li img {
        display: block;
        margin: auto;
        margin-bottom: 2px;
    }

    .rmenu ul li a {
        display: inline-block;
        margin: 8px 22px 8px 22px;
        border: 0;
        cursor: pointer;
        font-weight: 500;
        color: #000;
        width: auto;
        height: auto;
        border-radius: 0 !important
    }

    .rmenu ul li a:hover {
        background: none;
        color: #000
    }

    .rmenu ul li a span {
        font-size: 15px;
        border-bottom: 1px solid #999
    }

    .fixedmenu {
        justify-content: center !important;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 20;
        border-radius: 0 0 0 0 !important;
        margin: 0;
    }

    .fixedmenu div a {
        border-bottom: 0;
        text-decoration: none;
        border-radius: 0 0 0 0 !important;
    }

    .slidemenu {
        position: relative
    }

    .slidemenu div {
        padding-top: 12px !important;
        padding-bottom: 22px !important;
    }

    .slidemenu a {
        position: relative
    }

    .fixedmenu .slidemenu div {
        margin: 0 0 0 0;
    }

    /* главный экран */
    .main {
        padding-top: 40px;
    }

    .main .wr {
        display: flex;
        justify-content: space-between;
    }

    .arr {
        margin-left: 12px;
    }

    .breadcrumbs {
        display: flex;
        align-items: center;
        color: #ddd;
        margin-bottom: 40px;
        margin-left: 2px;
    }

    .breadcrumbs a {
        border-bottom: 1px solid;
        color: #72b33e !important;
    }

    .rep {
        margin-left: 10px;
        margin-right: 10px;
    }

    h1 {
        font-weight: 500;
        line-height: 120%;
        margin-bottom: 20px;
    }

    .leftmain p {
        color: #fff;
        font-size: 20px;
        line-height: 120%;
        margin-top: 12px;
    }

    .leftmain ul {
        margin-top: 60px;
        margin-bottom: 50px;
        list-style-type: none;
        display: flex;
    }

    .leftmain ul li {
        color: #fff;
        line-height: 130%;
        background: url('/wp-content/uploads/2022/08/venok.png') no-repeat;
        background-position: 0 0;
        margin-right: 20px;
        min-height: 50px;
        padding-left: 80px;
        font-size: 15px;
    }

    .leftmain ul li:nth-child(1) {
        max-width: 300px;
    }

    .leftmain ul li:nth-child(2) {
        max-width: 220px;
    }

    .leftmain ul li:nth-child(3) {
        max-width: 300px;
    }


    .mainbtns {
        margin-top: 80px;
    }

    .mainbtns button {
        font-size: 16px;
        margin-right: 10px;
    }

    /* о компании */
    .about {
        padding-top: 60px;
        padding-bottom: 50px;
        background: url('/wp-content/uploads/2022/08/lispng.png') no-repeat;
        background-position: 0 100px;
        position: relative;
    }

    .aboutwrap {
        padding-top: 20px;
        grid-template-columns: 100%;
    }

    .about h2 {
        padding-left: 150px;
    }

    .leftabout {
        padding-left: 150px;
        padding-right: 120px;
    }

    .leftabout p {
        margin-top: 18px;
        margin-bottom: 18px;
        line-height: 140%;
        font-size: 17px;
    }

    .leftabout span {
        font-size: 22px;
        font-weight: 500;
        line-height: 130%;
    }

    .leftabout ul {
        list-style-type: none;
        margin-top: 30px;
        margin-bottom: 40px;
    }

    .leftabout ul li {
        padding-left: 28px;
        position: relative;
        margin-bottom: 12px;
        line-height: 140%;
        font-size: 17px;
    }

    .leftabout ul li::after {
        content: '';
        display: flex;
        position: absolute;
        top: 8px;
        left: 0px;
        width: 6px;
        height: 6px;
        background: #70a842;
        border-radius: 50%;
        border: solid 4px rgba(112, 168, 66, 0.2);
        box-sizing: border-box;
    }

    .rightabout {
        margin: auto;
        margin-top: 55px;
        padding-left: 150px;
        padding-right: 120px;
    }

    .rightaboutbg {
        background: url('/wp-content/uploads/2022/08/lispng2.png') no-repeat;
        width: 158px;
        height: 436px;
        z-index: -1;
        position: absolute;
        right: 0;
        top: 50px;
    }

    .aboutwrap a {
        display: block;
        border: 0
    }

    .rightvideo {
        cursor: pointer;
        height: 440px;
        border-radius: 15px;
        background: url('/wp-content/uploads/2022/08/bg.jpg') no-repeat top center;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    .videobtn {
        margin-top: 20px;
        animation: pulse 2s infinite;
        width: 80px;
        height: 80px;
        border-radius: 50%;
        box-shadow: 0 0 0 25px rgba(112, 168, 66, 0.1);
        border: 10px solid rgba(112, 168, 66, 0.2);
        background: linear-gradient(to bottom, #70a842, #519531);
        background-clip: padding-box;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .rightvideo p {
        color: #8ec366;
        font-weight: 500;
        font-size: 18px;
        max-width: 220px;
        text-align: center;
        margin-top: 34px;
    }

    .eks p {
        font-weight: 500;
        text-align: center;
        font-size: 18px;
        margin-top: 20px;
    }

    .zoobl {
        padding-top: 60px;
        padding-left: 150px;
        padding-right: 120px;
    }

    .zoobl2 {
        padding-top: 10px;
    }

    .zoozag {
        font-weight: bold;
        font-size: 28px;
        margin-bottom: 10px;
        margin-left: -2px;
    }

    .zooopis {
        margin-top: 10px;
        font-size: 18px;
    }

    .aboutimages {
        margin-top: 40px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        padding-left: 150px;
        padding-right: 120px;
    }

    .aboutimages a {
        border: 0;
        width: 32%;
        display: block;
        margin-bottom: 10px;
    }

    .aboutimages img {
        border-radius: 10px;
    }

    /* каталог */
    .catalog {
        padding-top: 70px;
        padding-bottom: 30px;
    }

    .catalog h2 {
        margin-left: -3px;
    }

    .catalog h3 {
        margin-left: -2px;
        font-size: 36px;
    }

    .catwrap {
        padding-top: 70px;
        grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
        gap: 70px;
    }

    .catwrap div img {
        transition: all 0.5s ease;
    }

    .catwrap div:hover img {
        transform: scale(1.02);
    }

    .catwrap div:nth-child(3) {
        margin-right: 0;
    }

    .catwrap div:nth-child(6) {
        margin-right: 0;
    }

    .catwrap div:nth-child(9) {
        margin-right: 0;
    }

    .nob {
        border: 0;
        display: block;
    }

    .catbg {
        display: block;
        margin: auto;
        position: relative;
        top: 0;
        left: 0;
        right: 0;
        z-index: -2;
        border-radius: 10px;
    }

    .cat-img {
        max-width: 600px;
        width: 114%;
        margin-left: -7%;
        position: absolute;
        z-index: 1;
        top: 8%;
    }

    .cat-akciya {
        transition: all 0.5s ease;
        border-radius: 50%;
        width: 90px;
        height: 90px;
        background: linear-gradient(to top, #dd0000, #c21c1c, #ff2121);
        color: #fff;
        font-weight: bold;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        left: -20px;
        top: -20px;
        z-index: 5;
        text-transform: uppercase;
    }

    .catwrap div:hover .cat-akciya {
        transform: scale(1.02);
    }

    .cat-zag {
        font-size: 19px;
        text-align: center;
        font-weight: 500;
        margin-top: 30px;
        margin-bottom: 10px;
    }

    .cat-zag a {
        color: #000;
        border-bottom: 1px solid #bbb
    }

    .cat-sort {
        text-align: center;
        margin-top: 10px;
    }

    .cat-sort a {
        border-bottom: 1px solid #b4d099
    }

    .cat-size {
        text-align: center;
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .cat-price {
        text-align: center;
        font-weight: 600;
        font-size: 24px;
        color: #549733;
        margin-top: 6px;
        margin-bottom: 12px;
    }

    .catwrap div button {
        display: block;
        margin: auto;
        margin-top: 20px;
        padding: 20px 40px;
    }

    .cat-tiles {
        list-style-type: none;
        display: flex;
        margin-top: 20px;
        margin-bottom: 14px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .cat-tiles li {
        margin: 3px 3px;
    }

    .cat-tiles li a {
        background: #ddd;
        color: #777;
        display: block;
        border-radius: 5px;
        padding: 8px 12px;
        font-size: 14px;
        border: 0;
    }

    .cat-tiles li a:hover {
        background: #777;
        color: #fff;
    }

    .catwrap2 .cat-zag {
        font-size: 16px;
        margin-top: 20px;
    }

    .cat-img3 {
        width: 100%;
        max-width: 600px;
    }

    /* товар */
    .tovar {
        padding-top: 24px;
        padding-bottom: 40px;
    }

    .tovar-mainimg {
        position: relative;
    }

    .tovar-images {
        max-width: 480px;
        margin: auto;
        margin-top: 1rem;
        display: flex;
        justify-content: flex-start;
        flex-wrap: nowrap;
        gap: 1rem;
    }

    .tovar-images a {
        border: 0;
        display: block;
    }

    .tovar-images img {
        border-radius: 8px;
    }

    .cat-img2 {
        width: 100%;
        max-width: 570px;
        position: absolute;
        top: 8%;
    }

    .thrpagebg {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: auto;
        z-index: -2;
        border-radius: 10px;
        border: 1px solid #ddd;
    }

    .cat-img2x {
        width: 80%;
        max-width: 570px;
        margin: auto;
        display: block;
        margin-top: 12%;
        margin-bottom: 12%;
    }

    .catalogbg2 h1 {
        font-size: 32px;
    }

    .tovar-mainimg .cat-akciya {
        left: -20px;
    }

    .tovarright h3 {
        margin-bottom: 10px;
        line-height: 110%;
    }

    .calclink {
        color: #3a791b
    }

    .akciya {
        border-radius: 4px;
        background: linear-gradient(to top, #dd0000, #c21c1c);
        padding: 10px 18px;
        color: #fff;
        margin-top: 22px;
        margin-bottom: 10px;
        margin-left: 10px;
        display: inline-block;
    }

    .tovarright p {
        font-size: 15px;
        line-height: 140%;
        margin-bottom: 20px;
    }

    .tovarright-cena {
        font-weight: 600;
        font-size: 24px;
        color: #549733;
        margin-top: 10px;
    }

    .opistable {
        width: 100%;
        background: #fff;
        border-collapse: collapse;
        padding: 0;
        margin: 22px 0 30px 0;
    }

    .opistable tr:nth-child(odd) td {
        background: #f0f0f0;
    }

    .opistable tr:first-child td:first-child {
        border-radius: 5px 0 0 0;
    }

    .opistable tr:first-child td:last-child {
        border-radius: 0 5px 0 0;
    }

    .opistable tr:last-child td:first-child {
        border-radius: 0 0 0 5px;
    }

    .opistable tr:last-child td:last-child {
        border-radius: 0 0 5px 0;
    }

    .opistable td {
        background: #f9f9f9;
        padding: 12px 16px;
        vertical-align: middle;
        font-size: 14px;
    }

    .opistable tr td:last-child {
        text-align: right;
    }

    /* цены */
    .price {
        background: #e6e6e6;
        padding-top: 70px;
        padding-bottom: 60px;
    }

    .price h2 {
        margin-left: -3px;
    }

    .price-opis {
        margin-top: 30px;
        font-size: 18px;
    }

    .price-opis a {
        border-bottom: 1px dotted;
    }

    .pricetable {
        width: 100%;
        background: #fff;
        border-radius: 20px;
        border-collapse: collapse;
        padding: 0;
        margin: 60px 0 0 0;
    }

    .pricetable th {
        background: linear-gradient(to top, #70a842, #519531);
        padding: 20px 26px;
        color: #fff;
        font-weight: 500;
        text-align: left;
    }

    .pricetable tr:nth-child(odd) td {
        background: #f6f6f6;
    }

    .pricetable th:first-child {
        border-radius: 10px 0 0 0;
    }

    .pricetable th:last-child {
        border-radius: 0 10px 0 0;
    }

    .pricetable tr:last-child td:first-child {
        border-radius: 0 0 0 10px;
    }

    .pricetable tr:last-child td:last-child {
        border-radius: 0 0 10px 0;
    }

    .pricetable th a {
        color: #fff;
    }

    .pricetable td {
        background: #fff;
        padding: 20px 26px;
        vertical-align: middle;
    }

    .pricetable tr th:last-child {
        text-align: right;
    }

    .pricetable tr td:last-child {
        text-align: right;
        font-weight: 600;
        color: #3a791b;
        width: 20%;
    }

    .price .btn {
        display: block;
        margin: auto;
        margin-top: 40px;
    }

    .edinica2 {
        margin-left: 10px;
        font-size: 14px;
        font-weight: 400;
        max-width: 54px;
        outline: 0;
        border: 0;
        padding: 7px 8px 7px 8px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 5px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
        text-align: left;
    }

    .edinica2 option {
        color: #000;
    }

    /* калькулятор */
    .calculator {
        padding-top: 70px;
        padding-bottom: 60px;
    }

    .calculator h3 {
        font-size: 40px;
        margin-left: -2px;
        margin-bottom: 30px;
    }

    .calc-opis {
        font-size: 18px;
        margin-top: 5px;
    }

    .calcformwrap {
        width: 100%;
        justify-content: flex-start;
        align-items: flex-end;
        flex-wrap: wrap;
    }

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

    .calcleft div {
        margin-right: 30px;
    }

    .calcleft p {
        font-weight: 500;
        font-size: 17px;
        margin-left: 5px;
        margin-bottom: 5px;
    }

    .calcform {
        margin-top: 60px;
    }

    .calcright {
        display: flex;
        align-items: center;
        margin-top: 30px;
    }

    .calcright div {
        margin-right: 30px;
    }

    .calcright p {
        font-weight: 500;
        font-size: 17px;
        margin-left: 5px;
        margin-bottom: 5px;
    }

    .calcright .inpt2 {
        width: 50px;
        padding: 14px 20px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        color: #fff;
    }

    .slct {
        font-size: 14px;
        font-weight: 400;
        width: 95px;
        outline: 0;
        border: 0;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        color: #fff;
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
    }

    .slct::placeholder {
        color: #fff;
    }

    .slct option {
        color: #000;
    }

    .calc-cena {
        margin-top: 40px;
    }

    .calc-cena p {
        font-weight: 500;
        font-size: 24px;
        margin-bottom: 10px;
    }

    .calc-cena span {
        font-weight: 600;
        font-size: 30px;
        color: #3a791b
    }

    .calcformwrap .btn {
        margin-top: 30px;
        font-size: 17px;
    }

    /* преимущества */
    .preim {
        padding-top: 80px;
        padding-bottom: 40px;
        background: url('/wp-content/uploads/2022/08/preimbg.jpg') no-repeat center center #3c3533;
    }

    .preim h3 {
        color: #fff;
        font-size: 36px;
        font-weight: 500;
    }

    .preimwrap {
        padding-top: 70px;
        display: grid;
        grid-template-columns: 100%;
    }

    .preimcenter {
        margin: auto;
        display: block;
        max-width: 432px;
        margin-top: 10px;
        margin-bottom: 70px;
    }

    .preimwrap ul {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
        align-items: flex-start;
    }

    .preimwrap ul li {
        padding-left: 86px;
        color: #fff;
        position: relative;
        margin-bottom: 60px;
        line-height: 130%;
        padding-right: 20px;
    }

    .preimwrap ul li:last-child {
        margin-bottom: 0;
    }

    .preimwrap ul li span {
        font-size: 20px;
        font-weight: 500;
        color: #fff;
        margin-bottom: 8px;
        display: block;
        margin-left: -1px
    }

    .preimwrap ul li img {
        position: absolute;
        left: 23px;
        top: 22px;
    }

    .preimwrap ul li::before {
        position: absolute;
        content: '';
        left: 0px;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        box-shadow: 0 0 0 5px rgba(112, 168, 66, 0.1);
        border: 7px solid rgba(112, 168, 66, 0.2);
        background: linear-gradient(to bottom, #70a842, #519531);
        background-clip: padding-box;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    /* грузовик */
    .gruz {
        padding-top: 60px;
        padding-bottom: 60px;
        background: url('/wp-content/uploads/2022/08/map.png') no-repeat bottom center;
    }

    .gruz h3 {
        font-size: 36px;
        max-width: 900px;
        line-height: 120%;
    }

    .gruzwrap {
        padding-top: 40px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .gruzovik {
        margin-left: -40px;
        margin-top: 40px;
        width: 64%;
        max-width: 832px;
    }

    .rightgruz {
        width: 37%;
        margin-top: 10px;
    }

    .gruzpoint {
        background: linear-gradient(to top, #519531, #70a842);
        display: flex;
        width: 100%;
        justify-content: flex-start;
        height: 120px;
        border-radius: 10px;
        align-items: center;
        margin-bottom: 20px;
    }

    .gruzicon {
        background: url('/wp-content/uploads/2022/08/circle.png') no-repeat center right;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 100px;
        height: 100%;
        border-radius: 10px 0 0 10px;
        flex-grow: 1;
    }

    .gruzpoint p {
        font-weight: 500;
        font-size: 15px;
        line-height: 120%;
        color: #fff;
        margin-left: 30px;
        margin-right: 30px;
        flex-grow: 1;
    }

    /* оплата и доставка */
    .semipage {
        min-height: 480px !important;
        max-height: 480px !important;
    }

    .semipage video {
        margin-top: -350px;
    }

    .dostavka {
        padding-top: 40px;
        padding-bottom: 60px;
    }

    .dostavka .wr {
        position: relative
    }

    .dostavka h2 {
        margin-bottom: 40px;
        margin-left: -3px;
    }

    .dostavka-opis {
        font-size: 16px;
        line-height: 140%;
    }

    .dostwrap h3 {
        margin-top: 60px;
        margin-bottom: 20px;
        margin-left: -2px;
    }

    .gazel {
        display: block;
        margin: auto;
        height: auto;
        max-width: 832px;
        margin-top: 60px;
    }

    .dost-zag {
        font-weight: 500;
        font-size: 18px;
        margin-bottom: 20px;
        line-height: 130%;
    }

    .dosttbl {
        border-collapse: collapse;
        width: 100%;
        margin: 0;
        padding: 0;
        margin-bottom: 40px;
    }

    .dosttbl tr:first-child td {
        border-bottom: 2px solid #fff;
    }

    .dosttbl tr td:last-child {
        font-size: 18px;
        font-weight: 600;
        color: #519531;
        text-align: right;
        min-width: 130px;
    }

    .dosttbl td {
        padding: 14px 20px;
        background: #f0f0f0;
        vertical-align: middle;
        border-bottom: 2px solid #fff;
    }

    .dosttbl tr:first-child td:first-child {
        border-bottom: 2px solid #fff;
        border-radius: 10px 0 0 0;
    }

    .dosttbl tr:first-child td:last-child {
        border-bottom: 2px solid #fff;
        border-radius: 0 10px 0 0;
    }

    .dosttbl tr:last-child td:first-child {
        border-bottom: 2px solid #fff;
        border-radius: 0 0 0 10px;
    }

    .dosttbl tr:last-child td:last-child {
        border-bottom: 2px solid #fff;
        border-radius: 0 0 10px 0;
    }

    .dosttbl tr:last-child td::first-child {
        font-size: 18px;
        font-weight: 600;
        color: #519531;
        text-align: right;
        min-width: 130px;
    }

    .oplata {
        padding-top: 40px;
        padding-bottom: 100px;
    }

    .opl {
        background: #f0f0f0;
        border-radius: 25px;
        padding: 90px 30px 80px 30px;
        text-align: center;
    }

    .opl h2 {
        text-align: center;
    }

    .opl-opis {
        text-align: center;
        font-size: 18px;
        margin-top: 19px;
    }

    .oplwrap {
        padding-top: 50px;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
    }

    .oplwrap div {
        text-align: center;
        width: 25%;
    }

    .oplwrap div img {
        margin: auto;
        display: block;
    }

    .oplwrap div p {
        margin-top: 10px;
        text-align: center;
        font-size: 17px;
        font-weight: 500;
    }

    /* Галерея */
    .gallery {
        padding-top: 30px;
        padding-bottom: 0px;
    }

    .gallery h2 {
        margin-left: -3px;
        line-height: 120%;
    }

    .gallery .opis {
        font-size: 17px;
        line-height: 130%;
        margin-top: 12px;
    }

    .galwrap {
        margin-top: 50px;
    }

    .galpoint {
        padding: 35px 40px 30px 40px;
        margin-bottom: 50px;
        border-radius: 20px;
        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1)
    }

    .galzag {
        font-weight: 500;
        font-size: 24px;
        line-height: 120%;
    }

    .galdate {
        font-size: 14px;
        color: #999;
        margin-top: 5px;
    }

    .galphotos {
        margin-top: 30px;
        display: flex;
        flex-wrap: wrap;
        gap: 2%;
    }

    .galphotos a {
        border: 0;
        width: 32%;
        display: block;
        margin-bottom: 2%;
    }

    .galphotos img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 10px;
    }

    .galimage {
        width: 100%;
        min-height: 250px;
        max-width: 32%;
        cursor: pointer;
        border-radius: 10px;
        margin-bottom: 2%;
        background-size: cover;
        background-repeat: no-repeat;
    }

    /* Акции */
    .akcii {
        padding-top: 40px;
        padding-bottom: 20px;
    }

    .akcii h2 {
        margin-left: -2px;
        line-height: 120%;
    }

    .akcii .opis {
        font-size: 20px;
        line-height: 130%;
        margin-top: 12px;
    }

    .akc {
        margin-top: 40px;
        position: relative;
        width: 100%;
        height: auto;
    }

    .akctext {
        color: #fff;
        font-size: 26px;
        font-weight: 500;
        position: absolute;
        z-index: 1;
        top: 40px;
        left: 40px;
        max-width: 360px;
    }

    .akcdate {
        color: rgba(255, 255, 255, 0.5);
        position: absolute;
        bottom: 40px;
        left: 40px;
    }

    .akc span {
        color: #74bd3b
    }

    .akc img {
        border-radius: 15px;
    }

    /* Контакты */
    .kontakty {
        padding-top: 40px;
        padding-bottom: 120px;
    }

    .kontakty h2 {
        line-height: 120%;
    }

    .ofiswrap {
        display: flex;
        justify-content: space-between;
        padding-bottom: 100px;
        align-items: stretch;
    }

    .ofis-left {
        width: 45%;
        margin-top: 50px;
    }

    .ofis-zag {
        font-size: 20px;
        font-weight: 600;
        margin-bottom: 8px;
    }

    .ofis-opis {
        font-size: 16px;
        margin-bottom: 40px;
    }

    .ofis-opis span {
        font-size: 24px;
        font-weight: 600;
        display: block;
        margin-top: 6px;
        margin-bottom: 5px;
    }

    .ofis-opis span a {
        border: 0;
    }

    .ofis-photos {
        display: flex;
        justify-content: space-between;

    }

    .ofis-photos a {
        display: block;
        border: 0;
    }

    .ofis-photos img {
        border-radius: 8px;
        margin-top: 10px;
    }

    .swiper-tabs{
        width: 100%;
        overflow-x: hidden;
    }

    .kont-map {
        border-radius: 15px;
        overflow: hidden;
        border: 1px solid #ddd;
        margin-top: 50px;
    }

    .kontakty h3 {
        font-size: 40px;
    }

    .cont-wrap {
        display: flex;
        margin-top: 50px;
        gap: 1%;
    }

    .cont-wrap div {
        padding: 30px 3% 33px 3%;
        background: #f6f6f6;
        border-radius: 10px;
        width: 19%;
    }

    .cont-zag {
        font-size: 17px;
        font-weight: 500;
        margin-bottom: 10px;
    }

    .cont-opis {
        font-size: 15px;
    }

    .cont-opis span {
        font-size: 17px;
        font-weight: 600;
        display: block;
        margin-top: 6px;
        line-height: 100%;
    }

    .cont-opis span a {
        border: 0;
    }

    /* Тех условия */
    .uslovia {
        padding-top: 30px;
        padding-bottom: 50px;
    }

    .uslovia h2 {
        line-height: 120%;
        margin-bottom: 5px;
        font-size: 28px;
    }

    .uslovia h3 {
        line-height: 120%;
        font-size: 24px;
        margin-top: 90px;
        margin-bottom: 30px;
    }

    .uslovia .opis {
        font-size: 18px;
        font-style: italic;
        margin-bottom: 20px;
    }

    .usl {
        font-size: 18px;
        margin-bottom: 40px;
        line-height: 130%;
    }

    .usl p {
        margin-top: 7px;
        margin-bottom: 7px;
    }

    .uslovia ol {
        list-style: none;
        counter-reset: li;
        margin: 10px 0 30px 0;
        padding: 0;
    }

    .uslovia ol span {
        font-weight: 500;
        font-size: 16px;
    }

    .uslovia ol li {
        margin: 10px 0 10px 0;
        line-height: 140%;
        font-size: 16px;
    }

    .uslovia ol li ol {
        margin-left: 10px;
    }

    .uslovia li:before {
        counter-increment: li;
        content: counters(li, ".") ". ";
    }

    .teh-table {
        border-collapse: collapse;
        margin-top: 30px;
        margin-bottom: 50px;
    }

    .teh-table td {
        border: 1px solid #ddd;
        padding: 15px 20px;
        font-size: 14px;
    }

    .teh-table img {
        width: 100%;
        height: auto;
    }

    /* Форма */
    .midforma {
        background: url('/wp-content/uploads/2022/08/bg2.jpg') no-repeat center center;
        padding-top: 60px;
        padding-bottom: 70px;
    }

    .midform-zag {
        color: #fff;
        font-size: 30px;
        font-weight: 500;
        max-width: 600px;
        margin-bottom: 10px;
    }

    .midform-zag2 {
        color: #96e457;
        font-size: 24px;
        font-weight: 500;
    }

    .iphone {
        position: absolute;
        right: 50px;
        top: -90px;
        width: 106px;
        height: auto;
    }

    .phoneformwrap {
        grid-template-columns: 100%;
    }

    .phoneform .inpt2 {
        margin-right: 10px;
        background: linear-gradient(to top, #ddd, #fff)
    }

    .phoneform .btn2 {
        width: 240px;
        font-weight: 500;
        font-size: 17px;
    }

    .phoneform .pers {
        width: 600px;
    }

    .phoneform .pers label {
        justify-content: flex-start;
        align-items: center;
    }

    .phoneform .pers span {
        margin: 0
    }

    /* статья */
    .article {
        padding-top: 60px;
        padding-bottom: 40px;
    }

    .article2 {
        padding-top: 40px;
        padding-bottom: 20px;
    }

    .article h2 {
        font-size: 40px;
        font-weight: 600;
        margin-top: 50px;
        margin-bottom: 30px;
        margin-left: -3px;
        line-height: 120%;
    }

    .article h3 {
        font-size: 36px;
        font-weight: 600;
        margin-top: 50px;
        margin-bottom: 30px;
        margin-left: -3px;
        line-height: 120%;
    }

    .article h4 {
        font-size: 30px;
        font-weight: 500;
        margin-top: 40px;
        margin-bottom: 20px;
        margin-left: -3px;
        line-height: 120%;
    }

    .article h5 {
        font-size: 24px;
        font-weight: 500;
        margin-top: 40px;
        margin-bottom: 20px;
        margin-left: -2px;
        line-height: 120%;
    }

    .article h2:first-child {
        margin-top: 0;
    }

    .article h3:first-child {
        margin-top: 0;
    }

    .article p {
        font-size: 17px;
        line-height: 140%;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .article ol {
        list-style-type: none;
        counter-reset: num;
        margin: 40px 0 70px 0;
        padding: 0;
    }

    .article ol li {
        font-size: 17px;
        margin-bottom: 28px;
        line-height: 140%;
        position: relative;
        padding-left: 54px
    }

    .article ol li span {
        font-weight: 500;
        color: #000;
        font-size: 18px;
        display: block;
        margin-bottom: 6px;
    }

    .article ol li:before {
        content: counter(num);
        counter-increment: num;
        border: 5px solid rgba(112, 168, 66, 0.2);
        display: flex;
        font-size: 16px;
        position: absolute;
        top: -7px;
        left: 0px;
        width: 26px;
        height: 26px;
        align-items: center;
        justify-content: center;
        background: linear-gradient(to top, #70a842, #418123);
        color: #fff;
        font-weight: 600;
        border-radius: 50%;
        background-clip: padding-box;
    }

    .article ul {
        list-style-type: none;
        margin: 40px 0 70px 0;
        padding: 0;
    }

    .article ul li {
        font-size: 17px;
        margin-bottom: 34px;
        line-height: 140%;
        position: relative;
        padding-left: 26px
    }

    .article ul li span {
        font-weight: 500;
        color: #000;
        font-size: 18px;
        display: block;
        margin-bottom: 6px;
    }

    .article ul li:before {
        content: '';
        display: flex;
        position: absolute;
        top: 4px;
        left: 0px;
        width: 6px;
        height: 6px;
        background: linear-gradient(to top, #70a842, #418123);
        border-radius: 50%;
        border: 5px solid rgba(112, 168, 66, 0.2);
        background-clip: padding-box;
    }

    .article-images {
        margin-top: 50px;
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        margin-bottom: 50px;
    }

    .article-images a {
        border: 0;
        width: 24%;
        display: block;
        margin-right: 1%;
        margin-bottom: 1%;
    }

    .article-images img {
        border-radius: 10px;
    }

    /* футер */
    .footer {
        background: #222222;
        border-bottom: 1px solid #282828;
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .footer .wr {
        display: flex;
        justify-content: space-between;
    }

    .botlogo img {
        display: block;
    }

    .botlogo p {
        line-height: 20px;
        font-weight: 400;
        color: #aaa;
        font-size: 13px;
        margin-top: 14px;
    }

    .botadr {
        max-width: 220px;
        text-align: left;
        margin-top: 30px;
    }

    .botadr span {
        color: #fff;
        display: block;
        font-weight: 500;
        font-size: 17px;
    }

    .botadr p {
        color: #fff;
        margin-top: 6px;
    }

    .bottopbtn {
        cursor: pointer;
        text-align: center;
        color: #fff;
    }

    .bottopbtn p {
        color: #fff;
        margin-left: 7px;
    }

    .bottopbtn img {
        display: block;
        margin: auto;
        margin-bottom: 12px;
    }

    .botcont {
        text-align: left
    }

    .botcont div {
        background: #558132;
        color: #fff;
        font-size: 13px;
        border-radius: 4px;
        padding: 5px 10px;
        display: inline-block;
        margin-bottom: 12px;
    }

    .botcont span {
        display: block;
        margin-bottom: 5px;
    }

    .botcont span a {
        color: #fff;
        font-size: 25px;
        font-weight: 600;
        border: 0;
    }

    .botcont p {
        font-size: 14px;
        color: #fff;
        margin-top: 1px;
    }

    .botmenu {
        list-style-type: none;
    }

    .botmenu li {
        margin-bottom: 12px;
        font-size: 13px;
    }

    .botmenu li a {
        color: #fff;
    }

    .botmenu li a:hover {
        color: #ddd;
    }

    .footercopy {
        background: #232323;
        padding-top: 26px;
        padding-bottom: 28px;
        border-top: 1px solid #555
    }

    .footercopy .wr {
        text-align: center;
        display: flex;
        justify-content: space-between;
    }

    .footleft p {
        display: flex;
        color: #999;
        text-align: left;
        font-size: 14px;
    }

    .footleft p:first-child {
        margin-bottom: 5px;
    }

    .footleft p a {
        margin-right: 20px;
        color: #fff !important;
    }

    .footright {
        text-align: right;
    }

    .footright p {
        text-align: right;
        color: #999;
        font-size: 14px;
    }

    .footright a {
        color: #fff !important;
    }

    .footleft {
        width: 70%;
    }

    /* фиксированные кнопки */
    .fixedbtns {
        position: fixed;
        right: 16px;
        bottom: 16px;
        z-index: 10;
    }

    .fixedbtns div {
        cursor: pointer;
        width: 60px;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        margin-top: 7px;
    }

    .fixedbtns div a {
        border: 0;
        display: block;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
    }

    .fixedbtns img {
        width: 30px;
        height: 30px;
    }

    .up {
        background: linear-gradient(to top, #757575, #a5a5a5);
        margin-bottom: 25px;
    }

    .tg {
        background: linear-gradient(to top, #3b8cc5, #68baff)
    }

    .tg img {
        margin-left: -6px;
    }

    .wa {
        background: linear-gradient(to top, #38ab28, #7fec3d)
    }

    .bc {
        background: linear-gradient(to top, #549024, #9ece41);
        position: relative;
    }

    .bc div {
        border-radius: 50%;
        width: 22px;
        height: 22px;
        font-weight: bold;
        font-size: 13px;
        background: #fff;
        display: flex;
        position: absolute;
        right: -3px;
        bottom: -3px;
        box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .bc img {
        margin-left: -4px;
        margin-top: 1px
    }

    /* формы и модальные окна */
    .inpt {
        font-size: 17px;
        font-weight: 400;
        width: 145px;
        margin-bottom: 8px;
        outline: 0;
        border: 0;
        padding: 25px 38px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
    }

    .inpt::placeholder {
        color: #fff;
    }

    .formzag2 {
        font-weight: 500;
        font-size: 36px;
        color: #fff;
        text-align: left;
    }

    .formopis2 {
        text-align: left;
        margin-top: 12px;
        margin-bottom: 37px;
        font-size: 18px;
        color: #fff;
    }

    .inpt2 {
        font-size: 17px;
        font-weight: 400;
        width: 145px;
        outline: 0;
        border: 0;
        padding: 25px 38px;
        background: linear-gradient(to bottom, #ddd, #bbb);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #000;
    }

    .inpt2::placeholder {
        color: #000;
    }

    .popup {
        display: none;
        position: fixed;
        z-index: 900;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        overflow: auto;
    }

    .modal {
        background: #fff;
        z-index: 1200;
        width: 440px;
        margin: auto;
        position: absolute;
        left: 0;
        right: 0;
        top: 16vh;
        border-radius: 10px;
    }

    .overlaypop {
        position: fixed;
        z-index: 1000;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        padding-bottom: 10vh;
        background: rgba(0, 0, 0, 0.4);
        cursor: pointer;
    }

    .clsbtn {
        position: absolute;
        color: #000;
        right: 20px;
        top: 20px;
        font-size: 20px;
        cursor: pointer;
        transition: 0.5s;
    }

    .clsbtn:hover {
        transform: rotate(90deg);
    }

    .modaltext {
        padding: 50px 50px 30px 50px;
    }

    .modaltext a {
        color: #000;
    }

    .pers2 label {
        margin-top: 10px;
        display: flex;
        justify-content: flex-start;
    }

    .checkpol {
        flex: 0 0 13px;
        display: block;
        width: 13px;
        height: 13px;
        border: 1px solid #777;
        margin-right: 10px;
    }

    .pers {
        margin-top: 20px;
    }

    .pers a {
        color: #888 !important;
    }

    .pers span {
        font-size: 12px;
        color: #999;
        margin-bottom: 8px;
        line-height: 130%;
    }

    .formopis {
        text-align: center;
        margin: auto;
        max-width: 220px;
        margin-top: 10px;
        margin-bottom: 27px;
        font-size: 16px;
        line-height: 120%;
    }

    .form {
        margin-top: 40px;
    }

    .modalform .btn2 {
        display: flex;
        margin: 0 auto;
        margin-top: 15px;
        min-width: 180px;
        width: 231px;
        font-size: 17px;
    }

    .modalform .inpt2 {
        display: block;
        margin: 0 auto;
        margin-bottom: 5px;
    }

    .modalform .pers {
        margin: auto;
        margin-top: 25px;
    }

    .modalform .pers span {
        color: #aaa;
    }

    .modalform .pers span a {
        color: #aaa;
    }

    .modalzag {
        font-weight: bold;
        text-align: center;
        font-size: 22px;
        color: #000
    }

    .modalopis {
        margin: 0 auto;
        max-width: 270px;
        line-height: 120%;
        margin-top: 12px;
        margin-bottom: 20px;
        font-size: 16px;
        text-align: center;
        color: #000
    }

    .modalform .otmetka {
        margin: 0 auto;
        margin-top: 30px;
        max-width: 230px;
    }

    /* Корзина */
    .modal2 {
        background: #fff;
        z-index: 1200;
        width: 640px;
        margin: auto;
        position: absolute;
        right: 0;
        top: 0;
        min-height: 100vh;
    }

    .modal2 .modaltext {
        padding: 30px 30px 30px 40px
    }

    .basketzag {
        font-weight: 600;
        font-size: 24px;
        margin-bottom: 30px;
    }

    .basket {
        border-top: 1px solid #ddd;
    }

    .basketform {
        display: none;
    }

    .basket-itog {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .basket-position {
        border-bottom: 1px solid #ddd;
        padding-top: 12px;
        padding-bottom: 12px;
        position: relative;
        display: flex;
        align-items: center;
    }

    .basket-position-zag {
        font-weight: 500;
        font-size: 15px;
    }

    .basket-position-right {
        margin-left: 20px;
    }

    .basket-position-kolvo {
        display: flex;
        margin-top: 10px;
        margin-bottom: 8px;
        align-items: center;
    }

    .basket-kolvo {
        font-size: 15px;
        font-weight: 400;
        max-width: 45px;
        margin-right: 8px;
        outline: 0;
        border: 0;
        padding: 12px 18px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
        text-align: right;
    }

    .edinica {
        font-size: 15px;
        font-weight: 400;
        max-width: 80px;
        margin-right: 8px;
        outline: 0;
        border: 0;
        padding: 11px 17px 11px 17px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
        text-align: left;
    }

    .edinica option {
        color: #000;
    }

    .basket-position-price {
        font-size: 18px;
        font-weight: 600;
        color: #418123;
        margin-left: 8px;
    }

    .basket-clsbtn {
        position: absolute;
        color: #777;
        right: 10px;
        top: 24px;
        font-size: 16px;
        cursor: pointer;
        transition: 0.5s;
    }

    .basket-clsbtn:hover {
        transform: rotate(90deg);
    }

    .basket-itog-zag {
        font-size: 18px;
        font-weight: 500;
    }

    .basket-itog-price {
        font-size: 24px;
        font-weight: 600;
        margin-top: 4px;
        color: #418123
    }
}

@media (max-width: 1024px){
    .tovar .wr{
        grid-template-columns: 100%;
    }
    .footer .wr{
        display: grid;
        grid-template-columns: 100%;
    }
}

@media screen and (max-width: 979px) and (min-width: 750px) {
    /* база */
    html, body, div, table, tr, td, li, ul, p {
        font-size: 14px;
    }

    h1 {
        font-size: 34px;
        color: #fff;
    }

    h2 {
        font-size: 26px;
        font-weight: 600;
    }

    h3 {
        font-size: 20px;
    }

    h4 {
        font-size: 17px;
    }

    h5 {
        font-size: 15px;
    }

    .wrap {
        width: 100%;
        height: auto;
    }

    .wr {
        max-width: 1360px;
        padding-right: 30px;
        padding-left: 30px;
        margin: auto;
    }

    button {
        transition: all 0.4s ease;
        font-size: 15px;
        font-weight: 400;
        padding: 24px 38px;
        background: linear-gradient(to bottom, #70a842, #418123);
        border-radius: 7px;
        box-shadow: 0 10px 20px rgba(65, 130, 40, 0.4);
    }

    button:hover {
        background: linear-gradient(to bottom, #70a842, #4c8e2d);
        box-shadow: 0 10px 20px rgba(65, 130, 40, 0.6);
    }

    fancybox-button:hover {
        box-shadow: 0 !important
    }

    /* видео */
    .is_overlay {
        display: block;
        width: 100%;
        height: auto;
        overflow: hidden;
        min-height: 920px;
    }

    #trailer {
        position: absolute;
        text-align: center;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        min-height: 920px;
        z-index: -9999999;
        overflow: hidden;
        max-height: 900px;
    }

    #trailer video {
        position: relative;
        height: 100%;
        width: 100%;
        height: auto;
        min-width: 2000px;
        min-height: 950px;
        z-index: -9999999;
        overflow: hidden !important;
    }

    .over {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        overflow: hidden;
        min-height: 920px;
        background: url('/wp-content/uploads/2022/08/point.png');
        z-index: -99999;
        max-height: 920px;
    }

    .line {
        position: absolute;
        height: 382px;
        background: url('/wp-content/uploads/2022/08/grtop.png') top center repeat-x;
        text-align: center;
        top: 0;
        right: 0;
        left: 0;
        overflow: hidden;
        z-index: -999;
    }

    .ver {
        overflow: hidden;
    }

    .thrdpage {
        overflow: hidden;
    }

    .thrdpage #trailer {
        min-height: 440px;
        max-height: 440px;
    }

    .thrdpage .over {
        min-height: 440px;
        height: 440px;
    }

    /* хедер */
    .catalogbg {
        min-height: 920px;
        margin-bottom: 20px;
    }

    .catalogbg2 {
        margin-bottom: 40px;
        height: 420px;
        background-image: none !important
    }

    .header {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .header .wr {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .topline {
        padding-top: 20px;
        padding-bottom: 20px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15)
    }

    .topline .wr {
        display: flex;
        justify-content: space-between;
    }

    .topright {
        display: flex;
        justify-content: space-between;
    }

    .email {
        color: #fff;
        margin-right: 50px;
        font-size: 13px;
    }

    .email a {
        color: #fff;
    }

    .perezvonite {
        cursor: pointer;
        border-bottom: 1px solid;
        color: #fff;
        font-size: 13px;
    }

    .location {
        cursor: pointer;
        display: flex;
        align-items: center;
        color: #fff;
        font-size: 13px;
    }

    .location img {
        margin-right: 10px;
    }

    .location p {
        border-bottom: 1px dotted #fff;
        font-size: 13px;
    }

    .loc p {
        font-size: 18px;
        font-weight: 500;
    }

    .loc ul {
        list-style-type: none;
        padding-bottom: 10px;
        margin-top: 30px;
    }

    .loc ul li {
        padding-left: 24px;
        background: url('/wp-content/uploads/2022/08/metka2.png') no-repeat;
        background-position: 0 4px;
        margin-bottom: 12px;
    }

    .loc ul li a {
        color: #418123
    }

    .logo img {
        display: block;
        float: left;
    }

    .logo p {
        display: none;
        line-height: 20px;
        font-weight: 400;
        color: #aaa;
        font-size: 14px;
        margin-left: 140px;
        margin-top: 20px;
    }

    .adr {
        max-width: 180px;
    }

    .adr span {
        color: #fff;
        display: block;
        font-weight: 500;
        font-size: 16px;
    }

    .adr p {
        color: #fff;
        margin-top: 6px;
    }

    .topbtn {
        cursor: pointer;
        text-align: center;
        color: #fff;
    }

    .topbtn p {
        color: #fff;
        margin-left: 7px;
    }

    .topbtn img {
        display: block;
        margin: auto;
        margin-bottom: 12px;
    }

    .cont {
        text-align: right
    }

    .cont div {
        background: #558132;
        color: #fff;
        font-size: 12px;
        border-radius: 4px;
        padding: 5px 10px;
        display: inline-block;
        margin-bottom: 12px;
    }

    .cont span {
        display: block;
        margin-bottom: 2px;
    }

    .cont span a {
        color: #fff;
        font-size: 22px;
        font-weight: 600;
        border: 0;
    }

    .cont p {
        font-size: 13px;
        color: #fff;
        margin-top: 0px;
    }

    /* верхнее меню */
    .topmenu {
        min-height: 52px;
    }

    .menu {
        display: flex;
        background: #558132;
        border-radius: 10px;
        margin-left: -5px;
        margin-right: -5px;
    }

    .menu div {
        font-size: 13px;
        flex-basis: auto;
        flex-grow: 1;
        min-height: 52px;
    }

    .menu div a {
        border-bottom: 0;
        text-decoration: none;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
    }

    .menu div:first-child a {
        border-radius: 10px 0 0 10px;
    }

    .menu div:last-child a {
        border-radius: 0 10px 10px 0;
    }

    .menu div a:hover {
        color: #fff;
        background: #456828;
    }

    .menu div a span {
        border-bottom: 1px solid;
    }

    .rmenu {
        position: absolute;
        width: 100%;
        min-width: 590px;
        top: 100%;
        height: auto !important;
        background: #fff !important;
        z-index: 10;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
        height: auto;
        border-radius: 0 0 10px 10px;
    }

    .rmenu ul {
        list-style-type: none;
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        padding: 15px 10px 0 10px;
    }

    .rmenu ul li {
        text-align: center;
        width: 33%;
        margin-bottom: 10px;
    }

    .rmenu ul li img {
        display: block;
        margin: auto;
        margin-bottom: 2px;
    }

    .rmenu ul li a {
        display: inline-block;
        margin: 8px 22px 8px 22px;
        border: 0;
        cursor: pointer;
        font-weight: 500;
        color: #000;
        width: auto;
        height: auto;
        border-radius: 0 !important
    }

    .rmenu ul li a:hover {
        background: none;
        color: #000
    }

    .rmenu ul li a span {
        font-size: 14px;
        border-bottom: 1px solid #999
    }

    .fixedmenu {
        justify-content: center !important;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 20;
        border-radius: 0 0 0 0 !important;
        margin: 0;
    }

    .fixedmenu div a {
        border-bottom: 0;
        text-decoration: none;
        border-radius: 0 0 0 0 !important;
    }

    .slidemenu {
        position: relative
    }

    .slidemenu div {
        padding-top: 12px !important;
        padding-bottom: 22px !important;
    }

    .slidemenu a {
        position: relative
    }

    .fixedmenu .slidemenu div {
        margin: 0 0 0 0;
    }

    /* главный экран */
    .main {
        padding-top: 40px;
    }

    .main .wr {
        display: flex;
        justify-content: space-between;
    }

    .arr {
        margin-left: 6px;
    }

    .breadcrumbs {
        display: flex;
        align-items: center;
        color: #ddd;
        margin-bottom: 30px;
        margin-left: 2px;
    }

    .breadcrumbs a {
        border-bottom: 1px solid;
        color: #72b33e !important;
    }

    .rep {
        margin-left: 10px;
        margin-right: 10px;
    }

    h1 {
        font-weight: 500;
        line-height: 120%;
        margin-bottom: 20px;
        margin-left: -1px;
    }

    .leftmain p {
        color: #fff;
        font-size: 20px;
        line-height: 120%;
        margin-top: 12px;
    }

    .leftmain ul {
        margin-top: 40px;
        margin-bottom: 20px;
        list-style-type: none;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
    }

    .leftmain ul li {
        color: #fff;
        line-height: 130%;
        background: url('/wp-content/uploads/2022/08/venok.png') no-repeat;
        background-position: 0 0;
        min-height: 50px;
        padding-left: 76px;
        font-size: 15px;
        margin-bottom: 20px;
    }

    .leftmain ul li:nth-child(1) {
        max-width: 300px;
    }

    .leftmain ul li:nth-child(2) {
        max-width: 220px;
    }

    .leftmain ul li:nth-child(3) {
        max-width: 300px;
    }


    .mainbtns {
        margin-top: 10px;
    }

    .mainbtns button {
        font-size: 16px;
        margin-right: 10px;
    }

    /* о компании */
    .about {
        padding-top: 50px;
        padding-bottom: 50px;
        background: url('/wp-content/uploads/2022/08/lispng.png') no-repeat;
        background-position: 0 100px;
        position: relative;
    }

    .aboutwrap {
        padding-top: 20px;
    }

    .about h2 {
        padding-left: 150px;
    }

    .leftabout p {
        margin-top: 18px;
        margin-bottom: 18px;
        line-height: 140%;
        font-size: 17px;
    }

    .leftabout span {
        font-size: 22px;
        font-weight: 500;
        line-height: 130%;
    }

    .leftabout ul {
        list-style-type: none;
        margin-top: 30px;
        margin-bottom: 40px;
    }

    .leftabout ul li {
        padding-left: 28px;
        position: relative;
        margin-bottom: 12px;
        line-height: 140%;
        font-size: 17px;
    }

    .leftabout ul li::after {
        content: '';
        display: flex;
        position: absolute;
        top: 8px;
        left: 0px;
        width: 6px;
        height: 6px;
        background: #70a842;
        border-radius: 50%;
        border: solid 4px rgba(112, 168, 66, 0.2);
        box-sizing: border-box;
    }

    .rightabout {
        margin: auto;
        margin-top: 55px;
    }

    .rightaboutbg {
        background: url('/wp-content/uploads/2022/08/lispng2.png') no-repeat;
        width: 158px;
        height: 436px;
        z-index: -1;
        position: absolute;
        right: 0;
        top: 50px;
    }

    .aboutwrap a {
        display: block;
        border: 0
    }

    .rightvideo {
        cursor: pointer;
        height: 440px;
        border-radius: 15px;
        background: url('/wp-content/uploads/2022/08/bg.jpg') no-repeat top center;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    .videobtn {
        margin-top: 20px;
        animation: pulse 2s infinite;
        width: 80px;
        height: 80px;
        border-radius: 50%;
        box-shadow: 0 0 0 25px rgba(112, 168, 66, 0.1);
        border: 10px solid rgba(112, 168, 66, 0.2);
        background: linear-gradient(to bottom, #70a842, #519531);
        background-clip: padding-box;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .rightvideo p {
        color: #8ec366;
        font-weight: 500;
        font-size: 18px;
        max-width: 220px;
        text-align: center;
        margin-top: 34px;
    }

    .eks p {
        font-weight: 500;
        text-align: center;
        font-size: 18px;
        margin-top: 20px;
    }

    .zoobl {
        padding-top: 60px;
    }

    .zoobl2 {
        padding-top: 10px;
    }

    .zoozag {
        font-weight: bold;
        font-size: 28px;
        margin-bottom: 10px;
        margin-left: -2px;
    }

    .zooopis {
        margin-top: 10px;
        font-size: 18px;
    }

    .aboutimages {
        margin-top: 40px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .aboutimages a {
        border: 0;
        width: 32%;
        display: block;
        margin-bottom: 10px;
    }

    .aboutimages img {
        border-radius: 10px;
    }

    /* каталог */
    .catalog {
        padding-top: 40px;
        padding-bottom: 30px;
    }

    .catalog h2 {
        margin-left: -3px;
    }

    .catalog h3 {
        margin-left: -2px;
        font-size: 36px;
    }

    .catwrap {
        padding-top: 50px;
    }

    .catwrap div img {
        transition: all 0.5s ease;
    }

    .catwrap div:hover img {
        transform: scale(1.02);
    }

    .catwrap div:nth-child(even) {
        margin-right: 0;
    }

    .nob {
        border: 0;
        display: block;
    }

    .catbg {
        display: block;
        margin: auto;
        position: relative;
        top: 0;
        left: 0;
        right: 0;
        z-index: -2;
        border-radius: 10px;
    }

    .cat-img {
        max-width: 600px;
        width: 114%;
        margin-left: -7%;
        position: absolute;
        z-index: 1;
        top: 8%;
    }

    .cat-akciya {
        transition: all 0.5s ease;
        border-radius: 50%;
        width: 90px;
        height: 90px;
        background: linear-gradient(to top, #dd0000, #c21c1c, #ff2121);
        color: #fff;
        font-weight: bold;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        left: -20px;
        top: -20px;
        z-index: 5;
        text-transform: uppercase;
    }

    .catwrap div:hover .cat-akciya {
        transform: scale(1.02);
    }

    .cat-zag {
        font-size: 19px;
        text-align: center;
        font-weight: 500;
        margin-top: 20px;
        margin-bottom: 10px;
    }

    .cat-zag a {
        color: #000;
        border-bottom: 1px solid #bbb
    }

    .cat-sort {
        text-align: center;
        margin-top: 10px;
    }

    .cat-sort a {
        border-bottom: 1px solid #b4d099
    }

    .cat-size {
        text-align: center;
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .cat-price {
        text-align: center;
        font-weight: 600;
        font-size: 24px;
        color: #549733;
        margin-top: 3px;
        margin-bottom: 12px;
    }

    .catwrap div button {
        display: block;
        margin: auto;
        margin-top: 20px;
        padding: 20px 40px;
    }

    .cat-tiles {
        list-style-type: none;
        display: flex;
        margin-top: 20px;
        margin-bottom: 14px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .cat-tiles li {
        margin: 3px 3px;
    }

    .cat-tiles li a {
        background: #ddd;
        color: #777;
        display: block;
        border-radius: 5px;
        padding: 8px 12px;
        font-size: 14px;
        border: 0;
    }

    .cat-tiles li a:hover {
        background: #777;
        color: #fff;
    }

    .catwrap2 .cat-zag {
        font-size: 16px;
        margin-top: 20px;
    }

    .cat-img3 {
        width: 100%;
        max-width: 600px;
    }

    /* товар */
    .tovar {
        padding-top: 20px;
        padding-bottom: 40px;
    }

    .tovarleft {
        width: 40%;
    }

    .tovar-mainimg {
        position: relative;
    }

    .tovar-images {
        max-width: 480px;
        margin: auto;
        margin-top: 1rem;
        display: flex;
        justify-content: flex-start;
        flex-wrap: nowrap;
        gap: 1rem;
    }

    .tovar-images a {
        border: 0;
        display: block;
    }

    .tovar-images img {
        border-radius: 8px;
    }

    .cat-img2 {
        width: 100%;
        max-width: 570px;
        position: absolute;
        top: 8%;
    }

    .thrpagebg {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: auto;
        z-index: -2;
        border-radius: 10px;
        border: 1px solid #ddd;
    }

    .cat-img2x {
        width: 80%;
        max-width: 570px;
        margin: auto;
        display: block;
        margin-top: 12%;
        margin-bottom: 12%;
    }

    .catalogbg2 h1 {
        font-size: 26px;
    }

    .tovar-mainimg .cat-akciya {
        left: -20px;
    }

    .tovarright h3 {
        margin-bottom: 1px;
        line-height: 110%;
        font-size: 22px;
    }

    .calclink {
        color: #3a791b
    }

    .akciya {
        border-radius: 4px;
        background: linear-gradient(to top, #dd0000, #c21c1c);
        padding: 10px 14px;
        color: #fff;
        margin-top: 2px;
        margin-bottom: 3px;
        display: block;
    }

    .tovarright p {
        font-size: 15px;
        line-height: 140%;
        margin-bottom: 20px;
    }

    .tovarright-cena {
        font-weight: 600;
        font-size: 24px;
        color: #549733;
        margin-top: 4px;
        line-height: 100%;
        margin-bottom: 10px;
    }

    .opistable {
        width: 100%;
        background: #fff;
        border-collapse: collapse;
        padding: 0;
        margin: 22px 0 30px 0;
    }

    .opistable tr:nth-child(odd) td {
        background: #f0f0f0;
    }

    .opistable tr:first-child td:first-child {
        border-radius: 5px 0 0 0;
    }

    .opistable tr:first-child td:last-child {
        border-radius: 0 5px 0 0;
    }

    .opistable tr:last-child td:first-child {
        border-radius: 0 0 0 5px;
    }

    .opistable tr:last-child td:last-child {
        border-radius: 0 0 5px 0;
    }

    .opistable td {
        background: #f9f9f9;
        padding: 12px 16px;
        vertical-align: middle;
        font-size: 13px;
    }

    .opistable tr td:last-child {
        text-align: right;
    }

    /* цены */
    .price {
        background: #e6e6e6;
        padding-top: 50px;
        padding-bottom: 40px;
    }

    .price h2 {
        margin-left: -1px;
    }

    .price-opis {
        margin-top: 20px;
        font-size: 16px;
    }

    .price-opis a {
        border-bottom: 1px dotted;
    }

    .pricetable {
        width: 100%;
        background: #fff;
        border-radius: 20px;
        border-collapse: collapse;
        padding: 0;
        margin: 40px 0 0 0;
    }

    .pricetable th {
        background: linear-gradient(to top, #70a842, #519531);
        padding: 14px 20px;
        color: #fff;
        font-weight: 400;
        text-align: left;
    }

    .pricetable tr:nth-child(odd) td {
        background: #f6f6f6;
    }

    .pricetable th:first-child {
        border-radius: 10px 0 0 0;
    }

    .pricetable th:last-child {
        border-radius: 0 10px 0 0;
    }

    .pricetable tr:last-child td:first-child {
        border-radius: 0 0 0 10px;
    }

    .pricetable tr:last-child td:last-child {
        border-radius: 0 0 10px 0;
    }

    .pricetable th a {
        color: #fff;
    }

    .pricetable td {
        background: #fff;
        padding: 14px 20px;
        vertical-align: middle;
        font-size: 14px;
    }

    .pricetable tr th:last-child {
        text-align: right;
    }

    .pricetable tr td:last-child {
        text-align: right;
        font-weight: 600;
        color: #3a791b;
        width: 20%;
    }

    .price .btn {
        display: block;
        margin: auto;
        margin-top: 40px;
    }

    .edinica2 {
        margin-left: 10px;
        font-size: 14px;
        font-weight: 400;
        max-width: 54px;
        outline: 0;
        border: 0;
        padding: 7px 8px 7px 8px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 5px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
        text-align: left;
    }

    .edinica2 option {
        color: #000;
    }

    /* калькулятор */
    .calculator {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .calculator h3 {
        font-size: 30px;
        margin-left: -2px;
        margin-bottom: 16px;
        line-height: 120%;
    }

    .calc-opis {
        font-size: 16px;
        margin-top: 5px;
    }

    .calcformwrap {
        width: 100%;
        justify-content: flex-start;
        align-items: flex-end;
        flex-wrap: wrap;
    }

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

    .calcleft div {
        margin-right: 30px;
    }

    .calcleft p {
        font-weight: 500;
        font-size: 17px;
        margin-left: 5px;
        margin-bottom: 5px;
    }

    .calcform {
        margin-top: 60px;
    }

    .calcright {
        display: flex;
        align-items: center;
        margin-top: 30px;
    }

    .calcright div {
        margin-right: 30px;
    }

    .calcright p {
        font-weight: 500;
        font-size: 17px;
        margin-left: 5px;
        margin-bottom: 5px;
    }

    .calcright .inpt2 {
        width: 50px;
        padding: 14px 20px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        color: #fff;
    }

    .slct {
        font-size: 14px;
        font-weight: 400;
        width: 95px;
        outline: 0;
        border: 0;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        color: #fff;
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
    }

    .slct::placeholder {
        color: #fff;
    }

    .slct option {
        color: #000;
    }

    .calc-cena {
        margin-top: 40px;
    }

    .calc-cena p {
        font-weight: 500;
        font-size: 24px;
        margin-bottom: 10px;
    }

    .calc-cena span {
        font-weight: 600;
        font-size: 30px;
        color: #3a791b
    }

    .calcformwrap .btn {
        margin-top: 30px;
        font-size: 17px;
    }

    /* преимущества */
    .preim {
        padding-top: 60px;
        padding-bottom: 60px;
        background: url('/wp-content/uploads/2022/08/preimbg.jpg') no-repeat center center #3c3533;
    }

    .preim h3 {
        color: #fff;
        font-size: 36px;
        font-weight: 500;
    }

    .preimwrap {
        padding-top: 70px;
    }

    .preimcenter {
        margin: auto;
        display: block;
        max-width: 432px;
        margin-top: 40px;
        margin-bottom: 30px;
    }

    .preimwrap ul {
        list-style-type: none;
    }

    .preimwrap ul li {
        padding-left: 84px;
        color: #fff;
        position: relative;
        margin-bottom: 36px;
        line-height: 130%;
    }

    .preimwrap ul li:last-child {
        margin-bottom: 0;
    }

    .preimwrap ul li span {
        font-size: 20px;
        font-weight: 500;
        color: #fff;
        margin-bottom: 8px;
        display: block;
        margin-left: -1px
    }

    .preimwrap ul li img {
        position: absolute;
        left: 23px;
        top: 17px;
    }

    .preimwrap ul li::before {
        position: absolute;
        content: '';
        left: 0px;
        top: -5px;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        box-shadow: 0 0 0 5px rgba(112, 168, 66, 0.1);
        border: 7px solid rgba(112, 168, 66, 0.2);
        background: linear-gradient(to bottom, #70a842, #519531);
        background-clip: padding-box;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    /* грузовик */
    .gruz {
        padding-top: 50px;
        padding-bottom: 40px;
        background: url('/wp-content/uploads/2022/08/map.png') no-repeat top center;
    }

    .gruz h3 {
        font-size: 26px;
        max-width: 900px;
        line-height: 120%;
    }

    .gruzwrap {
        padding-top: 40px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: column;
    }

    .gruzovik {
        margin-left: -40px;
        margin-top: 40px;
        width: 64%;
        max-width: 832px;
    }

    .rightgruz {
        margin-top: 40px;
        width: 100%;
    }

    .gruzpoint {
        background: linear-gradient(to top, #519531, #70a842);
        display: flex;
        width: 100%;
        justify-content: flex-start;
        height: 120px;
        border-radius: 10px;
        align-items: center;
        margin-bottom: 20px;
    }

    .gruzicon {
        background: url('/wp-content/uploads/2022/08/circle.png') no-repeat center right;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 100px;
        height: 100%;
        border-radius: 10px 0 0 10px;
        flex-grow: 1;
        min-width: 115px
    }

    .gruzpoint p {
        font-weight: 500;
        font-size: 15px;
        line-height: 120%;
        color: #fff;
        margin-left: 30px;
        margin-right: 30px;
        flex-grow: 1;
    }


    /* оплата и доставка */
    .semipage {
        min-height: 440px !important;
        max-height: 440px !important;
    }

    .semipage video {
        margin-top: -350px;
    }

    .dostavka {
        padding-top: 30px;
        padding-bottom: 20px;
    }

    .dostavka .wr {
        position: relative
    }

    .dostavka h2 {
        margin-bottom: 40px;
        margin-left: -3px;
    }

    .dostavka-opis {
        font-size: 16px;
        line-height: 140%;
    }

    .dostwrap h3 {
        margin-top: 60px;
        margin-bottom: 20px;
        margin-left: -2px;
    }

    .gazel {
        margin-top: 50px;
        height: auto;
        width: 100%;
        height: auto;
        max-width: 832px;
    }

    .dost-zag {
        font-weight: 500;
        font-size: 18px;
        margin-bottom: 20px;
        line-height: 130%;
    }

    .dosttbl {
        border-collapse: collapse;
        width: 100%;
        margin: 0;
        padding: 0;
        margin-bottom: 40px;
    }

    .dosttbl tr:first-child td {
        border-bottom: 2px solid #fff;
    }

    .dosttbl tr td:last-child {
        font-size: 18px;
        font-weight: 600;
        color: #519531;
        text-align: right;
        min-width: 130px;
    }

    .dosttbl td {
        padding: 14px 20px;
        background: #f0f0f0;
        vertical-align: middle;
        border-bottom: 2px solid #fff;
    }

    .dosttbl tr:first-child td:first-child {
        border-bottom: 2px solid #fff;
        border-radius: 10px 0 0 0;
    }

    .dosttbl tr:first-child td:last-child {
        border-bottom: 2px solid #fff;
        border-radius: 0 10px 0 0;
    }

    .dosttbl tr:last-child td:first-child {
        border-bottom: 2px solid #fff;
        border-radius: 0 0 0 10px;
    }

    .dosttbl tr:last-child td:last-child {
        border-bottom: 2px solid #fff;
        border-radius: 0 0 10px 0;
    }

    .dosttbl tr:last-child td::first-child {
        font-size: 18px;
        font-weight: 600;
        color: #519531;
        text-align: right;
        min-width: 130px;
    }

    .oplata {
        padding-top: 40px;
        padding-bottom: 100px;
    }

    .opl {
        background: #f0f0f0;
        border-radius: 25px;
        padding: 90px 30px 80px 30px;
        text-align: center;
    }

    .opl h2 {
        text-align: center;
    }

    .opl-opis {
        text-align: center;
        font-size: 18px;
        margin-top: 19px;
    }

    .oplwrap {
        padding-top: 50px;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
    }

    .oplwrap div {
        text-align: center;
        width: 25%;
    }

    .oplwrap div img {
        margin: auto;
        display: block;
    }

    .oplwrap div p {
        margin-top: 10px;
        text-align: center;
        font-size: 17px;
        font-weight: 500;
    }

    /* Галерея */
    .gallery {
        padding-top: 30px;
        padding-bottom: 0px;
    }

    .gallery h2 {
        margin-left: -3px;
        line-height: 120%;
    }

    .gallery .opis {
        font-size: 17px;
        line-height: 130%;
        margin-top: 12px;
    }

    .galwrap {
        margin-top: 50px;
    }

    .galpoint {
        padding: 35px 40px 30px 40px;
        margin-bottom: 50px;
        border-radius: 20px;
        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1)
    }

    .galzag {
        font-weight: 500;
        font-size: 24px;
        line-height: 120%;
    }

    .galdate {
        font-size: 14px;
        color: #999;
        margin-top: 5px;
    }

    .galphotos {
        margin-top: 30px;
        display: flex;
        flex-wrap: wrap;
        gap: 2%;
    }

    .galphotos a {
        border: 0;
        width: 48%;
        display: block;
        margin-bottom: 2%;
    }

    .galphotos img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 10px;
    }

    .galimage {
        width: 100%;
        min-height: 225px;
        max-width: 49%;
        cursor: pointer;
        border-radius: 10px;
        margin-bottom: 2%;
        background-size: cover;
        background-repeat: no-repeat;
    }

    /* Акции */
    .akcii {
        padding-top: 30px;
        padding-bottom: 20px;
    }

    .akcii h2 {
        margin-left: -2px;
        line-height: 120%;
    }

    .akcii .opis {
        font-size: 20px;
        line-height: 130%;
        margin-top: 12px;
        margin-bottom: 30px;
    }

    .akc {
        margin-top: 20px;
        position: relative;
        width: 100%;
        height: auto;
    }

    .akctext {
        color: #fff;
        font-size: 20px;
        font-weight: 500;
        position: absolute;
        z-index: 1;
        top: 40px;
        left: 40px;
        max-width: 270px;
    }

    .akcdate {
        color: rgba(255, 255, 255, 0.5);
        position: absolute;
        bottom: 40px;
        left: 40px;
    }

    .akc span {
        color: #74bd3b
    }

    .akc img {
        border-radius: 15px;
    }

    /* Контакты */
    .kontakty {
        padding-top: 30px;
        padding-bottom: 80px;
    }

    .kontakty h2 {
        line-height: 120%;
    }

    .ofiswrap {
        padding-bottom: 100px;
    }

    .ofis-left {
        margin-top: 30px;
    }

    .ofis-zag {
        font-size: 20px;
        font-weight: 600;
        margin-bottom: 8px;
    }

    .ofis-opis {
        font-size: 16px;
        margin-bottom: 30px;
    }

    .ofis-opis span {
        font-size: 24px;
        font-weight: 600;
        display: block;
        margin-top: 6px;
        margin-bottom: 5px;
    }

    .ofis-opis span a {
        border: 0;
    }

    .ofis-photos {
        display: flex;
        justify-content: space-between;
    }

    .ofis-photos a {
        display: block;
        border: 0;
    }

    .ofis-photos img {
        border-radius: 8px;
        margin-top: 10px;
    }

    .kont-map {
        border-radius: 10px;
        height: 450px;
        overflow: hidden;
        border: 1px solid #ddd;
        margin-top: 30px;
    }

    .kontakty h3 {
        font-size: 34px;
    }

    .cont-wrap {
        display: flex;
        margin-top: 50px;
        gap: 2%;
        flex-wrap: wrap;
    }

    .cont-wrap div {
        padding: 30px 5% 33px 5%;
        background: #f6f6f6;
        border-radius: 10px;
        width: 38%;
        margin-bottom: 2%;
    }

    .cont-zag {
        font-size: 17px;
        font-weight: 500;
        margin-bottom: 10px;
    }

    .cont-opis {
        font-size: 15px;
    }

    .cont-opis span {
        font-size: 17px;
        font-weight: 600;
        display: block;
        margin-top: 6px;
        line-height: 100%;
    }

    .cont-opis span a {
        border: 0;
    }

    /* Тех условия */
    .uslovia {
        padding-top: 20px;
        padding-bottom: 50px;
    }

    .uslovia h2 {
        line-height: 110%;
        margin-bottom: 11px;
        font-size: 28px;
    }

    .uslovia h3 {
        line-height: 120%;
        font-size: 24px;
        margin-top: 90px;
        margin-bottom: 30px;
    }

    .uslovia .opis {
        font-size: 15px;
        font-style: italic;
        margin-bottom: 20px;
    }

    .usl {
        font-size: 18px;
        margin-bottom: 40px;
        line-height: 130%;
    }

    .usl p {
        margin-top: 7px;
        margin-bottom: 7px;
    }

    .uslovia ol {
        list-style: none;
        counter-reset: li;
        margin: 10px 0 30px 0;
        padding: 0;
    }

    .uslovia ol span {
        font-weight: 500;
        font-size: 16px;
    }

    .uslovia ol li {
        margin: 10px 0 10px 0;
        line-height: 140%;
        font-size: 14px;
    }

    .uslovia ol li ol {
        margin-left: 10px;
    }

    .uslovia li:before {
        counter-increment: li;
        content: counters(li, ".") ". ";
    }

    .teh-table {
        border-collapse: collapse;
    }

    .teh-table td {
        border: 1px solid #ddd;
        padding: 15px 20px;
        font-size: 14px;
    }

    .teh-table img {
        width: 100%;
        height: auto;
    }

    .tablewrap {
        overflow-y: auto;
        margin-top: 30px;
        margin-bottom: 50px;
    }

    /* Форма */
    .midforma {
        background: url('/wp-content/uploads/2022/08/bg2.jpg') no-repeat center center;
        padding-top: 50px;
        padding-bottom: 50px;
        /* 40px, как в базовом правиле: иначе отступ гулял по ширинам
           40 / 30 / 40 — только на брейкпоинте 750-979 px было 30. */
        margin-top: 40px;
    }

    .midform-zag {
        color: #fff;
        font-size: 24px;
        font-weight: 500;
        max-width: 600px;
        margin-bottom: 10px;
    }

    .midform-zag2 {
        color: #96e457;
        font-size: 18px;
        font-weight: 500;
    }

    .iphone {
        position: absolute;
        right: 50px;
        top: -110px;
        width: 106px;
        height: auto;
    }

    .phoneform .inpt2 {
        margin-right: 10px;
        background: linear-gradient(to top, #ddd, #fff);
        font-size: 16px;
    }

    .phoneform .btn2 {
        width: 210px;
        font-weight: 500;
        font-size: 16px;
    }

    .phoneform .pers {
        width: 600px;
    }

    .phoneform .pers label {
        justify-content: flex-start;
        align-items: center;
    }

    .phoneform .pers span {
        margin: 0
    }

    /* статья */
    .article {
        padding-top: 30px;
        padding-bottom: 40px;
    }

    .article2 {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .article h2 {
        font-size: 30px;
        font-weight: 600;
        margin-top: 30px;
        margin-bottom: 16px;
        margin-left: -3px;
        line-height: 120%;
    }

    .article h3 {
        font-size: 24px;
        font-weight: 600;
        margin-top: 30px;
        margin-bottom: 16px;
        margin-left: -3px;
        line-height: 120%;
    }

    .article h4 {
        font-size: 24px;
        font-weight: 500;
        margin-top: 20px;
        margin-bottom: 16px;
        margin-left: -3px;
        line-height: 120%;
    }

    .article h5 {
        font-size: 18px;
        font-weight: 500;
        margin-top: 20px;
        margin-bottom: 16px;
        margin-left: -2px;
        line-height: 120%;
    }

    .article h2:first-child {
        margin-top: 0;
    }

    .article h3:first-child {
        margin-top: 0;
    }

    .article p {
        font-size: 15px;
        line-height: 140%;
        margin-top: 14px;
        margin-bottom: 14px;
    }

    .article ol {
        list-style-type: none;
        counter-reset: num;
        margin: 40px 0 40px 0;
        padding: 0;
    }

    .article ol li {
        font-size: 15px;
        margin-bottom: 28px;
        line-height: 140%;
        position: relative;
        padding-left: 48px
    }

    .article ol li span {
        font-weight: 500;
        color: #000;
        font-size: 16px;
        display: block;
        margin-bottom: 6px;
    }

    .article ol li:before {
        content: counter(num);
        counter-increment: num;
        border: 5px solid rgba(112, 168, 66, 0.2);
        display: flex;
        font-size: 14px;
        position: absolute;
        top: -5px;
        left: 0px;
        width: 26px;
        height: 26px;
        align-items: center;
        justify-content: center;
        background: linear-gradient(to top, #70a842, #418123);
        color: #fff;
        font-weight: 600;
        border-radius: 50%;
        background-clip: padding-box;
    }

    .article ul {
        list-style-type: none;
        margin: 40px 0 40px 0;
        padding: 0;
    }

    .article ul li {
        font-size: 15px;
        margin-bottom: 34px;
        line-height: 140%;
        position: relative;
        padding-left: 27px
    }

    .article ul li span {
        font-weight: 500;
        color: #000;
        font-size: 16px;
        display: block;
        margin-bottom: 6px;
    }

    .article ul li:before {
        content: '';
        display: flex;
        position: absolute;
        top: 4px;
        left: 0px;
        width: 6px;
        height: 6px;
        background: linear-gradient(to top, #70a842, #418123);
        border-radius: 50%;
        border: 5px solid rgba(112, 168, 66, 0.2);
        background-clip: padding-box;
    }

    .article-images {
        margin-top: 50px;
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        margin-bottom: 50px;
    }

    .article-images a {
        border: 0;
        width: 24%;
        display: block;
        margin-right: 1%;
        margin-bottom: 1%;
    }

    .article-images img {
        border-radius: 10px;
    }

    /* футер */
    .footer {
        background: #222222;
        border-bottom: 1px solid #282828;
        padding-top: 50px;
        padding-bottom: 40px;
    }

    .botlogo img {
        display: block;
    }

    .botlogo p {
        line-height: 20px;
        font-weight: 400;
        color: #aaa;
        font-size: 13px;
        margin-top: 14px;
    }

    .botadr {
        max-width: 220px;
        text-align: left;
        margin-top: 30px;
    }

    .botadr span {
        color: #fff;
        display: block;
        font-weight: 500;
        font-size: 16px;
    }

    .botadr p {
        color: #fff;
        margin-top: 6px;
    }

    .bottopbtn {
        cursor: pointer;
        text-align: center;
        color: #fff;
    }

    .bottopbtn p {
        color: #fff;
        margin-left: 7px;
    }

    .bottopbtn img {
        display: block;
        margin: auto;
        margin-bottom: 12px;
    }

    .botcont {
        text-align: left
    }

    .botcont div {
        background: #558132;
        color: #fff;
        font-size: 12px;
        border-radius: 4px;
        padding: 5px 10px;
        display: inline-block;
        margin-bottom: 12px;
    }

    .botcont span {
        display: block;
        margin-bottom: 5px;
    }

    .botcont span a {
        color: #fff;
        font-size: 22px;
        font-weight: 600;
        border: 0;
    }

    .botcont p {
        font-size: 13px;
        color: #fff;
        margin-top: 1px;
    }

    .botmenu {
        list-style-type: none;
    }

    .botmenu li {
        margin-bottom: 12px;
        font-size: 13px;
    }

    .botmenu li a {
        color: #fff;
    }

    .botmenu li a:hover {
        color: #ddd;
    }

    .footercopy {
        background: #232323;
        padding-top: 26px;
        padding-bottom: 28px;
        border-top: 1px solid #555
    }

    .footercopy .wr {
        text-align: center;
        display: flex;
        justify-content: space-between;
    }

    .footleft p {
        display: flex;
        color: #999;
        text-align: left;
        font-size: 13px;
    }

    .footleft p:first-child {
        margin-bottom: 5px;
    }

    .footleft p a {
        margin-right: 20px;
        color: #fff !important;
    }

    .footright {
        text-align: right;
    }

    .footright p {
        text-align: right;
        color: #999;
        font-size: 13px;
    }

    .footright a {
        color: #fff !important;
    }

    .footleft {
        width: 70%;
    }

    /* фиксированные кнопки */
    .fixedbtns {
        position: fixed;
        right: 16px;
        bottom: 16px;
        z-index: 10;
    }

    .fixedbtns div {
        cursor: pointer;
        width: 60px;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        margin-top: 7px;
    }

    .fixedbtns div a {
        border: 0;
        display: block;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
    }

    .fixedbtns img {
        width: 30px;
        height: 30px;
    }

    .up {
        background: linear-gradient(to top, #757575, #a5a5a5);
        margin-bottom: 25px;
    }

    .tg {
        background: linear-gradient(to top, #3b8cc5, #68baff)
    }

    .tg img {
        margin-left: -6px;
    }

    .wa {
        background: linear-gradient(to top, #38ab28, #7fec3d)
    }

    .bc {
        background: linear-gradient(to top, #549024, #9ece41);
        position: relative;
    }

    .bc div {
        border-radius: 50%;
        width: 22px;
        height: 22px;
        font-weight: bold;
        font-size: 13px;
        background: #fff;
        display: flex;
        position: absolute;
        right: -3px;
        bottom: -3px;
        box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .bc img {
        margin-left: -4px;
        margin-top: 1px
    }

    /* формы и модальные окна */
    .inpt {
        font-size: 17px;
        font-weight: 400;
        width: 145px;
        margin-bottom: 8px;
        outline: 0;
        border: 0;
        padding: 25px 38px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
    }

    .inpt::placeholder {
        color: #fff;
    }

    .formzag2 {
        font-weight: 500;
        font-size: 36px;
        color: #fff;
        text-align: left;
    }

    .formopis2 {
        text-align: left;
        margin-top: 12px;
        margin-bottom: 37px;
        font-size: 18px;
        color: #fff;
    }

    .inpt2 {
        font-size: 17px;
        font-weight: 400;
        width: 145px;
        outline: 0;
        border: 0;
        padding: 25px 30px;
        background: linear-gradient(to bottom, #ddd, #bbb);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #000;
    }

    .inpt2::placeholder {
        color: #000;
    }

    .popup {
        display: none;
        position: fixed;
        z-index: 900;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        overflow: auto;
    }

    .modal {
        background: #fff;
        z-index: 1200;
        width: 440px;
        margin: auto;
        position: absolute;
        left: 0;
        right: 0;
        top: 16vh;
        border-radius: 10px;
    }

    .overlaypop {
        position: fixed;
        z-index: 1000;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        padding-bottom: 10vh;
        background: rgba(0, 0, 0, 0.4);
        cursor: pointer;
    }

    .clsbtn {
        position: absolute;
        color: #000;
        right: 20px;
        top: 20px;
        font-size: 20px;
        cursor: pointer;
        transition: 0.5s;
    }

    .clsbtn:hover {
        transform: rotate(90deg);
    }

    .modaltext {
        padding: 50px 50px 30px 50px;
    }

    .modaltext a {
        color: #000;
    }

    .pers2 label {
        margin-top: 10px;
        display: flex;
        justify-content: flex-start;
    }

    .checkpol {
        flex: 0 0 13px;
        display: block;
        width: 13px;
        height: 13px;
        border: 1px solid #777;
        margin-right: 10px;
    }

    .pers {
        margin-top: 20px;
    }

    .pers a {
        color: #888 !important;
    }

    .pers span {
        font-size: 12px;
        color: #999;
        margin-bottom: 8px;
        line-height: 130%;
    }

    .formopis {
        text-align: center;
        margin: auto;
        max-width: 220px;
        margin-top: 10px;
        margin-bottom: 27px;
        font-size: 16px;
        line-height: 120%;
    }

    .form {
        margin-top: 40px;
    }

    .modalform .btn2 {
        display: flex;
        margin: 0 auto;
        margin-top: 15px;
        min-width: 180px;
        width: 216px;
        font-size: 16px;
    }

    .modalform .inpt2 {
        display: block;
        margin: 0 auto;
        margin-bottom: 5px;
        font-size: 16px;
    }

    .modalform .pers {
        margin: auto;
        margin-top: 25px;
    }

    .modalform .pers span {
        color: #aaa;
    }

    .modalform .pers span a {
        color: #aaa;
    }

    .modalzag {
        font-weight: bold;
        text-align: center;
        font-size: 22px;
        color: #000
    }

    .modalopis {
        margin: 0 auto;
        max-width: 270px;
        line-height: 120%;
        margin-top: 12px;
        margin-bottom: 20px;
        font-size: 16px;
        text-align: center;
        color: #000
    }

    .modalform .otmetka {
        margin: 0 auto;
        margin-top: 30px;
        max-width: 230px;
    }

    /* Корзина */
    .modal2 {
        background: #fff;
        z-index: 1200;
        width: 640px;
        margin: auto;
        position: absolute;
        right: 0;
        top: 0;
        min-height: 100vh;
    }

    .modal2 .modaltext {
        padding: 30px 30px 30px 40px
    }

    .basketzag {
        font-weight: 600;
        font-size: 24px;
        margin-bottom: 30px;
    }

    .basket {
        border-top: 1px solid #ddd;
    }

    .basketform {
        display: none;
    }

    .basket-itog {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .basket-position {
        border-bottom: 1px solid #ddd;
        padding-top: 12px;
        padding-bottom: 12px;
        position: relative;
        display: flex;
        align-items: center;
    }

    .basket-position-zag {
        font-weight: 500;
        font-size: 15px;
    }

    .basket-position-right {
        margin-left: 20px;
    }

    .basket-position-kolvo {
        display: flex;
        margin-top: 10px;
        margin-bottom: 8px;
        align-items: center;
    }

    .basket-kolvo {
        font-size: 15px;
        font-weight: 400;
        max-width: 45px;
        margin-right: 8px;
        outline: 0;
        border: 0;
        padding: 12px 18px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
        text-align: right;
    }

    .edinica {
        font-size: 15px;
        font-weight: 400;
        max-width: 80px;
        margin-right: 8px;
        outline: 0;
        border: 0;
        padding: 11px 17px 11px 17px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
        text-align: left;
    }

    .edinica option {
        color: #000;
    }

    .basket-position-price {
        font-size: 18px;
        font-weight: 600;
        color: #418123;
        margin-left: 8px;
    }

    .basket-clsbtn {
        position: absolute;
        color: #777;
        right: 10px;
        top: 24px;
        font-size: 16px;
        cursor: pointer;
        transition: 0.5s;
    }

    .basket-clsbtn:hover {
        transform: rotate(90deg);
    }

    .basket-itog-zag {
        font-size: 18px;
        font-weight: 500;
    }

    .basket-itog-price {
        font-size: 24px;
        font-weight: 600;
        margin-top: 4px;
        color: #418123
    }
}

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

    .modalbuttons {
        display: flex;
        flex-flow: column !important;
        margin-top: 15px;
        justify-content: space-between;
        flex-flow: row;
    }

    .modalbuttons .btn1:last-child {
        margin-top: 15px;
    }

    .modalbuttons .btn1 {
        padding: 15px;
        width: 100%;
    }

    .mobmenuwrap {
        display: block;
        position: fixed;
        z-index: 100;
    }

    .mobmenubtn {
        cursor: pointer;
        z-index: 100;
        position: fixed;
        right: 16px;
        top: 16px;
        width: 5vw;
        height: 5vw;
        padding: 4vw;
        background: linear-gradient(to bottom, #70a842, #418123);
        border-radius: 60px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;
    }

    .mobmenubtn div {
  //      width: 100%;
//        height: 2px;
//        background: #fff;
		position: absolute;
        height: 2px;
        background: #fff;
        width: 15px;
    }
	  	.mobmenubtn div:nth-child(1){	
		top:10px;
	}
		.mobmenubtn div:nth-child(2){
		top:16px;
	}
		.mobmenubtn div:nth-child(3){
		top:22px;
	}

    .mobmenucls {
        cursor: pointer;
        z-index: 250;
        position: fixed;
        right: 5vw;
        top: 5vw;
        width: 9vw;
        height: 9vw;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(to bottom, #70a842, #418123);
        border-radius: 60px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;
        color: #fff;
    }

    .mobmenu {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background: #fff;
        z-index: 150;
        overflow-x: auto;
        padding-left: 30px;
    }

    .mobmenu {
        padding-top: 10vw;
    }

    .mobmenu div {
        display: block;
        margin-bottom: 15px;
    }

    .rmenux ul {
        list-style-type: none;
        margin-bottom: 30px;
        margin-top: 20px;
    }

    .rmenux ul li {
        margin-left: 5vw;
        margin-top: 12px;
        margin-bottom: 12px;
        position: relative;
        display: block;
    }

    .rmenux ul li:before {
        content: '';
        display: block;
        left: -17px;
        top: 8px;
        position: absolute;
        background: #999;
        width: 9px;
        height: 1px
    }

    .mobmenu a {
        font-weight: 500;
        font-size: 15px;
    }

    .mobadr {
        margin-top: 50px;
    }

    .mobadr span {
        color: #000;
        display: block;
        font-weight: 500;
        font-size: 18px
    }

    .mobadr p {
        color: #000;
        margin-top: 1vw;
        font-size: 15px;
    }

    .mobtopbtn {
        margin-top: 40px;
        margin-bottom: 40px;
    }

    .mobcont {
        text-align: left;
        margin-top: 8vw !important
    }

    .mobcont span {
        display: block;
        margin-bottom: 5px;
    }

    .mobcont span a {
        color: #000;
        font-size: 24px;
        font-weight: 600;
        border: 0;
    }

    .mobcont p {
        font-size: 15px;
        color: #000;
        margin-top: 1px;
    }


    /* база */
    html, body, div, table, tr, td, li, ul, p {
        font-size: 14px;
    }

    h1 {
        font-size: 28px;
        color: #fff;
    }

    h2 {
        font-size: 22px;
        font-weight: 600;
    }

    h3 {
        font-size: 18px;
    }

    h4 {
        font-size: 16px;
    }

    h5 {
        font-size: 14px;
    }

    .wrap {
        width: 100%;
        height: auto;
    }

    .wr {
        max-width: 1360px;
        padding-right: 26px;
        padding-left: 26px;
        margin: auto;
    }

    button {
        transition: all 0.4s ease;
        font-size: 15px;
        font-weight: 400;
        padding: 24px 38px;
        background: linear-gradient(to bottom, #70a842, #418123);
        border-radius: 7px;
        box-shadow: 0 10px 20px rgba(65, 130, 40, 0.4);
    }

    button:hover {
        background: linear-gradient(to bottom, #70a842, #4c8e2d);
        box-shadow: 0 10px 20px rgba(65, 130, 40, 0.6);
    }

    fancybox-button:hover {
        box-shadow: 0 !important
    }

    /* видео */
    .is_overlay {
        display: block;
        width: 100%;
        height: auto;
        overflow: hidden;
    }

    #trailer {
        display: none;
    }

    #trailer video {
        display: none;
    }

    .over {
        display: none;
    }

    .line {
        position: absolute;
        height: 382px;
        background: url('/wp-content/uploads/2022/08/grtop.png') top center repeat-x;
        text-align: center;
        top: 0;
        right: 0;
        left: 0;
        overflow: hidden;
        z-index: -999;
    }

    .ver {
        overflow: hidden;
    }

    .thrdpage {
        overflow: hidden;
    }

    .thrdpage #trailer {
        min-height: 440px;
        max-height: 440px;
    }

    .thrdpage .over {
        min-height: 440px;
        height: 440px;
    }

    /* хедер */
    .catalogbg {
        height: auto;
        margin-bottom: 20px;
        background: url('/wp-content/uploads/2022/08/bgmob.jpg') no-repeat top center
    }

    .catalogbg2 {
        margin-bottom: 20px;
        background: url('/wp-content/uploads/2022/08/bgmob.jpg') no-repeat top center
    }

    .header {
        padding-top: 30px;
        padding-bottom: 10px;
    }

    .header .wr {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

    .topline {
        padding-top: 20px;
        padding-bottom: 20px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15)
    }

    .topline .wr {
        display: flex;
        justify-content: flex-start;
    }

    .topright {
        display: flex;
        justify-content: space-between;
    }

    .email {
        color: #fff;
        font-size: 13px;
    }

    .email a {
        color: #fff;
    }

    .email span {
        display: none;
    }

    .perezvonite {
        display: none;
        cursor: pointer;
        border-bottom: 1px solid;
        color: #fff;
        font-size: 13px;
    }

    .location {
        cursor: pointer;
        display: flex;
        align-items: center;
        color: #fff;
        font-size: 13px;
        margin-right: 20px;
    }

    .location img {
        margin-right: 7px;
    }

    .location p {
        border-bottom: 1px dotted #fff;
        font-size: 13px;
    }

    .loc p {
        font-size: 18px;
        font-weight: 500;
    }

    .loc ul {
        list-style-type: none;
        padding-bottom: 10px;
        margin-top: 30px;
    }

    .loc ul li {
        padding-left: 24px;
        background: url('/wp-content/uploads/2022/08/metka2.png') no-repeat;
        background-position: 0 4px;
        margin-bottom: 12px;
    }

    .loc ul li a {
        color: #418123
    }

    .logo {
        margin-bottom: 30px;
    }

    .logo img {
        display: block;
        float: left;
    }

    .logo p {
        display: none;
        line-height: 20px;
        font-weight: 400;
        color: #aaa;
        font-size: 14px;
        margin-left: 140px;
        margin-top: 20px;
    }

    .adr {
        max-width: 180px;
        text-align: center;
        margin-bottom: 30px;
    }

    .adr span {
        color: #fff;
        display: block;
        font-weight: 500;
        font-size: 16px;
    }

    .adr p {
        color: #fff;
        margin-top: 6px;
    }

    .topbtn {
        cursor: pointer;
        text-align: center;
        color: #fff;
        display: none;
    }

    .topbtn p {
        color: #fff;
        margin-left: 7px;
    }

    .topbtn img {
        display: block;
        margin: auto;
        margin-bottom: 12px;
    }

    .cont {
        text-align: center
    }

    .cont div {
        background: #558132;
        color: #fff;
        font-size: 12px;
        border-radius: 4px;
        padding: 5px 10px;
        display: inline-block;
        margin-bottom: 12px;
    }

    .cont span {
        display: block;
        margin-bottom: 2px;
    }

    .cont span a {
        color: #fff;
        font-size: 22px;
        font-weight: 600;
        border: 0;
    }

    .cont p {
        font-size: 13px;
        color: #fff;
        margin-top: 0px;
    }

    /* верхнее меню */
    .topmenu {
        display: none;
    }

    .menu {
        background: #558132;
        border-radius: 10px;
        margin-left: -5px;
        margin-right: -5px;
    }

    .menu div {
        font-size: 13px;
        flex-basis: auto;
        flex-grow: 1;
        min-height: 52px;
    }

    .menu div a {
        border-bottom: 0;
        text-decoration: none;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
    }

    .menu div:first-child a {
        border-radius: 10px 0 0 10px;
    }

    .menu div:last-child a {
        border-radius: 0 10px 10px 0;
    }

    .menu div a:hover {
        color: #fff;
        background: #456828;
    }

    .menu div a span {
        border-bottom: 1px solid;
    }

    .rmenu {
        position: absolute;
        width: 100%;
        min-width: 590px;
        top: 100%;
        height: auto !important;
        background: #fff !important;
        z-index: 10;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
        height: auto;
        border-radius: 0 0 10px 10px;
    }

    .rmenu ul {
        list-style-type: none;
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        padding: 15px 10px 0 10px;
    }

    .rmenu ul li {
        text-align: center;
        width: 33%;
        margin-bottom: 10px;
    }

    .rmenu ul li img {
        display: block;
        margin: auto;
        margin-bottom: 2px;
    }

    .rmenu ul li a {
        display: inline-block;
        margin: 8px 22px 8px 22px;
        border: 0;
        cursor: pointer;
        font-weight: 500;
        color: #000;
        width: auto;
        height: auto;
        border-radius: 0 !important
    }

    .rmenu ul li a:hover {
        background: none;
        color: #000
    }

    .rmenu ul li a span {
        font-size: 14px;
        border-bottom: 1px solid #999
    }

    .fixedmenu {
        justify-content: center !important;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 20;
        border-radius: 0 0 0 0 !important;
        margin: 0;
    }

    .fixedmenu div a {
        border-bottom: 0;
        text-decoration: none;
        border-radius: 0 0 0 0 !important;
    }

    .slidemenu {
        position: relative
    }

    .slidemenu a {
        position: relative
    }

    .fixedmenu .slidemenu div {
        margin: 0 0 0 0;
    }

    /* главный экран */
    .main {
        padding-top: 30px;
        padding-bottom: 50px;
    }

    .main .wr {
        display: flex;
        justify-content: space-between;
    }

    .arr {
        margin-left: 6px;
    }

    .breadcrumbs {
        display: flex;
        align-items: center;
        color: #ddd;
        margin-bottom: 20px;
        margin-left: 2px;
        flex-wrap: wrap;
        font-size: 13px;
    }

    .breadcrumbs span {
        margin-bottom: 5px;
        font-size: 13px;
    }

    .breadcrumbs a {
        border-bottom: 1px solid;
        color: #72b33e !important;
    }

    .rep {
        margin-left: 10px;
        margin-right: 10px;
    }

    h1 {
        font-weight: 500;
        line-height: 110%;
        margin-bottom: 14px;
        margin-left: -1px;
    }

    .leftmain p {
        color: #fff;
        font-size: 16px;
        line-height: 120%;
        margin-top: 12px;
    }

    .leftmain ul {
        margin-top: 40px;
        margin-bottom: 0;
        list-style-type: none;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
    }

    .leftmain ul li {
        color: #fff;
        line-height: 130%;
        background: url('/wp-content/uploads/2022/08/venok.png') no-repeat;
        background-position: 0 0;
        min-height: 50px;
        padding-left: 76px;
        font-size: 15px;
        margin-bottom: 20px;
    }

    .leftmain ul li:nth-child(1) {
        max-width: 300px;
    }

    .leftmain ul li:nth-child(2) {
        max-width: 220px;
    }

    .leftmain ul li:nth-child(3) {
        max-width: 300px;
    }


    .mainbtns {
        margin-top: 10px;
    }

    .mainbtns button {
        font-size: 16px;
        margin-top: 10px;
        width: 220px;
    }

    /* о компании */
    .about {
        padding-top: 40px;
        padding-bottom: 30px;
        background: none;
    }
    .about h2{
        padding: 0;
    }

    .aboutwrap {
        padding-top: 2px;
    }

    .leftabout {
        padding: 0;
    }

    .leftabout p {
        margin-top: 18px;
        margin-bottom: 18px;
        line-height: 140%;
        font-size: 15px;
    }

    .leftabout span {
        font-size: 17px;
        font-weight: 500;
        line-height: 130%;
    }

    .leftabout ul {
        list-style-type: none;
        margin-top: 20px;
        margin-bottom: 30px;
    }

    .leftabout ul li {
        padding-left: 22px;
        position: relative;
        margin-bottom: 12px;
        line-height: 140%;
        font-size: 15px;
    }

    .leftabout ul li::after {
        content: '';
        display: flex;
        position: absolute;
        top: 9px;
        left: 0px;
        width: 6px;
        height: 6px;
        background: #70a842;
        border-radius: 50%;
        border: solid 4px rgba(112, 168, 66, 0.2);
        box-sizing: border-box;
    }

    .rightabout {
        margin: auto;
        margin-top: 35px;
        padding: 0;
    }

    .rightaboutbg {
        display: none;
    }

    .aboutwrap a {
        display: block;
        border: 0
    }

    .rightvideo {
        cursor: pointer;
        height: 340px;
        border-radius: 15px;
        background: url('/wp-content/uploads/2022/08/bg.jpg') no-repeat top center;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    .videobtn {
        margin-top: 20px;
        animation: pulse 2s infinite;
        width: 80px;
        height: 80px;
        border-radius: 50%;
        box-shadow: 0 0 0 25px rgba(112, 168, 66, 0.1);
        border: 10px solid rgba(112, 168, 66, 0.2);
        background: linear-gradient(to bottom, #70a842, #519531);
        background-clip: padding-box;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .rightvideo p {
        color: #8ec366;
        font-weight: 500;
        font-size: 18px;
        max-width: 220px;
        text-align: center;
        margin-top: 34px;
    }

    .eks p {
        font-weight: 500;
        text-align: center;
        font-size: 16px;
        margin-top: 20px;
    }

    .zoobl {
        padding: 40px 0 0 0;
    }

    .zoobl2 {
        padding: 0;
    }

    .zoozag {
        font-weight: bold;
        font-size: 20px;
        margin-bottom: 10px;
        margin-left: -2px;
    }

    .zooopis {
        margin-top: 10px;
        font-size: 15px;
    }

    .aboutimages {
        margin-top: 40px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        padding: 0;
    }

    .aboutimages a {
        border: 0;
        width: 48%;
        display: block;
        margin-bottom: 10px;
    }

    .aboutimages img {
        border-radius: 10px;
    }

    /* каталог */
    .catalog {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .catalog h2 {
        margin-left: -1px;
    }

    .catalog h3 {
        margin-left: -1px;
        font-size: 24px;
        line-height: 110%;
    }

    .catwrap {
        padding-top: 30px;
    }

    .catwrap div img {
        transition: all 0.5s ease;
    }

    .catwrap div:hover img {
        transform: scale(1.02);
    }

    .catwrap div:nth-child(even) {
        margin-right: 0;
    }

    .nob {
        border: 0;
        display: block;
    }

    .catbg {
        display: block;
        margin: auto;
        position: relative;
        top: 0;
        left: 0;
        right: 0;
        z-index: -2;
        border-radius: 10px;
    }

    .cat-img {
        max-width: 600px;
        width: 114%;
        margin-left: -7%;
        position: absolute;
        z-index: 1;
        top: 8%;
    }

    .cat-akciya {
        font-size: 13px;
        transition: all 0.5s ease;
        border-radius: 50%;
        width: 70px;
        height: 70px;
        background: linear-gradient(to top, #dd0000, #c21c1c, #ff2121);
        color: #fff;
        font-weight: bold;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        left: -10px;
        top: -10px;
        z-index: 5;
        text-transform: uppercase;
    }

    .catwrap div:hover .cat-akciya {
        transform: scale(1.02);
    }

    .cat-zag {
        font-size: 19px;
        text-align: center;
        font-weight: 500;
        margin-top: 20px;
        margin-bottom: 10px;
    }

    .cat-zag a {
        color: #000;
        border-bottom: 1px solid #bbb
    }

    .cat-sort {
        text-align: center;
        margin-top: 10px;
    }

    .cat-sort a {
        border-bottom: 1px solid #b4d099
    }

    .cat-size {
        text-align: center;
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .cat-price {
        text-align: center;
        font-weight: 600;
        font-size: 24px;
        color: #549733;
        margin-top: 3px;
        margin-bottom: 12px;
    }

    .catwrap div button {
        display: block;
        margin: auto;
        margin-top: 20px;
        padding: 20px 40px;
    }

    .cat-tiles {
        list-style-type: none;
        display: flex;
        margin-top: 20px;
        margin-bottom: 14px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .cat-tiles li {
        margin: 3px 3px;
    }

    .cat-tiles li a {
        background: #ddd;
        color: #777;
        display: block;
        border-radius: 5px;
        padding: 8px 12px;
        font-size: 13px;
        border: 0;
    }

    .cat-tiles li a:hover {
        background: #777;
        color: #fff;
    }

    .catwrap2 .cat-zag {
        font-size: 15px;
        margin-top: 20px;
    }

    .cat-img3 {
        width: 100%;
        max-width: 600px;
    }

    /* товар */
    .tovar {
        padding-top: 16px;
        padding-bottom: 20px;
    }

    .tovar-mainimg {
        position: relative;
    }

    .tovar-images {
        max-width: 480px;
        margin: auto;
        margin-top: 1rem;
        display: flex;
        justify-content: flex-start;
        flex-wrap: nowrap;
        gap: 1rem;
    }

    .tovar-images a {
        border: 0;
        display: block;
    }

    .tovar-images img {
        border-radius: 8px;
    }

    .cat-img2 {
        width: 110%;
        margin-left: -5%;
        max-width: 570px;
        position: absolute;
        top: 14%;
    }

    .thrpagebg {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: auto;
        z-index: -2;
        border-radius: 10px;
        border: 1px solid #ddd;
    }

    .cat-img2x {
        width: 80%;
        max-width: 570px;
        margin: auto;
        display: block;
        margin-top: 12%;
        margin-bottom: 12%;
    }

    .catalogbg2 h1 {
        font-size: 20px;
        margin: 30px 0 0 0;
    }

    .tovar-mainimg .cat-akciya {
        left: -20px;
    }

    .tovarright {
        margin-top: 40px;
    }

    .tovarright h3 {
        margin-bottom: 1px;
        line-height: 110%;
        font-size: 24px;
    }

    .calclink {
        color: #3a791b
    }

    .akciya {
        border-radius: 4px;
        background: linear-gradient(to top, #dd0000, #c21c1c);
        padding: 10px 14px;
        color: #fff;
        margin-top: 2px;
        margin-bottom: 3px;
        display: block;
    }

    .tovarright p {
        font-size: 15px;
        line-height: 140%;
        margin-bottom: 20px;
    }

    .tovarright-cena {
        font-weight: 600;
        font-size: 24px;
        color: #549733;
        margin-top: 4px;
        line-height: 100%;
        margin-bottom: 10px;
    }

    .opistable {
        width: 100%;
        background: #fff;
        border-collapse: collapse;
        padding: 0;
        margin: 22px 0 30px 0;
    }

    .opistable tr:nth-child(odd) td {
        background: #f0f0f0;
    }

    .opistable tr:first-child td:first-child {
        border-radius: 5px 0 0 0;
    }

    .opistable tr:first-child td:last-child {
        border-radius: 0 5px 0 0;
    }

    .opistable tr:last-child td:first-child {
        border-radius: 0 0 0 5px;
    }

    .opistable tr:last-child td:last-child {
        border-radius: 0 0 5px 0;
    }

    .opistable td {
        background: #f9f9f9;
        padding: 12px 16px;
        vertical-align: middle;
        font-size: 13px;
    }

    .opistable tr td:last-child {
        text-align: right;
    }

    /* цены */
    .price {
        background: #e6e6e6;
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .price h2 {
        margin-left: -1px;
        line-height: 110%;
        font-size: 22px;
    }

    .price-opis {
        margin-top: 13px;
        font-size: 14px;
    }

    .price-opis a {
        border-bottom: 1px dotted;
        font-weight: 500;
    }

    .pricetable {
        background: #fff;
        border-radius: 20px;
        border-collapse: collapse;
        padding: 0;
        margin: 30px 0 0 0;
        width: calc(100% + 52px);
        position: relative;
        left: -26px;
        right: -26px;
    }

    .pricetable th {
        background: linear-gradient(to top, #70a842, #519531);
        padding: 18px 14px 16px 14px;
        color: #fff;
        font-weight: 400;
        text-align: left;
        font-size: 13px;
    }

    .pricetable tr th:first-child {
        display: none;
    }

    .pricetable tr td:first-child {
        display: none;
    }


    .pricetable tr:nth-child(odd) td {
        background: #f6f6f6;
    }

    .pricetable th a {
        color: #fff;
    }

    .pricetable td {
        background: #fff;
        padding: 10px 14px;
        vertical-align: middle;
        font-size: 13px;
    }

    .pricetable tr th:last-child {
        text-align: left;
        padding-right: 26px;
    }

    .pricetable tr td:last-child {
        text-align: left;
        font-weight: 600;
        color: #3a791b;
        width: 26%;
        padding-right: 26px;
    }

    .pricetable tr td:nth-child(2) {
        padding-left: 26px;
        padding-right: 0;
    }

    .pricetable tr th:nth-child(2) {
        padding-left: 26px;
        padding-right: 0;
    }

    .pricetable tr td:nth-child(3) {
        padding-right: 0;
    }

    .pricetable tr th:nth-child(3) {
        padding-right: 0;
    }

    .pricetable tr td:nth-child(4) {
        padding-right: 0;
    }

    .pricetable tr th:nth-child(4) {
        padding-right: 0;
    }

    .pricetable tr td:nth-child(6) {
        padding-left: 0;
    }

    .pricetable tr th:nth-child(6) {
        padding-left: 0;
    }

    .price .btn {
        display: block;
        margin: auto;
        margin-top: 30px;
        padding: 20px 30px
    }

    .edinica2 {
        display: block;
        margin-top: 3px;
        font-size: 14px;
        font-weight: 400;
        max-width: 54px;
        outline: 0;
        border: 0;
        padding: 7px 8px 7px 8px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 5px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
        text-align: left;
    }

    .edinica2 option {
        color: #000;
    }

    /* калькулятор */
    .calculator {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .calculator h3 {
        font-size: 28px;
        margin-left: -1px;
        margin-bottom: 16px;
        line-height: 110%;
    }

    .calc-opis {
        font-size: 14px;
        margin-top: 5px;
    }

    .calcformwrap {
        width: 100%;
        justify-content: flex-start;
        align-items: flex-end;
        flex-wrap: wrap;
    }

    .calcleft {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }

    .calcleft div {
        margin-right: 30px;
        margin-bottom: 30px;
    }

    .calcleft p {
        font-weight: 500;
        font-size: 15px;
        margin-left: 5px;
        margin-bottom: 5px;
    }

    .calcform {
        margin-top: 30px;
    }

    .calcright {
        display: flex;
        align-items: center;
        padding-top: 20px;
        flex-wrap: wrap;
        border-top: 1px solid #ddd;
    }

    .calcright div {
        margin-right: 30px;
        margin-bottom: 30px;
    }

    .calcright p {
        font-weight: 500;
        font-size: 15px;
        margin-left: 5px;
        margin-bottom: 5px;
    }

    .calcright .inpt2 {
        width: 50px;
        padding: 14px 20px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        color: #fff;
    }

    .slct {
        font-size: 14px;
        font-weight: 400;
        width: 95px;
        outline: 0;
        border: 0;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        color: #fff;
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
    }

    .slct::placeholder {
        color: #fff;
    }

    .slct option {
        color: #000;
    }

    .calc-cena {
        margin-top: 10px;
    }

    .calc-cena p {
        font-weight: 500;
        font-size: 20px;
        margin-bottom: 10px;
    }

    .calc-cena span {
        font-weight: 600;
        font-size: 24px;
        color: #3a791b
    }

    .calcformwrap .btn {
        margin-top: 20px;
        font-size: 17px;
    }

    /* преимущества */
    .preim {
        padding-top: 40px;
        padding-bottom: 50px;
        background: url('/wp-content/uploads/2022/08/preimbg.jpg') no-repeat center center #3c3533;
    }

    .preim h3 {
        color: #fff;
        font-size: 24px;
        font-weight: 500;
        line-height: 110%;
    }

    .preimwrap {
        padding-top: 40px;
    }

    .preimcenter {
        margin: auto;
        display: block;
        width: 100%;
        max-width: 432px;
        margin-top: 40px;
        margin-bottom: 40px;
    }

    .preimwrap ul {
        list-style-type: none;
    }

    .preimwrap ul li {
        padding-left: 84px;
        color: #fff;
        position: relative;
        margin-bottom: 36px;
        line-height: 130%;
    }

    .preimwrap ul li:last-child {
        margin-bottom: 0;
    }

    .preimwrap ul li span {
        font-size: 18px;
        font-weight: 500;
        color: #fff;
        margin-bottom: 8px;
        display: block;
        margin-left: -1px
    }

    .preimwrap ul li img {
        position: absolute;
        left: 23px;
        top: 22px;
    }

    .preimwrap ul li::before {
        position: absolute;
        content: '';
        left: 0px;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        box-shadow: 0 0 0 5px rgba(112, 168, 66, 0.1);
        border: 7px solid rgba(112, 168, 66, 0.2);
        background: linear-gradient(to bottom, #70a842, #519531);
        background-clip: padding-box;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    /* грузовик */
    .gruz {
        padding-top: 40px;
        padding-bottom: 40px;
        background: url('/wp-content/uploads/2022/08/map.png') no-repeat top center;
    }

    .gruz h3 {
        font-size: 20px;
        max-width: 900px;
        line-height: 110%;
    }

    .gruzwrap {
        padding-top: 50px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: column;
    }

    .gruzovik {
        margin-left: -20px;
        margin-top: 0;
        width: 100%;
        max-width: 832px;
    }

    .rightgruz {
        margin-top: 40px;
        width: 100%;
    }

    .gruzpoint {
        background: linear-gradient(to top, #519531, #70a842);
        display: flex;
        width: 100%;
        justify-content: flex-start;
        height: 110px;
        border-radius: 10px;
        align-items: center;
        margin-bottom: 20px;
    }

    .gruzicon {
        background: url('/wp-content/uploads/2022/08/circle.png') no-repeat center right;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 100px;
        height: 100%;
        border-radius: 10px 0 0 10px;
        flex-grow: 1;
        min-width: 75px
    }

    .gruzicon img {
        width: 30px;
        height: auto;
    }

    .gruzpoint p {
        font-weight: 500;
        font-size: 15px;
        line-height: 120%;
        color: #fff;
        margin-left: 20px;
        margin-right: 20px;
        flex-grow: 1;
    }

    /* оплата и доставка */
    .semipage {
        min-height: 510px !important;
        max-height: 510px !important;
    }

    .semipage video {
        margin-top: -350px;
    }

    .dostavka {
        padding-top: 20px;
        padding-bottom: 40px;
    }

    .dostavka .wr {
        position: relative
    }

    .dostavka h2 {
        margin-bottom: 40px;
        margin-left: -3px;
    }

    .dostavka-opis {
        font-size: 16px;
        line-height: 140%;
    }

    .dostwrap h3 {
        margin-top: 60px;
        margin-bottom: 20px;
        margin-left: -2px;
    }

    .gazel {
        margin-top: 50px;
        height: auto;
        width: 100%;
        height: auto;
        max-width: 832px;
    }

    .dost-zag {
        font-weight: 500;
        font-size: 18px;
        margin-bottom: 20px;
        line-height: 130%;
    }

    .dosttbl {
        border-collapse: collapse;
        width: 100%;
        margin: 0;
        padding: 0;
        margin-bottom: 30px;
    }

    .dosttbl tr:first-child td {
        border-bottom: 2px solid #fff;
    }

    .dosttbl tr td:last-child {
        font-size: 18px;
        font-weight: 600;
        color: #519531;
        text-align: right;
        min-width: 130px;
    }

    .dosttbl td {
        padding: 14px 20px;
        background: #f0f0f0;
        vertical-align: middle;
        border-bottom: 2px solid #fff;
    }

    .dosttbl tr:first-child td:first-child {
        border-bottom: 2px solid #fff;
        border-radius: 10px 0 0 0;
    }

    .dosttbl tr:first-child td:last-child {
        border-bottom: 2px solid #fff;
        border-radius: 0 10px 0 0;
    }

    .dosttbl tr:last-child td:first-child {
        border-bottom: 2px solid #fff;
        border-radius: 0 0 0 10px;
    }

    .dosttbl tr:last-child td:last-child {
        border-bottom: 2px solid #fff;
        border-radius: 0 0 10px 0;
    }

    .dosttbl tr:last-child td::first-child {
        font-size: 18px;
        font-weight: 600;
        color: #519531;
        text-align: right;
        min-width: 130px;
    }

    .oplata {
        padding-top: 40px;
        padding-bottom: 50px;
    }

    .opl {
        background: #f0f0f0;
        border-radius: 15px;
        padding: 40px 30px 30px 30px;
        text-align: center;
    }

    .opl h2 {
        text-align: center;
    }

    .opl-opis {
        text-align: center;
        font-size: 15px;
        margin-top: 19px;
    }

    .oplwrap {
        padding-top: 50px;
    }

    .oplwrap div {
        text-align: center;
        margin-bottom: 40px;
    }

    .oplwrap div img {
        margin: auto;
        display: block;
    }

    .oplwrap div p {
        margin-top: 10px;
        text-align: center;
        font-size: 17px;
        font-weight: 500;
    }

    /* Галерея */
    .gallery {
        padding-top: 10px;
        padding-bottom: 0px;
    }

    .gallery h2 {
        margin-left: -3px;
        line-height: 120%;
    }

    .gallery .opis {
        font-size: 16px;
        line-height: 130%;
        margin-top: 12px;
    }

    .galwrap {
        margin-top: 30px;
    }

    .galpoint {
        padding: 24px 30px 24px 30px;
        margin-bottom: 30px;
        border-radius: 10px;
        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1)
    }

    .galzag {
        font-weight: 500;
        font-size: 18px;
        line-height: 120%;
    }

    .galdate {
        font-size: 13px;
        color: #999;
        margin-top: 5px;
    }

    .galphotos {
        margin-top: 20px;
    }

    .galphotos a {
        border: 0;
        width: 100%;
        display: block;
        margin-bottom: 2%;
    }

    .galphotos img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 10px;
    }

    .galimage {
        width: 100%;
        min-height: 200px;
        max-width: 100%;
        cursor: pointer;
        border-radius: 10px;
        margin-bottom: 2%;
        background-size: cover;
        background-repeat: no-repeat;
    }

    /* Акции */
    .akcii {
        padding-top: 20px;
        padding-bottom: 10px;
    }

    .akcii h2 {
        margin-left: -2px;
        line-height: 120%;
    }

    .akcii .opis {
        font-size: 15px;
        line-height: 130%;
        margin-top: 12px;
        margin-bottom: 24px;
    }

    .akc {
        margin-top: 10px;
        position: relative;
        height: auto;
        overflow: hidden;
        border-radius: 10px;
    }

    .akctext {
        color: #fff;
        font-size: 16px;
        font-weight: 500;
        position: absolute;
        z-index: 1;
        top: 24px;
        left: 24px;
        max-width: 220px;
    }

    .akcdate {
        color: rgba(255, 255, 255, 0.5);
        position: absolute;
        bottom: 24px;
        left: 24px;
        font-size: 13px;
    }

    .akc span {
        color: #74bd3b
    }

    .akc img {
        border-radius: 10px;
        min-width: 400px;
    }

    /* Контакты */
    .kontakty {
        padding-top: 10px;
        padding-bottom: 30px;
    }

    .kontakty h2 {
        line-height: 120%;
    }
    .ofis-left,
    .ofis-right{
        max-width: 100%;
        width: 100%;
    }

    .ofiswrap {
        display: block;
        padding-bottom: 70px;
    }

    .ofis-left {
        margin-top: 30px;
    }

    .ofis-zag {
        font-size: 17px;
        font-weight: 500;
        margin-bottom: 8px;
    }

    .ofis-opis {
        font-size: 14px;
        margin-bottom: 30px;
    }

    .ofis-opis span {
        font-size: 24px;
        font-weight: 600;
        display: block;
        margin-top: 6px;
        margin-bottom: 5px;
    }

    .ofis-opis span a {
        border: 0;
    }

    .ofis-photos a {
        display: block;
        border: 0;
    }

    .ofis-photos img {
        border-radius: 8px;
        margin-top: 10px;
    }

    .kont-map {
        border-radius: 10px;
        height: 450px;
        overflow: hidden;
        border: 1px solid #ddd;
        margin-top: 30px;
    }

    .kontakty h3 {
        font-size: 34px;
    }

    .cont-wrap {
        margin-top: 50px;
    }

    .cont-wrap div {
        padding: 30px 5% 33px 5%;
        background: #f6f6f6;
        border-radius: 10px;
        margin-bottom: 2%;
    }

    .cont-zag {
        font-size: 17px;
        font-weight: 500;
        margin-bottom: 10px;
    }

    .cont-opis {
        font-size: 15px;
    }

    .cont-opis span {
        font-size: 17px;
        font-weight: 600;
        display: block;
        margin-top: 6px;
        line-height: 100%;
    }

    .cont-opis span a {
        border: 0;
    }


    /* Тех условия */
    .uslovia {
        padding-top: 20px;
        padding-bottom: 0px;
    }

    .uslovia h2 {
        line-height: 110%;
        margin-bottom: 11px;
        font-size: 22px;
    }

    .uslovia h3 {
        line-height: 120%;
        font-size: 18px;
        margin-top: 50px;
        margin-bottom: 10px;
    }

    .uslovia .opis {
        font-size: 15px;
        font-style: italic;
        margin-bottom: 20px;
    }

    .usl {
        font-size: 18px;
        margin-bottom: 40px;
        line-height: 130%;
    }

    .usl p {
        margin-top: 7px;
        margin-bottom: 7px;
    }

    .uslovia ol {
        list-style: none;
        counter-reset: li;
        margin: 10px 0 30px 0;
        padding: 0;
    }

    .uslovia ol span {
        font-weight: 500;
        font-size: 16px;
    }

    .uslovia ol li {
        margin: 10px 0 10px 0;
        line-height: 130%;
        font-size: 14px;
    }

    .uslovia ol li ol {
        margin-left: 10px;
    }

    .uslovia li:before {
        counter-increment: li;
        content: counters(li, ".") ". ";
    }

    .teh-table {
        border-collapse: collapse;
        min-width: 760px;
    }

    .teh-table td {
        border: 1px solid #ddd;
        padding: 12px 16px;
        font-size: 13px;
    }

    .teh-table img {
        width: 100%;
        height: auto;
    }

    .tablewrap {
        overflow-y: auto;
        margin-top: 30px;
        margin-bottom: 50px;
    }

    /* Форма */
    .midforma {
        background: url('/wp-content/uploads/2022/08/bg2.jpg') no-repeat center center;
        padding-top: 40px;
        padding-bottom: 50px;
    }

    .midform-zag {
        color: #fff;
        font-size: 20px;
        font-weight: 500;
        max-width: 600px;
        margin-bottom: 10px;
    }

    .midform-zag2 {
        color: #96e457;
        font-size: 18px;
        font-weight: 500;
    }

    .iphone {
        display: none;
    }

    .phoneformwrap {
        padding-top: 30px;
    }

    .phoneform .inpt2 {
        margin-bottom: 10px;
        background: linear-gradient(to top, #ddd, #fff);
        font-size: 16px;
    }

    .phoneform .btn2 {
        width: 225px;
        font-weight: 500;
        font-size: 16px;
    }

    .phoneform .pers label {
        justify-content: flex-start;
        align-items: center;
    }

    .phoneform .pers span {
        margin: 0
    }

    /* статья */
    .article {
        padding-top: 30px;
        padding-bottom: 20px;
    }

    .article2 {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .article h2 {
        font-size: 24px;
        font-weight: 600;
        margin-top: 30px;
        margin-bottom: 16px;
        margin-left: -1px;
        line-height: 120%;
    }

    .article h3 {
        font-size: 20px;
        font-weight: 600;
        margin-top: 30px;
        margin-bottom: 16px;
        margin-left: -1px;
        line-height: 120%;
    }

    .article h4 {
        font-size: 18px;
        font-weight: 500;
        margin-top: 20px;
        margin-bottom: 16px;
        margin-left: -1px;
        line-height: 120%;
    }

    .article h5 {
        font-size: 16px;
        font-weight: 500;
        margin-top: 20px;
        margin-bottom: 16px;
        margin-left: -1px;
        line-height: 120%;
    }

    .article h2:first-child {
        margin-top: 0;
    }

    .article h3:first-child {
        margin-top: 0;
    }

    .article p {
        font-size: 15px;
        line-height: 140%;
        margin-top: 14px;
        margin-bottom: 14px;
    }

    .article ol {
        list-style-type: none;
        counter-reset: num;
        margin: 40px 0 40px 0;
        padding: 0;
    }

    .article ol li {
        font-size: 15px;
        margin-bottom: 28px;
        line-height: 140%;
        position: relative;
        padding-left: 48px
    }

    .article ol li span {
        font-weight: 500;
        color: #000;
        font-size: 16px;
        display: block;
        margin-bottom: 6px;
    }

    .article ol li:before {
        content: counter(num);
        counter-increment: num;
        border: 5px solid rgba(112, 168, 66, 0.2);
        display: flex;
        font-size: 14px;
        position: absolute;
        top: -5px;
        left: 0px;
        width: 26px;
        height: 26px;
        align-items: center;
        justify-content: center;
        background: linear-gradient(to top, #70a842, #418123);
        color: #fff;
        font-weight: 600;
        border-radius: 50%;
        background-clip: padding-box;
    }

    .article ul {
        list-style-type: none;
        margin: 40px 0 40px 0;
        padding: 0;
    }

    .article ul li {
        font-size: 15px;
        margin-bottom: 34px;
        line-height: 140%;
        position: relative;
        padding-left: 28px
    }

    .article ul li span {
        font-weight: 500;
        color: #000;
        font-size: 16px;
        display: block;
        margin-bottom: 6px;
    }

    .article ul li:before {
        content: '';
        display: flex;
        position: absolute;
        top: 4px;
        left: 0px;
        width: 6px;
        height: 6px;
        background: linear-gradient(to top, #70a842, #418123);
        border-radius: 50%;
        border: 5px solid rgba(112, 168, 66, 0.2);
        background-clip: padding-box;
    }

    .article-images {
        margin-top: 50px;
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        margin-bottom: 50px;
    }

    .article-images a {
        border: 0;
        width: 24%;
        display: block;
        margin-right: 1%;
        margin-bottom: 1%;
    }

    .article-images img {
        border-radius: 10px;
    }

    /* футер */
    .footer {
        background: #222222;
        border-bottom: 1px solid #282828;
        padding-top: 50px;
        padding-bottom: 40px;
    }

    .botlogo {
        margin-bottom: 40px;
    }

    .botlogo img {
        display: block;
    }

    .botlogo p {
        line-height: 20px;
        font-weight: 400;
        color: #aaa;
        font-size: 13px;
        margin-top: 14px;
    }

    .botadr {
        max-width: 220px;
        text-align: left;
        margin-top: 30px;
    }

    .botadr span {
        color: #fff;
        display: block;
        font-weight: 500;
        font-size: 16px;
    }

    .botadr p {
        color: #fff;
        margin-top: 6px;
    }

    .bottopbtn {
        cursor: pointer;
        text-align: center;
        color: #fff;
    }

    .bottopbtn p {
        color: #fff;
        margin-left: 7px;
    }

    .bottopbtn img {
        display: block;
        margin: auto;
        margin-bottom: 12px;
    }

    .botcont {
        text-align: left;
        margin-top: 50px;
    }

    .botcont div {
        background: #558132;
        color: #fff;
        font-size: 12px;
        border-radius: 4px;
        padding: 5px 10px;
        display: inline-block;
        margin-bottom: 12px;
    }

    .botcont span {
        display: block;
        margin-bottom: 5px;
    }

    .botcont span a {
        color: #fff;
        font-size: 22px;
        font-weight: 600;
        border: 0;
    }

    .botcont p {
        font-size: 13px;
        color: #fff;
        margin-top: 1px;
    }

    .botmenu {
        list-style-type: none;
    }

    .botmenu li {
        margin-bottom: 12px;
        font-size: 14px;
    }

    .botmenu li a {
        color: #fff;
    }

    .botmenu li a:hover {
        color: #ddd;
    }

    .footercopy {
        background: #232323;
        padding-top: 26px;
        padding-bottom: 38px;
        border-top: 1px solid #555
    }

    .footercopy .wr {
        text-align: center;
    }

    .footleft p {
        color: #999;
        text-align: left;
        font-size: 13px;
        max-width: 300px;
    }

    .footleft p:first-child {
        margin-bottom: 5px;
    }

    .footleft p a {
        display: inline-block;
        color: #fff !important;
        line-height: 140%;
        margin-bottom: 5px;
    }

    .footright {
        text-align: left;
    }

    .footright p {
        text-align: left;
        color: #999;
        font-size: 13px;
    }

    .footright a {
        color: #fff !important;
    }

    .footleft {
        margin-bottom: 30px;
    }

    /* фиксированные кнопки */
    .fixedbtns {
        position: fixed;
        right: 16px;
        bottom: 16px;
        z-index: 10;
    }

    .fixedbtns div {
        cursor: pointer;
        width: 50px;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        margin-top: 7px;
    }

    .fixedbtns div a {
        border: 0;
        display: block;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
    }

    .fixedbtns img {
        width: 20px;
        height: 20px;
    }

    .up {
        background: linear-gradient(to top, #757575, #a5a5a5);
        margin-bottom: 25px;
    }

    .tg {
        background: linear-gradient(to top, #3b8cc5, #68baff)
    }

    .tg img {
        margin-left: -3px;
    }

    .wa {
        background: linear-gradient(to top, #38ab28, #7fec3d)
    }

    .bc {
        background: linear-gradient(to top, #549024, #9ece41);
        position: relative;
    }

    .bc div {
        border-radius: 50%;
        width: 22px;
        height: 22px;
        font-weight: bold;
        font-size: 13px;
        background: #fff;
        display: flex;
        position: absolute;
        right: -3px;
        bottom: -3px;
        box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .bc img {
        margin-left: -2px;
        margin-top: 1px
    }

    /* формы и модальные окна */
    .inpt {
        font-size: 17px;
        font-weight: 400;
        width: 145px;
        margin-bottom: 8px;
        outline: 0;
        border: 0;
        padding: 25px 38px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
    }

    .inpt::placeholder {
        color: #fff;
    }

    .formzag2 {
        font-weight: 500;
        font-size: 36px;
        color: #fff;
        text-align: left;
    }

    .formopis2 {
        text-align: left;
        margin-top: 12px;
        margin-bottom: 37px;
        font-size: 18px;
        color: #fff;
    }

    .inpt2 {
        font-size: 17px;
        font-weight: 400;
        width: 145px;
        outline: 0;
        border: 0;
        padding: 25px 30px;
        background: linear-gradient(to bottom, #ddd, #bbb);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #000;
    }

    .inpt2::placeholder {
        color: #000;
    }

    .popup {
        display: none;
        position: fixed;
        z-index: 900;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        overflow: auto;
    }

    .modal {
        background: #fff;
        z-index: 1200;
        margin: auto;
        position: absolute;
        left: 0;
        right: 0;
        top: 16vh;
        border-radius: 10px;
    }

    .overlaypop {
        position: fixed;
        z-index: 1000;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        padding-bottom: 10vh;
        background: rgba(0, 0, 0, 0.4);
        cursor: pointer;
    }

    .clsbtn {
        position: absolute;
        color: #000;
        right: 20px;
        top: 20px;
        font-size: 20px;
        cursor: pointer;
        transition: 0.5s;
    }

    .clsbtn:hover {
        transform: rotate(90deg);
    }

    .modaltext {
        padding: 50px 50px 30px 50px;
    }

    .modaltext a {
        color: #000;
    }

    .pers2 label {
        margin-top: 10px;
        display: flex;
        justify-content: flex-start;
    }

    .checkpol {
        flex: 0 0 13px;
        display: block;
        width: 13px;
        height: 13px;
        border: 1px solid #777;
        margin-right: 10px;
    }

    .pers {
        margin-top: 20px;
    }

    .pers a {
        color: #888 !important;
    }

    .pers span {
        font-size: 12px;
        color: #999;
        margin-bottom: 8px;
        line-height: 130%;
    }

    .formopis {
        text-align: center;
        margin: auto;
        max-width: 220px;
        margin-top: 10px;
        margin-bottom: 27px;
        font-size: 16px;
        line-height: 120%;
    }

    .form {
        margin-top: 40px;
    }

    .modalform .btn2 {
        display: flex;
        margin: 0 auto;
        margin-top: 15px;
        min-width: 160px;
        width: 200px;
        font-size: 15px;
    }

    .modalform .inpt2 {
        display: block;
        margin: 0 auto;
        margin-bottom: 5px;
        font-size: 15px;
    }

    .modalform .pers {
        margin: auto;
        margin-top: 25px;
    }

    .modalform .pers span {
        color: #aaa;
    }

    .modalform .pers span a {
        color: #aaa;
    }

    .modalzag {
        font-weight: bold;
        text-align: center;
        font-size: 22px;
        color: #000
    }

    .modalopis {
        margin: 0 auto;
        max-width: 240px;
        line-height: 120%;
        margin-top: 12px;
        margin-bottom: 20px;
        font-size: 14px;
        text-align: center;
        color: #000
    }

    .modalform .otmetka {
        margin: 0 auto;
        margin-top: 30px;
        max-width: 230px;
    }

    .modaltext .clsbtn {
        color: #000 !important
    }

    .mobmenucls {
        color: #fff !important
    }

    /* Корзина */
    .modal2 {
        background: #fff;
        z-index: 1200;
        margin: auto;
        position: absolute;
        right: 0;
        top: 0;
        left: 0;
        min-height: 100vh;
    }

    .modal2 .modaltext {
        padding: 10px;
    }

    .basketzag {
        font-weight: 600;
        font-size: 24px;
        margin-bottom: 30px;
    }

    .basket {
        border-top: 1px solid #ddd;
    }

    .basketform {
        display: none;
    }

    .basket-itog {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .basket-position {
        border-bottom: 1px solid #ddd;
        padding-top: 18px;
        padding-bottom: 12px;
        position: relative;
    }

    .basket-position-zag {
        font-weight: 500;
        font-size: 15px;
    }

    .basket-position-right {
        margin-top: 2px;
    }

    .basket-position-kolvo {
        display: flex;
        margin-top: 10px;
        margin-bottom: 8px;
        align-items: center;
        flex-wrap: wrap
    }

    .basket-kolvo {
        font-size: 15px;
        font-weight: 400;
        max-width: 45px;
        margin-right: 8px;
        outline: 0;
        border: 0;
        padding: 12px 18px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
        text-align: right;
    }

    .edinica {
        font-size: 15px;
        font-weight: 400;
        max-width: 80px;
        margin-right: 8px;
        outline: 0;
        border: 0;
        padding: 11px 17px 11px 17px;
        background: linear-gradient(to bottom, #515151, #7b7b7b);
        border-radius: 8px;
        cursor: pointer;
        font-family: 'Klimat', sans-serif;
        color: #fff;
        text-align: left;
    }

    .edinica option {
        color: #000;
    }

    .basket-position-price {
        font-size: 18px;
        font-weight: 600;
        color: #418123;
        margin-top: 18px;
        width: 100%;
    }

    .basket-clsbtn {
        position: absolute;
        color: #777;
        right: 10px;
        top: 24px;
        font-size: 16px;
        cursor: pointer;
        transition: 0.5s;
    }

    .basket-clsbtn:hover {
        transform: rotate(90deg);
    }

    .basket-itog-zag {
        font-size: 18px;
        font-weight: 500;
    }

    .basket-itog-price {
        font-size: 24px;
        font-weight: 600;
        margin-top: 4px;
        color: #418123
    }

    .bask .clsbtn {
        right: 20px;
        top: 20px;
    }
}

@media screen and (max-width: 700px) {
    .clsbtn {
        font-size: 20px;
        right: 15px;
        top: 15px;
    }

    .modal {
        width: 90%;
        max-width: 400px;
        top: 16vh;
    }

    .modaltext {
        padding: 46px 30px 40px 30px;
    }
}

@media screen and (max-width: 500px) {
    .pricetable tr th span {
        display: none;
    }

    .pricetable tr th:nth-child(5) {
        display: none;
    }

    .pricetable tr td:nth-child(5) {
        display: none;
    }
}

.thanks {
    min-height: 90vh;
    margin-bottom: 0;
}

.thanks a {
    color: #7cb153
}

.similar-products {
    margin: 90px 0;
}

.similar-products_title {
    margin: 0 0 40px 0;
    line-height: 1em;
}

.similar-products_slider-nav-btn-wrapper {
    display: flex;
    align-items: center;
    margin: 40px auto 0 auto;
    width: fit-content;
}

.similar-products_slider-nav-btn {
    background: white;
    border: 1px solid #DDD;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 40px;
    border-radius: 0;
    box-shadow: none;
}

.similar-products_slider-nav-btn.next {
    transform: scale(-1, 1);
}

.similar-products_slider-nav-btn :where(img, svg) {
    width: 60px;
    height: 8px;
    object-fit: contain;
    pointer-events: none;
}

.similar-products_slider-nav-btn path {
    fill: #6AA43F;
}

.product-card {
    border: 1px solid #DDD;
    padding: 20px 20px 30px 20px;
    box-sizing: border-box;
    text-align: center;
    display: grid;
    grid-template-columns: 100%;
    justify-items: center;
}

.cert-header {
    font-size: 28px;
}

.cert-card {
    border: 1px solid #DDD;
    padding: 20px 20px 30px 20px;
    box-sizing: border-box;
    text-align: center;
    display: grid;
    grid-template-columns: 100%;
    justify-items: center;
}

.cert-card a {
    border-bottom: none;
}

.product-card_img-wrapper {
    display: flex;
    text-decoration: none;
    border-bottom: none;
    margin: 0 0 20px 0;
}

.product-card_img {
    width: 100%;
    height: 165px;
    object-fit: contain;
}

.product-card_title {
    font-size: 16px;
    font-weight: 500;
    color: black;
    margin: 0 0 20px 0;
    text-decoration: underline;
    border-bottom: none;
}

.product-card_props-list {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
    display: grid;
    grid-template-columns: 100%;
    gap: 10px;
}

.product-card_price {
    color: #6AA43F;
    font-weight: 600;
    font-size: 24px;
}

.product-card_add-to-cart {
    margin: 20px auto 0 auto;
    display: flex;
    width: fit-content;
    background: #6DA640;
    box-shadow: none;
}

.faq {
    margin: 100px 0;
}

.faq_title {
    line-height: 1em;
    margin: 0 0 50px 0;
}

.faq_list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.faq-item_question {
    border-radius: 10px;
    background: #EAEAEA;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 25px;
    font-size: 20px;
    font-weight: 500;
}

.faq-item_answer {
    padding: 25px 30px 0 30px;
    line-height: 1.3em;
    font-size: 16px;
}

.faq-item_question-icon {
    background: #6AA43F;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    grid-template-rows: auto;
    flex-shrink: 0;
    --width: 12px;
    --color: white;
    --weight: 2px;
    --angle: 0deg;
}

[open] .faq-item_question-icon {
    --angle: 45deg;
    background: #343434;
}

@media (max-width: 768px) {
    .faq_list {
        grid-template-columns: 100%;
    }
}

@media (max-width: 480px) {
    .similar-product .wp-post-image {
        height: 120px;
    }

    .faq-item_question {
        font-size: 14px;
        padding: 20px;
    }

    .faq-item_answer {
        font-size: 14px;
        padding: 1em 0 0 20px;
    }
}

@media (min-width: 320px) {
    .swiper-button-next,
    .swiper-button-prev{
        display: none;
    }
}
@media (min-width: 768px) {
    .swiper-button-next,
    .swiper-button-prev{
        display: flex;
    }
}

/* Block image slider */
.block-image-slider {
    margin-top: 30px;
}

.block-image-slider-wrapper {
    
}

.block-image-slider-wrapper-item {
    min-height: 500px;
    max-height: 500px;
}

.block-image-slider-wrapper-nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
/* Block image slider */
/* --- Гейт согласия (152-ФЗ) ------------------------------------------------
   Кнопка отправки ВСЕГДА активна: клик без согласия отменяет отправку и
   подсвечивает строку согласия (js/consent-gate.js). Приглушённый вид оставлен
   только для честного [disabled] — feedback.js гасит кнопку на время AJAX,
   и это индикатор «идёт отправка», а не «нажимать нельзя».                  */
button[type="submit"][disabled] {
    opacity: .5;
    cursor: not-allowed;
}

/* Красный подбирается под подложку: на светлой — тёмный (5,9:1 к белому),
   на тёмном фото .midforma тем же цветом текст 13 px уже не прочитать. */
.pers {
    --consent-error: #C62828;
}

.midforma .pers {
    --consent-error: #FF8A80;
    /* Блок с телефоном — форма горизонтальная и широкая, а .pers наследовал
       колонку 280 px: согласие ломалось на три строки и тянуло блок вниз.
       Даём ширину формы и кладём согласие с сообщением в ОДНУ строку, чтобы
       появление ошибки не сдвигало вёрстку. На узких экранах перенос сработает
       сам (flex-wrap), там места на строку всё равно нет. */
    /* 900 px, а не ширина формы (800): при 14 px согласие и сообщение в сумме
       ~860 px, на 800 они бы разъехались на две строки. Правее 950 px начинается
       картинка телефона (.iphone, absolute) — под неё текст заводить нельзя. */
    max-width: 900px;
    width: 100%;
    /* Отступ от полей и кнопки: перебивает общий `.midforma .pers { margin: 0 }`. */
    margin-top: 18px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 20px;
}

.midforma .pers .pol {
    margin-top: 0;
    /* Текст в одну строку — выравниваем по центру чекбокса, а не по верху. */
    align-items: center;
}

.midforma .pers span {
    margin-bottom: 0;
    font-size: 14px;
}

.midforma .consent-error {
    margin-top: 0;
    font-size: 14px;
}

/* Строка согласия — <label>: кликается целиком, а не 13 px чекбокса. */
.pers .pol {
    align-items: flex-start;
    cursor: pointer;
}

.checkpol {
    cursor: pointer;
}

.pol.is-consent-error .checkpol {
    outline: 2px solid var(--consent-error);
    outline-offset: 2px;
    border-color: var(--consent-error);
    box-shadow: 0 0 0 4px rgba(198, 40, 40, .18);
}

.pol.is-consent-error span,
.pol.is-consent-error span a,
.pol.is-consent-error a {
    color: var(--consent-error) !important;
}

.consent-error {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 8px;
    font-size: 13px;
    line-height: 135%;
    color: var(--consent-error);
}

/* Знак «!» в кружке: цветом текста, поэтому читается и на светлом, и на тёмном. */
.consent-error::before {
    content: "!";
    flex: 0 0 15px;
    width: 15px;
    height: 15px;
    margin-top: 1px;
    border: 1.5px solid currentColor;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
    line-height: 12px;
    text-align: center;
}

@media (prefers-reduced-motion: no-preference) {
    .pol.consent-shake {
        animation: consent-shake .35s ease-in-out;
    }

    @keyframes consent-shake {
        0%, 100% { transform: translateX(0); }
        18% { transform: translateX(-4px); }
        38% { transform: translateX(4px); }
        58% { transform: translateX(-3px); }
        78% { transform: translateX(2px); }
    }
}

/* --- P0: страница "Спасибо" (CTA в hero для страницы 451) --- */
.thanks-actions {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 22px;
}
.thanks-actions .thanks-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 14px 28px;
    border-radius: 8px;
    background: var(--green, #6DA640);
    color: #fff;
    font-size: 16px;
    text-decoration: none;
}
.thanks-actions .thanks-home {
    color: #fff;
    text-decoration: underline;
    font-size: 16px;
}
@media (max-width: 480px) {
    .thanks-actions { flex-direction: column; align-items: stretch; }
    .thanks-actions .thanks-cta { width: 100%; }
    .thanks-actions .thanks-home { text-align: center; }
}

/* --- P1: тач-таргеты ≥44px (мобильная доступность) --- */
.mobmenucls {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.clsbtn {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.mobmenubtn:focus-visible,
.mobmenucls:focus-visible,
.clsbtn:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}
@media (max-width: 750px) {
    .mobmenu > div > a,
    .mobmenu .rolmenu {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
}

/* P1: бургер — гарантированный тач-таргет ≥48px (был ~31px из-за border-box) */
.mobmenubtn {
    min-width: 48px;
    min-height: 48px;
    box-sizing: border-box;
}

/* ================================================================
   P1 mobile-first конверсия: поднять товар/цену/CTA выше сгиба.
   Только @media (десктоп не трогаем). Контент остаётся в DOM
   (никаких display:none-удалений) — mobile-first indexing ок.
   ================================================================ */
@media (max-width: 768px) {
    /* 1. Сжать hero-логотип (декоративный баннер почти на весь 1-й экран) */
    #up .wrap.header .logo img {
        max-height: 60px;
        width: auto;
    }
    #up .wrap.header .logo p {
        font-size: 12px;
        line-height: 1.25;
        margin: 4px 0 0;
    }
    #up .wrap.header .wr {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    /* часы — компактнее; телефон 8-800 оставляем заметным (это CTA) */
    #up .adr {
        margin: 6px 0;
    }
    #up .adr span,
    #up .adr p {
        font-size: 13px;
        line-height: 1.25;
    }
    /* меньше вертикальных отступов у hero-контента */
    #up .main .wr {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    /* 2. Ограничить высоту фото товара, чтобы цена/CTA поднялись */
    .wrap.tovar .tovar-mainimg {
        max-height: 46vh;
        overflow: hidden;
    }
    .wrap.tovar .tovar-mainimg img {
        max-height: 46vh;
        width: auto;
        object-fit: contain;
    }

    /* 3. Отступ снизу под липкий CTA-бар (контент не прячется под ним) */
    body.has-sticky-cta {
        padding-bottom: 76px;
    }
    /* плавающие кнопки поднять над липким баром */
    body.has-sticky-cta .fixedbtns {
        bottom: 88px;
    }
}

/* Липкий CTA-бар — ДУБЛЬ существующего CTA (реальный CTA есть в DOM),
   поэтому на десктопе безопасно display:none. Показываем только на мобилке. */
.sticky-cta {
    display: none;
}
@media (max-width: 768px) {
    .sticky-cta.is-ready {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 60;
        align-items: center;
        gap: 12px;
        padding: 10px 14px;
        background: #fff;
        box-shadow: 0 -2px 12px rgba(0, 0, 0, .15);
    }
    .sticky-cta__price {
        font-weight: 700;
        font-size: 16px;
        color: var(--black, #343434);
        white-space: nowrap;
    }
    .sticky-cta__btn {
        margin-left: auto;
        min-height: 48px;
        padding: 12px 22px;
        background: var(--green, #6DA640);
        color: #fff;
        border: 0;
        border-radius: 8px;
        font-size: 16px;
        flex: 0 0 auto;
    }
}

/* --- P1 mobile: доп. компрессия hero (итерация 2) --- */
@media (max-width: 768px) {
    /* компактный hero-хедер: лого + телефон в строку, часы мелко */
    #up .wrap.header .wr {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 6px 12px;
        padding: 8px 16px;
    }
    #up .wrap.header .logo { margin: 0; }
    #up .wrap.header .adr { order: 3; flex-basis: 100%; margin: 0; }
    #up .wrap.header .adr span,
    #up .wrap.header .adr p { font-size: 12px; display: inline; }
    #up .wrap.header .cont { margin: 0; text-align: right; }
    #up .wrap.header .cont p { font-size: 11px; }
    /* корзина-кнопка в хедере дублирует плавающую корзину (.fixedbtns) — прячем ДУБЛЬ UI (не контент) */
    #up .wrap.header .topbtn { display: none; }

    /* категория: сжать intro-описание в hero (контент остаётся в DOM) */
    #up .leftmain p { margin: 6px 0; font-size: 14px; line-height: 1.35; }
    #up .leftmain ul { margin: 8px 0; }
    #up .leftmain ul li { margin: 4px 0; }
    #up .main .wr { padding-top: 8px; padding-bottom: 8px; }

    /* фото товара чуть ниже, чтобы цена поднялась */
    .wrap.tovar .tovar-mainimg,
    .wrap.tovar .tovar-mainimg img { max-height: 40vh; }
}

/* --- P1 mobile: фиксы горизонтального переполнения на 320px (Яндекс) --- */
@media (max-width: 768px) {
    /* фото товара — не переполнять и не обрезать по ширине */
    .wrap.tovar .tovar-mainimg { overflow: visible; }
    .wrap.tovar .tovar-mainimg img {
        max-width: 100%;
        height: auto;
    }
    /* липкий бар строго в границах вьюпорта */
    .sticky-cta.is-ready { box-sizing: border-box; max-width: 100vw; }
    .sticky-cta__price {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
@media (max-width: 360px) {
    /* топ-бар (город/ТГ/email) не должен переполнять узкие экраны */
    #up .wrap.topline .wr { flex-wrap: wrap; row-gap: 2px; }
    #up .wrap.topline { font-size: 12px; }
    #up .wrap.header .cont span a { font-size: 20px; }
}

/* --- P1 mobile: устранить h-scroll от фото single-товара и слайдеров карточек --- */
@media (max-width: 768px) {
    .wrap.tovar .thrpagebg,
    .wrap.tovar .thrpagebg img {
        max-width: 100%;
        height: auto;
    }
    /* горизонтальные слайдеры карточек не должны давать h-scroll всей страницы */
    .wrap.catalog,
    .wrap.tovar,
    .similar-products,
    .swiper {
        overflow-x: hidden;
    }
}

/* --- ТГ канал: иконка вместо текста (ПК+мобилка) --- */
.tg-channel a {
    display: inline-flex;
    align-items: center;
    color: #fff;
    text-decoration: none;
    margin-right: 10px;
}
.tg-channel__ico { display: block; }
.tg-channel__txt {
    /* визуально скрыто, доступно скринридерам не требуется (есть aria-label) */
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}
.tg-channel a:hover .tg-channel__ico { opacity: .8; }

/* --- P1 mobile: компактная шапка + hero по контенту (итерация 3) --- */
@media (max-width: 768px) {
    /* email из топ-бара — он есть в бургер-меню (.mobcont); контент в DOM сохранён */
    #up .wrap.topline .topright .email { display: none; }

    /* компактная wrap.header: лого + телефон, часы мелким текстом */
    #up .wrap.header .wr { padding: 6px 16px; gap: 2px 12px; }
    #up .wrap.header .logo img { max-height: 46px; }
    #up .wrap.header .logo p { font-size: 10px; line-height: 1.2; margin: 2px 0 0; }
    #up .wrap.header .adr { order: 4; flex-basis: 100%; margin: 2px 0 0; }
    #up .wrap.header .adr span,
    #up .wrap.header .adr p { font-size: 11px; }
    #up .wrap.header .cont span a { font-size: 22px; }
    #up .wrap.header .cont p { font-size: 10px; }

    /* hero карточки товара — высота по контенту (не целый экран) */
    .catalogbg2 {
        min-height: 0;
        height: auto;
        max-height: none;
    }
}

/* --- P1 mobile: паддинг шапки + переработка fixedbtns (FAB) --- */
@media (max-width: 768px) {
    /* убрать крупный паддинг .header (base 50/40px) на мобилке */
    #up .wrap.header { padding-top: 8px; padding-bottom: 8px; }

    /* fixedbtns: убрать "Вверх", мессенджеры схлопнуть в FAB */
    .fixedbtns .up { display: none; }
    .fixedbtns .tg,
    .fixedbtns .wa,
    .fixedbtns .max {
        display: none;
        opacity: 0;
        transform: translateY(8px);
        transition: opacity .18s ease, transform .18s ease;
    }
    .fixedbtns.is-open .tg,
    .fixedbtns.is-open .wa,
    .fixedbtns.is-open .max {
        display: block;
        opacity: 1;
        transform: none;
    }
    .fixedbtns__fab {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        align-self: flex-end;
        box-sizing: border-box;
        width: 54px;
        height: 54px;
        min-width: 54px;
        padding: 0;
        margin-top: 10px;
        border: 0;
        border-radius: 50%;
        background: linear-gradient(to bottom, #70a842, #418123);
        box-shadow: 0 3px 10px rgba(0, 0, 0, .25);
        cursor: pointer;
    }
    .fixedbtns.is-open .fixedbtns__fab { background: #9E9999; }
}
/* десктоп: FAB скрыт, все кнопки как прежде */
@media (min-width: 769px) {
    .fixedbtns__fab { display: none; }
}

/* --- ФИКС: фото товара не должно налезать на .tovarright (mobile) ---
   Контейнер обнимает картинку (height:auto), а ограничение высоты — на самом img.
   Раньше контейнер имел фикс. max-height + overflow:visible → img вылезал вниз. */
@media (max-width: 768px) {
    .wrap.tovar .tovar-mainimg {
        max-height: none;
        height: auto;
        overflow: visible;
    }
    .wrap.tovar .tovar-mainimg img {
        max-height: 44vh;
        max-width: 100%;
        width: auto;
        height: auto;
        object-fit: contain;
        display: block;
    }
}

/* --- Оверлей под hero-текст (читаемость белого текста на светлой фон-текстуре) ---
   Тёмный градиент между фоном #up и текстом. Точечный паттерн .over не трогаем
   (он лежит выше текста). Только мобилка — там была проблема контраста. */
@media (max-width: 768px) {
    #up {
        position: relative;
    }
    #up::after {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 1;
        pointer-events: none;
        background: linear-gradient(180deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, .35) 40%, rgba(0, 0, 0, .12) 100%);
    }
    #up > .wrap.topline,
    #up > .wrap.header,
    #up > .main {
        position: relative;
        z-index: 2;
    }
}

/* --- Хлебные крошки: горизонтальный скролл, одинарное подчёркивание, разделители --- */
.breadcrumbs {
    flex-wrap: nowrap;
    white-space: nowrap;
    overflow-x: auto;
    max-width: 100%;                  /* не растягивать страницу — скроллить внутри */
    min-width: 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;            /* Firefox: скрыть скроллбар */
}
.breadcrumbs::-webkit-scrollbar { display: none; }   /* WebKit: скрыть скроллбар */
.breadcrumbs .breadcrumbs__item { flex: 0 0 auto; }
/* разделитель "/" перед каждым элементом кроме первого; на span-обёртке — не подчёркивается */
.breadcrumbs .breadcrumbs__item + .breadcrumbs__item::before {
    content: "/";
    margin: 0 6px;
    color: #ddd;
}
/* одинарное подчёркивание: убрать border-bottom, остаётся text-decoration */
.breadcrumbs a { border-bottom: none; }

/* последний элемент (заголовок текущей страницы) скрыт и на ПК, и на мобилке;
   остаётся в DOM и в микроразметке BreadcrumbList. Разделитель перед ним
   (его ::before) тоже исчезает — без «висящего» слэша. */
.breadcrumbs .breadcrumbs__current { display: none; }

/* --- Гарантия отсутствия горизонтального скролла страницы на мобилке (Яндекс) ---
   Карусели (swiper) скроллятся внутри себя; fixed-элементы (меню/липкий бар/
   плавающие кнопки) не затрагиваются. --- */
@media (max-width: 768px) {
    html,
    body {
        overflow-x: clip;
        max-width: 100%;
    }
}

/* --- Похожие товары: нативный горизонтальный скролл вместо Swiper со стрелками --- */
.similar-products_slider {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 6px;
}
.similar-products_slider::-webkit-scrollbar { display: none; }
.similar-products_slider .similar-product {
    flex: 0 0 calc((100% - 40px) / 3);   /* ПК: ~3 карточки в ряд (2 gap по 20px) */
    scroll-snap-align: start;
    min-width: 0;
}
/* стрелки-переключатели больше не нужны (на случай кэша разметки) */
.similar-products_slider-nav-btn-wrapper { display: none; }

@media (max-width: 768px) {
    .similar-products_slider { gap: 12px; }
    .similar-products_slider .similar-product {
        flex: 0 0 100%;                  /* мобилка: ровно 1 товар на экран */
    }
}

/* --- H1 карточки товара в начале блока (над колонками, во всю ширину) --- */
.tovar .wr .tovar-h1 {
    grid-column: 1 / -1;
    margin-bottom: 16px;
}

/* --- «Товар в наличии» — бейдж в левом верхнем углу главного фото --- */
.thrpagebg {
    position: relative;
}
.thrpagebg .nalichiye {
    position: absolute;
    top: 12px;
    left: 12px;
    margin: 0;
    padding: 6px 12px;
    /* Читаемость на ЛЮБОМ фоне фото: непрозрачный фон (текст всегда виден),
       граница (виден на белом/светлом фоне), тень (отделяет на тёмном). */
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 6px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .18);
    z-index: 3;
}

/* --- fix: контент блока товара не должен уходить под плавающие кнопки (ПК) --- */
@media (min-width: 1025px) {
    .tovar .wr {
        padding-right: 110px;
    }
}
/* --- фото товара ближе к левому краю: убрать авто-центрирование .thrpagebg --- */
.wrap.tovar .thrpagebg {
    margin-left: 0;
    margin-right: auto;
}

/* Заголовок товара держим на 32px (базовый .h3 теперь 24px по новой шкале) */
.tovar-h1 {
    font-size: 32px;
}

/* Хлебные крошки в блоке товара (над H1): во всю ширину + читаемый разделитель на белом */
.tovar .wr .breadcrumbs {
    grid-column: 1 / -1;
    margin-bottom: 12px;
}
.tovar .breadcrumbs .breadcrumbs__item + .breadcrumbs__item::before {
    color: #9E9999;
}

/* --- Карточка товара: hero по контенту (H1 и крошки перенесены в блок товара) ---
   Убираем принудительную высоту 520px и лишние отступы — без пустот над .wrap.tovar. */
.catalogbg2 {
    min-height: auto;
    max-height: none;
    margin-bottom: 24px;
}
.catalogbg2 .main .wr {
    padding-top: 8px;
    padding-bottom: 8px;
}

/* Карточка товара: .main (после topmenu) пуст — крошки/H1 перенесены в блок товара.
   Схлопываем, чтобы под меню не оставалась пустая полоса hero. */
.catalogbg2 .main,
.catalogbg2 .main .wr {
    padding-top: 0;
    padding-bottom: 0;
    min-height: 0;
}

/* --- Карточка товара: фон-слой hero (видео/постер/.over) по высоте hero ---
   Раньше .is_overlay/#trailer=930-950px, .over=520px → фон тянулся ЗА контент товара.
   Ограничиваем высотой #up (hero теперь компактный). --- */
.catalogbg2 {
    position: relative;
}

/* --- Карточка товара: #trailer(постер) и .over — absolute, режем высоту без сдвига потока ---
   Раньше 520px → баннер тянулся за хлебные крошки/контент. Ограничиваем высотой шапки. --- */
.thrdpage #trailer,
.thrdpage .over {
    min-height: 0 !important;
    max-height: 310px !important;
}

/* --- Тонкая настройка карточки товара (по запросу) --- */
.catalogbg2 { margin-bottom: 0; }                 /* убрать нижний отступ hero */
.wrap.tovar .thrpagebg { width: 100%; }           /* фото-бокс на всю ширину колонки (нет отступа справа) */
@media (min-width: 769px) {
    .thrdpage #trailer,
    .thrdpage .over { max-height: 360px !important; }   /* полоса после меню чуть больше */
    .tovar { padding-top: 84px; }                        /* контент ниже полосы */
}

/* Анкоры в правой колонке товара — в цвет дизайн-системы (не дефолтный синий) */
.tovarright a { color: var(--green); }
.tovarright a:not(.buy-btn--calc):hover { color: var(--black); }  /* калькулятор при hover — белый текст на зелёном (см. .buy-btn--calc:hover) */


/* --- Модалки: окно растёт под содержимое (разбор 2026-08-01) ----------------
   Внутренние отступы .modaltext заданы ТОЛЬКО в медиазапросах (≤1320px и
   ≤979/750 — 50/50/30/50, ≤700px — 46/30/40/30), а шире 1320px их нет вовсе:
   «воздух» там брался из разницы min-height 435px и высоты содержимого, а само
   содержимое центрировалось (display:grid + align-content:center). Поэтому
   любой прирост контента не растягивал окно, а съедал поля — замер на 1366px
   при появлении сообщения о согласии: контент 391 → 431px, запас снизу
   24 → 2px, окно так и осталось 435px. Даём те же отступы и на широких: теперь
   min-height задаёт минимум, а не потолок, и окно растёт вместе с контентом.
   Отступы .bask/.loc/.cart_added перебивают это правило своей специфичностью. */
.modaltext {
    padding: 50px 50px 30px;
}

@media screen and (max-width: 700px) {
    /* на узких свои отступы (были заданы до этой правки) — сохраняем */
    .modaltext {
        padding: 46px 30px 40px;
    }
}

/* --- Согласие: строка сообщения существует всегда ---------------------------
   js/consent-gate.js создаёт .consent-msg под каждым согласием при загрузке
   страницы (в т.ч. в закрытых модалках). В покое это серая подсказка, при
   ошибке — тот же текст красным с иконкой: одинаковый текст занимает
   одинаковое место, поэтому ошибка не двигает ни кнопку, ни границы окна.
   Место под иконку зарезервировано всегда (visibility, не display), иначе при
   ошибке текст сжимался бы на её ширину и мог получить лишнюю строку. */
.consent-msg {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 8px;
    font-size: 13px;
    line-height: 135%;
    /* #999 у .pers span даёт 2,85:1 — для отдельной строки текста мало;
       #707070 проходит AA (4,95:1 на белом) и на глаз не отличается. */
    color: #707070;
}

.consent-msg::before {
    content: "!";
    flex: 0 0 15px;
    width: 15px;
    height: 15px;
    margin-top: 1px;
    border: 1.5px solid currentColor;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
    line-height: 12px;
    text-align: center;
    visibility: hidden;
}

/* Согласие отмечено — подсказка не нужна, но место под неё остаётся занятым
   (visibility, не display): снятая обратно галочка не должна двигать вёрстку. */
.consent-msg.is-idle {
    visibility: hidden;
}

.consent-msg.is-error {
    color: var(--consent-error);
}

.consent-msg.is-error::before {
    visibility: visible;
}

/* Сообщение теперь живёт ВНУТРИ слота: рамку и иконку рисует слот, самому
   тексту остаётся только цвет (он наследуется от .consent-msg.is-error). */
.consent-msg .consent-error {
    display: inline;
    margin: 0;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}

.consent-msg .consent-error::before {
    content: none;
}

/* Тёмное фото под .midforma: серый текст подсказки на нём не читается. */
.midforma .consent-msg {
    margin-top: 0;
    font-size: 14px;
    color: rgba(255, 255, 255, .82);
}


/* Заголовок блока «О материале» (фото + характеристики + описание под листингом
   подкатегории). Блок переехал под таблицу размеров 2026-08-01, и без заголовка
   фото с характеристиками читались как продолжение листинга.
   grid-column: 1 / -1 обязателен: .tovar .wr — сетка 570px + 1fr, и без него
   заголовок занимает ЯЧЕЙКУ, выталкивая колонку с характеристиками на вторую
   строку (замер: провал 170 px между заголовком и таблицей). Тот же приём уже
   применён к .tovar-h1 на карточке товара. */
.tovar .wr .tovar-about-h2 {
    grid-column: 1 / -1;
    margin: 0 0 24px;
    font-size: clamp(24px, 2.4vw, 32px);
    font-weight: 700;
    line-height: 1.1;
    color: #000;
}

/* --- Сервисные страницы: без тёмного градиента под H1 на мобилке (решение
   владельца 2026-08-03) ---
   Оверлей `#up::after` (см. «Оверлей под hero-текст», @media ≤768 выше) писался
   под СТАРЫЙ hero с фон-текстурой и БЕЛЫМ текстом. У компактного архетипа фон
   снят (`.up-compact{background:none!important}` в css/header.css), а H1 чёрный —
   поэтому градиент читался серой полосой за заголовком: замер боя на 390 px —
   rgba(0,0,0,.55)→.12 на всю высоту блока (85,5 px «Доставка», 117 px «Контактная
   информация»). Гасим только у `.up-compact`; на видео-hero (главная, листинги)
   оверлей нужен — там белый текст поверх видео/постера.
   Селектор с `#up`: у исходного правила id, класс его специфичностью не перебьёт. */
@media (max-width: 768px) {
    #up.up-compact::after { content: none; }
}

/* --- Корзина: единица измерения — подпись, а не выпадашка (2026-08-04) ---
   Количество в корзине хранится ШТУКАМИ, и сумму сервер считает по цене штуки
   (ajax-functions.php), поэтому выбирать «м2/м3/шт» там нечего: прежний <select>
   был мёртвым (его обработчик basketObj.handleChangeUnit читает data-price,
   которого в серверной разметке корзины нет) и вдобавок обещал «шт» при цене,
   считавшейся за м². Класс `.edinica` оставлен ради прежнего вида, но он писался
   под <select>: span — inline, вертикальные паддинги высоту строки не держат,
   а курсор-указатель на неинтерактивной подписи обманывает. */
.basket-position-kolvo span.edinica {
    display: inline-block;
    cursor: default;
}

/* ==========================================================================
   Уведомление об использовании cookie (152-ФЗ) — 2026-08-04
   Разметка: template-parts/cookie-banner.php, поведение: js/cookie-banner.js.
   Правила дописаны в КОНЕЦ файла: блоки style.css продублированы в трёх-четырёх
   медиазапросах, и только последнее правило при равной специфичности выигрывает.
   ========================================================================== */

.lpk-cookie {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    /* Выше .sticky-cta (60) и .fixedbtns (10), ниже модалок темы: пока висит баннер,
       поверх него ничего своего не открывается. */
    z-index: 80;
    padding: 0 20px 20px;
    font-family: 'Klimat', sans-serif;
    animation: lpk-cookie-in .34s cubic-bezier(.2, .7, .3, 1) both;
}

.lpk-cookie[hidden] {
    display: none;   /* явный display у .lpk-cookie иначе перебил бы атрибут hidden */
}

.lpk-cookie__in {
    max-width: 1180px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 26px;
    padding: 18px 24px;
    background: #1E2318;
    color: #E8EAE3;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 14px;
    box-shadow: 0 14px 40px rgba(0, 0, 0, .34);
}

.lpk-cookie__text {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: #C9CFC0;
}

.lpk-cookie__text a {
    color: #A7DC72;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.lpk-cookie__actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
    flex-shrink: 0;
}

.lpk-cookie__btn {
    appearance: none;
    font-family: inherit;
    font-size: 15px;
    line-height: 1;
    white-space: nowrap;
    padding: 14px 26px;
    border-radius: 8px;
    cursor: pointer;
    transition: background .2s, box-shadow .2s, border-color .2s;
}

/* Градиент и тень — те же, что у .hero-cta .btn-primary: кнопка согласия должна
   читаться как кнопка сайта, а не как элемент чужого виджета. */
.lpk-cookie__btn--primary {
    border: 0;
    font-weight: 500;
    color: #fff;
    background: linear-gradient(to bottom, #70A842, #418123);
    box-shadow: 0 6px 16px rgba(65, 130, 40, .34);
}

.lpk-cookie__btn--primary:hover {
    background: linear-gradient(to bottom, #7CB84C, #4C8E2D);
}

.lpk-cookie__btn--ghost {
    border: 1px solid rgba(255, 255, 255, .3);
    background: transparent;
    color: #E8EAE3;
}

.lpk-cookie__btn--ghost:hover {
    border-color: rgba(255, 255, 255, .62);
    background: rgba(255, 255, 255, .06);
}

.lpk-cookie__btn:focus-visible {
    outline: 2px solid #A7DC72;
    outline-offset: 2px;
}

@keyframes lpk-cookie-in {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: none; }
}

/* Пока баннер виден, липкие элементы поднимаются на его высоту (её меряет JS
   и кладёт в --lpk-cookie-h на body). Без этого баннер закрыл бы «Оставить заявку»
   на листинге и карточке товара — то есть главный CTA мобильной версии. */
.sticky-cta.is-ready,
.fixedbtns {
    transition: bottom .32s cubic-bezier(.2, .7, .3, 1);
}

body.has-cookie-banner .sticky-cta.is-ready {
    bottom: var(--lpk-cookie-h, 0px);
}

body.has-cookie-banner .fixedbtns {
    bottom: calc(30px + var(--lpk-cookie-h, 0px));
}

@media (prefers-reduced-motion: reduce) {
    .lpk-cookie,
    .sticky-cta.is-ready,
    .fixedbtns {
        animation: none;
        transition: none;
    }
}

@media (max-width: 768px) {
    .lpk-cookie {
        padding: 0;
    }

    .lpk-cookie__in {
        flex-direction: column;
        align-items: stretch;
        gap: 13px;
        padding: 16px 16px calc(18px + env(safe-area-inset-bottom, 0px));
        border-radius: 16px 16px 0 0;
        border-bottom: 0;
    }

    .lpk-cookie__text {
        font-size: 13.5px;
    }

    .lpk-cookie__actions {
        margin-left: 0;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .lpk-cookie__btn {
        min-height: 48px;   /* палец, а не курсор */
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 12px 10px;
        font-size: 14px;
    }
}

/* Цена за штуку на карточке товара (2026-08-04, план 2026-08-04-schema-microdata).
   Появилась потому, что в микроразметке Offer.price обязан быть ценой того, что
   покупают — одной доски, — а размечать число, которого на странице нет, нельзя.
   Вспомогательная строка под главной ценой: тот же зелёный, но мельче и не
   жирная, чтобы «от N руб./м²» осталась главной. */
.tovarright-cena-piece {
    margin: 6px 0 0;
    font-size: 15px;
    line-height: 1.2;
    color: #6b7a63;
}

/* «без НДС» рядом с главной ценой карточки (2026-09-08, ответ владельца: цены на
   сайте БЕЗ НДС). Тот же приглушённый цвет, что у цены за штуку, и мельче — пометка
   обязана читаться, но не спорить за внимание с самим числом. nowrap: «без» и «НДС»
   на разных строках выглядят как обрыв фразы. */
.tovarright-cena-vat {
    margin-left: 8px;
    font-size: 14px;
    font-weight: 400;
    color: #6b7a63;
    white-space: nowrap;
}

/* ─────────────────────────────────────────────────────────────────────
   Главная: блок «Наш ассортимент» целиком в экране (2026-08-17)

   Модификатор .catalog-fit печатает block-assortment.php только при
   is_front_page(): тот же блок выводится на /pilomateriali и /dostavka, там
   геометрию менять не просили.

   Бюджет (Метрика, 90 дней; окно посетителя минус липкая шапка ПОСЛЕ скролла —
   61 px на ПК, 66 на мобиле): ПК 875 px у медианы и 766 у p25; мобиль 661 и 630.
   Было 1402 px на ПК и 3575 на мобиле — из них 382 px в карточке занимала
   медиа-область и 80 px уходило в gap.

   Специфичность .catalog-fit … (0,2,0) перебивает базовые .catbg/.cat-img
   (0,1,0) во всех медиа-блоках выше, поэтому !important не нужен.
   ───────────────────────────────────────────────────────────────────── */

/* На ПК общей кнопки нет вовсе — там кнопка есть в каждой карточке. */
.cat-order-all {
    display: none;
}

@media (min-width: 750px) {
    .catalog-fit {
        padding-top: 20px;
        padding-bottom: 40px;
    }

    .catalog-fit .catwrap {
        padding-top: 28px;
        /* Шесть колонок вместо трёх, карточка занимает две. Ширина карточки и
           зазоры при этом НЕ меняются: 2·(W−5g)/6 + g = (W−2g)/3, ровно то же,
           что давало «1fr 1fr 1fr». Смысл один: остаток ряда можно сдвинуть на
           ПОЛколонки, чего в трёхколоночной сетке сделать нельзя. */
        grid-template-columns: repeat(6, 1fr);
        gap: 28px;
    }

    .catalog-fit .catwrap > div {
        /* ⚠️ Именно grid-column-END, а не сокращение `grid-column: span 2`.
           Сокращение с одним значением кладёт «span 2» в grid-column-START, и
           правило сдвига ряда ниже его затирало: карточки последнего ряда
           схлопывались до ОДНОЙ колонки (замер 2026-08-18 — 193 px вместо 407).
           Со span в end начало остаётся auto и переопределяется свободно. */
        grid-column-end: span 2;
    }

    /* Неполный последний ряд центрируем. Разделов стало восемь (2026-08-18,
       вернули доску пола и садовую плитку), 8 = 3 + 3 + 2 — два последних висели
       прижатыми влево, с дырой справа шириной в карточку. Правило считает
       остаток само и к числу разделов не привязано: осталось двое — сдвиг на
       полколонки, один — на целую. Внутри .catwrap только карточки (JSON-LD
       уходит в граф из PHP, кнопка «Заказать» лежит снаружи), поэтому
       nth-child-арифметика тут честная. */
    .catalog-fit .catwrap > div:nth-child(3n + 1):nth-last-child(2) {
        grid-column-start: 2;
    }

    .catalog-fit .catwrap > div:nth-child(3n + 1):nth-last-child(1) {
        grid-column-start: 3;
    }

    /* Высоту карточки задаёт фон (catbg.jpg 480×500, раньше масштабировался по
       ширине колонки и давал 382 px). Фиксируем медиа-область. */
    .catalog-fit .catbg {
        height: 180px;
        width: 100%;
        object-fit: cover;
    }

    /* Фото товара раньше вылезало за карточку (width: 114%, margin-left: -7%).
       Вписываем по центру медиа-области. */
    .catalog-fit .cat-img {
        width: auto;
        max-width: none;
        height: 164px;
        margin-left: 0;
        left: 50%;
        transform: translateX(-50%);
        top: 8px;
    }

    /* ⚠️ Базовое `.catwrap div:hover img { transform: scale(1.02) }` (0,2,1)
       перебило бы наш translateX и фото прыгало бы влево на пол-карточки. */
    .catalog-fit .catwrap div:hover .cat-img {
        transform: translateX(-50%) scale(1.02);
    }

    .catalog-fit .cat-zag {
        font-size: 17px;
        margin-top: 10px;
        margin-bottom: 6px;
    }

    .catalog-fit .cat-price {
        font-size: 21px;
        margin-top: 0;
        margin-bottom: 0;
    }

    .catalog-fit .catwrap div button {
        margin-top: 10px;
        padding: 11px 26px;
    }
}

/* Широкий ПК: ЧЕТЫРЕ колонки вместо трёх.
   Замер 2026-08-18 показал, чего не видно по вёрстке: фото карточки задано ВЫСОТОЙ
   (`.cat-img { height: 164px; width: auto }`) и от ширины колонки не зависит вовсе —
   в 407-пиксельной карточке оно занимает 185 px, остальное фон вокруг. Значит узкая
   колонка изображение не режет, а забирает только воздух: 1440 px — карточка 407 -> 300,
   фото те же 185×136, блок 873 -> 582 px. Последнее и есть смысл модификатора
   .catalog-fit — уместить блок в экран целиком; при трёх колонках и восьми разделах
   он в 900-пиксельное окно не влезал.
   ⚠️ Порог 1200 px не косметический: минимум карточки задаёт фото. При четырёх
   колонках 1000 px дают карточку 215 px против фото 185 px (по 15 px с боков), а 750 px —
   151 px, то есть фото шире плашки. Ниже 1200 остаются три колонки.
   Приём тот же, что и для трёх: колонок вдвое больше (8), карточка на две — ширина
   и зазоры не меняются, 2·(W−7g)/8 + g = (W−3g)/4.

   ⚠️ Четыре колонки — только от СЕМИ разделов (`:has(> div:nth-child(7))`), решение
   владельца 2026-08-24. Смысл ступени в том, чтобы уложить блок в два ряда; при шести
   разделах два ряда даёт и трёхколоночная сетка (3 + 3), а четырёхколоночная — 4 + 2,
   то есть ряд с дырой на две карточки. Высота от этого не растёт вовсе: она задана
   фото и подписью, а не шириной колонки, — блок остаётся в первом экране.
   Порог считается САМ, к числу разделов правило не привязано: вернут снятые категории
   (`inc/retired-categories.php`) — семь-восемь карточек снова разложатся по четыре.
   Браузер без `:has` игнорирует весь селектор и остаётся на трёх колонках: при восьми
   разделах это лишний ряд и скролл, но не сломанная вёрстка. */
@media (min-width: 1200px) {
    .catalog-fit .catwrap:has(> div:nth-child(7)) {
        grid-template-columns: repeat(8, 1fr);
    }

    /* Сдвиги трёхколоночного варианта здесь вредны: при восьми разделах седьмая
       карточка подходит под `3n + 1` и уехала бы вбок. Специфичность у сброса та же
       (0,4,1), поэтому решает порядок — блок стоит ниже по файлу. */
    .catalog-fit .catwrap:has(> div:nth-child(7)) > div:nth-child(3n + 1):nth-last-child(2),
    .catalog-fit .catwrap:has(> div:nth-child(7)) > div:nth-child(3n + 1):nth-last-child(1) {
        grid-column-start: auto;
    }

    /* Неполный последний ряд по центру: остались трое — сдвиг на полколонки,
       двое — на целую, один — на полторы. При восьми разделах ряды полные (4 + 4),
       правило работает на будущее: девятый раздел даст 4 + 4 + 1 по центру. */
    .catalog-fit .catwrap:has(> div:nth-child(7)) > div:nth-child(4n + 1):nth-last-child(3) {
        grid-column-start: 2;
    }

    .catalog-fit .catwrap:has(> div:nth-child(7)) > div:nth-child(4n + 1):nth-last-child(2) {
        grid-column-start: 3;
    }

    .catalog-fit .catwrap:has(> div:nth-child(7)) > div:nth-child(4n + 1):nth-last-child(1) {
        grid-column-start: 4;
    }
}

/* Низкие окна ПК: у четверти посетителей окно 827 px и ниже (p25), там
   доступно 766 px, а базовая версия блока — 750 px, то есть впритык. Порог
   именно 900, а не 820: при 827 px ступень обязана срабатывать (иначе запас
   16 px), а медианные 936 остаются на базовой версии. */
@media (min-width: 750px) and (max-height: 900px) {
    .catalog-fit .catwrap {
        padding-top: 20px;
        gap: 20px;
    }

    .catalog-fit .catbg {
        height: 150px;
    }

    .catalog-fit .cat-img {
        height: 136px;
    }
}

/* Мобиль: плитка 2×3 вместо столбика из шести карточек. */
/* Мобиль. ⚠️ Целевой бюджет здесь НЕ медианный, а низкий: 583 px (окно p10
   649 минус шапка 66). Первая раскатка целилась в медиану (661) и дала блок
   619 px — владелец сообщил, что на его телефоне блок в экран не влез. У
   четверти мобильных посетителей окно <= 696, у десятой части <= 649, плюс
   распространённые 375x667 (iPhone SE) дают те же ~600. Поэтому ужато до ~555:
   медиа-область 88 -> 76, цена 17 -> 15 px, отступы и gap по 2-4 px. Дальше
   ужимать нельзя без потери читаемости цены — она главное для оптового
   посетителя. */
@media (max-width: 749px) {
    .catalog-fit {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .catalog-fit .catwrap {
        padding-top: 12px;
        /* Перебивает repeat(auto-fit, minmax(290px, 1fr)) из @media (max-width:
           1320px) — из-за него на 390 px колонка была ОДНА, и блок вырастал
           до 3575 px. */
        /* Четыре колонки вместо двух, карточка на две — тот же приём, что на
           ПК (разбор выше): ширина карточки не меняется, зато одинокая карточка
           последнего ряда встаёт по центру. При восьми разделах ряды полные,
           это страховка на нечётное число. */
        grid-template-columns: repeat(4, 1fr);
        /* Ряды разведены шире колонок. Замер на 390×727 показал: при gap 10px
           цена стоит в 10 px от фото СЛЕДУЮЩЕЙ карточки и в 18 px от своего
           названия — то есть читается как подпись к чужому фото. 14 px между
           рядами против 10 px внутри карточки возвращают правильную
           группировку и стоят 8 px высоты на весь блок. По колонке оставляем
           10 px: там каждый пиксель уходит в ширину карточки. */
        gap: 12px 10px;
    }

    .catalog-fit .catwrap > div {
        /* ⚠️ Именно grid-column-END, а не сокращение `grid-column: span 2`.
           Сокращение с одним значением кладёт «span 2» в grid-column-START, и
           правило сдвига ряда ниже его затирало: карточки последнего ряда
           схлопывались до ОДНОЙ колонки (замер 2026-08-18 — 193 px вместо 407).
           Со span в end начало остаётся auto и переопределяется свободно. */
        grid-column-end: span 2;
    }

    .catalog-fit .catwrap > div:nth-child(2n + 1):nth-last-child(1) {
        grid-column-start: 2;
    }

    .catalog-fit .catbg {
        height: 76px;
        width: 100%;
        object-fit: cover;
    }

    .catalog-fit .cat-img {
        width: auto;
        max-width: none;
        height: 68px;
        margin-left: 0;
        left: 50%;
        transform: translateX(-50%);
        top: 4px;
    }

    .catalog-fit .catwrap div:hover .cat-img {
        transform: translateX(-50%) scale(1.02);
    }

    /* Две строки зарезервированы: «Брус обрезной лиственница» переносится, а
       «Брусок» нет — без min-height ряды разъезжаются по высоте (проверено:
       цены во всех карточках ряда встают на один Y).

       align-content делит запас min-height пополам вместо того, чтобы копить
       его под однострочным названием: было 6 px до фото и 18 px до цены, стало
       по 14 и 10. Именно align-content, а НЕ flex/grid: ссылка внутри .cat-zag
       должна остаться строчной, иначе её border-bottom растянется на всю
       ширину карточки, а не под текст. Браузеры без поддержки (до Chrome 123)
       получают прежнюю раскладку — высота от этого не меняется. */
    .catalog-fit .cat-zag {
        font-size: 13px;
        line-height: 1.25;
        min-height: 2.4em;
        align-content: center;
        margin-top: 4px;
        margin-bottom: 4px;
    }

    .catalog-fit .cat-price {
        font-size: 15px;
        margin-top: 0;
        margin-bottom: 0;
    }

    /* Шесть кнопок в карточках заменены одной общей — см. block-assortment.php. */
    .catalog-fit .catwrap div button {
        display: none;
    }

    .catalog-fit .cat-order-all {
        display: block;
        margin: 8px auto 0;
        padding: 10px 18px;
    }
}

/* Благотворительность своим блоком (block-charity.php, 2026-08-17). Верхний
   отступ даёт сам .zoobl (padding-top: 60px), здесь только нижний — как был у
   хвоста .about. */
.charity {
    position: relative;
    padding-bottom: 70px;
}

@media (max-width: 749px) {
    .charity {
        padding-bottom: 30px;
    }
}

/* ── Таблица сравнения на узком экране: строка становится карточкой ───────────
   Замер tests/tools/visual-check.mjs 2026-10-04: при экране 390 px таблица
   занимала 760 px, и ТРЕТЬЯ колонка — та, ради которой её и писали, — целиком
   уходила за край, причём недостижимо: горизонтальной прокрутки у страницы нет,
   контейнер просто обрезал. То же положение, из-за которого прайс в сентябре
   собрал 88,7 % отказов и NOT_MOBILE_FRIENDLY в Вебмастере.

   Поэтому на телефоне колонок нет: заголовок строки становится заголовком
   карточки, а каждое значение подписывается именем своей колонки из data-label
   (его проставляет tools/restyle-compare-table.php). */
@media (max-width: 749px) {
    .lpk-cmp,
    .lpk-cmp tbody,
    .lpk-cmp tbody tr {
        display: block;
    }

    .lpk-cmp thead {
        display: none;
    }

    .lpk-cmp tbody tr {
        padding: 14px 16px;
        border-bottom: 1px solid #e6e6e6;
    }

    .lpk-cmp tbody tr:last-child {
        border-bottom: 0;
    }

    /* width:auto обязателен: у ячейки задана доля (22 %), и в блочном режиме она
       остаётся шириной в пятую часть экрана. Эта грабля уже стоила цикла в
       таблице ассортимента — там правило вдобавок проиграло по специфичности. */
    .lpk-cmp tbody th {
        display: block;
        width: auto;
        padding: 0 0 8px;
        border: 0;
        font-size: 16px;
    }

    .lpk-cmp tbody td {
        display: block;
        padding: 0 0 10px;
        border: 0;
        font-size: 15px;
    }

    .lpk-cmp tbody tr td:last-child {
        padding-bottom: 0;
    }

    /* Подпись колонки над значением: в карточке шапки нет, и без неё «Пилёная:
       ворс, заусенцы» теряет привязку к естественной влажности. */
    .lpk-cmp tbody td::before {
        content: attr(data-label);
        display: block;
        margin-bottom: 2px;
        font-size: 12px;
        letter-spacing: .04em;
        text-transform: uppercase;
        color: #707070;
    }
}