@font-face {
    font-family: 'e-Ukraine';
    src: url('../fonts/e-Ukraine-Bold.eot');
    src: url('../fonts/e-Ukraine-Bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/e-Ukraine-Bold.woff2') format('woff2'),
         url('../fonts/e-Ukraine-Bold.woff') format('woff'),
         url('../fonts/e-Ukraine-Bold.ttf')  format('truetype'),
         url('../fonts/e-Ukraine-Bold.svg#e-Ukraine') format('svg');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'e-Ukraine';
    src: url('../fonts/e-Ukraine-Medium.eot');
    src: url('../fonts/e-Ukraine-Medium.eot?#iefix') format('embedded-opentype'),
         url('../fonts/e-Ukraine-Medium.woff2') format('woff2'),
         url('../fonts/e-Ukraine-Medium.woff') format('woff'),
         url('../fonts/e-Ukraine-Medium.ttf')  format('truetype'),
         url('../fonts/e-Ukraine-Medium.svg#e-Ukraine') format('svg');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'e-Ukraine';
    src: url('../fonts/e-Ukraine-Light.eot');
    src: url('../fonts/e-Ukraine-Light.eot?#iefix') format('embedded-opentype'),
         url('../fonts/e-Ukraine-Light.woff2') format('woff2'),
         url('../fonts/e-Ukraine-Light.woff') format('woff'),
         url('../fonts/e-Ukraine-Light.ttf')  format('truetype'),
         url('../fonts/e-Ukraine-Light.svg#e-Ukraine') format('svg');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'e-Ukraine';
    src: url('../fonts/e-Ukraine-Regular.eot');
    src: url('../fonts/e-Ukraine-Regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/e-Ukraine-Regular.woff2') format('woff2'),
         url('../fonts/e-Ukraine-Regular.woff') format('woff'),
         url('../fonts/e-Ukraine-Regular.ttf')  format('truetype'),
         url('../fonts/e-Ukraine-Regular.svg#e-Ukraine') format('svg');
    font-weight: normal;
    font-style: normal;
}

*, ::after, ::before {
    box-sizing: border-box;
}
body, html {
    overflow-x: hidden;
    position: relative;
}
body {
    font-family: 'e-Ukraine';
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 22px;
    letter-spacing: -0.32px;
    color: #0E1C1A;
    margin: 0;
    padding: 96px 0 0;
    background: #EEECE0;
}
a {
    color: #0E1C1A;
    text-decoration: underline;
}
a:hover {
   text-decoration: none; 
}
p {
    margin: 16px 0;
}
input, 
textarea {
    outline: none;
    border: 1px solid #D5D2C3;
    width: 100%;
    height: 56px;
    padding: 0 24px;
    margin: 0 0 24px;
    border-radius: 16px;
    background: #D5D2C3;
    color: #0E1C1A;
    font-family: e-Ukraine;
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 18px;
    letter-spacing: -0.28px;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}
.invalid input.wpcf7-validates-as-required {
    border: 1px solid #AF6B6D;
}
textarea {
    height: 120px;
}
::placeholder {
    color: hsl(171deg 33% 8% / 50%);
}
.checkbox-item {
    display: flex;
    align-items: center;
    margin: 0 0 24px;
    font-size: 12px;
    font-weight: 300;
    line-height: 16px;
    letter-spacing: -0.24px;
    color: #0E1C1A;
}
.checkbox-input {
    appearance: none;
    -webkit-appearance: none; 
}
.checkbox-input {
    appearance: none;
    padding: 0;
    margin: 0 8px 0 0;
    width: 24px;
    height: 24px;
    border: 1px solid #073A33;
    border-radius: 6px;
    background-color: #ffffff00;
    cursor: pointer;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.checkbox-input:checked {
    background-color: #073A33;
    border-color: #073A33;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="9" viewBox="0 0 13 9" fill="none"><path d="M11.3666 0.700195L4.03328 8.03353L0.699951 4.7002" stroke="%23EEECE0" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
}

.hidden {
  display: none;
}
.btn {
    width: auto;
    height: 56px;
    background: #073A33;
    padding: 0 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
    border: 0;
    border-radius: 16px;
    cursor: pointer;
    font-family: e-Ukraine;
    color: #EEECE0; 
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    text-decoration: none;
}
.btn:hover {
    background: #0F5F55
}
.btn-phone::after {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    margin-left: 16px;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M21.9999 16.9201V19.9201C22.0011 20.1986 21.944 20.4743 21.8324 20.7294C21.7209 20.9846 21.5572 21.2137 21.352 21.402C21.1468 21.5902 20.9045 21.7336 20.6407 21.8228C20.3769 21.912 20.0973 21.9452 19.8199 21.9201C16.7428 21.5857 13.7869 20.5342 11.1899 18.8501C8.77376 17.3148 6.72527 15.2663 5.18993 12.8501C3.49991 10.2413 2.44818 7.27109 2.11993 4.1801C2.09494 3.90356 2.12781 3.62486 2.21643 3.36172C2.30506 3.09859 2.4475 2.85679 2.6347 2.65172C2.82189 2.44665 3.04974 2.28281 3.30372 2.17062C3.55771 2.05843 3.83227 2.00036 4.10993 2.0001H7.10993C7.59524 1.99532 8.06572 2.16718 8.43369 2.48363C8.80166 2.80008 9.04201 3.23954 9.10993 3.7201C9.23656 4.68016 9.47138 5.62282 9.80993 6.5301C9.94448 6.88802 9.9736 7.27701 9.89384 7.65098C9.81408 8.02494 9.6288 8.36821 9.35993 8.6401L8.08993 9.9101C9.51349 12.4136 11.5864 14.4865 14.0899 15.9101L15.3599 14.6401C15.6318 14.3712 15.9751 14.1859 16.3491 14.1062C16.723 14.0264 17.112 14.0556 17.4699 14.1901C18.3772 14.5286 19.3199 14.7635 20.2799 14.8901C20.7657 14.9586 21.2093 15.2033 21.5265 15.5776C21.8436 15.9519 22.0121 16.4297 21.9999 16.9201Z" stroke="%23EEECE0" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}
.title {
    font-weight: 500;
    font-size: 48px;
    line-height: 54px; 
    line-height: 113%;
    letter-spacing: -0.04em;
    text-transform: uppercase;
    color: #0e1c1a;
    margin: 0 0 40px;
}
.title span {
    color: #af8b6b;
}
h1.title {
    font-size: 56px;
    line-height: 64px; 
    margin: 0 0 24px;
}
.icon {
    width: 64px;
    height: 64px;
    border-radius: 100px;
    background: #AF8B6B;
    display: flex;
    justify-content: center;
    align-items: center;
}
.container {
    width: 1344px;
    margin: auto;
    padding-right: 8px;
    padding-left: 8px;
    margin-right: auto;
    margin-left: auto;
}
.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -8px;
    margin-left: -8px;
}
.col-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
}
.col-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
}
.col-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}
.col-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}
.col-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
}
.col-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}
.col-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
}
.col-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
}
.col-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
}
.col-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
}
.col-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
}
.col-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}
.col-1,
.col-2,
.col-3, 
.col-4, 
.col-5, 
.col-6, 
.col-7, 
.col-8, 
.col-9, 
.col-10, 
.col-11, 
.col-12  {
    position: relative;
    padding-right: 8px;
    padding-left: 8px;
}

@media only screen and (max-width: 1344px) {
    .container {
        width: 1200px;
    }
}
@media only screen and (max-width: 1234px) {
    .container {
        width: 976px;
    }
}
@media only screen and (max-width: 1024px) {
    .container {
        width: 736px;
    }
    .title {
        font-size: 40px;
        line-height: 46px;
        letter-spacing: -1.6px;
    }
    h1.title {
        font-size: 48px;
        line-height: 56px; 
    }
}

@media only screen and (max-width: 767px) {
    body {
        padding: 73px 0 0;
    }
    .container {
        width: 100%;
    }
    .col-1,
    .col-2,
    .col-3, 
    .col-4, 
    .col-5, 
    .col-6, 
    .col-7, 
    .col-8, 
    .col-9, 
    .col-10, 
    .col-11, 
    .col-12  {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .btn {
        width: 100%;
    }
    .title {
        font-size: 30px;
        line-height: 36px; 
        letter-spacing: -1.2px;
    }
    h1.title {
        font-size: 34px;
        line-height: 38px; 
    }
}

header {
    position: absolute;
    top: 0;
    width: 100%;
    padding: 24px 0;
    border-bottom: 1px solid #d5d2c3;
} 
header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.ul-menu {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    padding: 0;
    margin: 0;
    list-style: none;
}
.ul-menu li a {
    color: #0E1C1A;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 16px;
    transition: 0.3s;
    text-decoration: none;
}
.ul-menu li a:hover {
    color: #0F5F55;
}
.header-right {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin: -4px 0;
}
.header-right .tel {
    font-size: 16px;
    color: #0E1C1A;
    font-weight: 400;
    text-decoration: none;
}

.languages {
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
}
.languages > li > a {
    color: #0E1C1A;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 16px;
    border-radius: 100px;
    border: 1px solid #D5D2C3;
    height: 48px;
    padding: 0 16px 0 12px;
    margin: 4px 0;
    display: inline-flex;
    align-items: center;
    transition: 0.3s;
    cursor: pointer;
    text-decoration: none;
}
.languages > li ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: none;
    position: absolute; 
    border-radius: 8px;
    background: #D5D2C3;
    padding: 4px;
    width: 100%;
}
.languages > li > ul li a {
    color: #0E1C1A;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 16px;
    padding: 10px 12px;
    display: block;
    border-radius: 4px;
    transition: 0.3s;
    text-decoration: none;
}
.languages > li > ul li a:hover {
    background: #EEECE0;
}

.languages > li > a::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    margin-right: 8px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" stroke="%230E1C1A" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/><path d="M2 12H22" stroke="%230E1C1A" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/><path d="M12 2C14.5013 4.73835 15.9228 8.29203 16 12C15.9228 15.708 14.5013 19.2616 12 22C9.49872 19.2616 8.07725 15.708 8 12C8.07725 8.29203 9.49872 4.73835 12 2Z" stroke="%230E1C1A" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    transition: 0.3s;
}
.languages > li:hover > a {
    background: #D5D2C3;
}
.languages > li:hover ul {
    display: block;
}

.menuToggle {
    position: relative;
    z-index: 999;
    cursor: pointer;
    display: none;
    transition: 0.3s;
    border-radius: 100px;
    border: 1px solid #D5D2C3;
    height: 48px;
    width: 48px;
    align-items: center;
    justify-content: center;
}
.hamburger {
    width: 12px;
    height: 1.5px;
    transform: translate(0, -50%);
    background: #0E1C1A;
    transition: 0.5s;
    display: inline-block;
    border-radius: 10px;
    margin: 0 6px 0 0;
}

.hamburger:before,
.hamburger:after {
    content: "";
    width: 18px;
    height: 1.5px;
    position: absolute;
    background: #0E1C1A;
    transition: 0.3s;
    border-radius: 10px;
}
.hamburger:before {
    top: -5px;
}
.hamburger:after {
    top: 5px;
}
.active .hamburger {
    background: none;
}
.active .menuToggle:hover .hamburger {
    background: none;
}
.active .hamburger:before {
    top: 0;
    transform: rotate(45deg);
}
.active .hamburger:after {
    top: 0;
    transform: rotate(135deg);
}
.active .menuToggle {
    padding: 0;
    background: none;
}
.active .menuToggle span {
    display: none;
}
.popup-menu {
    position: absolute;
    right: 0;
    top: 97px;
    z-index: 11;
    width: 320px;
    height: calc(100vh - 97px);
    display: none;
    background: #FAF9F1;
    padding: 24px;
}
html.active {
    overflow: hidden;
}
.active .popup-menu {
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
}
.popup-menu .ul-menu {
    gap: 0;
}
.popup-menu .ul-menu li {
    width: 100%;
    border-bottom: 1px solid #D5D2C3;
    padding: 16px 0;
    display: flex;
}
.popup-menu .languages {
    display: none;
}
@media only screen and (max-width: 1024px) {
    header .menu {
        display: none;
    }
    .menuToggle {
        display: flex;
    }
}

@media only screen and (max-width: 767px) {
    header {
        padding: 16px 0;
    }
    header .logo img {
        height: 32px;
    }
    header .languages {
        display: none;
    }
    .header-right .tel {
        font-size: 14px;
    }
    .popup-menu .languages {
        display: block;
    }
    .popup-menu {
        top: 73px;
        height: calc(100vh - 73px);
    }
    .languages > li ul {
        top: -116px;
    }
    
}

.section-first {
    padding: 48px 0 0;
}
.section-first .subtitle {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: center;
}
.section-first .subtitle p {
    font-size: 18px;
    margin: 0;
    max-width: 640px;
}
.section-first .photo {
    height: 360px;
    border-radius: 24px;
    overflow: hidden;
    margin: 48px 0 0;
}
.section-first .photo img {
    width: 100%; 
    height: 100%; 
    object-fit: cover;
    object-position: center;
}
@media only screen and (max-width: 767px) {
    .section-first {
        padding: 32px 0 0;
    }
    .section-first .photo {
        margin: 32px 0 0;
    }
}

.section-solution {
    padding: 120px 0 0;
}
.section-solution .block {
    border-radius: 24px;
    border: 1px solid #D5D2C3;
    padding: 24px;
    transition: 0.3s;
    height: stretch;
}
.section-solution .block:hover {
    border: 1px solid #073A33;
    background: #073A33;
    position: absolute;
    z-index: 1;
    width: calc(100% - 16px);
    color: #EEECE0;
    height: auto;
    
}
.section-solution .block .btn {
    opacity: 0;
    width: 100%;
    background: #EEECE0;
    color: #073A33;
    display: none;
}
.section-solution .block:hover .btn {
    opacity: 1;
    margin: 0;
    display: flex;
}
.section-solution .block .text {
    margin: 40px 0 0;
}
.section-solution .block .text .name {
    font-size: 20px;
    font-weight: 500;
    line-height: 24px; 
    letter-spacing: -0.4px;
    margin: 0 0 16px;
}
.section-solution .block .text p {
    margin: 0;
}
.section-solution .block:hover .text {
    margin: 40px 0;
}
@media only screen and (max-width: 1234px) {
    .section-solution .row {
        margin-bottom: -16px;
    }
    .section-solution .col-3 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
        margin-bottom: 16px;
    }
}
@media only screen and (max-width: 1024px) {
    .section-solution {
        padding: 80px 0 0;
    }
    .section-solution .block {
        display: flex;
        flex-wrap: wrap;
        align-content: space-between;
    }
    .section-solution .block:hover {
        background: none;
        position: relative;
        width: 100%;
        height: stretch;
        color: #0E1C1A;
        border: 1px solid #D5D2C3;
    }
    .section-solution .block .text {
        margin: 40px 0;
    }
    .section-solution .block .btn {
        opacity: 1;
        margin: 0;
        display: flex;
        background: #073A33;
        color: #EEECE0;
    }
}
@media only screen and (max-width: 767px) {
    .section-solution {
        padding: 48px 0 0;
    }
    .section-solution .col-3 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .section-solution .block .text {
        margin: 24px 0;
    }
    .section-solution .block:hover .text {
        margin: 24px 0;
    }
}


.section-about {
    padding: 120px 0 336px;
    margin: 0 0 -130px;
    background-image: url(../img/bg-about.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top 50px center;
    position: relative;
}
.section-about::after {
    content: '';
    display: block;
    width: 100%;
    height: 462px;
    background: linear-gradient(180deg, rgba(238, 236, 224, 0.00) 0%, #EEECE0 100%);
    position: absolute;
    bottom: -1px;
}
.section-about .container {
    position: relative;
    z-index: 1;
}
.section-about .text {
    margin: 28px 0 24px;
}
.section-about .title span {
    display: block;
}
@media only screen and (max-width: 1024px) {
    .section-about {
        padding: 80px 0 306px;
        margin: 0 0 -162px;
        background-position: top 100px center;
    }
    .section-about .title {
        margin: 0;
    }
    .section-about .col-6 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .section-about .text {
        margin: 0 0 32px;
    }
}
@media only screen and (max-width: 767px) {
    .section-about {
        padding: 48px 0 148px;
        margin: 0 0 -58px;
        background-size: 100%;
        background-position: bottom center;
    }
    .section-about::after {
        height: 150px;
    }
}


.section-services {
    border-radius: 32px;
    background: #EEECE0;
    position: relative;
    z-index: 2;
    margin: 0 16px;
    padding: 80px 0 0;
}
.section-services .row {
    margin-bottom: -16px;
}
.section-services .col-4, 
.section-services .col-6 {
    margin-bottom: 16px;
}
.section-services .block {
    padding: 32px;
    border-radius: 24px;
    background-size: cover;
    background-position: center;
    min-height: 480px;
    position: relative;
    overflow: hidden;
}
.section-services .block .name {
    font-size: 24px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: -0.48px;
}
.section-services .block .btn {
    margin: 24px 0 0;
}
.section-services .block::after {
    content: '';
    display: block;
    width: 100%;
    height: 250px;
    position: absolute;
    left: 0;
    bottom: -1px;
    mask: linear-gradient(transparent, #D6D3C4, #D6D3C4);
    backdrop-filter: blur(20px);
}
.section-services .block::before {
    content: '';
    display: block;
    width: 100%;
    height: 200px;
    position: absolute;
    left: 0;
    bottom: -1px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #D6D3C4 100%);
}
.section-services .block .hover {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 32px;
    border-radius: 24px;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: space-between;
    z-index: 1;
}
.section-services .block .hover>div {
    width: 100%;
}
.section-services .block .hover ul {
    display: none;
    padding: 0;
    margin: 0;
    list-style: none;
}
.section-services .block .hover ul li {
    font-size: 14px;
    line-height: 18px;
    letter-spacing: -0.28px;
    margin: 12px 0;
    padding-left: 12px;
    background: url('data:image/svg+xml,<svg width="8" height="13" viewBox="0 0 8 13" fill="none" xmlns="http://www.w3.org/2000/svg"><path opacity="0.8" d="M8 8.62011L5.10638 9.60335L6.89362 12.1508L5.78723 13L4 10.4525L2.21277 13L1.10638 12.1508L2.89362 9.55866L0 8.57542L0.425532 7.18994L3.31915 8.17318V5H4.68085V8.17318L7.57447 7.18994L8 8.62011Z" fill="%230E1C1A"/></svg>');
    background-repeat: no-repeat;
    background-position: left top;
}
.section-services .block .hover:hover ul {
    display: block;
}
.section-services .block:hover .hover {
    background: linear-gradient(180deg, rgba(214, 211, 196, 0.30) 0%, #D6D3C4 100%);
    backdrop-filter: blur(15px);
    height: 100%;
    width: 100%;
}
@media only screen and (max-width: 1234px) {
    .section-services .col-4 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
}
@media only screen and (max-width: 1024px) {
    .section-services {
        padding: 48px 0 0;
    }
}
@media only screen and (max-width: 767px) {
    .section-services .col-4 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .section-services .block {
        padding: 24px;
        min-height: 360px;
    }
    .section-services .block .hover {
        padding: 24px;
    }
    .section-services .block:hover {
        padding: 0;
        min-height: auto;
    }
    .section-services .block:hover .icon {
        display: none;
    }
    .section-services .block:hover .hover {
        position: relative;
    }
}


.section-why {
    padding: 120px 0 0;
}
.section-why .col-4:first-child {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
}
.section-why .title {
    margin: 0;
}
.section-why .row {
    margin-bottom: -16px;
}
.section-why .col-4 {
    margin-bottom: 16px;
}
.section-why .block {
    border-radius: 24px;
    border: 1px solid #D5D2C3;
    padding: 24px;
    height: 100%;
}
.section-why .block .name {
    margin: 40px 0 16px;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px; 
    letter-spacing: -0.4px;
}
.section-why .block p {
    margin: 0;
}
@media only screen and (max-width: 1024px) {
    .section-why {
        padding: 80px 0 0;
    }
    .section-why .col-4:first-child,
    .section-why .col-4:last-child {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .section-why .col-4:first-child {
        margin-bottom: 40px;
    }
    .section-why .col-4 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    
}
@media only screen and (max-width: 767px) {
    .section-why {
        padding: 48px 0 0;
    }
    .section-why .col-4:first-child {
        margin-bottom: 32px;
    }
    .section-why .col-4 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}



.section-work {
    padding: 120px 0 0;
    border-bottom: 1px solid #AF8B6B;
}
.section-work .row {
    align-items: center;
}
.section-work img.map {
    float: right;
    margin-right: 100px;
}
.section-work .text {
    max-width: 550px;
    margin: 0 0 40px;
}
.section-work .col-6 {
    position: relative;
}
.marker-block-1  {
    top: 20px;
    left: 208px;
}
.marker-block-2  {
    top: 75px;
    left: 220px;
}
.marker-block-3 {
    top: 140px;
    left: 248px;
}
.marker-block-4 {
    top: 195px;
    left: 277px;
}
.marker-block-5 {
    top: 236px;
    left: 300px;
}
.marker-block-6 {
    top: 264px;
    left: 320px;
}
.marker-block-7 {
    top: 289px;
    left: 346px;
}
.marker-block-8 {
    top: 330px;
    left: 380px;
}
.marker-block-9 {
    top: 368px;
    left: 422px;
}
.marker-block-10 {
    top: 420px;
    left: 483px;
}
.marker-block-11 {
    top: 450px;
    left: 324px;
}
.section-work .marker-block {
    position: absolute;
}
.section-work .marker-block .marker {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    display: flex;
    align-items: center;
    cursor: pointer;
    min
}
.section-work .marker-block.active .marker {
    color: #AF8B6B;
}
.section-work .marker-block .marker span {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none"><circle opacity="0.1" cx="9" cy="9" r="9" fill="%23073A33"/><circle opacity="0.8" cx="9" cy="9" r="6" fill="%23073A33"/><circle cx="9" cy="9" r="2" fill="%23FAF9F1"/></svg>');
    min-width: 18px;
    height: 18px;
    margin: 0 4px 0 0;
}
.section-work .marker-block .block {
    width: 230px;
    border-radius: 16px;
    background: #FAF9F1;
    overflow: hidden;
    display: none;
    position: absolute;
    right: 100%;
}
.section-work .marker-block.active .block {
    display: block;
    z-index: 1;
}
.section-work .marker-block img {
    width: 100%;
    height: auto;
}
.section-work .marker-block .block-text {
    padding: 12px;
}
.section-work .marker-block .name {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px; 
    letter-spacing: -0.28px;
}
.section-work .marker-block p {
    margin: 8px 0 0;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}
@media only screen and (max-width: 1344px) {
    .marker-block-1  {
        left: 136px;
    }
    .marker-block-2  {
        left: 147px;
    }
    .marker-block-3 {
        left: 176px;
    }
    .marker-block-4 {
        left: 204px;
    }
    .marker-block-5 {
        left: 228px;
    }
    .marker-block-6 {
        left: 249px;
    }
    .marker-block-7 {
        left: 273px;
    }
    .marker-block-8 {
        left: 307px;
    }
    .marker-block-9 {
        left: 352px;
    }
    .marker-block-10 {
        left: 411px;
    }
    .marker-block-11 {
        left: 324px;
    }
}
@media only screen and (max-width: 1234px) {
    .section-work .col-6:first-child {
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }
    .section-work .col-6:last-child {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }
    .section-work img.map {
        margin-right: 70px;
    }
    .marker-block-1  {
        left: 136px;
    }
    .marker-block-2  {
        left: 147px;
    }
    .marker-block-3 {
        left: 176px;
    }
    .marker-block-4 {
        left: 204px;
    }
    .marker-block-5 {
        left: 228px;
    }
    .marker-block-6 {
        left: 249px;
    }
    .marker-block-7 {
        left: 273px;
    }
    .marker-block-8 {
        left: 307px;
    }
    .marker-block-9 {
        left: 352px;
    }
    .marker-block-10 {
        left: 411px;
    }
    .marker-block-11 {
        left: 324px;
    }
}
@media only screen and (max-width: 1024px) {
    .section-work {
        padding: 80px 0 0;
    }
    .section-work .col-6:first-child {
        order: 2;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .section-work .col-6:last-child  {
        order: 1;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .marker-block-1  {
        left: 302px;
    }
    .marker-block-2  {
        left: 314px;
    }
    .marker-block-3 {
        left: 342px;
    }
    .marker-block-4 {
        left: 371px;
    }
    .marker-block-5 {
        left: 394px;
    }
    .marker-block-6 {
        left: 414px;
    }
    .marker-block-7 {
        left: 442px;
    }
    .marker-block-8 {
        left: 474px;
    }
    .marker-block-9 {
        left: 517px;
    }
    .marker-block-10 {
        left: 578px;
    }
    .marker-block-11 {
        left: 424px;
    }
}
@media only screen and (max-width: 767px) {
    .section-work {
        padding: 48px 0 0;
    }
    .section-work img.map {
        margin-right: -20px;
    }
    .section-work .marker-block .marker {
        min-width: 200px;
        position: absolute;
    }
    .section-work .marker-block .block {
        right: auto;
        top: 30px;
        left: 50%;
        transform: translate(-50%);
    }
    .section-work .marker-block {
        width: 100%
    }
    .marker-block-1  {
        top: 30px;
        left: auto;
    }
    .section-work .marker-block-1 .marker {
        right: 150px;
    }
    .marker-block-2  {
        left: auto;
    }
    .section-work .marker-block-2 .marker {
        right: 139px;
    }
    .marker-block-3 {
        left: auto;
    }
    .section-work .marker-block-3 .marker {
        right: 113px;
    }
    .marker-block-4 {
        left: auto;
    }
    .section-work .marker-block-4 .marker {
        right: 83px;
    }
    .marker-block-5 {
        left: auto;
    }
    .section-work .marker-block-5 .marker {
        right: 60px;
    }
    .marker-block-6 {
        left: auto;
    }
    .section-work .marker-block-6 .marker {
        right: 38px;
    }
    .marker-block-7 {
        left: auto;
    }
    .section-work .marker-block-7 .marker {
        right: 15px;
    }
    .marker-block-8 {
        left: auto;
    }
    .section-work .marker-block-8 .marker {
        right: -6px;
    }
    .marker-block-9 {
        left: auto;
    }
    .section-work .marker-block-9 .marker {
        right: 118px;
        min-width: auto;
    }
    .section-work .marker-block.marker-block-9 .marker span,
    .section-work .marker-block.marker-block-10 .marker span {
        order: 2;
        margin: 0 0 0 4px;
    }
    .marker-block-10 {
        left: auto;
    }
    .section-work .marker-block-10 .marker {
        right: 59px;
        min-width: auto;
    }
    
    .marker-block-11 {
        left: auto;
    }
    .section-work .marker-block-11 .marker {
        right: 40px;
    }
}







footer {
    background: #073A33;
    border-radius: 32px 32px 0 0;
    margin: 120px 0 0;
    padding: 80px 0 0;
    color: #FAF9F1;
}
.footer-block {
    max-width: 580px;
    padding-bottom: 48px;
}
.footer-block .title {
    margin: 0;
    color: #FAF9F1;
}
.footer-block hr {
    margin: 24px 0;
    border: 0;
    border-bottom: 1px solid hsl(53deg 47% 96% / 10%);
}
.footer-block .tel {
    color: #FAF9F1;
    font-size: 32px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: -0.64px;
    text-decoration: none;
}
.footer-block .messenger {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 16px 0 24px;
    list-style: none;
    gap: 16px;
}
.footer-block .messenger li a {
    height: 48px;
    border-radius: 12px;
    border: 1px solid #FAF9F1;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 12px;
    color: #FAF9F1;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: -0.28px;
    transition: 0.3s;
    text-decoration: none;
}
.footer-block .messenger li a svg {
    margin-right: 12px;
}
.footer-block .block-soc {
    font-size: 14px;
    line-height: 18px;
    letter-spacing: -0.28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.footer-block .block-soc .soc {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
    gap: 16px;
    min-width: 112px;
    list-style: none;
}
.footer-block .block-soc .soc li a {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    border: 1px solid #FAF9F1;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.3s;
}
.footer-block .messenger li a:hover,
.footer-block .block-soc .soc li a:hover {
    background: #FAF9F1;
    color: #073A33
}
.footer-block .messenger li a svg path,
.footer-block .block-soc .soc li a svg path {
    transition: 0.3s;
}
.footer-block .messenger li a:hover svg path,
.footer-block .block-soc .soc li a:hover svg path {
    fill: #073A33;
}
.footer-block p {
    font-size: 14px;
    line-height: 18px; 
    letter-spacing: -0.28px;
    margin: 8px 0;
} 
.footer-block p a {
    color: #FAF9F1;
}
footer form {
    border-radius: 24px 24px 0 0;
    background: #EEECE0;
    padding: 40px;
    height: 100%;
}
footer .wpcf7 {
    height: 100%;
}
.form-container {
    display: flex;
    align-content: space-between;
    flex-wrap: wrap;
    height: 100%;
}
.form-container > div {
    width: 100%;
}
.form-container .btn {
    width: 100%;
}
@media only screen and (max-width: 1234px) {
    footer .col-7, footer .col-5 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .footer-block {
        max-width: 100%;
    }
    .footer-center, .footer-bottom {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .footer-center > div {
        width: 50%;
    }
}
@media only screen and (max-width: 1024px) {
    footer {
        margin: 80px 0 0;
        padding: 48px 0 0;
    }
    .footer-center > div {
        width: 100%;
    }
}
@media only screen and (max-width: 767px) {
    footer {
        margin: 48px 0 0;
    }
    .footer-block {
        padding-bottom: 32px;
    }
    .footer-block hr {
        margin: 16px 0;
    }
    .footer-block .messenger li a {
        font-size: 0;
    }
    .footer-block .messenger li a svg {
        margin: 0;
    }
    .footer-block .block-soc {
        flex-wrap: wrap;
        gap: 8px;
    }
    footer form {
        padding: 24px;
    }
}

.wpcf7 form .wpcf7-response-output {
   display: none!important;
}
.popup.fancybox-content {
    padding: 56px;
    max-width: 550px;
    border-radius: 24px;
    background: #EEECE0;
}
.popup .icon {
    margin: auto;
}
.popup .form-bottom {
    margin: 8px 0 0;
}
.popup .form-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: -0.48px;
    text-align: center;
}
.popup#thankyou .form-title {
    margin: 24px 0 16px;
}
.popup .form-text {
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 18px;
    letter-spacing: -0.28px;
    opacity: 0.8;
    margin: 16px 0 32px;
}
.popup#thankyou .form-text {
    margin: 0;
}
@media only screen and (max-width: 767px) {
    .popup.fancybox-content {
        padding: 48px 24px;
    }
}

.section-page-text {
    padding: 120px 0 0;
}
.section-page-text .container {
    max-width: 900px;
    margin: auto;
}
.section-page-text  h2 {
    font-weight: 500;
    line-height: 113%;
    font-size: 40px;
    line-height: 46px;
    letter-spacing: -1.6px;
    text-transform: uppercase;
    color: #0e1c1a;
    margin: 24px 0;
}
@media only screen and (max-width: 1024px) {
    .section-page-text {
        padding: 80px 0 0;
    }
    .section-page-text  h2 {
        font-size: 30px;
        line-height: 36px; 
        letter-spacing: -1.2px;
    }
}
@media only screen and (max-width: 767px) {
    .section-page-text {
        padding: 48px 0 0;
    }
}