/*============= IMPORTS ===============*/

/*============= ALIGNES ===============*/

.alignwide {
    width: 100%;
}

.alignfull {
    margin-left: calc(-100vw / 2 + 100% / 2);
    margin-right: calc(-100vw / 2 + 100% / 2);
    max-width: 1920px;
}

@media only screen and (min-width: 1920px) {
    .alignfull {
        width: 100vw !important;
        max-width: unset;
    }
}
/* =========== ROOT =========== */

:root {
    /* base-colors */

    --primary: #e1bc76;
    --second: linear-gradient(
        90deg,
        rgb(247, 223, 175) 0%,
        rgba(236, 206, 148, 1) 20%,
        rgba(236, 206, 148, 1) 60%,
        rgba(195, 174, 131, 1) 100%
    );
    --second_bg: linear-gradient(
        90deg,
        rgba(255, 255, 255, 1) 0%,
        rgba(255, 255, 255, 1) 100%
    );

    --hover: #f6f6f6;
    --hovers: #ecce94;

    /* bg-colors */

    --bg: #000000;
    --bg_sec: #101010;
    --bg_th: #1d1d1d;
    --bg_stroke: #232323;

    --bgs: #f6f6f6;
    --bgs_sec: #c8c9cd;
    --bgs_stroke: #eeeeee;

    --bg_half: rgba(255, 255, 255, 0.2);

    /* text-colors */

    --head: #f6f6f6;
    --text: #d3d3d3;
    --text_sec: #ffffff;

    --heads: #000000;
    --texts: #1d1d1d;
    --texts_sec: #525252;

    /* gradients */

    --grad_main: linear-gradient(
        -78.04deg,
        rgba(16, 16, 16, 1) 0%,
        rgba(0, 0, 0, 1) 100%
    );
    --grad_sec: linear-gradient(
        -68.51deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(240, 217, 174, 1) 100%
    );
    --grad_th: linear-gradient(
        180deg,
        rgba(16, 16, 16, 1) 0%,
        rgba(0, 0, 0, 1) 100%
    );

    /* transitions */

    --transition: all 0.3s ease-in;
    --transition02: all 0.2s ease-in;
    --transition04: all 0.45s ease-in;

    /* fonts */

    --font: "Onest", sans-serif; /* main text */
    --font2: "Onest", sans-serif; /* headers*/
    --font_spec: "Jura", sans-serif; /* btn, menu, num*/

    /* font-sizes */

    --fs62: 62px; /* 62 - 27 */
    --fs60: 60px; /* 60 - 27 */
    --fs54: 54px; /* 54 - 27 */
    --fs52: 52px; /* 52 - 27 */
    --fs50: 50px; /* 50 - 27 */
    --fs48: 48px; /* 48 - 26 */
    --fs44: 44px; /* 44 - 26 */
    --fs42: 42px; /* 42 - 26 */
    --fs36: 36px; /* 36 - 25 */
    --fs32: 32px; /* 32 - 24 */
    --fs30: 30px; /* 30 - 22 */
    --fs28: 28px; /* 28 - 22 */
    --fs24: 24px; /* 24 - 20 */
    --fs23: 23px; /* 23 - 20 */
    --fs20: 20px; /* 20 - 18 */
    --fs18: 18px; /* 18 - 16 */
    --fs16: 16px;
    --fs14: 14px;
    --fs12: 12px;

    /* font-weights */

    --regular: 400;
    --medium: 500;
    --semibold: 600;
    --bold: 700;
    --extrabold: 800;

    /* line-height */

    --lh145: 145%;
    --lh140: 140%;
    --lh135: 135%;
    --lh130: 130%;
    --lh120: 120%;
    --lh110: 110%;
    --lh100: 100%;
    --lh90: 90%;

    /* border-radius */

    --br5: 5px;
    --br10: 10px;
    --br15: 15px;
    --br20: 20px;
    --br30: 30px;
    --br100: 100px;
    --brmax: 100%;

    /* px */

    --px200: 200px;
    --px150: 150px;
    --px120: 120px;
    --px100: 100px;
    --px90: 90px;
    --px80: 80px;
    --px70: 70px;
    --px60: 60px;
    --px50: 50px;
    --px45: 45px;
    --px40: 40px;
    --px30: 30px;
    --px25: 25px;
    --px20: 20px;
    --px15: 15px;
    --px10: 10px;
    --px5: 5px;
}

@media (max-width: 700px) {
    :root {
        --fs62: 40px; /* 62 - 27 */
        --fs60: 39px; /* 60 - 27 */
        --fs54: 38px; /* 54 - 27 */
        --fs52: 37px; /* 52 - 27 */
        --fs50: 36px; /* 50 - 27 */
        --fs48: 36px; /* 48 - 26 */
        --fs44: 35px; /* 44 - 26 */
        --fs42: 34px; /* 42 - 26 */
        --fs36: 30px; /* 36 - 25 */
        --fs32: 28px; /* 32 - 24 */
        --fs30: 26px; /* 30 - 22 */
        --fs28: 22px; /* 28 - 22 */
        --fs24: 20px; /* 24 - 20 */
        --fs23: 20px; /* 23 - 20 */
        --fs20: 18px; /* 20 - 18 */
        --fs18: 16px; /* 18 - 16 */

        --px200: 100px;
        --px150: 75px;
        --px120: 60px;
        --px100: 50px;
        --px90: 45px;
        --px80: 40px;
        --px70: 35px;
        --px60: 30px;
        --px50: 25px;
        --px45: 23px;
        --px40: 20px;
        --px30: 20px;
        --px25: 20px;
    }
}

@media (max-width: 480px) {
    :root {
        --fs62: 27px; /* 62 - 27 */
        --fs60: 27px; /* 60 - 27 */
        --fs54: 27px; /* 54 - 27 */
        --fs52: 27px; /* 52 - 27 */
        --fs50: 27px; /* 50 - 27 */
        --fs48: 26px; /* 48 - 26 */
        --fs44: 26px; /* 44 - 26 */
        --fs42: 26px; /* 42 - 26 */
        --fs36: 25px; /* 36 - 25 */
        --fs32: 24px; /* 32 - 24 */
        --fs30: 22px; /* 30 - 22 */

        --px200: 60px;
        --px150: 45px;
        --px120: 40px;
        --px100: 35px;
        --px90: 35px;
        --px80: 30px;
        --px70: 25px;
        --px60: 25px;
        --px50: 20px;
        --px45: 20px;
        --px40: 15px;
        --px30: 15px;
        --px25: 15px;
        --px20: 15px;
        --px15: 10px;
    }
}

/* =========== BASE CONFIG =========== */

html {
    box-sizing: border-box;
    position: relative;
}

* {
    margin: 0;
    padding: 0;
    font-family: var(--font);
    font-weight: var(--regular);
    font-size: var(--fs16);
    line-height: var(--lh135);
    color: var(--text);
    box-sizing: inherit;
}

body {
    background-color: var(--bg);
    max-width: 1920px;
    overflow-x: hidden;
    margin: 0 auto;
    width: auto;
}

main.foned {
    position: relative;
    overflow: hidden;
    z-index: 999;
}
main.foned:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9999;
}

#main,
#primary {
    min-height: 46vh;
}

/* text css */

.fancybox-infobar,
.fancybox-infobar * {
    color: var(--stroke);
}

a,
button,
input,
textarea {
    outline: none !important;
}

a {
    text-decoration: none;
}

a,
a *,
a:hover,
a:hover *,
button,
button *,
button:hover,
button:hover * {
    transition: all 0.3s ease-in;
}

ul li,
ol li {
    list-style-position: inside;
}
ul li::marker {
    /* color: var(--primary); */
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
    color: var(--head);
    font-weight: var(--medium);
    font-family: var(--font2);
}

h1,
.h1,
h2,
.h2,
h3,
.h3 {
    line-height: var(--lh110);
}

h4,
.h4,
h5,
.h5,
h6,
.h6 {
    line-height: var(--lh120);
}

h1,
.h1 {
    font-size: var(--fs54);
}
h2,
.h2 {
    font-size: var(--fs48);
}
h3,
.h3 {
    font-size: var(--fs36);
}
h4,
.h4 {
    font-size: var(--fs28);
}
h5,
.h5 {
    font-size: var(--fs20);
}
h6,
.h6 {
    font-size: var(--fs16);
}

.p1,
.p2,
.p3,
.p4 {
    font-weight: var(--regular);
}
.p1 {
    font-size: var(--fs20);
    line-height: var(--lh130);
}
.p2 {
    font-size: var(--fs16);
    line-height: var(--lh135);
}
.p3 {
    font-size: var(--fs14);
    line-height: var(--lh140);
}
.p4 {
    font-size: var(--fs12);
    line-height: var(--lh100);
}

.button,
.menu_text,
.num,
.btn,
.nav-menu-element a,
.btn_base,
.breadcrumbs *,
.pagination-numbers .page-numbers {
    font-family: var(--font_spec);
    line-height: var(--lh110);
    font-weight: var(--bold);
}
.block_title {
    text-align: center;
}
.button {
    font-size: var(--fs16);
}
.menu_text {
    font-size: var(--fs16);
}
.num {
    font-size: var(--fs60);
}

.breadcrumbs {
    padding: var(--px30) 0;
    color: var(--bg_stroke); /* цвет разделителя */
    display: flex;
    align-items: center;
    gap: var(--px20);
    flex-wrap: wrap;
    row-gap: var(--px15);
}
.breadcrumbs * {
    text-transform: uppercase;
}
.breadcrumbs span {
    color: var(--text); /* цвет текста остальных страниц */
}
.breadcrumbs span.current-item {
    color: var(--primary); /* цвет текста текущей страницы */
}

.error-page .breadcrumbs span:last-child * {
    color: var(--primary); /* цвет текста текущей страницы для 404 */
}

.uppercase {
    text-transform: uppercase;
}

/* btns css*/

.soc {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    height: fit-content;
    outline: none;
    cursor: pointer;
    width: 50px;
    height: 50px;
    min-width: 50px;
    text-align: center;
    border: 1px solid var(--bgs_stroke);
    border-radius: 10px;
    svg {
        width: 20px;
        height: 20px;
        object-fit: contain;
    }
}

.soc:hover {
    background: var(--hover);
    border-color: var(--hover);
    img {
        filter: brightness(100);
    }
    svg path {
        fill: var(--bg);
    }
}

@media (max-width: 550px) {
    .soc {
        width: 40px;
        height: 40px;
        min-width: 40px;
    }
}

.btn_base {
    position: relative;
    display: flex;
    justify-content: space-between;
    gap: 5px;
    align-items: center;
    justify-content: center;
    width: fit-content;
    height: fit-content;
    outline: none;
    text-align: center;
}

.btn {
    position: relative;
    display: flex;
    justify-content: space-between;
    gap: 5px;
    align-items: center;
    justify-content: center;
    width: fit-content;
    height: fit-content;
    outline: none;
    font-size: var(--fs16);
    font-weight: var(--bold);
    border-radius: 10px;
    cursor: pointer;
    padding: 17px 30px;
    text-align: center;
    text-transform: uppercase;
}

.btn,
.btn *,
.btn:hover,
.btn:hover *,
.btn_base,
.btn_base *,
.btn_base:hover,
.btn_base:hover * {
    transition: var(--transition);
}

.btn_pm {
    padding: 17px 20px;
}
.btn_small {
    width: 55px;
    height: 55px;
    font-size: var(--fs16);
    background: var(--bg_sec);
    border-radius: 5px;
    cursor: pointer;
}
.btn_small:hover {
    background: var(--hover);
    svg {
        filter: brightness(100);
    }
}

.btn_primary {
    background: var(--bgs);
    color: var(--heads);
    box-shadow: 0px 0px 20px 0px rgba(236, 206, 148, 0.5);
    position: relative;
    overflow: hidden;
    border: none !important;
    svg path {
        stroke: var(--heads);
    }
}
.btn_primary .button {
    position: relative;
    z-index: 2;
    color: var(--heads);
}
.btn_primary::before {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    background: var(--second);
    transition: var(--transition);
}

.btn_primary:hover::before {
    opacity: 0;
    transition: var(--transition);
}

.btn_primary:hover {
    box-shadow: 0px 0px 0px 0px rgba(236, 206, 148, 0.5);
}

.btn_stroke {
    border: 1px solid var(--primary);
    background: transparent;
    color: var(--head);
    svg path {
        stroke: var(--head);
    }
}

.btn_stroke_2 {
    border: 1px solid var(--head);
    background: transparent;
    color: var(--head);
    svg path {
        stroke: var(--head);
    }
}

.btn_dark {
    border: 1px solid var(--bgs_stroke);
    background: var(--bgs_sec);
    color: var(--bg_th);
    svg path {
        stroke: var(--bg_th);
    }
}
.btn_stroke:hover {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--heads);
    svg path {
        stroke: var(--heads);
    }
}
.btn_stroke_2:hover {
    background: var(--bgs);
    border-color: var(--bgs);
    color: var(--heads);
    svg path {
        stroke: var(--heads);
    }
}

.btn_white:hover {
    background: var(--bgs_stroke);
    border-color: var(--bgs_stroke);
    color: var(--hover);
    svg path {
        stroke: var(--hover);
    }
}

.pagination-numbers {
    display: flex;
    gap: var(--px20);
    align-items: center;
}

.pagination-numbers .page-numbers {
    border-radius: var(--br5);
    cursor: pointer;
    transition: var(--transition);
    width: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--head);
    padding: var(--px5);
}

.pagination-numbers .page-numbers.current {
    color: var(--primary);
}

.pagination-numbers .page-numbers:hover {
    color: var(--primary);
}

.item_img {
    cursor: pointer;
    transition: var(--transition);
    position: relative;
}
.item_img:hover {
    transition: var(--transition);
}
.item_img:before {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    background: rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: var(--transition);
}

.item_img:after {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 2;
    width: 50px;
    height: 50px;
    display: block;
    content: "";
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M0 10C0 4.47715 4.47715 0 10 0H40C45.5228 0 50 4.47715 50 10V40C50 45.5228 45.5228 50 40 50H10C4.47715 50 0 45.5228 0 40V10Z' fill='%23E1BC76'/%3e%3cpath d='M27 19H31M31 19V23M31 19L26.3333 23.6667M23 31H19M19 31V27M19 31L23.6667 26.3334' stroke='white' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e ");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0;
    transition: var(--transition);
}

.item_img:hover:after,
.item_img:hover:before {
    opacity: 1;
    transition: var(--transition);
}

.item_video {
    cursor: pointer;
    transition: var(--transition);
    position: relative;
}
.item_video::before {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 2;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    content: url("data:image/svg+xml;charset=UTF-8,%3csvg width='27' height='30' viewBox='0 0 27 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.62504 4.5131C4.27996 7.9951 4.11197 11.4924 4.12171 14.9914C4.12171 19.6598 4.40504 23.3198 4.62504 25.4731C7.81162 24.0256 10.9238 22.4197 13.95 20.6614C16.9849 18.9202 19.9308 17.0284 22.7767 14.9931C19.9314 12.9556 16.9861 11.0615 13.9517 9.3181C10.9248 7.56202 7.81205 5.95835 4.62504 4.5131ZM1.45004 2.9331C1.49505 2.55467 1.62772 2.19195 1.83751 1.87379C2.0473 1.55563 2.32841 1.2908 2.65851 1.10034C2.98861 0.909888 3.35859 0.799067 3.73903 0.776689C4.11947 0.754311 4.49989 0.820993 4.85004 0.971434C6.62004 1.7281 10.5867 3.52643 15.62 6.43143C20.655 9.3381 24.1967 11.8764 25.735 13.0281C27.0484 14.0131 27.0517 15.9664 25.7367 16.9548C24.2134 18.0998 20.715 20.6048 15.62 23.5481C10.52 26.4914 6.60004 28.2681 4.84671 29.0148C3.33671 29.6598 1.64671 28.6814 1.45004 27.0531C1.22004 25.1498 0.790039 20.8281 0.790039 14.9914C0.790039 9.1581 1.21837 4.8381 1.45004 2.9331Z' fill='black'/%3e%3c/svg%3e");
    background: var(--second);
    backdrop-filter: blur(15px);
    border-radius: 20px;
    width: 100px;
    height: 100px;
    object-fit: contain;
    object-position: center;
    opacity: 0;
    transition: var(--transition);
}
.item_video:after {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 2;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    content: url("data:image/svg+xml;charset=UTF-8,%3csvg width='27' height='30' viewBox='0 0 27 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.62504 4.51334C4.27996 7.99535 4.11197 11.4926 4.12171 14.9917C4.12171 19.66 4.40504 23.32 4.62504 25.4733C7.81162 24.0259 10.9238 22.42 13.95 20.6617C16.9849 18.9205 19.9308 17.0287 22.7767 14.9933C19.9314 12.9558 16.9861 11.0618 13.9517 9.31834C10.9248 7.56226 7.81205 5.95859 4.62504 4.51334ZM1.45004 2.93335C1.49505 2.55491 1.62772 2.1922 1.83751 1.87404C2.0473 1.55587 2.32841 1.29104 2.65851 1.10059C2.98861 0.910132 3.35859 0.799311 3.73903 0.776933C4.11947 0.754555 4.49989 0.821237 4.85004 0.971678C6.62004 1.72834 10.5867 3.52668 15.62 6.43168C20.655 9.33834 24.1967 11.8767 25.735 13.0283C27.0484 14.0133 27.0517 15.9667 25.7367 16.955C24.2134 18.1 20.715 20.605 15.62 23.5483C10.52 26.4917 6.60004 28.2683 4.84671 29.015C3.33671 29.66 1.64671 28.6817 1.45004 27.0533C1.22004 25.15 0.790039 20.8283 0.790039 14.9917C0.790039 9.15834 1.21837 4.83835 1.45004 2.93335Z' fill='url(%23paint0_radial_12003_1060)'/%3e%3cdefs%3e%3cradialGradient id='paint0_radial_12003_1060' cx='0' cy='0' r='1' gradientTransform='matrix(36.2392 36.3121 -33.1058 70.6649 -2.77554 -1.69235)' gradientUnits='userSpaceOnUse'%3e%3cstop stop-color='%23F2E1BF'/%3e%3cstop offset='0.463811' stop-color='%23ECCE94'/%3e%3cstop offset='1' stop-color='%23C3AE83'/%3e%3c/radialGradient%3e%3c/defs%3e%3c/svg%3e ");
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.4) 0%,
        rgba(0, 0, 0, 0.4) 100%
    );
    backdrop-filter: blur(15px);
    border-radius: 20px;
    width: 100px;
    height: 100px;
    object-fit: contain;
    object-position: center;
    opacity: 1;
    transition: var(--transition);
    border: 1px solid var(--bg_stroke);
}

.video__media {
    filter: brightness(0.5);
}
.item_video iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
}
.item_video.video-hiden iframe {
    z-index: 5 !important;
}
.item_video.video-hiden .video__media {
    filter: none;
    z-index: -1;
    display: none;
}
.item_video:hover {
    transition: var(--transition);
}
.item_video:hover::after {
    opacity: 0;
}
.item_video:hover::before {
    opacity: 1;
}

.rew_pag {
    display: flex;
    gap: var(--px30);
    align-items: center;
    justify-content: space-between;
    grid-column: 1/-1;
}
@media (max-width: 700px) {
    .btn {
        width: 100%;
    }
    .swiper .btn {
        width: auto;
    }
    .item_video:after {
        opacity: 1;
    }
}

/* custom classes css*/

.pointer {
    cursor: pointer;
}

.overflow {
    overflow: hidden;
}

.contain_img img,
.contain_img svg {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.cover_img img,
.cover_img svg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.custom_scrollbar::-webkit-scrollbar {
    height: 3px;
    width: 3px;
}
.custom_scrollbar::-webkit-scrollbar-track {
    background-color: var(--bg_stroke);
}
.custom_scrollbar::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 6px var(--primary);
}
.custom_scrollbar {
    overflow: auto;
}
strong {
    font-weight: var(--bold);
}
.custom_table {
    table {
        width: 100%;
        border: 1px solid var(--bg_stroke);
        border-collapse: collapse;
    }
    table th {
        font-weight: bold;
        padding: var(--px10);
        background: var(--bg_sec);
        border: 1px solid var(--bg_stroke);
        text-align: start;
        padding: var(--px15) var(--px20);
    }
    table td {
        border: 1px solid var(--bg_stroke);
        padding: var(--px10);
        background: var(--bg_sec);
        padding: var(--px15) var(--px20);
    }
}

.nowrap_text {
    text-wrap: nowrap !important;
}

.ta_c {
    text-align: center;
}

.ta_s {
    text-align: start;
}

.ta_e {
    text-align: end;
}

.text_gap {
    gap: 15px;
}

.text_gap ul,
.text_gap ol {
    gap: 10px;
}

.text_gap,
.text_gap ul,
.text_gap ol {
    display: flex;
    flex-direction: column;
}

.text_gap_small {
    gap: 10px;
}

.text_gap_small ul,
.text_gap_small ol {
    gap: 10px;
}

.text_gap_small,
.text_gap_small ul,
.text_gap_small ol {
    display: flex;
    flex-direction: column;
}

.text_gap_big {
    gap: 15px;
}

.text_gap_big ul,
.text_gap_big ol {
    gap: 15px;
}

.text_gap_big,
.text_gap_big ul,
.text_gap_big ol {
    display: flex;
    flex-direction: column;
}

.custom_ul ul li,
.custom_ul.ul li {
    list-style: none;
    display: flex;
    gap: 10px;
}

.custom_ul ul li::before,
.custom_ul.ul li::before {
    width: 4px;
    height: 4px;
    min-width: 4px;
    margin-top: 7px;
    border-radius: var(--brmax);
    background: var(--second);
    position: static;
    content: "";
}

.df_c {
    display: flex;
    flex-direction: column;
}

.df_r {
    display: flex;
    flex-direction: row;
}

.df {
    display: flex;
}

.fw {
    flex-wrap: wrap;
}

.w_100 {
    width: 100%;
}
.w_auto {
    width: auto;
}

.w_fc {
    width: fit-content;
}

.h_100 {
    height: 100%;
}
.h_auto {
    height: auto;
}

.h_fc {
    height: fit-content;
}

.jc_sp {
    justify-content: space-between;
}

.jc_c {
    justify-content: center;
}

.jc_s {
    justify-content: start;
}

.jc_e {
    justify-content: end;
}

.ai_s {
    align-items: static;
}
.ai_c {
    align-items: center;
}
.ai_e {
    align-items: end;
}

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

.container {
    max-width: 1530px;
    width: 100%;
    margin: 0 auto;
}

@media (max-width: 1560px) {
    .container {
        padding: 0 15px;
    }
}

.bg_img {
    background-repeat: no-repeat !important;
    background-size: cover !important;
}
.bg_img_c {
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: center !important;
}

.bg_img_contain {
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center !important;
}

@media (max-width: 700px) {
    .text_gap {
        gap: 10px;
    }
    .text_gap ul,
    .text_gap ol {
        gap: 5px;
    }
}

.color_head {
    color: var(--head);
}
.color_heads {
    color: var(--heads);
}
.color_bg {
    color: var(--bg);
}
.color_bg_sec {
    color: var(--bg_sec);
}
.color_bg_th {
    color: var(--bg_th);
}
.color_bg_stroke {
    color: var(--bg_stroke);
}
.color_text {
    color: var(--text);
}
.color_text_sec {
    color: var(--text_sec);
}
.color_texts {
    color: var(--texts);
}
.color_texts_sec {
    color: var(--texts_sec);
}
.color_primary {
    color: var(--primary);
}
.color_secondary {
    color: var(--second);
}
.text_color_second {
    background-image: var(--second);
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}

.color_hover {
    color: var(--hover);
}
.color_hovers {
    color: var(--hovers);
}

.fw_regular {
    font-weight: var(--regular);
}
.fw_medium {
    font-weight: var(--medium);
}
.fw_semibold {
    font-weight: var(--semibold);
}
.fw_bold {
    font-weight: var(--bold);
}

.lh130 {
    line-height: var(--lh130);
}
.lh120 {
    line-height: var(--lh120);
}
.lh110 {
    line-height: var(--lh110);
}
.lh100 {
    line-height: var(--lh100);
}
.lh90 {
    line-height: var(--lh90);
}

.br5 {
    border-radius: 5px;
}
.br10 {
    border-radius: 10px;
}
.br15 {
    border-radius: 15px;
}
.br20 {
    border-radius: 20px;
}
.br25 {
    border-radius: 25px;
}
.br30 {
    border-radius: 30px;
}
.br50 {
    border-radius: 50px;
}
.brmax {
    border-radius: var(--brmax);
}

.bg_primary {
    background: var(--primary);
}
.bg_secondary {
    background: var(--second);
}
.bg_bg {
    background: var(--bg);
}
.bg_half {
    background: var(--bg_half);
}
.bg_white {
    background: var(--bg);
}
.bg_sec {
    background: var(--bg_sec);
}
.bg_th {
    background: var(--bg_th);
}
.bg_head {
    background: var(--head);
}

.standart_padding {
    padding-top: var(--px60);
    padding-bottom: var(--px60);
}

.small_padding {
    padding-top: var(--px40);
    padding-bottom: var(--px40);
}

.big_padding {
    padding-top: var(--px80);
    padding-bottom: var(--px80);
}

.bottom_padding {
    padding-bottom: var(--px60);
}

.big_bottom_padding {
    padding-bottom: var(--px120);
}

.top_padding {
    padding-top: var(--px60);
}

.page-title {
    margin-bottom: var(--px40);
}

.gap_120 {
    gap: var(--px120);
}
.gap_100 {
    gap: var(--px100);
}
.gap_90 {
    gap: var(--px90);
}
.gap_80 {
    gap: var(--px80);
}
.gap_70 {
    gap: var(--px70);
}
.gap_60 {
    gap: var(--px60);
}
.gap_50 {
    gap: var(--px50);
}
.gap_40 {
    gap: var(--px40);
}
.gap_30 {
    gap: var(--px30);
}
.gap_25 {
    gap: var(--px25);
}
.gap_20 {
    gap: var(--px20);
}
.gap_15 {
    gap: var(--px15);
}
.gap_10 {
    gap: 10px;
    gap: var(--px10);
}
.gap_5 {
    gap: var(--px5);
}

.p_60 {
    padding: var(--px60);
}
.p_50 {
    padding: var(--px50);
}
.p_40 {
    padding: var(--px40);
}
.p_30 {
    padding: var(--px30);
}
.p_25 {
    padding: var(--px25);
}
.p_20 {
    padding: var(--px20);
}
.p_15 {
    padding: var(--px15);
}
.p_10 {
    padding: var(--px10);
}
.p_5 {
    padding: var(--px5);
}

/*============ HEADER =================*/

#header {
    position: sticky;
    top: 0;
    width: 100%;
    background: var(--bg);
    min-height: 90px;
    max-width: 1920px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--bg_stroke);
    z-index: 999;
}

#header {
    .phone:hover,
    .email:hover {
        color: var(--primary);
    }
}

.header_left {
    margin-left: auto;
}

.header-menu > .nav-menu-element > a {
    display: flex;
    color: var(--text);
    text-wrap: nowrap;
    padding-top: 5px;
}

.header-menu > .nav-menu-element:hover > a,
.header-menu > .nav-menu-element.active > a {
    color: var(--primary);
}

.header-menu .has-childs {
    position: relative;
}

.header-menu .has-childs a {
    position: relative;
}
.header-menu .nav-menu-element {
    text-transform: uppercase;
}
.header-menu .sub-menu {
    position: absolute;
    display: grid;
    grid-template-columns: 1fr;
    min-width: 230px;
    width: fit-content;
    left: -20px;
    top: 53px;
    z-index: 999;
    background: var(--grad_main);
    display: none;
    border-radius: 0 0 20px 20px;
    border: 1px solid var(--bg_stroke);
}
.header-menu .sub-menu a {
    color: var(--text);
    padding: var(--px20);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--px10);
}
.header-menu .sub-menu > .nav-menu-element > a::after {
    display: flex;
    content: url("../images/arr2.svg");
    width: 16px;
    height: 16px;
    object-fit: contain;
    position: relative;
    object-position: center;
    transition: var(--transition);
}

.header-menu .sub-menu > .nav-menu-element:hover > a::after {
    filter: brightness(0) saturate(100%) invert(66%) sepia(76%) saturate(230%)
        hue-rotate(1deg) brightness(102%) contrast(86%);
    transform: rotate(-180deg);
}
.header-menu .sub-menu > .nav-menu-element:not(:last-child) > a {
    border-bottom: 1px solid var(--bg_stroke);
}
.header-menu .sub-menu a:hover {
    color: var(--primary);
}
.header-menu .sub-menu::before {
    background: var(--primary);
    left: 0;
    top: -38px;
    width: 100%;
    height: 38px;
    content: "";
    display: block;
    position: absolute;
    opacity: 0;
}

.header-menu .has-childs:hover > a::before {
    display: flex;
}

.header-menu .has-childs:hover > a ~ .sub-menu {
    display: grid;
}

.header-menu,
.menuTop {
    a:hover {
        color: var(--primary);
    }
}

#header #mobile-mnu .nav-menu-element.has-childs > a ~ .sub-menu {
    display: none;
}
#header #mobile-mnu .nav-menu-element.has-childs > a.open ~ .sub-menu {
    display: block;
}
#header .has-childs > a {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    justify-content: start;
}
#header .has-childs > a::after {
    display: flex;
    content: url("../images/arr.svg");
    width: 16px;
    height: 16px;
    object-fit: contain;
    position: relative;
    object-position: center;
    transition: var(--transition);
}

#header #mobile-mnu .nav-menu-element.has-childs.open a::after,
#header .nav-menu-element.has-childs:hover > a::after {
    transform: rotate(-180deg);
    filter: brightness(0) saturate(100%) invert(66%) sepia(76%) saturate(230%)
        hue-rotate(1deg) brightness(102%) contrast(86%);
}
.header-menu > .nav-menu-element.active.has-childs > a::after {
    filter: brightness(0) saturate(100%) invert(66%) sepia(76%) saturate(230%)
        hue-rotate(1deg) brightness(102%) contrast(86%);
}

.header_container {
    padding: var(--px20) var(--px40);
}

.logo-holder {
    width: 223px;
    height: 100px;
    min-width: 220px;
    display: block;
}

/*================ MOBILE MNU =============*/
#header .burger.open_menu {
    display: none;
    flex-direction: column;
    background: transparent;
    height: 40px;
    width: 40px;
    justify-content: space-evenly;
    align-items: center;
    border-radius: 2px;
    flex-shrink: 0;
}

#header .burger.open_menu span {
    background: var(--primary);
    width: 30px;
    height: 4px;
    transition: all 0.3s ease-in;
}

#header .burger.open_menu.clicked {
    background: var(--second);
}

#header .burger.open_menu.clicked span {
    background: var(--bg);
}

#header #mobile-mnu {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 320px;
    background-color: var(--bg_sec);
    padding: 30px;
    transition: all 0.3s ease-in;
    transform: translateX(-350px);
    z-index: 9999;
}

#header #mobile-mnu * {
    color: var(--text) !important;
}

#header #mobile-mnu #close-mnu {
    font-size: 20px;
    position: absolute;
    right: 10px;
    top: 10px;
    cursor: pointer;
    display: block;
    color: var(--primary);
}

#header #mobile-mnu .logo__holder {
    text-align: center;
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}
#header #mobile-mnu .logo__holder img,
#header #mobile-mnu .logo__holder svg {
    max-height: 60px;
}
#header #mobile-mnu .menuTop {
    list-style-type: none;
    /* margin-bottom: 10px; */
}
.address * {
    color: var(--bg);
}
#mobile-mnu .btn_shop {
    width: 100%;
    margin-bottom: 15px;
}
#header #mobile-mnu.opened {
    transform: translateX(0);
}

#header #mobile-mnu .logo-holder {
    margin-bottom: 20px;
}
#header #mobile-mnu ul li {
    list-style: none;
}
#header #mobile-mnu ul a {
    padding: 5px 0;
    font-size: var(--fs18);
    display: block;
}

#header #mobile-mnu ul a:hover {
    color: var(--primary);
}
#header #mobile-mnu .header_holder {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 20px;
}

#header #mobile-mnu .soc-holder {
    margin-top: 20px;
}

@media (max-width: 1750px) {
    .header_container {
        gap: var(--px40);
    }
}

@media (max-width: 1580px) {
    .header-menu {
        gap: var(--px20);
    }
}

@media (max-width: 1500px) {
    .header_left .btn {
        display: none;
    }
    .header_left,
    .header_left_container {
        gap: var(--px20);
    }
    .header_container {
        padding: var(--px20);
    }
}
@media (max-width: 1220px) {
    .header_menu {
        display: none;
    }
    #header .burger.open_menu {
        display: flex;
    }
}
@media (max-width: 650px) {
    .header_container .logo-holder {
        width: 150px;
        min-width: auto;
        height: auto;
    }
    .header_left {
        gap: var(--px15);
    }
    #header {
        min-height: auto;
    }
}
@media (max-width: 650px) {
    .header_container .header_left_container {
        flex-direction: column;
        align-items: end;
        gap: 7px;
        .soc {
            width: 25px;
            height: 25px;
            min-width: 25px;
            border: none;
            border-radius: 3px;
            gap: 5px;
            svg {
                width: 18px;
                height: 18px;
                object-fit: contain;
            }
        }
    }
}
@media (max-width: 650px) {
    .header_container .phone {
        font-size: 14px;
    }
}
/*============ FOOTER ===============*/

.footer_container {
    background: var(--grad_th);
    border-radius: 20px;
    padding-top: var(--px120);
    max-width: 1820px;
    margin: 0 auto;
}

.form_footer_container {
    padding-bottom: var(--px60);
}

.footer_bottom {
    padding: var(--px30) 0 var(--px30);
    border-top: 1px solid var(--bg_stroke);
}

.footer_bottom .privacy,
.footer_bottom .copy {
    height: fit-content;
}

.footer_bottom .privacy {
    text-decoration: underline;
}

.footer_bottom {
    display: flex;
    gap: 20px;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.footer_bottom * {
    color: var(--text);
}

.footer_main {
    border-top: 1px solid var(--bg_stroke);
    padding: var(--px60) 0;
}

.footer-menu a {
    text-transform: uppercase;
}

.footer_main {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

@media (max-width: 950px) {
    .footer_main {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media (max-width: 900px) {
    .footer_bottom {
        flex-direction: column;
        gap: 10px;
    }
    .footer_bottom > * {
        width: fit-content;
        margin: 0 auto;
    }
}
@media (max-width: 800px) {
    .form_footer_container {
        flex-direction: column;
    }
}

@media (max-width: 700px) {
    .footer_main {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 480px) {
    .footer_main {
        grid-template-columns: 1fr;
    }
}

/* footer grampus */

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.glogo {
    width: 111px;
    height: 17px;
    mask-image: url("../images/gmask.png");
    mask-origin: border-box;
    mask-size: contain;
    mask-repeat: no-repeat;
    background: var(--second);
    position: relative;
    cursor: pointer;
    display: inline-flex;
    vertical-align: sub;
    overflow: hidden;
    margin-left: 10px;
}

.glogo:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: red;
    transform: translateX(100%);
    transition: transform 0.7s ease-in;
    background: linear-gradient(
            90deg,
            #fe6604 10%,
            #ee0a76 30%,
            #ee0a76 60%,
            #fe6604 101%
        )
        repeat-x 0 0;
    background-size: 100px;
    animation-duration: 5s;
    animation-name: slideUp;
    animation-iteration-count: infinite;
    animation-delay: 3s;
}

.glogo:hover:before {
    /*transform: translateY(-100%);*/
    animation-name: unset;
    transform: translateX(0);
}

@keyframes slideUp {
    0% {
        transform: translateX(-100%);
    }

    50% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(100%);
    }
}

/* ============== MODAL ============= */
.wpcf7 .wpcf7-response-output,
.wpcf7 .wpcf7-not-valid-tip {
    display: none;
}
.wpcf7 .ajax-loader {
    display: none;
}
.wpcf7 .wpcf7-spinner {
    display: none;
}
.modal-message-img {
    width: 163px;
    height: 163px;
    min-width: 163px;
    border-radius: 100%;
    overflow: hidden;
    border: 1px solid var(--bgs);
}
.modal-callback-img {
    width: 80px;
    height: 80px;
    min-width: 80px;
    border-radius: 100%;
    overflow: hidden;
    border: 1px solid var(--bgs);
}
.theme-modal.fancybox__content {
    max-width: 610px;
    width: 100%;
}
.standart_modal {
    max-width: 415px !important;
}
.theme-modal.fancybox__content .form-top {
    flex-direction: column;
}
.theme-modal.fancybox__content button {
    margin-top: 10px;
    width: 100%;
}
.theme-modal.fancybox__content a {
    text-decoration: none !important;
    color: var(--primary) !important;
}
.theme-modal.fancybox__content > .f-button.is-close-btn {
    top: 20px !important;
    right: 20px !important;
    background-color: transparent;
    margin: 0;
    width: fit-content;
}
.theme-modal.fancybox__content > .f-button.is-close-btn svg path {
    stroke: var(--text_primary_head);
    fill: var(--text_primary_head);
    transition: stroke 0.3s ease-in;
}
.theme-modal.fancybox__content > .f-button.is-close-btn:hover svg path {
    stroke: var(--primary);
    fill: var(--primary);
}
.theme-modal .title {
    color: var(--bg);
    /*   text-align: center; */
}
.theme-modal .subtitle {
    /*   color: var(--text_primary_head_sec); */
    margin-top: 10px;
    /*   text-align: center; */
}
.theme-modal.modal-open {
    pointer-events: all;
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}

.theme-modal .form-privacy {
    text-align: center;
}

input[list="services"]::-webkit-calendar-picker-indicator {
    display: none !important;
}
.input-wrapper.list {
    position: relative;
}
.input-wrapper.list svg {
    top: 0;
    bottom: 0;
    right: 20px;
    margin: auto 0;
    position: absolute;
    transition: var(--transition);
}
.input-wrapper.list input {
    padding-right: 56px;
}
.input-wrapper.list:hover svg {
    transform: rotate(-180deg);
    transition: var(--transition);
}
.with-fancybox .theme-modal {
    display: flex;
    z-index: 9999;
    background: var(--bg_th);
    border-radius: var(--br10);
    .f-button {
        height: fit-content;
    }
    .f-button svg {
        width: 16px;
        height: 16px;
        object-fit: contain;
    }
}
#modal-message {
    padding: var(--px25);
}
.with-fancybox .theme-modal .modal__title {
    /*   text-transform: uppercase; */
    /*   margin-bottom: 10px; */
    /*   text-align: center; */
}
.with-fancybox .theme-modal .modal__subtitle {
    /*   text-align: center; */
    /*   margin: 0 auto; */
}

.fancybox__backdrop {
    background: rgba(40, 45, 60, 0.8) !important;
}

[form-send][disabled] {
    opacity: 0.5;
}
.modals__ {
    display: none;
}

.modal__subtitle + .btn {
    width: 100%;
    margin-top: 25px;
}
.modal-hide {
    display: none;
}
.with-fancybox .theme-modal .form-privacy {
    text-align: left;
}

@media (max-width: 480px) {
    .with-fancybox .theme-modal {
        padding: 20px 15px;
    }
    .is-compact .fancybox__content > .f-button.is-close-btn {
        top: 5px;
        right: 5px;
    }
    #modal-message .df_center {
        flex-direction: column;
        align-items: start;
    }
}
/* ============= SWIPER =========== */

.swiper {
    width: 100%;
    overflow: hidden;
}

.swiper-slide {
    height: auto;
}

.slider_btn_wrap {
    display: flex;
    gap: 10px;
}

.slider-btn,
.slider-btn-primary,
.pag-btn,
.pag-btn-primary {
    border-radius: var(--br5);
    height: 50px;
    width: 50px;
    min-width: 50px;
    max-width: 50px;
    cursor: pointer;
    transition: var(--transition);
    width: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--bg);
    border: 1px solid var(--head);
    border-radius: 10px;
}

.slider-btn svg,
.pag-btn svg {
    object-fit: contain;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.slider-btn *,
.slider-btn-primary *,
.pag-btn *,
.pag-btn-primary * {
    transition: var(--transition);
}

.slider-btn:hover,
.pag-btn:hover {
    background: var(--primary);
    border-color: var(--primary);
    svg path {
        stroke: var(--head);
    }
}

.slider-btn-primary:hover,
.pag-btn-primary:hover {
    background: var(--hover);
    border-color: var(--hover);
    svg path {
        stroke: var(--bg);
    }
}

.slider-btn.swiper-button-disabled,
.slider-btn-primary.swiper-button-disabled,
.inactive .pag-btn-primary,
.inactive .pag-btn {
    pointer-events: none;
    background: var(--bg_th);
    border: 1px solid var(--bg_th);
    svg path {
        stroke: var(--texts_sec);
    }
}

.swiper_bottom {
    display: flex;
    gap: 30px;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: var(--px40);
    align-items: center;
}

.swiper_bottom .pag,
.swiper_bottom .pag2 {
    width: fit-content !important;
    display: flex;
    gap: 10px;
}
.swiper_bottom .pag,
.swiper_bottom .pag *,
.swiper_bottom .pag:hover,
.swiper_bottom .pag *:hover {
    transition: var(--transition);
}
.swiper-pagination-bullet {
}
.partner_swiper .swiper-slide {
    display: flex;
}
.partner_card {
    width: 100%;
}
.pag .swiper-pagination-bullet {
    margin: 0 !important;
    width: 20px;
    height: 20px;
    min-width: 20px;
    min-height: 20px;
    opacity: 1;
    min-width: 20px;
    flex-shrink: 0;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background: url("data:image/svg+xml;charset=UTF-8,%3csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3crect x='1.41421' y='10' width='12.1421' height='12.1421' transform='rotate(-45 1.41421 10)' stroke='%23333333' stroke-width='2'/%3e%3crect x='6' y='10' width='5.65685' height='5.65685' transform='rotate(-45 6 10)' fill='%23333333'/%3e%3c/svg%3e ");
}
.pag .swiper-pagination-bullet-active {
    background: url("data:image/svg+xml;charset=UTF-8,%3csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3crect x='1.41421' y='10' width='12.1421' height='12.1421' transform='rotate(-45 1.41421 10)' stroke='%23FF6900' stroke-width='2'/%3e%3crect x='6' y='10' width='5.65685' height='5.65685' transform='rotate(-45 6 10)' fill='%23FF6900'/%3e%3c/svg%3e ");
}

@media (max-width: 480px) {
    .pag .swiper-pagination-bullet {
        width: 12px;
        height: 12px;
        min-width: 12px;
    }
    .swiper_bottom .pag {
        gap: 5px;
    }
}

/* ============= input =========== */

.form input,
.form textarea {
    display: flex;
    width: 100%;
    padding: 14px 20px;
    color: var(--texts);
    cursor: pointer;
    border-radius: 0;
    background: rgba(246, 246, 246, 0.1);
    outline: none;
    resize: none;
    transition: var(--transition);
    border-radius: 10px;
    border: none !important;
}
.form textarea {
    height: 110px;
    resize: vertical;
    transition: none;
    resize: none;
}

/*
 * Поле запроса живёт по rows, а не по фиксированной высоте: четыре
 * строки задаёт разметка. Отступы при фокусе меняются с 14+14 на
 * 20+8 — сумма та же, поэтому поле не прыгает.
 */
.form textarea.form-request {
    height: auto;
}
.form textarea ~ .label {
    flex-wrap: wrap;
}
.form input::placeholder,
.form textarea::placeholder {
    color: var(--texts);
    opacity: 0;
    transition: 0.3s;
}

.form input:focus,
.form textarea:focus,
.input-wrapper > input:not(:placeholder-shown),
.input-wrapper > textarea:not(:placeholder-shown) {
    background: var(--bgs);
    padding: 20px 20px 8px;
    transition: var(--transition);
}
.form input:hover,
.form textarea:hover {
    background: var(--bgs);
    transition: var(--transition);
}
.form input:focus::placeholder,
.form textarea:focus::placeholder {
    opacity: 1;
    color: var(--texts);
}
.form input:hover::placeholder,
.form textarea:hover::placeholder {
    color: var(--texts);
}
.form .input-wrapper {
    position: relative;
    width: 100%;
}
.form .input-wrapper .label {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: 0;
    margin-top: 14px;
    transform: translate(20px, 0);
    color: var(--text);
    pointer-events: none;
    transition: var(--transition);
    height: fit-content;
    width: calc(100% - 20px);
    font-size: 16px;
}
.form .input-wrapper textarea + .label {
    margin: 0;
    margin-top: 22px;
}
.input-wrapper input:focus ~ .label,
.input-wrapper textarea:focus ~ .label,
.input-wrapper > input:not(:placeholder-shown) ~ .label,
.input-wrapper > textarea:not(:placeholder-shown) ~ .label {
    top: 5px;
    font-size: 12px;
    color: var(--texts_sec);
    margin: 0;
    line-height: 140%;
    transition: var(--transition);
}
.form input:hover ~ .label,
.form textarea:hover ~ .label {
    color: var(--texts);
}
.form input:focus,
.form > input:not(:placeholder-shown) {
    outline: none;
}

.form input.error,
.form textarea.error,
.form input.error + .label,
.form textarea.error + .label {
    border-color: #ff0000 !important;
    color: #ff0000 !important;
}
.form input.error::placeholder,
.form textarea.error::placeholder {
    color: #ff0000 !important;
}
.form input.error,
.form textarea.error {
    color: #ff0000 !important;
    border-color: #ff0000 !important;
}
.form .form-privacy {
    color: var(--text_primary_secondary);
}
.form .form-privacy a {
    text-decoration: underline;
}
.form .form-privacy a:hover {
    color: var(--primary);
}

.form-bot {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.form-bot > .btn_base {
    width: 100%;
}

.file_container {
    position: relative;
    cursor: pointer;
}

.file__upload-wrap {
    margin: 10px 0 20px;
}

.file__upload-wrap span {
    color: red;
}

.file_container .label {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    cursor: pointer;
    display: flex;
    gap: 10px;
    color: var(--heads);
    justify-content: space-between;
    align-items: center;
    background: rgba(246, 246, 246, 0.1);
    border-radius: 10px;
    padding: 14px 20px;
}
.file_container:hover .label {
    background: var(--bgs);
    transition: var(--transition);
    p {
        color: var(--heads);
    }
}
.file_container:hover .label svg path {
    fill: var(--heads);
    transition: var(--transition);
}
input[type="file"].focus ~ .label {
    background: var(--bgs);
    transition: var(--transition);
    p {
        color: var(--heads);
    }
}
input[type="file"].focus ~ .label svg path {
    fill: var(--heads);
}

.file_container input:hover + .label,
.file_container input:hover + .label p {
    transition: var(--transition);
}
.file_container input:hover + .label {
    border-color: var(--primary);
}
.file_container input + .label,
.file_container input + .label p {
    transition: var(--transition);
}
.file_container input {
    opacity: 0;
    z-index: 33;
    position: relative;
}
.file_container input,
.file_container input::-webkit-file-upload-button {
    cursor: pointer;
}

@media (max-width: 480px) {
    .form-privacy,
    .form-privacy * {
        font-size: 14px;
    }
}
.input-wrapper:not(:last-child) {
    /*   margin-bottom: 10px; */
}

.privacy_input {
    position: absolute;
    width: 22px !important;
    height: 22px;
    z-index: 2;
    opacity: 0;
}

.form-privacy-container label {
    display: block;
    width: 22px;
    height: 22px;
    min-width: 22px;
    border-radius: 6px;
    border: 1px solid var(--text);
    position: relative;
    cursor: pointer;
}

.form-privacy-container label::before {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 0;
    width: 16px;
    height: 16px;
    display: block;
    content: "";
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M13.3337 4L6.00033 11.3333L2.66699 8' stroke='%23F6F6F6' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e ");
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 0;
}

.privacy_input ~ label {
    transition: var(--transition);
}

.privacy_input:hover ~ label {
    border: 1px solid var(--primary);
    transition: var(--transition);
}

.privacy_input:checked ~ label {
    border: 1px solid var(--primary);
    background: var(--primary);
}

.privacy_input:checked ~ label::before {
    opacity: 1;
}

.privacy_input.error ~ .form-privacy *,
.privacy_input.error ~ .form-privacy {
    color: #ff0000 !important;
}
.privacy_input.error ~ label {
    border-color: #ff0000 !important;
}
.theme-modal .privacy_input.error ~ label {
    border-color: #ff0000 !important;
}

/* form_block */

.form_block_container {
    padding: var(--px120) 0;
    margin: 0 auto;
    max-width: 1820px;
    position: relative;
}

.form_block_container .container {
    position: relative;
    z-index: 3;
}

.form_block_container::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0.5);
}

.form_block_container::after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 2;
    background: linear-gradient(
        0deg,
        rgba(0, 0, 0, 1) 0%,
        rgba(0, 0, 0, 0.6) 53.84615659713745%,
        rgba(0, 0, 0, 0) 100%
    );
}

.form_block_left {
    max-width: 490px;
}

#footer .form_block_left {
    max-width: 550px;
}

.form_block_form {
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(15px);
    max-width: 620px;
    width: 100%;
    height: fit-content;
}

#footer .form_block_form {
    background: var(--bg_sec);
}

@media (max-width: 950px) {
    .form_block_container .container {
        flex-direction: column;
    }
    .form_block_container {
        border-radius: 0;
    }
    .form_block_left,
    .form_block_form {
        max-width: none;
    }

    .form_block_form {
        background: rgb(53 53 53 / 40%);
    }
}

/* services */

.services_cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.services_card {
    background: var(--bg_sec);
    border-radius: 20px;
    display: flex;
    min-height: 320px;
    overflow: hidden;
}

.services_card_img {
    max-width: 350px;
    width: 100%;
}

.services_card_img {
    position: relative;
    height: auto;
}

.services_card_img img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.services_card_content {
    width: 100%;
    height: auto;
}
.services_card_price {
    background-image: var(--second);
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}
.services_card_img::before {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    background: linear-gradient(
        90deg,
        rgba(16, 16, 16, 1) 0%,
        rgba(16, 16, 16, 0.6) 52.88461446762085%,
        rgba(16, 16, 16, 0) 100%
    );
}

.services_card:nth-child(4n + 3) {
    flex-direction: row-reverse;
}

.services_card:nth-child(4n + 3) .services_card_img::before {
    background: linear-gradient(
        90deg,
        rgba(16, 16, 16, 0) 0%,
        rgba(16, 16, 16, 0.6) 52.88461446762085%,
        rgba(16, 16, 16, 1) 100%
    );
}

.services_card:nth-child(4n + 4) {
    flex-direction: row-reverse;
}

.services_card:nth-child(4n + 4) .services_card_img::before {
    background: linear-gradient(
        90deg,
        rgba(16, 16, 16, 0) 0%,
        rgba(16, 16, 16, 0.6) 52.88461446762085%,
        rgba(16, 16, 16, 1) 100%
    );
    margin-right: -1px;
}
.services_card:hover .services_card_img img {
    transform: scale(1.2);
}

@media (max-width: 1300px) {
    .services_cards {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .services_card {
        flex-direction: column !important;
    }
    .services_card_img {
        height: 200px;
        max-width: none;
    }
    .services_card_img::before {
        opacity: 0;
    }
}

/* single services */

.services_mainbanner {
    max-width: 1820px;
    margin: 0 auto;
}

.services_mainbanner_top {
    padding: var(--px100) 0;
    position: relative;
}

.services_mainbanner_top::before {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    background: linear-gradient(
        0deg,
        rgba(0, 0, 0, 1) 0%,
        rgba(0, 0, 0, 0.6) 53.84615659713745%,
        rgba(0, 0, 0, 0) 100%
    );
}

.services_mainbanner_top::after {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    background: rgba(0, 0, 0, 0.5);
}

.services_mainbanner_top .container {
    position: relative;
    z-index: 3;
}

.services_mainbanner_top_info {
    min-height: 300px;
    max-width: 750px;
}

.services_mainbanner_top_info p {
    max-width: 490px;
}

.services_mainbanner_advs {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.services_mainbanner_adv {
    background: url(../images/adv_bg.svg);
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: top left !important;
}

.services_mainbanner_adv_icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
}

.services_mainbanner_adv_title {
    font-size: 20px;
}

@media (max-width: 1280px) {
    .services_mainbanner_advs {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .services_mainbanner {
        padding: 10px;
    }
}
@media (max-width: 950px) {
    .services_mainbanner_advs {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 700px) {
    .services_mainbanner_advs {
        grid-template-columns: 1fr;
    }
    .services_mainbanner_top_price {
        flex-direction: column-reverse;
        align-items: start;
    }
    .services_mainbanner_top_info {
        min-height: 450px;
        padding-left: 15px;
        padding-right: 15px;
    }
}
@media (max-width: 414px) {
    .services_mainbanner_adv_title {
        font-size: var(--fs20);
    }
    .services_mainbanner_top {
        border-radius: 0;
    }
    .services_mainbanner_top_info {
        min-height: 300px;
        padding-left: 0;
        padding-right: 0;
    }
    .services_mainbanner {
        padding: 0;
    }
}

/* prices */

.prices_content th:first-child {
    width: 25%;
}
.prices_content th:last-child {
    width: 17%;
}
.prices_content th:nth-child(2) {
    width: 17%;
}
.prices_content th {
    text-align: start;
    background: var(--bg_th);
}

.prices_content table {
    border-collapse: collapse;
    border-radius: 10px;
    overflow: hidden;
    width: 100%;
}

.prices_content {
    border: 1px solid var(--bg_stroke);
    border-radius: 10px;
    background: var(--bg_sec);
    overflow: auto;
}

.prices_content th,
.prices_content td {
    padding: var(--px15) var(--px20);
    border: 1px solid var(--bg_stroke);
}

.prices_content tbody tr {
    background: var(--bg_sec);
}

.prices_contentainer {
    padding-bottom: var(--px20);
}

@media (max-width: 800px) {
    .prices_content th:first-child,
    .prices_content th:last-child {
        width: auto;
    }
    .prices_content th:nth-child(2) {
        width: auto;
    }
    .prices_content th,
    .prices_content td {
        padding: 10px;
    }
}
@media (max-width: 650px) {
    .prices_content th,
    .prices_content td,
    .prices_content .td_head {
        font-size: 12px;
    }
    .prices_content th,
    .prices_content td {
        padding: 5px;
    }
}
@media (max-width: 480px) {
    .prices_content th,
    .prices_content td,
    .prices_content .td_head {
        font-size: 11px;
    }
}
@media (max-width: 450px) {
    .prices_content {
        min-width: 405px;
        overflow: hidden;
    }
}

/* docs */

.doc_card_img {
    height: 390px;
    width: 100%;
}

.archive_docs {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: var(--px30);
}

@media (max-width: 1500px) {
    .archive_docs {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 1100px) {
    .archive_docs {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 800px) {
    .archive_docs {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 575px) {
    .archive_docs {
        grid-template-columns: repeat(1, 1fr);
    }
}

/* reviews */

.review-card__video {
    max-width: 750px;
    position: relative;
    height: auto;
}
.review-card__video .video {
    position: relative;
    width: 100%;
    border-radius: 10px;
    overflow: hidden;
    min-height: 480px;
    height: 100%;
}
.review-card__video .video__media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    object-fit: cover;
}
.review-card__video-info {
    position: absolute;
    bottom: 20px;
    left: 20px;
    width: calc(100% - 40px);
    z-index: 1;
}
.review-card__video-title {
    color: var(--background);
}
.reviews-two-block .review-card__video-title:not(:last-child) {
    margin-bottom: 5px;
}
.review-card__video-date {
    color: var(--main-text-secondary);
}
.review-card__image {
    max-width: 360px;
    position: relative;
    border: 1px solid var(--stroke);
    border-radius: 10px;
    overflow: hidden;
    cursor: zoom-in;
    min-height: 480px;
    height: auto;
}
.review-card__image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.review-card__default {
    display: flex;
    max-width: 360px;
    min-height: 480px;
    height: auto;
    border-radius: 20px;
    overflow: hidden;
}
.review-card__default-gallery-wrap {
    width: 48%;
    position: relative;
    height: fit-content;
}
.review-card__default-gallery-wrap .gallery-main .swiper-slide {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    cursor: pointer;
    min-height: 480px;
}
.review-card__default-gallery-wrap .gallery-main .swiper-slide img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.review-card__default-gallery-wrap .gallery-thumbnail {
    position: absolute;
    left: 26px;
    bottom: 33px;
    width: calc(100% - 52px);
}
.review-card__default-gallery-wrap .gallery-thumbnail .swiper-slide {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    cursor: pointer;
}
.review-card__default-gallery-wrap .gallery-thumbnail .swiper-slide:after {
    content: "";
    display: block;
    padding-bottom: 100%;
}
.review-card__default-gallery-wrap .gallery-thumbnail .swiper-slide img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.review-card__default-info {
    padding: var(--px30);
    display: flex;
    flex-direction: column;
    gap: var(--px30);
    background: var(--bg_sec);
}
.review-card__default-text-short + .review-card__default-text-full {
    display: none;
}
.review-card__default-text-wrap.open .review-card__default-text-short {
    display: none;
}
.review-card__default-text-wrap.open .review-card__default-text-full {
    display: block;
}
.review-card__default-text-wrap:not(:last-child) {
    margin-bottom: 10px;
}
.review-card__default-load-more {
    margin-top: var(--px30);
    cursor: pointer;
    width: fit-content;
    color: var(--primary);
    transition: all 0.3s ease-in;
}
.review-card__default-thumb {
    width: 80px;
    min-width: 80px;
    height: 80px;
}

.archive_reviews {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.archive_reviews > * {
    max-width: none !important;
}
.archive_reviews .review-card__video {
    grid-column: span 2;
}
.archive_reviews_container {
    display: grid;
    grid-template-columns: 1fr 3fr;
}

.archive_reviews_form {
    background: url(../images/adv_bg.svg);
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: top left !important;
    position: sticky;
    top: 110px;
}

@media (max-width: 1400px) {
    .archive_reviews {
        grid-template-columns: 1fr 1fr;
    }
    .archive_reviews .review-card__video {
        grid-column: span 1;
    }
}
@media (max-width: 1180px) {
    .archive_reviews {
        grid-template-columns: 1fr;
    }
    .archive_reviews > * {
        min-height: auto;
        height: 100%;
    }
    .archive_reviews_container {
        grid-template-columns: 1fr 2fr;
    }
}
@media (max-width: 900px) {
    .archive_reviews_container {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 992px) {
    .review-card__default-load-more:hover {
        color: var(--hovers);
    }
}
.reviews-two-block__slider-nav {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}
.reviews-two-block__slider-btn-wrap {
    display: flex;
    gap: 10px;
}
@media (max-width: 767px) {
    .review-card__default-top:not(:last-child) {
        margin-bottom: 10px;
    }
    .review-card__default-info {
        padding: 15px;
    }
}
@media (max-width: 575px) {
    .review-card__image {
        max-width: none;
    }
    .review-card__video {
        max-width: none;
    }
    .review-card__default {
        flex-direction: column;
        max-width: none;
    }
    .review-card__default-gallery-wrap {
        width: 100%;
    }
    .review-card__default-gallery-wrap .gallery-main .swiper-slide {
        min-height: 350px;
    }
    .reviews-two-block__slider-nav {
        flex-direction: column;
    }
    .reviews-two-block__slider-nav .btn {
        width: 100%;
    }

    .review-card__default-info,
    .review-card__default {
        min-height: 320px;
    }
    .review-card__image,
    .review-card__video .video {
        min-height: 400px;
    }
}

/* works  */

.works-two-block {
    overflow: hidden;
}
.works-two-block .works {
    overflow: visible;
}
.works-two-block .works .swiper-wrapper {
    align-items: stretch;
}
.works_section .work {
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    overflow: hidden;
}
.works_section .work.swiper-slide {
    opacity: 0.5;
}
.works_section .work.swiper-slide-active {
    opacity: 1;
}
.works_section .work .side {
    width: 50%;
    display: flex;
    flex-direction: column;
    height: auto;
}
.works_section .work .left-side {
    position: relative;
    height: auto;
}
.works_section .work .right-side {
    padding: 40px;
}
.works_section .work__image {
    width: 100%;
    object-fit: cover;
    height: 100%;
    border-radius: 10px;
}
.works_section .work__attributes {
    position: absolute;
    left: 10px;
    bottom: 10px;
    max-width: calc(100% - 20px);
    width: fit-content;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    background: var(--head-secondary);
    border-radius: 5px;
    gap: 15px;
    padding: 10px 20px;
    flex-wrap: wrap;
}
.works_section .work .attribute {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
}
.works_section .work .attribute__icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
}
.works_section .work .attribute__value {
    font-weight: 400;
    font-size: 14px;
    line-height: 130%;
    letter-spacing: 0.03em;
    color: var(--main-text-primary);
}
.works_section .work__desc {
    margin-bottom: 30px;
}
.works_section .work__desc strong {
    font-weight: 800;
}
.works_section .work__price {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}
.works_section .block-bot {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
    flex-wrap: wrap;
}
.works_section .nav-holder {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: fit-content;
    gap: 5px;
}

.works_text .work__text-hidden {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    line-clamp: 6;
    -webkit-box-orient: vertical;
}

.work__text * {
    padding: 7.5px 0;
}

.works_text.unset .work__text {
    overflow: unset;
    display: unset;
    -webkit-line-clamp: unset;
    line-clamp: unset;
    -webkit-box-orient: unset;
}

.works_gallery {
    height: 100%;
    position: relative;
}

.works_gallery video,
.works_gallery iframe {
    width: 100%;
    height: calc(100% - 20px);
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}

.works_gallery_video {
    background: var(--bg);
}

.works_gallery .swiper-slide {
    height: 100%;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    img {
        position: absolute;
        top: 0;
        left: 0;
    }
}

.works_gallery .swiper-slide::before {
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 10;
    width: 100%;
    height: 35%;
    display: block;
    content: "";
    background: linear-gradient(
        180deg,
        rgba(16, 16, 16, 0) 0%,
        rgba(16, 16, 16, 1) 100%
    );
}

.works_gallery .swiper-slide.works_gallery_video::before {
    display: none;
}

.works_gallery_pag {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    padding: var(--px20);
    display: flex;
    gap: var(--px10);
    z-index: 2;
    padding-bottom: 10px;
    .swiper-pagination-bullet {
        width: 100%;
        height: 2px;
        background: var(--bgs);
        opacity: 1;
        border-radius: 20px;
        margin: 0 !important;
    }
    .swiper-pagination-bullet.active {
        background: var(--second);
    }
}

.work__text_bottom {
    row-gap: var(--px15);
}

.work__read-more {
    color: var(--hovers);
    cursor: pointer;
    margin-top: var(--px15);
}

.work__read-more:hover {
    color: var(--hover);
    svg path {
        stroke: var(--hover);
    }
}

@media (max-width: 1050px) {
    .works_section .work {
        flex-direction: column;
    }
    .works_section .work .side {
        width: 100%;
    }
    .works_section .work__image {
        height: auto;
    }

    .works_section .work .left-side,
    .works_gallery a {
        min-height: 300px;
    }
}
@media (max-width: 700px) {
    .works_section .work .right-side {
        padding: var(--px10);
    }
    .work__text_bottom {
        flex-direction: column-reverse;
        align-items: start;
        margin-top: 10px;
    }
    .work__text_bottom .btn {
        width: 100%;
    }
}
@media (max-width: 400px) {
    .works_section .work .right-side {
        padding: 0;
    }
}

/*# sourceMappingURL=block.css.map */

/* error page */

.error-page_text * {
    text-align: center;
}

.error-page_text p {
    max-width: 620px;
}

.error-page_content {
    padding-top: 460px;
    background-repeat: no-repeat !important;
    background-size: 100% cover !important;
    background-position: top center !important;
}

@media (max-width: 600px) {
    .error-page_content {
        padding-top: 260px;
    }
}

/* ============= MEDIA QUERIES =========== */

.page-id-15 .page-title {
    text-align: center;
}

.hide {
    display: none !important;
}

.fancybox-infobar,
.fancybox-infobar * {
    color: var(--bg);
    svg path {
        stroke: var(--bg);
    }
}

.site_menu li {
    list-style: none;
}
.grampus-cookie-notice {
    border-top: 1px solid var(--bg_stroke);
}

/*# sourceMappingURL=main.css.map */

.catalog-card {
    background: var(--text-head-secondary);
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.catalog-card__slider {
    position: relative;
    height: 280px;
}

.catalog-card__slider img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.catalog-card__slide--desktop {
    display: block;
}

.catalog-card__slide--mobile {
    display: none;
}

.catalog-card__nav {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
}

.catalog-card__nav {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
}

.catalog-card__nav-prev,
.catalog-card__nav-next {
    width: 36px;
    height: 36px;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 14px;
    cursor: pointer;
}

.catalog-card__nav-prev::after,
.catalog-card__nav-next::after {
    content: "";
    width: 8px;
    height: 8px;
    border: solid white;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 2px;
}

.catalog-card__nav-prev::after {
    transform: rotate(135deg);
    margin-right: -2px;
}

.catalog-card__nav-next::after {
    transform: rotate(-45deg);
    margin-left: -2px;
}

.catalog-card__content {
    padding: 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.catalog-card__title {
    margin-bottom: 15px;
}

.catalog-card__description {
    flex: 1;
}

.catalog-card__description_container {
    margin-bottom: 15px;
}

.catalog-card__chars {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 15px;
    margin-bottom: 20px;
    font-size: 14px;
}

.catalog-card__char-key {
    color: var(--main-text-secondary);
}

.catalog-card__char-value {
    font-weight: 600;
}

.catalog-card__buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.catalog-card__btn {
    width: 100%;
}

.catalog-card__description.text-hidden {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  -webkit-box-orient: vertical;
}
.catalog-card__description.unset{
  overflow: unset;
  display: unset;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  -webkit-box-orient: unset;
}

.catalog-card__default-load-more {
    cursor: pointer;
    color: var(--primary);
    svg path {
        stroke: var(--primary);
    }
}

.catalog-card__default-load-more:hover {
    color: var(--text);
    svg path {
        stroke: var(--head);
    }
}


@media (max-width: 768px) {
    .catalog-card__slide--desktop {
        display: none;
    }
    .catalog-card__slide--mobile {
        display: block;
    }
    .catalog-card__slider {
        height: 220px;
    }
}

.mainbanner_container {
    background-image: var(--desktop-bg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

@media (max-width: 550px) {
    .mainbanner_container {
        background-image: var(--mobile-bg, var(--desktop-bg));
    }
}
