/*!
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;
}

/* Форма */
.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;
}