*,
*::before,
*::after {
    box-sizing: border-box;
}

ul,
ol {
    padding: 0;
    list-style-type: none;
}

body,
h1,
h2,
h3,
h4,
p,
ul[class],
ol[class],
li,
figure,
figcaption,
blockquote,
dl,
dd {
    margin: 0;
}

:root {
    --white-color: #FFFFFF;
    --text-color: #515151;
    --bg-color: #EDEDED;

}

a {
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    outline: none;
    transition: .3s;
}

a:hover {
    text-decoration: none;
}

p a {
    text-decoration: underline;
    color: inherit;
}

ul[class], ol[class] {
    padding: 0;
    list-style-type: none;
}

img {
    pointer-events: none;
}

* {
    padding: 0px;
    margin: 0px;
    border: 0px;
    -webkit-box-sizing: border-box;
}

/*
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background: transparent;
}
  
::-webkit-scrollbar-track {
    background: #A3BFCE;
    border-radius: 10px;
}
  
::-webkit-scrollbar-thumb {
    background-color: var(--text-color);
    border-radius: 10px;
    border: 3px solid #050c26;
}
*/

@font-face {
    font-family: "Museo"; 
    src: url("../fonts/MuseoSansCyrl700.ttf") format("truetype"); 
    font-style: normal; 
    font-weight: 400; 
}

html {
    position: sticky;
    margin: 0;
    /*
    scroll-behavior: smooth;
    */
    overflow-x: hidden;
}

html.no-scroll {
    position: fixed;
    overflow-y: scroll;
    width: 100%;
}

body {
    font-family: "Museo";
    background: var(--bg-color);
    color: var(--text-color);
    font-size: 18px;
    line-height: 1.2;
    font-weight: 400;
    position: relative;
    overflow-x: hidden;
}

section {
    position: relative;
    padding: 60px 0;
}

.container {
    position: relative;
    width: 100%;
    max-width: 1200px;
    padding: 0 20px;
    margin: 0 auto;
}

.row {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}

h1 {
    font-family: "Geologica", sans-serif;
    font-weight: 600;
    font-size: 48px;
    line-height: 110.00000000000001%;
    letter-spacing: 0%;
    color: var(--white-color);
    text-shadow: 0px 4px 25px rgba(0, 0, 0, .25);
}

h2 {
    font-family: "Geologica", sans-serif;
    font-weight: 400;
    font-size: 35px;
    line-height: 1.2;
    letter-spacing: 0%;
    color: var(--text-dark);
    text-align: center;
    margin: 0 ;
}

.section-title {
    margin: 0 0 40px;
}

.section-title h2 {
    margin: 0 0 10px;
}

.section-title p {
    font-family: "Geologica", sans-serif;
    text-align: center;
    font-size: 20px;
}

.btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Geologica", sans-serif;
    height: 65px;
    width: 100%;
    background: var(--text-color);  
    font-size: 20px;
    font-weight: 400;
    line-height: 1;
    color: var(--white-color);
    transition: .3s;
    cursor: pointer;
    outline: none;
    overflow: hidden;
}

.btn:hover {
    opacity: .8;
}

/*====== header ======*/

header {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    background-color: #EDEDED;
    padding: 40px 0 26px;
    transition: .3s;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
    z-index: 100;
}

.header .row {
    align-items: center;
    gap: 0;
}

header.header-desktop .menu {
    max-width: 230px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 18px 30px;
    margin: 0 auto;
}

header.header-desktop .menu a {
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    color: var(--text-color);
}

header.header-desktop .btn {
    max-width: 200px;
}

header.header-desktop .location {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 34px;
}

header.header-desktop .location span {
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    color: var(--text-color);
    text-decoration: underline;
}

/*
header.scroll {
    background-color: #FFFFFF;
    box-shadow: 0px 4px 20px 0px rgba(54, 96, 142, 0.06);
}
    */

header.header-mobile {
    padding: 30px 0;
}

header.header-mobile .row {
    align-items: center;
}

header.header-mobile .custom-logo-link, header.header-mobile .custom-logo-link img {
    width: auto;
    height: 40px;
}

header.header-mobile .buttons {
    display: flex;
    margin: 0 0 0 auto;
}

header.header-mobile .buttons a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: var(--text-color);
}

header.header-mobile .buttons a svg {
    width: 25px;
    height: 25px;
}

header.header-mobile .buttons .mobile-close {
    display: none;
}

header.header-mobile .buttons.open .mobile-close {
    display: flex;
}

header.header-mobile .buttons.open .btn, header.header-mobile .buttons.open .mobile-phone, header.header-mobile .buttons.open .mobile-burger {
    display: none;
}

header.header-mobile .buttons a svg.phone-icon {
    width: 25px;
    height: 25px;
}

header.header-mobile .buttons a.btn {
    width: 140px;
    height: 40px;
    font-size: 14px;
}

.mobile-menu {
    position: fixed;
    left: 0;
    top: 100px;
    width: 100%;
    background-color: #EDEDED;
    transition: .3s;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
    padding: 0 0 40px;
    transform: translateX(-1000%);
    z-index: 100;
}

.mobile-menu.open {
    transform: translateX(0);
}

.mobile-menu .location {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 20px 0;
    border-bottom: 1px solid #D9D9D9;
}

.mobile-menu .location svg {
    width: 25px;
    height: 25px;
}

.mobile-menu .location span {
    font-size: 14px;
}

.mobile-menu .btn {
    width: 140px;
    height: 40px;
    font-size: 14px;
    margin: 40px auto;
}

.mobile-menu .menu {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 40px;
}

.mobile-menu .menu a {
    font-size: 14px;
    color: var(--text-color);
}

.mobile-menu .socials {
    justify-content: center;
    margin: 40px auto 0;
}

.mobile-menu .socials a {
    width: 40px;
    height: 40px;
}

.mobile-menu .socials a svg {
    width: 25px;
    height: 25px;
}

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

.contact-grid {
    display: grid;
    grid-template-areas: 
        "icon title"
        "icon text";
    gap: 5px 10px;
    grid-template-columns: 35px 1fr;
    align-items: center;
}

.contact-grid svg {
    grid-area: icon;
}

.contact-grid .contact-grid__title {
    grid-area: title;
    opacity: .5;
}

.socials a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 65px;
    height: 65px;
    background-color: var(--text-color);
}

/*====== primary ======*/

.primary {
    margin: 144px 0 0;
    padding: 30px 0 410px;
    background-size: cover;
    background-position: center;
}

.primary .row {
    position: relative;
}

.primary .primary-item {
    position: absolute;
    background: var(--white-color);
    padding: 30px 35px;
    border-radius: 30px;
}

.primary .primary-item ul {
    list-style-type: disc;
    padding: 0 0 0 20px;
}

.primary .primary-item .item-title {
    font-family: "Geologica", sans-serif;
    font-size: 24px;
    margin: 0 0 20px;
}

.primary .primary-item .item-text {
    font-size: 22px;
}

.primary .primary-item.primary-item-1 {
    width: 475px;
    top: 160px;
    left: 0;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
}

.primary .primary-item.primary-item-2 {
    width: 260px;
    top: 75px;
    right: 250px;
    clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 86%);
    border-radius: 90px 30px 30px 90px / 30px 30px 30px 30px;
    padding: 30px 10px 30px 20px;
    transform: skew(0, -2deg);
}

.primary .primary-item.primary-item-3 {
    width: 345px;
    top: 217px;
    right: 60px;
    clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 86%);
    border-radius: 90px 30px 30px 90px / 30px 30px 30px 30px;
    padding: 30px 10px 30px 20px;
    transform: skew(0, -2deg);
}

.primary .primary-item.primary-item-4 {
    width: 350px;
    top: 345px;
    right: 121px;
    clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 86%);
    border-radius: 90px 30px 30px 90px / 30px 30px 30px 30px;
    padding: 30px 10px 30px 20px;
    transform: skew(0, -2deg);
}

.primary .primary-item.primary-item-2 .item-title, .primary .primary-item.primary-item-3 .item-title, .primary .primary-item.primary-item-4 .item-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 20px;
    margin: 0 0 10px;
    /*
    transform: skew(0, -2deg);
    */
}

.primary .primary-item.primary-item-3 .item-title {
    transform: skew(0, 1deg);
}

.primary .primary-item.primary-item-3 .item-text {
    transform: skew(0, 3deg);
}

.primary .primary-item.primary-item-2 .item-title img, .primary .primary-item.primary-item-3 .item-title img, .primary .primary-item.primary-item-4 .item-title img {
    width: 14px;
}

.primary .primary-item.primary-item-2 .item-text, .primary .primary-item.primary-item-3 .item-text, .primary .primary-item.primary-item-4 .item-text {
    font-size: 14px;
    /*
    transform: skew(0, 1deg);
    */
}

/*====== section-button ======*/

.section-button {
    padding: 25px 0 60px;
}

/*====== why ======*/

.why {
    background-color: #E0E0E0;
}

.why .row {
    gap: 25px;
}

.why .small-tem {
    width: 66px;
    background-color: #C9C9C9;
}

.why .small-tem:first-child {
    border-radius: 15px 0 0 0;
}

.why .small-tem:last-child {
    border-radius: 0 0 15px 0;
}

.why .why-single {
    width: calc((100% - 141px) / 3);
    border-radius: 0 0 20px 20px;
    text-align: center;
    padding: 30px;
}

.why .why-single.why-single__3, .why .why-single.why-single__4 {
    border-radius: 0 20px 0 20px;
}

.why .why-single.why-single__5, .why .why-single.why-single__6 {
    border-radius: 20px 20px 0 0;
}

.why .why-single img {
    margin: 0 0 20px;
}

.why .why-single p {
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    color: var(--white-color);
}

.why .why-single p span {
    font-size: 18px;
}

.why-single__1, .why-single__3, .why-single__5 {
    background: linear-gradient(119.82deg, #6C6C6C -4.53%, #8F8F8F 34.97%, #8F8F8F 64.41%, #6C6C6C 112.64%);
}

.why-single__2, .why-single__4, .why-single__6 {
    background: var(--text-color);
}

/*====== use ======*/

.use {
    padding: 60px 0 30px;
}

.use .use-content {
    position: relative;
    width: 100%;
    height: 600px;
    padding: 40px 0;
}

.use .use-content .use-bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 2;
}

.use .use-content h2 {
    display: none;
    position: relative;
    font-size: 24px;
    margin: 0 auto 40px;
    text-shadow: 0px 4px 25px rgba(0, 0, 0, .25);
    color: var(--white-color);
    z-index: 3;
}

.use .use-content .use-single {
    position: absolute;
    max-width: 345px;
    background-color: transparent;
    padding: 30px;
    border-radius: 20px;
    transition: .5s;
    z-index: 3;
}

.use .use-content .use-single.show {
    background-color: var(--white-color);
}

.use .use-content .use-single::before {
    content: ''; 
    position: absolute;
    left: 148px;
    bottom: -46px;
    border: 26px solid transparent;
    border-top: 20px solid var(--white-color);
    opacity: 0;
    transition: .5;
    z-index: 3;
}

.use .use-content .use-single.show::before {
    opacity: 1;
}

.use .use-content .use-single .circle {
    display: block;
    content: ''; 
    position: absolute;
    width: 20px;
    height: 20px;
    background-color: var(--white-color);
    border-radius: 50%;
    left: calc(50% - 10px);
    bottom: -56px;
    z-index: 3;
}
/*
.use .use-content .use-single::after {
    display: block;
    content: ''; 
    position: absolute;
    width: 20px;
    height: 20px;
    background-color: var(--white-color);
    border-radius: 50%;
    left: calc(50% - 10px);
    bottom: -56px;
    z-index: 3;
}
*/
.use .use-content .use-single p {
    line-height: 1.2;
    opacity: 0;
    transition: .5s;
}

.use .use-content .use-single.show p {
    opacity: 1;
}

.use .use-content .use-single.use-single__1 {
    top: 92px;
    left: 24px;
}

.use .use-content .use-single.use-single__2 {
    top: 332px;
    left: 88px;
}

.use .use-content .use-single.use-single__3 {
    top: 90px;
    right: 34px;
}

.use .use-content .use-single.use-single__4 {
    top: 116px;
    left: calc(50% - 180px);
}

.use .use-content .use-single.use-single__5 {
    top: 334px;
    right: 112px;
}

/*====== tinting ======*/

.tinting {
    padding: 30px 0 60px;
}

.tinting .row {
    justify-content: center;
    gap: 0;
}

.tinting-desktop .tinting-single {
    position: relative;
    aspect-ratio: 1.1 / 1;
    width: calc(100% / 3);
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
    overflow: hidden;
}

.tinting-desktop .tinting-single.tinting-single__small {
    max-width: 350px;
    aspect-ratio: 1 / 1;
}

.tinting-desktop .tinting-single:nth-child(1) {
    border-top: 6px solid var(--text-color);
    border-bottom: 6px solid var(--text-color);
    border-left: 6px solid var(--text-color);
}

.tinting-desktop .tinting-single:nth-child(2) {
    border: 6px solid var(--text-color);
}

.tinting-desktop .tinting-single:nth-child(3) {
    border-top: 6px solid var(--text-color);
    border-bottom: 6px solid var(--text-color);
    border-right: 6px solid var(--text-color);
}

.tinting-desktop .tinting-single:nth-child(4) {
    border-bottom: 6px solid var(--text-color);
    border-left: 6px solid var(--text-color);
}

.tinting-desktop .tinting-single:nth-child(5) {
    border-left: 6px solid var(--text-color);
    border-bottom: 6px solid var(--text-color);
    border-right: 6px solid var(--text-color);
}

.tinting-desktop .tinting-single:nth-child(6) {
    border-bottom: 6px solid var(--text-color);
    border-right: 6px solid var(--text-color);
}

.tinting-desktop .tinting-single img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 2;
}

.tinting-desktop .tinting-single::before {
    display: block;
    content: '';
    position: absolute;
    width: 100%;
    height: 200px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0.25%, #FFFFFF 87.96%);
    left: 0;
    bottom: 0;
    z-index: 3;
}

.tinting-desktop .tinting-single p {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 40px;
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    text-shadow: 0px 4px 25px rgba(0, 0, 0, .25);
    text-align: center;
    z-index: 4;
}

/*====== tinting tinting-mobile ======*/

.tinting-mobile {
    display: none;
    padding: 40px 0;
}

.tinting-mobile .tinting-single {
    position: relative;
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    aspect-ratio: 1 / 1;
    border-top: 3px solid var(--text-color);
    border-left: 3px solid var(--text-color);
    border-right: 3px solid var(--text-color);
}

.tinting-mobile .tinting-single:last-child {
    border-bottom: 3px solid var(--text-color);
}

.tinting-mobile .tinting-single::after {
    position: absolute;
    content: '';
    display: block;
    background-color: var(--text-color);
    height: 3px;
    width: 142%;
    transform: rotate(-45deg);
    top: 50%;
    left: -21%;
    z-index: 8;
}

.tinting-mobile .tinting-single .tinting-single__top {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    clip-path: polygon(0 0, 0 100%, 100% 0);
    overflow: hidden;
    z-index: 5;
}

.tinting-mobile .tinting-single .tinting-single__top img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 6;
}

.tinting-mobile .tinting-single .tinting-single__top::before {
    display: block;
    content: '';
    position: absolute;
    width: 100%;
    height: 50%;
    left: 0;
    top: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0.25%, rgba(255, 255, 255, 0.9) 87.96%);
    transform: rotate(180deg);
    z-index: 7;
}

.tinting-mobile .tinting-single .tinting-single__top p {
    position: absolute;
    left: 60px;
    top: 30px;
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    text-shadow: 0px 4px 25px rgba(0, 0, 0, .25);
    z-index: 8;
}

.tinting-mobile .tinting-single .tinting-single__bottom {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 3;
}

.tinting-mobile .tinting-single .tinting-single__bottom::before {
    display: block;
    content: '';
    position: absolute;
    width: 100%;
    height: 50%;
    left: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0.25%, #FFFFFF 87.96%);
    z-index: 4;
}

.tinting-mobile .tinting-single .tinting-single__bottom p {
    position: absolute;
    right: 60px;
    bottom: 30px;
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    text-shadow: 0px 4px 25px rgba(0, 0, 0, .25);
    z-index: 5;
}

/*
img {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
    */

/*====== skin ======*/

.skin {
    background-color: #E0E0E0;
}

.skin .buttons-desktop {
    display: flex;
    position: absolute;
    left: 20px;
    top: 0;
}

.skin .buttons-desktop div {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
}

.skin .buttons-desktop div.next__skin-desktop {
    transform: rotate(180deg);
}

.skin .swiper-skin {
    overflow: visible;
}

.skin .swiper-slide {
    width: 400px;
}

.skin .swiper-slide .swiper-slide__image {
    position: relative;
    background-color: var(--white-color);
    width: 100%;
    height: 266px;
    border-radius: 30px 30px 0 0;
    overflow: hidden;
    z-index: 3;
}

.skin .swiper-slide .swiper-slide__image img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.skin .swiper-slide .swiper-slide__content {
    position: relative;
    width: 450px;
    background-color: var(--white-color);
    margin: -66px -50px 0 0;
    right: -50px;
    border-radius: 0 0 30px 30px;
    padding: 30px;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
    z-index: 4;
}

.skin .swiper-slide .swiper-slide__content .content-title {
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    margin: 0 0 25px;
}

.skin .swiper-slide .swiper-slide__content .content-text {
    margin: 0 0 25px;
}

.skin .navigation-mobile {
    display: none;
    justify-content: center;
    gap: 40px;
    align-items: center;
    width: 100%;
    margin: 25px auto 0;
}

.skin .navigation-mobile .swiper-pagination-fraction {
    position: relative;
    width: 60px;
    bottom: 0;
}

.skin .navigation-mobile .prev__skin-mobile, .skin .navigation-mobile .next__skin-mobile {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
}

.skin .navigation-mobile div.next__skin-mobile {
    transform: rotate(180deg);
}

.skin .swiper-scrollbar.swiper-scrollbar__skin.swiper-scrollbar-horizontal {
    position: relative;
    margin: 40px auto 0;
}

/*====== cases ======*/

.cases .buttons-desktop {
    display: flex;
    position: absolute;
    left: 20px;
    top: 0;
}

.cases .buttons-desktop div {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
}

.cases .buttons-desktop div.next__case-desktop {
    transform: rotate(180deg);
}

.cases .swiper-case {
    overflow: visible;
}

.cases .about-slider {
    width: 650px;
    aspect-ratio: 1.25/1;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
    border-radius: 5px 40px 5px 40px;
    overflow: hidden;
}

.cases .about-slider__img--before img {
    width: 650px;
    object-position: top left;
}

.cases .about-slider__img--after img {
    width: 650px;
    object-position: top right;
}

.cases .about-slider__2 .about-slider__img--before img {
    height: calc(100% + 21px);
    top: -21px;
}

.cases .about-slider__3 .about-slider__img--after img, .cases .about-slider__4 .about-slider__img--after img, .cases .about-slider__5 .about-slider__img--after img, .cases .about-slider__6 .about-slider__img--after img {
    width: calc(100% + 135px);
    right: -135px;
}

.cases .swiper-slide {
    display: flex;
    gap: 20px;
    width: 990px;
}

.cases .swiper-slide .slide-info {
    width: 320px;
}

.cases .swiper-slide .slide-info .slide-info__content {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    background-color: var(--white-color);
    padding: 30px;
    margin: 0 0 20px;
    border-radius: 20px;
}

.cases .swiper-slide .slide-info .slide-info__content .content-title {
    width: 100%;
    font-size: 20px;
}

.cases .swiper-slide .slide-info .slide-info__content .content-item .item-title {
    opacity: .5;
    margin: 0 0 10px;
}

.cases .swiper-slide .slide-info .slide-info__content .content-item__square {
    width: 100%;
}

.cases .swiper-slide .slide-info .slide-info__content .btn {
    max-width: 230px;
}

.cases .swiper-slide .slide-info .slide-info__reviews {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    background-color: var(--white-color);
    padding: 30px;
    border-radius: 20px;
}

.cases .swiper-slide .slide-info .slide-info__reviews span {
    width: calc(100% - 45px);
    color: var(--text-color);
}

.cases .navigation-mobile {
    display: none;
    justify-content: center;
    gap: 40px;
    align-items: center;
    width: 100%;
    margin: 25px auto 0;
}

.cases .navigation-mobile .swiper-pagination-fraction {
    position: relative;
    width: 60px;
    bottom: 0;
}

.cases .navigation-mobile .prev__case-mobile, .skin .navigation-mobile .next__case-mobile, .skin .navigation-mobile .prev__case-mobile, .cases .navigation-mobile .next__case-mobile {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
}

.cases .navigation-mobile div.next__case-mobile {
    transform: rotate(180deg);
}

.cases .swiper-scrollbar.swiper-scrollbar__case.swiper-scrollbar-horizontal {
    position: relative;
    margin: 40px auto 0;
}

/*====== about ======*/

.about {
    background-color: #E0E0E0;
}

.about .row {
    display: grid;
    grid-template-areas: 
        "description photos"
        "description areas"
        "btn btn";
    align-items: flex-start;
    grid-template-columns: 40% 1fr;
}

.about-description {
    grid-area: description;
    background: linear-gradient(119.82deg, #6C6C6C -4.53%, #8F8F8F 34.97%, #8F8F8F 64.41%, #6C6C6C 112.64%);
    padding: 30px;
    border-radius: 0 20px 20px 0;
}

.about-description h2 {
    font-size: 35px;
    color: var(--white-color);
    margin: 0 0 25px;
}

.about-description .description-text {
    color: var(--white-color);
}

.about-description .about-description__box {
    padding: 30px;
    background-color: var(--white-color);
    border-radius: 20px;
    margin-top: 25px;
}

.about-description .about-description__box .box-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    margin: 0 0 30px;
}

.about-description .about-description__box .box-title span {
    width: calc(100% - 45px);
}

.about-description .about-description__box .box-title img {
    width: 35px;
}

.about-photos {
    grid-area: photos;
}

.about-photos .photos-title {
    font-size: 20px;
    margin: 0 0 25px;
}

.about-slider {
    --value: 50%;
    position: relative;
    width: 100%;
    margin: 0 auto;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
    border-radius: 20px;
    overflow: hidden;
}

.about-slider.about-slider__about {
    aspect-ratio: 1.13/1;
}
    
.about-slider__img {
    position: absolute;
    top: 0;
    max-width: none;
    height: 100%;
    object-fit: cover;
}

.about-slider__img img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 2;
}
    
.about-slider__img--before {
    left: 0;
    width: var(--value);
    border-right: 3px solid var(--white-color);
    object-position: left;
    overflow: hidden;
}

.about-slider__img--before p {
    position: absolute;
    background-color: var(--white-color);
    top: 20px;
    left: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
    border-radius: 20px;
    z-index: 3;
}

.about-slider__img--before img {
    left: 0;
    top: 0;
    object-position: top left;
}

.about-slider__about .about-slider__img--before img, .about-slider__6 .about-slider__img--before img {
    transform: scale(1, 1.17);
}
    
.about-slider__img--after {
    right: 0;
    width: calc(100% - var(--value));
    border-left: 3px solid var(--white-color);
    object-position: right;
    overflow: hidden;
}

.about-slider__img--after p {
    position: absolute;
    background-color: var(--white-color);
    top: 20px;
    right: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
    border-radius: 20px;
    z-index: 3;
}

.about-slider__img--after img {
    width: 100%;
    top: 0;
    right: 0;
    object-position: right;
}

.about .about-slider__img--after img {
    width: calc(100% + 230px);
    right: -230px;
}
    
.about-slider__range-js::-moz-range-thumb {
    position: relative;
    width: 76px;
    height: 76px;
    background-color: var(--white-color);
    background-image: url(/wp-content/uploads/2026/03/slide-arrow.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70px;
    border-radius: 50%;
    transform: translateX(calc(var(--value) - 50%));
    appearance: none;
    z-index: 5;
}
    
.about-slider__range-js::-webkit-slider-thumb {
    position: relative;
    width: 76px;
    height: 76px;
    background-color: var(--white-color);
    background-image: url(/wp-content/uploads/2026/03/slide-arrows.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70px;
    border-radius: 50%;
    transform: translateX(calc(var(--value) - 50%));
    -webkit-appearance: none;
    appearance: none;
    z-index: 5;
}
    
.about-slider__range-js {
    position: absolute;
    margin: 0;
    background-color: transparent;
    outline: 0;
    cursor: col-resize;
    -webkit-appearance: none;
    appearance: none;
    inset: 0;
}
    
.about-slider__range-js:hover {
    color: #4f4f4f;
}
    
.about-slider__range-js:active {
    color: #888888;
}
    
.about-slider__range-js:focus-visible::-moz-range-thumb {
    outline: auto;
}
    
.about-slider__range-js:focus-visible::-webkit-slider-thumb {
    outline: auto;
}

.about-areas {
    background: linear-gradient(119.82deg, #6C6C6C -4.53%, #8F8F8F 34.97%, #8F8F8F 64.41%, #6C6C6C 112.64%);
    padding: 30px;
    border-radius: 20px;
}

.about-areas .areas-ttile {
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    color: var(--white-color);
    margin: 0 0 25px;
}

.about-areas .areas-box {
    background-color: var(--white-color);
    padding: 30px;
    border-radius: 20px;
}

.about-areas .areas-box li {
    display: flex;
    align-items: center;
    gap: 10px;
}

.about-areas .areas-box li img {
    width: 35px;
}

.about-areas .areas-box li span {
    width: calc(100%  - 45px);
}

.about-areas .areas-box li + li {
    margin-top: 10px;
}

.about .btn {
    grid-area: btn;
}

/*====== prices ======*/

.prices .row {
    display: grid;
    grid-template-areas: 
        "content info"
        "btn .";
    grid-template-columns: repeat(2, 1fr);
}

.prices .price-content {
    grid-area: content;
    display: flex;
    gap: 40px;
}

.price-content h2 {
    width: 100px;
    margin: 30px 0;
}

.price-content .price-table {
    width: calc(100% - 140px);
    border-radius: 30px;
    overflow: hidden;
}

.price-table .table-row {
    display: flex;
}

.price-table .table-row:nth-child(1) {
    background: #C9C9C9;
}

.price-table .table-row:nth-child(2n) {
    background: #F2F2F2;
}

.price-table .table-row div {
    width: 50%;
    height: 82px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.prices .price-info {
    grid-area: info;
}

.prices .price-info .info-box {
    width: 100%;
    background-color: var(--white-color);
    padding: 30px;
    border-radius: 20px;
}

.prices .price-info .info-box + .info-box {
    margin-top: 25px;
}

.prices .btn {
    grid-area: btn;
}

/*====== order ======*/

.order {
    background-color: #E0E0E0;
    padding: 40px 0;
    overflow: hidden;
}

.order .section-title {
    position: relative;
    width: 100%;
    margin: 0 0 25px;
    z-index: 3;
}

.order .section-title h2 {
    text-align: left;
    margin: 0;
}

.order .order-bg {
    position: absolute;
    top: 69px;
    left: -256px;
    width: 1220px;
    transform: rotate(15.4deg);
}

.order .form-content {
    position: relative;
    max-width: 500px;
    background: linear-gradient(119.82deg, #6C6C6C -4.53%, #8F8F8F 34.97%, #8F8F8F 64.41%, #6C6C6C 112.64%);
    margin: 0 0 24px auto;
    padding: 30px;
    border-radius: 0 20px 20px 0;
    z-index: 5;
}

.order .form-content .form-title {
    font-size: 20px;
    margin: 0 0 25px;
    color: var(--white-color);
}

.order .form-content .form-description {
    text-align: left;
    margin: 0 0 25px;
    color: var(--white-color);
}

.order .btn, .checkbox-politic {
    width: 100%;
    z-index: 5;
}

/*====== calculator ======*/

.calculator-title {
    margin: 0 0 32px;
}

.calculator-title h2 {
    text-align: left;
    margin: 0 0 12px;
}

.calculator-title p {
    font-size: 20px;
}

.swiperTabs {
    margin: 0 0 20px;
}

.swiperTabs .swiper-slide {
    width: auto;
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
    background-color: var(--white-color);
    /*
    width: 400px;
    height: 64px;
    */
    padding: 16px;
    border: 1px solid rgba(56, 56, 56, 0.1);
    border-radius: 12px;
    cursor: pointer;
    outline: none;
}

.swiperTabs .swiper-slide.active {
    background-color: var(--text-color);
}

.swiperTabs .swiper-slide svg path {
    stroke: var(--text-color);
    transition: .3s;
}

.swiperTabs .swiper-slide.active svg path {
    stroke: var(--white-color);
}

.swiperTabs .swiper-slide span {
    font-weight: 700;   
    font-size: 16px;
    line-height: 1;
    letter-spacing: 0%;
    color: #383838;
}

.swiperTabs .swiper-slide.active span {
    color: var(--white-color);
}

.calculator-content {
    background-color: var(--white-color);
    /*
    display: grid;
    grid-template-areas: 
        "steps-tabs ."
        "step-title ."
        "steps-content steps-blocks";
    grid-template-columns: repeat(2, 1fr);
    
    gap: 20px;
    */
    padding: 20px;
    border-radius: 15px;
    /*
    border: 1px solid rgba(56, 56, 56, 0.1);
    */
}

.steps-tabs {
    /*
    grid-area: steps-tabs;
    */
    width: calc(50% - 5px);
    display: flex;
    gap: 8px;
    margin: 0 0 20px;
}

.steps-tabs .step {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    width: calc(25% - 6px);
    height: 45px;
    border-radius: 12px;
    /*
    border: 1px solid rgba(56, 56, 56, 0.1);
    */
    font-family: "Museo";
    font-size: 18px;
    background-color: #EDEDED;
    cursor: pointer;
    transition: .3s;
}

.steps-tabs .step img {
    display: none;
}

.steps-tabs .step.done span {
    display: none;
}

.steps-tabs .step.done img {
    display: block;
}

.steps-tabs .step.active {
    font-weight: bold;
    background-color: var(--text-color);
    color: var(--white-color);
}

.step-title {
    /*
    grid-area: step-title;
    */
    font-size: 20px;
    margin: 0 0 20px;
}

.steps-content {    
    grid-area: steps-content;
}

.steps-content {
    display: flex;
    gap: 10px;
}

.steps-content__list {
    width: 100%;
}

.steps-content__list .step-single {
    display: none;
}

.steps-content__list .step-single.active {
    display: flex;
    gap: 10px;
}

.steps-content__list .step-single .step-single_info, .step-single_form {
    width: calc(50% - 10px);
}

.step-single .form-row {
    margin: 0 0 0 auto;
}

.step-single .form-row.form-parameters {
    display: flex;
    gap: 8px;
}

.step-single .form-row.form-parameters .parameters-item {
    position: relative;
    width: 180px;
}

.step-single .form-row.form-parameters .parameters-item label {
    display: block;
    width: 100%;
    font-size: 18px;
    letter-spacing: 0%;
    color: #383838;
    margin: 0 0 10px;
}

.step-single .form-row.form-parameters .parameters-item input {
    width: 100%;
    background: #EDEDED;
    font-family: "Museo";
    padding: 15px;
    border-radius: 40px;
    font-size: 18px;
    letter-spacing: 0%;
    outline: none;
    color: rgba(81, 81, 81, .5);
}

.step-single .form-row.form-parameters .parameters-item input::placeholder {
    color: rgba(81, 81, 81, .5);
}

.step-single .form-row.form-parameters .parameters-multiplication {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 8px;
}

.step-single .form-row.form-parameters .parameters-multiplication p {
    font-size: 18px;
    letter-spacing: 0%;
    color: #383838;
    margin: 0 0 17px;
}

.step-single .form-row.form-parameters .parameters-item.form-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.step-single .form-row.form-parameters .parameters-item.form-row span {
    font-size: 36px;
    width: 20px;
    cursor: pointer;
}

.step-single .form-row.form-parameters .parameters-item.form-row input {
    width: calc(100% - 50px);
    margin: 0 auto;
}

.step-single .form-row.form-info {
    background: linear-gradient(119.82deg, #6C6C6C -4.53%, #8F8F8F 34.97%, #8F8F8F 64.41%, #6C6C6C 112.64%);
    margin: 20px 0  40px;
    padding: 16px;
    border-radius: 12px;
}

.step-single .form-row.form-info .form-info__title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
}

.step-single .form-row.form-info .form-info__title span {
    color: var(--white-color);
}

.step-single .form-row.form-info .form-info__text {
    color: var(--white-color);
}

.steps-buttons__footer {
    display: flex;
    gap: 20px;
}

.steps-buttons__footer .prev-step {
    background-color: #D9D9D9;
    color: var(--text-color);
    width: 150px;
}

.steps-buttons__footer.next-step {
    flex-basis: 1fr;
}

.steps-info__footer {
    width: 100%;
    margin: 20px 0;
}

.steps-content__list .step-single .step-single_image {
    position: relative;
    width: calc(50% - 10px);
    border-radius: 12px;
    overflow: hidden;
}

.steps-content__list .step-single .step-single_image img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    /*
    display: block;
    position: relative;
    height: 100%;
    margin: 0 auto;
    */
}

.objects-list {
    margin: 0 0 20px;
}

.objects-list.objects-list__type {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.objects-list.objects-list__type .objects-list__item {
    width: calc(50% - 6px);
}

.objects-list.objects-list__type .objects-list__item + .objects-list__item {
    margin-top: 0;
}

.objects-list .objects-list__item {
    display: flex;
    gap: 12px;
    cursor: pointer;
}

.objects-list .objects-list__item + .objects-list__item {
    margin-top: 12px;
}

.objects-list .objects-list__item .objects-list__image {
    position: relative;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    overflow: hidden;
}

.objects-list .objects-list__item .objects-list__image img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.objects-list .objects-list__item .objects-list__content {
    width: calc(100% - 84px);
    background: #D9D9D9;
    padding: 12px 16px;
    border-radius: 12px;
}

.objects-list .objects-list__item.current .objects-list__content {
    background: linear-gradient(119.82deg, #6C6C6C -4.53%, #8F8F8F 34.97%, #8F8F8F 64.41%, #6C6C6C 112.64%);
}

.objects-list .objects-list__item.current .objects-list__content p {
    color: var(--white-color);
}

.objects-list .objects-list__item .objects-list__content p + p {
    margin-top: 4px;
}

.step-single_form {

}

.step-single_form .form-image {
    position: relative;
    height: 190px;
    overflow: hidden;   
    border-radius: 12px;
    margin: 0 0 15px;
}

.step-single_form .form-image img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.step-single_form .phone-code, form .form-input input, .step-single_form form .form-input textarea {
    background-color: #EDEDED !important;
}

.step-single_form form .form-input.form-input__flex {
    gap: 10px;
}

.step-single_form form .form-input.form-input__flex .phone-code {
    width: 60px;
    height: 60px;
    margin: 0;
}

.step-single_form form .form-input.form-input__flex input {
    width: calc(100% - 70px);
    padding: 19px 20px;
}

.step-single_form form p {
    text-align: center;
    margin: 10px 0 0;
    color: #979797;
}

.step-single_form .step-single_form--bottom {
    display: flex;
    align-items: center;
    margin: 25px 0 0;
    gap: 20px;
}

.step-single_form .step-single_form--bottom .btn {
    width: 150px;
    background-color: #D9D9D9;
    color: var(--text-color);
}

.step-single_form .step-single_form--bottom p {
    width: calc(100% - 170px);
}

.step-single_info .form-prices {
    background: #EDEDED;
    padding: 30px;
    border-radius: 15px;
}

.step-single_info .form-prices .form-prices__box + .form-prices__box {
    margin-top: 16px;
}

.step-single_info .form-prices .form-prices__box .box-title {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    margin: 0 0 15px;
}

.step-single_info .form-prices .form-prices__box .box-text {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.step-single_info .form-prices .form-prices__box .box-text + .box-text {
    margin-top: 8px ;
}

.step-single_info .form-prices .form-prices__box .checkbox {
    display: flex;
    align-items: center;
    gap: 15px;
    cursor: pointer;
}

.step-single_info .form-prices .form-prices__box .checkbox .checkbox-icon {
    width: 35px;
    height: 35px;
}

.step-single_info .form-prices .form-prices__box .checkbox .checkbox-icon img {
    width: 100%;
}

.step-single_info .form-prices .form-prices__box .checkbox .checkbox-icon .form-check {
    display: none;
}

.step-single_info .form-prices .form-prices__box .checkbox.checked .checkbox-icon .form-check {
    display: block;
}

.step-single_info .form-prices .form-prices__box .checkbox.checked .checkbox-icon .form-no-check {
    display: none;
}

.step-single_info .form-prices .form-prices__box .checkbox .checkbox-title span {
    color: #979797;
}

.step-single_info .form-prices .form-prices__box .checkbox  .checkbox-price {
    margin: 0 0 0 auto;
}

.step-single_info .form-prices .form-prices__box .checkbox  .checkbox-price span {
    color: #979797;
}

.step-single_info .form-prices .form-prices__bottom {
    margin-top: 28px;
}

.step-single_info .form-prices .form-prices__bottom .bottom-title {
    font-family: "Geologica", sans-serif;
    font-size: 20px;
    margin: 0 0 8px;
}

.step-single_info .form-prices .form-prices__bottom .bottom-prices {
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 0 0 15px;
}

.step-single_info .form-prices .form-prices__bottom .bottom-prices .old {
    color: #979797;
    text-decoration: line-through;
}

.step-single_info .form-prices .form-prices__bottom .bottom-prices .current {
    font-size: 35px;
}

.step-single_info .form-prices .form-prices__bottom .gift {
    display: flex;
    align-items: center;
    gap: 8px;
}

/*
.steps-blocks {
    grid-area: steps-blocks;
    width: 100%;
}

.steps-blocks .swiper-slide {
    position: relative;
    width: 100%;
    height: 100%;
    aspect-ratio: 1.2 / 1;
    overflow: hidden;
}

.steps-blocks .swiper-slide img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
    */

/*====== specialist ======*/

.specialist {
    background-color: #E0E0E0;
}

.specialist .specialist-content, .specialist .specialist-photo {
    width: calc(50% - 20px);
}

.specialist-info {
    background-color: var(--white-color);
    padding: 30px;
    border-radius: 20px;
}

.specialist-info p {
    margin: 0 0 25px;
}

.specialist-info p:last-child {
    margin: 0;
}

.specialist-info p.info-text {
    display: flex;
    align-items: center;
    gap: 10px;
}

.specialist-info p.info-text span {
    width: calc(100% - 45px);
}

.specialist-promotion {
    margin: 25px 0 0;
    background: linear-gradient(119.82deg, #6C6C6C -4.53%, #8F8F8F 34.97%, #8F8F8F 64.41%, #6C6C6C 112.64%);
    padding: 30px;
    border-radius: 20px;
}

.specialist-promotion p {
    color: var(--white-color);
}

.specialist-photo {
    position: relative;
    padding: 370px 40px 40px;
    border-radius: 40px 40px 0 0;
    overflow: hidden;
}

.specialist-photo .specialist-photo__bg {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
    object-position: center;
    z-index: 2;
}

.specialist-photo .specialist-info {
    position: relative;
    border-radius: 0 0 20px 20px;
    z-index: 3;
}

/*====== faq ======*/

.accordion {
    width: 100%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 25px;
    z-index: 3;
}

.accordion-item {
    width: calc((100% - 25px) / 2);
    background-color: var(--white-color);
    padding: 35px 30px;
    border-radius: 20px;
    box-shadow: 0px 4px 40px 0px rgba(54, 96, 142, 0.08);
}

.accordion-item .accordion-item__title {
    display: flex;
    align-items: flex-start;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.accordion-item .accordion-item__title p {
    width: calc(100% - 45px);
    font-size: 20px;
}


.accordion-item .accordion-item__title img {
    width: 35px;
}

.accordion-item .accordion-item__title img.accordion-close {
    display: none;
}

.accordion-item.open .accordion-item__title img.accordion-plus {
    display: none;
}

.accordion-item.open .accordion-item__title img.accordion-close {
    display: block;
}

.accordion .accordion-item .accordion-item__content {
    max-height: 0;
    overflow: hidden;
    transition: .5s;
}

.accordion .accordion-item.open .accordion-item__content {
    max-height: 1000px;
    /*
    padding: 10px 0 0;
    */
}

.accordion .accordion-item .accordion-item__content p:nth-child(1) {
    margin-top: 10px;
}

.program-content ul li + li {
    margin-top: 5px;
}

.accordion .accordion-item .accordion-item__content p + p, .accordion .accordion-item .accordion-item__content p + ul, .accordion .accordion-item .accordion-item__content ul + p {
    margin-top: 20px;
}

/*====== map ======*/

.map {
    border-top: 1px solid #D9D9D9;
}

.map .map-content {
    position: relative;
    width: 390px;
    z-index: 10;
}

.map .map-content h2 {
    margin: 0 0 25px;
}

.map .map-content .map-content__box {
    background-color: #FFFFFF;
    padding: 30px 30px 40px;
    border-radius: 20px;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
}

.map .contact-grid, .map .contact-time {
    margin: 0 0 20px;
}

.map .contact-grid svg path {
    stroke: var(--text-color);
}

#map {
    position: relative;
    width: calc(100% - 430px);
    height: 345px;
    border-radius: 20px;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
    overflow: hidden;
}

.ymaps-2-1-79-controls__control {
	left: calc(100% - 20px) !important;
}

.ymaps-2-1-79-controls-pane {
	right: 0;
    /*
	top: 72px !important;
    */
}
.map-nav__wrapper {
    position: absolute;
	/*
    left: calc(60vw - 80px);
	*/
    /*
    top: 40px;
	right: 10px;
    
    top: 60px;
    */
    top: 0;
	right: 0;
    border-radius: 12px;
    box-shadow: 0px 2px 6px 0px #00000033;
    overflow: hidden;
}

.ymaps-2-1-79-map {
    width: 100% !important;
    height: 100% !important;
}

#zoom-in, #zoom-out {
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    cursor: pointer;
}

#zoom-in img, #zoom-out img {
    opacity: .7;
    transition: .3s;
}

#zoom-in img:hover, #zoom-out img:hover {
    opacity: 1;
}

.ymaps-2-1-79-map-copyrights-promo, .ymaps-2-1-79-copyright {
    display: none !important;
}

/*====== zamer ======*/

.zamer {
    background-color: #E0E0E0;
}

.zamer .row {
    justify-content: flex-end;
}

.zamer form {
    position: relative;
    max-width: 680px;
    margin: 0 0 0 auto;
    z-index: 6;
}

.zamer .zamer-bg {
    position: absolute;
    width: 750px;
    top: 70px;
    left: 20px;
    z-index: 5;
}

/*====== footer ======*/

footer {
    background: linear-gradient(119.82deg, #6C6C6C -4.53%, #8F8F8F 34.97%, #8F8F8F 64.41%, #6C6C6C 112.64%);
    padding: 40px 0 80px;
}

footer .row {
    display: grid;
    grid-template-areas: 
        "menu footer-info"
        "policy footer-info"
        "logo footer-info";
    gap: 25px 40px;
    grid-template-columns: 1fr 330px;
}

footer .menu {
    grid-area: menu;
    display: flex;
    gap: 25px;
}

footer .menu a {
    font-size: 20px;
    color: var(--white-color);
}

footer .policy {
    grid-area: policy;
    color: var(--white-color);
    text-decoration: underline;
}

footer .footer-logo {
    grid-area: logo;
}

footer .footer-logo .logo {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #EDEDED;
    width: 176px;
    height: 125px;
    border-radius: 30px;
    margin: 0 0 25px;
}

footer .footer-logo .copyright {
    color: var(--white-color);
}

footer .footer-info {
    grid-area: footer-info;
}

footer .footer-info .contact-grid {
    margin: 0 0 25px;
}

footer .footer-info svg path {
    stroke: var(--white-color);
}

footer .footer-info p {
    color: var(--white-color);
}

/*====== scroll-top ======*/
/*
.scroll-top {
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 20px;
    bottom: 20px;
    width: 50px;
    height: 50px;
    background-color: #DCDFE2;
    border-radius: 50%;
    transition: .3s;
    opacity: 0;
    z-index: 30;
}

.scroll-top.scroll {
    opacity: 1;
}

.scroll-top:hover {
    background-color: #E6E9EC;
}
*/

/*====== form ======*/

form .form-title {
    font-family: "Geologica", sans-serif;
    font-weight: 400;
    font-size: 35px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    margin: 0 0 20px;
}

form .form-description {
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    margin: 0 0 40px;
}

form .form-input {
    width: 100%;
    margin: 0 0 25px;
}

form .form-input input, form .form-input textarea {
    font-family: "Museo";
    width: 100%;
    background-color: var(--white-color);
    color: rgba(81, 81, 81, 1);
    font-size: 18px;
    padding: 30px;
    border-radius: 40px;
    outline: none;
}

form .form-input textarea {
    min-height: 130px;
}

form .form-input input::placeholder, form .form-input textarea::placeholder {
    color: rgba(81, 81, 81, .5);
}

form .form-input.form-input__flex {
    display: flex;
    gap: 15px;
}

form .form-input.form-input__flex .phone-code {
    background-color: var(--white-color);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 85px;
    height: 85px;
    border-radius: 40px;
}

form .form-input.form-input__flex .phone-code p {
    font-family: "Geologica", sans-serif;
    font-size: 20px;
}

form .form-input.form-input__flex input {
    width: calc(100% - 100px);
}

form .checkbox {
    width: 100%;
    display: flex;
    gap: 7px;
    align-items: flex-start;
    margin: 20px 0;
    padding: 0 0 0 4px;
}

.checkbox input {
    position: absolute;
    width: 16px;
    height: 16px;
    cursor: pointer;
    opacity: 0;
}

form .form-input.form-input__flex.form-input__flex--checkbox {
    gap: 25px;
}

form .form-input__flex .checkbox {
    width: auto;
    background-color: var(--white-color);
    margin: 0;
    padding: 30px;
    gap: 25px;
    border-radius: 20px;
}

.form-input__flex .checkbox input {
    width: auto;
}

.check-custom {
    width: 26px;
    height: 26px;
    flex-shrink: 0;
    box-sizing: border-box;
    background: var(--white-color);
    border-radius: 2px;
    border: 1px solid rgba(29, 47, 87, 0.2);
}

.check-custom:hover {
    border: 1px solid var(--text-color);
}

.checkbox input:checked+.check-custom {
    background: url(/wp-content/uploads/2026/03/icon-check.svg) no-repeat center / 12px 10px, var(--text-color);
    border: 1px solid var(--text-color);
}

form .checkbox-label {
    width: calc(100% - 23px);
    font-weight: 400;
    font-size: 18px;
    line-height: 130%;
    letter-spacing: 0%;
    cursor: pointer;
}

form .checkbox-label a {
    color: var(--text-color);
    text-decoration: underline;
}

form .btn {
    width: 100%;
    max-width: 100%;
}

form .btn.disabled {
    pointer-events: none !important;
    opacity: .5;
}

.form-input__photo--title, .form-input__photo--bottom {
    color: rgba(255, 255, 255, .5)
}

/* внешний вид всей области */
.form-upload {
    /* область подстраиваится под ширину внутренних элементов */
    display: inline-flex;
    /* выстраиваем все элементы внутри в столбец */
    flex-direction: column;
    /* центрируем внутренние элементы по горизонтали */
    align-items: center;
    /* центрируем элементы по вертикали */
    justify-content: center;
    /* область занимает 100% ширины окна браузера */
    width: 100%;
    /* область занимает 100% высоты окна браузера */
    min-height: 100vh;
    /* выставляем внутренние отступы */
    padding: 16px;
  }
  
  /* область для перетаскивания файлов */
  .upload-zone_dragover {
    /* цвет фона */
    background-color: var(--white-color);
    /* форма подстраивается под размеры элементов */
    display: inline-flex;
    /* центрируем внутренние элементы по горизонтали */
    align-items: center;
    /* центрируем элементы по вертикали */
    justify-content: center;
    /* центрируем элементы по вертикали */
    justify-content: center;
    /* ширина */
    width: 450px;
    /* высота */
    height: 130px;
    /* внутренние отступы */
    padding: 30px;
    /* скругление рамки */
    border-radius: 40px;
    /* цвет текста */
    color: rgba(81, 81, 81, .5);
    /* размер текста */
    font-size: 24px;
    /* тень с размытием */
    box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.2);
    margin: 0 0 25px;
  }
  
  /* область с кнопкой и подпись к ней */
  .form-upload__label {
    /* область занимает всю область элемента, внутри которого находится */
    display: flex;
    /* подпись к кнопке */
    flex-direction: column;
    /* центрируем внутренние элементы по горизонтали */
    align-items: center;
  }
  /* подпись к кнопке */
  .form-upload__title {
    width: 100%;
    /* 
    font-size: 16px;
    font-weight: 500;
    font-family: Arial, sans-serif;
    */
    margin-top: 25px;
    margin-bottom: 25px;
  }
  
input[type="file"] {
    width: 100%;
    padding: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    font-family: "Geologica", sans-serif !important;
    color: rgba(255, 255, 255, .5) !important;
    margin: 25px 0;
  }
input[type="file"]::file-selector-button {
    background-color: var(--text-color);
    width: 250px;
    height: 65px;
    cursor: pointer;
    
  }

  /* кнопка выбора файла */
input[type="file"]::file-selector-button {
    /* убираем рамку */
    border: none;
    /* скругляем углы */
    border-radius: 0;
    /* размер шрифта */
    font-size: 20px;
    /* шрифт и его цвет */
    color: var(--white-color);
    /* внутренние отступы */
    padding: 8px 16px;
  }
  
  /* цвет кнопки выбора файла при наведении на неё курсора */
  /*
  .form-upload__label input[type="file"]::file-selector-button:hover {
    background-color: #FD7F4A;
    }
    *
    /* шрифт названия файла */
    .form-upload__input {
    /* шрифт */
    font-family: Arial, sans-serif;
    /* размер шрифта */
    font-size: 16px;
  }
  
  /* стили для состояния, когда над формой держат файл */
  .upload-zone_dragover._active {
    /* цвет текста */
    color: #000000;
    /* цвет фона */
    background-color: #D4FB51;
  }

/*====== popup ======*/

.overlay {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(240, 243, 246, 0.6);
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    transition: .2s;
}

.overlay.open {
    z-index: 150;
    opacity: 1;
    visibility: visible;
}

.popup {
    background: var(--white-color);
    position: fixed;    
    left: calc(50% - 220px);
    top: calc(50% - 229px);
    width: 440px;
    max-width: 100%;
    border-radius: 20px;
    transition: .3s;
    padding: 50px 40px 50px;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    z-index: 1700;
}

.popup.open {
    opacity: 1;
    visibility: visible;
}

.popup form {
    max-width: 100%;
}

.popup .swiper {
    height: 200px;
}

.popup .swiper .swiper-slide {
    justify-content: center;
}

.popup .popup-close {
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.popup .popup-close svg {
    width: 14px;
}

.popup .popup-close svg path {
    stroke: var(--text-color);
}

.popup .order-title {
    font-size: 18px;
    line-height: 130%;
    font-weight: 500;
    letter-spacing: 0%;
    color: var(--text-color);
    margin: 0 auto 10px;
    text-align: center;
}

.popup .order-description {
    font-weight: 400;
    font-size: 15px;
    line-height: 130%;
    letter-spacing: 0%;
    color: var(--white-color);
    margin: 0 auto 20px;
    text-align: center;
}

.popup  form .checkbox-label span {
    color: var(--white-color);
}

.small-popup {
    display: flex;
    align-items: center;
    flex-direction: column;
    background: var(--blue-gradient);
    position: fixed;
    gap: 10px;
    left: calc(50% - 130px);
    top: calc(50% - 65px);
    width: 260px;
    height: 130px;
    max-width: 100%;
    border-radius: 20px;
    transition: .3s;
    padding: 40px 30px 30px;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    z-index: 170;
}

.success.open, .error.open {
    opacity: 1;
    visibility: visible;
}

.success.open svg, .error.open svg {
    width: 40px;
}

.success.open p, .error.open p {
    width: 100%;
    font-weight: 500;
    font-size: 16px;
    line-height: 120%;
    letter-spacing: 0%;
    color: var(--white-color);
    text-align: center;
}

@media screen and (max-width: 1200px) {
    

 
}

@media screen and (max-width: 980px) {
    
    header.header-desktop .btn {
        display: none;
    }

    .primary {
        padding: 30px 0 40px;
    }

    .primary .row {
        align-items: flex-start;
        justify-content: space-between;
    }

    .primary .primary-item {
        position: relative;
        top: 0 !important;
        right: 0 !important;
        left: 0 !important;
    }

    .skin .swiper-slide .swiper-slide__content {
        width: 100%;
        margin: 0;
        right: 0;
    }

    .swiper-scrollbar.swiper-scrollbar__skin {
        position: relative;
        margin: 50px 0 0;
    }

    .steps-tabs {
        width: 100%;
    }

    .objects-list.objects-list__type .objects-list__item {
        width: 100%;
    }

}

@media screen and (max-width: 768px) {

    body {
        font-size: 14px;
    }

    h1 {
        font-size: 26px;
        text-align: center;
    }

    h2 {
        font-size: 24px;
    }

    .btn {
        height: 40px;
        font-size: 14px;
    }

    .section-title {
        margin: 0 0 20px;
    }

    section {
        padding: 40px 0;
    }

    .section-title p {
        font-size: 14px;
        margin: 0 0 10px;
    }

    .primary {
        margin: 50px 0 0;
    }

    .primary .primary-item {
        padding: 15px 15px;
        border-radius: 15px;
    }

    .primary .primary-item .item-title {
        font-size: 18px;
        margin: 0 0 10px;
    }

    .why .row {
        gap: 10px;
    }

    .why .small-tem:first-child {
        width: 100%;
        border-radius: 5px 5px 0 0;
    }

    .why .why-single.why-single__1, .why .why-single.why-single__5 {
        background: var(--text-color);
        width: calc(44% - 10px);
        border-radius: 0 15px 15px 0;
        padding: 10px;
    }

    .why .why-single.why-single__2, .why .why-single.why-single__6 {
        background: linear-gradient(119.82deg, #6C6C6C -4.53%, #8F8F8F 34.97%, #8F8F8F 64.41%, #6C6C6C 112.64%);
        width: 56%;
        border-radius: 15px 0 0 15px;
        padding: 10px;
    }

    .why .why-single.why-single__3 {
        background: linear-gradient(119.82deg, #6C6C6C -4.53%, #8F8F8F 34.97%, #8F8F8F 64.41%, #6C6C6C 112.64%);
        width: 56%;
        border-radius: 0 15px 15px 0;
        padding: 10px;
    }

    .why .why-single.why-single__4 {
        background: var(--text-color);
        width: calc(44% - 10px);
        border-radius: 15px 0 0 15px;
        padding: 10px;
    }

    .why .why-single img {
        margin: 0 0 10px;
    }

    .why .why-single p, .why .why-single p span {
        font-size: 14px;
    }

    .use {
        padding: 0;
    }

    .use .section-title {
        display: none;
    }

    .use .use-content {
        height: auto;
        padding: 40px;
    }

    .use .use-content h2 {
        display: block;
    }

    .use .use-single {
        max-width: 100% !important;
        opacity: 1 !important;
        background-color: var(--white-color) !important;
        position: relative !important;
        padding: 15px !important;
        border-radius: 15px !important;
        left: 0 !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
    }

    .use .use-content .use-single p {
        opacity: 1;
    }

    .use .use-content .use-single::before, .use .use-content .use-single .circle {
        display: none;
    }

    .use .use-content .use-single + .use-single {
        margin-top: 25px;
    }

    .skin .buttons-desktop {
        display: none;
    }

    .skin .navigation-mobile {
        display: flex;
    }

    .skin .navigation-mobile .swiper-pagination-fraction {
        font-size: 18px;
        line-height: 1;
    }

    .tinting-mobile {
        display: block;
    }

    .skin .swiper-slide .swiper-slide__content {
        padding: 15px;
        border-radius: 0 0 20px 20px;
    }

    .swiper-scrollbar.swiper-scrollbar__skin {
        display: none;
    }

    .skin .swiper-slide .swiper-slide__content .content-title {
        font-size: 14px;
        margin: 0 0 20px;
    }

    .skin .swiper-slide .swiper-slide__content .content-text {
        margin: 0 0 20px;
    }

    .cases .buttons-desktop {
        display: none;
    }

    .cases .about-slider {
        width: 100%;
        height: 340px;
    }

    .cases .swiper-slide {
        flex-direction: column;
        gap: 20px;
    }

    .cases .swiper-slide .slide-info {
        width: 100%;
    }

    .cases .swiper-slide .slide-info .slide-info__content .content-item__square {
        width: auto;
    }

    .cases .swiper-slide .slide-info .slide-info__content {
        padding: 15px;
        border-radius: 15px;
    }

    .cases .swiper-scrollbar {
        display: none;
    }

    .cases .navigation-mobile {
        display: flex;
    }

    .cases .navigation-mobile .swiper-pagination-fraction {
        font-size: 18px;
        line-height: 1;
    }

    .about-slider__img--before p, .about-slider__img--after p {
        padding: 15px;
        border-radius: 15px;
    }
    
    .cases .swiper-slide .slide-info .slide-info__reviews {
        padding: 15px;
        border-radius: 15px;
    }

    .cases .swiper-slide .slide-info .slide-info__reviews img {
        width: 25px;
    }

    .cases .swiper-slide .slide-info .slide-info__content .btn {
        max-width: 100%;
    }

    .about-description h2 {
        font-size: 24px;
        margin: 0 0 20px;
    }

    .about .row {
        grid-template-areas:
            "description"
            "areas"
            "photos"
            "btn";
        grid-template-columns: 1fr;
        gap: 0;
    }
    
    .about-description, .about-areas {
        padding: 15px;
    }

    .about-description {
        border-radius: 15px 0 0 0;
    }

    .about-description .about-description__box {
        padding: 15px;
        border-radius: 20px;
        margin-top: 20px;
    }

    .about-description .about-description__box .box-title {
        margin: 0 0 10px;
    }

    .about-description .about-description__box .box-title span {
        font-size: 14px;
    }

    .about-description .about-description__box .box-title img {
        width: 25px;
    }

    .about-areas {
        border-radius: 0 0 0 15px;
    }

    .about-areas .areas-box {
        padding: 15px;
    }

    .about-areas .areas-box li img {
        width: 25px;
    }

    .about-photos, .about .btn {
        margin: 30px 0 0;
    }

    .about-photos .photos-title {
        font-size: 14px;
        text-align: center;
        margin: 0 0 20px;
    }

    .prices .row {
        grid-template-areas:
            "content"
            "info"
            "btn";
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .prices .price-content {
        flex-wrap: wrap;
        gap: 0;
    }

    .price-content h2 {
        width: 100%;
        text-align: center;
        margin: 0 0 30px;
    }

    .price-content .price-table {
        width: 100%;
        border-radius: 15px;
    }

    .prices .price-info .info-box {
        border-radius: 15px;
        padding: 15px;
    }

    .order .row {
        gap: 0;
    }

    .order .section-title h2 {
        text-align: center;
    }

    .order .section-title {
        margin: 0 0 160px;
    }

    .order .order-bg {
        width: 100%;
        left: 0;
        top: 40px;
        transform: rotate(0);
    }

    .order .form-content {
        padding: 15px;
    }

    .order .form-content .form-title {
        display: none;
    }

    .order .form-content .form-description {
        font-size: 14px;
        margin: 0 0 20px;
    }

    form .form-input {
        margin: 0 0 10px;
    }

    form .form-input input, form .form-input textarea {
        padding: 15px;
        font-size: 14px;
    }

    form .form-input.form-input__flex .phone-code {
        width: 45px;
        height: 45px;
        padding: 15px;
    }

    form .form-input.form-input__flex input {
        width: calc(100%  - 55px);
    }

    .specialist .specialist-content, .specialist .specialist-photo {
        width: 100%;
    }

    .specialist-info {
        padding: 15px;
        border-radius: 15px;
    }

    .specialist-info p {
        margin: 0 0 10px;
    }

    .specialist-info p.info-text {
        gap: 5px;
        margin: 0 0 20px;
    }

    .specialist-info p.info-text img {
        width: 25px;
    }

    .specialist-info p.info-text span {
        width: calc(100% - 30px);
    }

    .specialist-promotion {
        margin: 30px 0 0;
        padding: 15px;
        border-radius: 15px;
    }

    .specialist-photo {
        border-radius: 15px;
        padding: 170px 20px 20px;
    }

    .specialist-info {
        padding: 15px;
    }

    .specialist-info p {
        margin: 0 0 20px;
    }

    .accordion {
        gap: 10px;
    }

    .accordion-item {
        width: 100%;
        padding: 15px;
        border-radius: 15px;
    }

    .accordion-item .accordion-item__title p {
        font-size: 14px;
        width: calc(100% - 35px);
    }

    .accordion-item .accordion-item__title img {
        width: 25px;
    }

    .contact-grid svg {
        width: 25px;
    }

    .socials a {
        width: 40px;
        height: 40px;
    }

    .socials a svg {
        width: 25px;
    }

    .map .map-content .map-content__box {
        padding: 15px;
        border-radius: 15px;
    }

    #map {
        width: 100%;
        height: 300px;
    }

    form .form-input textarea {
        min-height: 100px;
    }

    form .form-input.form-input__flex.form-input__flex--checkbox {
        gap: 10px;
    }

    form .form-input__flex .checkbox {
        padding: 15px;
        gap: 10px;
        border-radius: 15px;
    }

    form .checkbox-label {
        font-size: 14px;
    }

    form .form-input__flex .checkbox, form .checkbox {
        align-items: center;
    }

    .zamer .zamer-bg {
        position: relative;
        max-width: 100%;
        top: 0;
        left: 0;
    }

    footer {
        padding: 30px 0 40px;
    }

    footer .row {
        display: grid;
        grid-template-areas:
            "menu"
            "footer-info"
            "policy"
            "logo";
        gap: 20px;
        grid-template-columns: 1fr;
    }

    footer .menu {
        flex-wrap: wrap;
        gap: 20px;
        margin: 0 0 20px;
    }

    footer .menu a {
        font-size: 14px;
    }

    footer .footer-logo {
        text-align: center;
        margin: 20px auto 0;
    }

    footer .footer-logo .logo {
        width: 100px;
        height: 70px;
        margin: 0 auto 40px;
        border-radius: 15px;
    }

    footer .footer-logo .logo img {
        width: 70px;
    }

    footer .footer-logo .copyright {
        font-size: 14px;
    }

    .step-single_form .step-single_form--bottom {
        flex-direction: column;
        align-items: flex-start;
    }

    .step-single_form .step-single_form--bottom p {
        width: 100%;
    }

}

@media screen and (max-width: 576px) {

    .steps-tabs {
        flex-wrap: wrap;
    }

    .steps-tabs .step {
        width: calc(50% - 4px);
        white-space: nowrap;
    }

    .steps-content__list .step-single .step-single_info, .step-single_form {
        width: 100%;
    }

    .steps-content__list .step-single .step-single_image {
        display: none;
    }

    .step-single .form-row.form-parameters {
        flex-wrap: wrap;
    }

    .step-single .form-row.form-parameters .parameters-item {
        width: calc(50% - 12px);
    }

    .step-single .form-row.form-parameters .parameters-item.form-row {
        width: 100%;
    }

    .steps-content__list .step-single {
        flex-wrap: wrap;
    }

    .step-single_form .form-image {
        display: none;
    }

    .step-single_form .step-single_form--bottom .btn {
        width: 100%;
    }

}

@media screen and (max-width: 360px) {
    
}