/* ===== Header ===== */
.header {
    position: sticky;
    top: 0;
    z-index: 11;
    background-color: var(--bg);
    padding: 10rem 0 20rem;
}

.header__wrapper {
    display: flex;
    justify-content: space-between;
    gap: var(--gap);
}

.header__container {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: var(--gap2);
    width: 100%;
}

.header__logo {
    width: 270rem;
    flex: 0 0 auto;
}

.logo {
    display: flex;
}

.logo__icon {
    width: 100%;
}

.logo__icon img {
    width: 100%;
}

.header__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10rem;
}

.header__icon {
    width: 40rem;
    height: 40rem;
    border-radius: 50%;
    background-color: #fff;
    padding: 10rem;
    transition: background-color .4s ease;
}

.header__icon>* {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.header__nav ul {
    display: flex;
    gap: var(--gap);
    list-style-type: none;
}

.header__nav a {
    text-transform: uppercase;
    font-size: 14rem;
}

/* ===== Hero ===== */
.hero {
    position: relative;
    min-height: 600rem;
    display: flex;
    align-items: center;
    padding: 50rem 0;
    z-index: 1;
}

.hero::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 43%;
    background-color: var(--accent);
    z-index: -1;
}

.hero__content {
    width: 35%;
    margin-left: auto;
}

.hero__content.big {
    width: 45%;
}

.hero__title.h2 {
    font-size: 50rem;
}

.hero-img {
    position: absolute;
    width: 58%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -2;
}

.hero .btn {
    position: absolute;
    bottom: var(--gap);
}

.hero__content:not(.big) .hero__text {
    font-size: 24rem;
}

.hero-mask {
    position: absolute;
    top: 0;
    left: 42%;
    height: 100%;
    z-index: -2;
}

.hero-mask img {
    width: 100%;
    height: 100%;
    display: block;
}

.hero__text.description ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10rem;
}

/* ===== Houses ===== */
.houses__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gap);
}

.houses__grid--wide {
    grid-template-columns: repeat(6, 1fr);
}

.house-card {
    background: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10rem;
    cursor: pointer;
    transition: transform .4s ease;
    overflow: hidden;
    border-radius: 15rem;
}

.house-card__header {
    display: grid;
    gap: 10rem;
    padding: 15rem 5rem 0 15rem;
}
.houses__grid--wide .house-card__title {
    font-size: 18rem!important;
}
.house-card__label {
    font-size: 14rem;
    color: var(--black);
    text-transform: uppercase;
}

.house-card__image img {
    object-fit: contain;
}

.house-card__title {
    text-transform: uppercase;
    margin-bottom: 0;
    transition: color .4s ease;
}

/* ===== Values ===== */
.values {
    background-color: #fff;
}

.values:has(.heading) .values__grid {
    margin-top: var(--gap);
}

.values__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap);
}

.values__grid-3 {
    grid-template-columns: repeat(3, 1fr);
}

.values__grid:not(.values__grid-3) .value-item:nth-child(odd) {
    padding-left: 0;
}

.values__grid:not(.values__grid-3) .value-item:nth-child(even) {
    padding-right: 0;
}

.values__grid:not(.values__grid-3) .value-item:nth-child(odd)::before {
    display: none;
}

.values__grid-3 .value-item:nth-child(3n+1) {
    padding-left: 0;
}

.values__grid-3 .value-item:nth-child(3n) {
    padding-right: 0;
}

.values__grid-3 .value-item:nth-child(3n+1)::before {
    display: none;
}

.value-item {
    position: relative;
    padding: 0 var(--gap2);
}

.value-item__title {
    margin-bottom: 10rem;
}

.value-item__text {
    opacity: 0.6;
}

.value-item::before {
    content: '';
    position: absolute;
    left: calc(var(--gap2)*-1);
    width: 1rem;
    height: 100%;
    background-color: var(--black);
    opacity: 0.1;
}

.value-item__icon {
    width: 46rem;
    height: 46rem;
    padding: 10rem;
    background-color: #f7f8fc;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--gap2);
}

.value-item__icon>* {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* ===== About ===== */
.about__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gap);
}

.about-video {
    margin-top: var(--gap);
    position: relative;
    z-index: 1;
    cursor: pointer;
    display: flex;
}

.about-video::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--black);
    opacity: 0.4;
}

.about-video__img {
    height: 600rem;
}

.video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 126rem;
    height: 126rem;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .4s ease;
}

.video-play::before {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 23rem 0 23rem 39.8rem;
    border-color: transparent transparent transparent var(--accent);
    transform: rotate(0deg);
    position: relative;
    left: 5rem;
    transition: border-color .4s ease;
}

/* ===== CTA ===== */
.cta {
    padding-top: 0;
}

.cta__grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: var(--gap);
}

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

.cta__title {
    margin-bottom: var(--gap2);
}

.cta__text {
    position: relative;
    z-index: 1;
    margin-bottom: var(--gap2);
}

.cta__image {
    margin-top: auto;
    height: 100%;
}

.cta__content.min {
    width: 80%;
}

.cta-form {
    background: #fff;
    padding: 30rem;
    display: grid;
    gap: var(--gap2);
}

.cta-form__group {
    display: grid;
    gap: 14rem;
}

/* ===== Mission ===== */
.mission__grid {
    display: grid;
    grid-template-columns: 420rem 1fr;
    gap: var(--gap);
}

/* ===== block-info ===== */
.block-info {
    padding: 0;
}

.block-info__grid {
    display: grid;
    grid-template-columns: 635rem 1fr;
    gap: var(--gap);
    position: relative;
    z-index: 1;
}

.block-info__grid--video {
    grid-template-columns: 50% 50%;
}

.block-info__wrap {
    min-width: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

.block-info__wrap .btn {
    margin-top: var(--gap);
}

.block-info__image {
    max-height: 450rem;
}

/* ===== Belief ===== */
.belief:not(.padding) {
    padding: 0;
}

.belief__content {
    background-color: #fff;
    position: relative;
    padding: 50rem;
    z-index: 1;
    overflow: hidden;
}

.heading:has(.belief__title) {
    width: 80%;
}

.heading:has(.belief__title) .img-mask.down {
    left: auto;
    right: 0;
}

.belief__text {
    width: 70%;
    position: relative;
    z-index: 1;
    min-width: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

.belief__text ul {
    list-style: none;
    display: grid;
    gap: var(--gap);
    margin-bottom: var(--gap);
}

.belief__text ul:not(:first-child) {
    margin-top: var(--gap);
}

.belief__text li {
    position: relative;
    padding-left: 60rem;
}

.belief__text li::before {
    content: "✔";
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 46rem;
    height: 46rem;
    background-color: #f7f8fc;
}

.belief__text>* {
    text-transform: inherit;
}

.belief__image {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 430rem;
    z-index: 1;
}

.belief__image img {
    object-fit: contain;
}

/* ===== Foundation ===== */
.foundation__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gap);
    margin-top: 60rem;
}

.foundation-item {
    display: grid;
    gap: var(--gap);
    justify-items: center;
    text-align: center;
    padding: 50rem 30rem 40rem;
    background-color: #fff;
}

.foundation-item__icon {
    background: var(--accent);
    width: 160rem;
    height: 160rem;
    display: grid;
    place-items: center;
}

.foundation-item__icon>* {
    width: 60rem;
    height: 60rem;
    object-fit: contain;
}

/* ===== Concept ===== */
.concept {
    background: #fff;
    position: relative;
    padding: 120rem 0;
}

.concept__content {
    width: 70%;
}

.concept__image {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 700rem;
    object-fit: contain;
}

.concept-hero {
    min-height: 540rem;
    background-color: transparent;
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: -120rem;
}

.concept-hero .concept__content {
    width: 43%;
}

.concept-hero .concept__image {
    height: 540rem;
    width: auto;
}

/* ===== Values Hero ===== */
.values {
    padding: 120rem 0;
}

.values-hero {
    padding-bottom: 0;
}

.values-hero__grid {
    display: grid;
    grid-template-columns: 50% 50%;
    gap: var(--gap);
    align-items: center;
}

/* ===== Why ===== */
.why {
    background-color: #fff;
    padding: 120rem 0;
}

.why__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap);
}

.why-card {
    background: #f7f8fc;
    padding: 30rem;
    display: flex;
    flex-direction: column;
}

.why-card::before {
    width: 40rem;
    height: 40rem;
    background: var(--accent);
    display: grid;
    place-items: center;
    margin-bottom: var(--gap2);
}

.why-card:has(.btn) .why-card__text {
    margin-bottom: var(--gap);
}

/* ===== Materials ===== */
.materials__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap);
}

.materials-card {
    display: flex;
    flex-direction: column;
    gap: var(--gap2);
}

.materials-card__image {
    height: 370rem;
}

/* ===== Contacts ===== */
.contacts__grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: var(--gap);
}

.contacts__map {
    min-height: 300rem;
    height: 100%;
    background: #fff;
    position: relative;
}

.contacts__map iframe {
    position: relative;
    z-index: 1;
}

.contacts__info {
    display: grid;
    gap: var(--gap2);
    background-color: #fff;
    padding: 30rem;
}

.contacts__phones {
    display: grid;
    gap: 2rem;
}

.contacts__phone,
.contacts__email {
    font-size: 20rem;
}

.contacts__address {
    font-size: 16rem;
}

.contacts__socials .social {
    background-color: var(--accent);
}

/* ===== Service ===== */
.service {
    padding: 0;
}

.service__item-dop {
    margin-top: 60rem;
}

.service__item {
    padding: 120rem 0;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.service__item:first-child {
    padding-top: 0;
}

.service__item:last-child {
    padding-bottom: 0;
}

.service__item-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gap);
    align-items: center;
}

.service__item:nth-child(even) {
    background-color: #fff;
}

.service__item:nth-child(even) .service__item-image {
    order: -1;
}

.service__item:nth-child(even)::before {
    content: '';
    position: absolute;
    top: -85rem;
    left: 62%;
    transform: translateX(-50%);
    background-image: url(../images/svg/mask3.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 390rem;
    height: 170rem;
    z-index: -1;
}

.service__item:nth-child(4n)::before {
    background-image: url(../images/svg/mask1.svg);
    top: -75rem;
    left: 20%;
    width: 360rem;
    height: 150rem;
}

.service__item-image {
    height: 600rem;
}

/* ===== advantage ===== */
.advantage__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gap);
}

.advantage-card {
    background-color: #fff;
    padding: 30rem;
}

.advantage-card::before {
    content: '✔';
    width: 40rem;
    height: 40rem;
    background: var(--accent);
    display: grid;
    place-items: center;
    margin-bottom: var(--gap2);
}

/* ===== Quality ===== */
.quality__header .btn {
    margin: var(--gap) auto 0;
}

.quality__certs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap);
    margin-top: 60rem;
}

.quality__cert {
    background: #fff;
    height: 770rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ===== Production ===== */
.production__header .btn {
    margin: var(--gap) auto 0;
}

.production__header .description {
    width: 80%;
    margin: 0 auto;
}

.production__gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gap);
    margin-top: 60rem;
}

.production__item {
    height: 260rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.production .heading .img-mask {
    left: auto;
    right: 10%;
}

/* ===== projects ===== */
.projects__layout {
    display: grid;
    gap: var(--gap);
    margin-top: 60rem;
}

.projects__layout:has(.projects-filter) {
    grid-template-columns: 280rem 1fr;
}

.projects__layout:has(.projects-filter) .projects-grid {
    grid-template-columns: 1fr;
}

.projects__layout:has(.projects-filter) .project-card__title {
    font-size: 32rem;
}

.projects__layout:has(.projects-filter) .project-card {
    min-height: 400rem;
    border-radius: 15rem;
}

.projects-filter__group {
    margin-bottom: var(--gap);
}

.projects-filter__title {
    font-size: 32rem;
    margin-bottom: var(--gap2);
}

.projects-filter__label {
    font-size: 20rem;
    margin-bottom: var(--gap2);
}

.projects-filter__range {
    display: flex;
    justify-content: space-between;
    font-size: 14rem;
    margin-bottom: 10rem;
}

.projects-filter__inputs {
    display: flex;
    gap: 10rem;
}

.projects-filter__inputs input {
    width: 100%;
    height: 40rem;
    border-radius: 20rem;
    padding: 8rem 14rem;
    background-color: #fff;
    font-size: 14rem;
}

.projects-filter__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10rem;
}

.projects-filter__buttons label {
    min-height: 40rem;
    min-width: 40rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8rem 14rem;
    border-radius: 20rem;
    border: none;
    background: #fff;
    cursor: pointer;
    text-align: left;
    font-size: 14rem;
    font-family: "manrope-r", sans-serif;
    transition: background-color .4s ease, color .4s ease;
}

.projects-filter__buttons label::after,
.projects-filter__buttons label::before {
    display: none;
}

.projects-filter .check input[type=checkbox]:checked+label {
    background-color: var(--accent);
}

.projects-filter__buttons .is-active {
    background-color: var(--accent);
}

.projects-content__top {
    display: flex;
    align-items: center;
    gap: var(--gap2);
    margin-bottom: var(--gap);
}

.projects-search input {
    width: 240rem;
    height: 44rem;
    border-radius: 10rem;
    padding: 14rem;
    padding-left: 34rem;
    background-color: #fff;
    background-image: url(../images/svg/search.svg);
    background-repeat: no-repeat;
    background-position: 10rem center;
    background-size: 14rem;
}

.projects-search input::placeholder {
    color: rgba(0, 0, 0, .3);
}

.projects-count {
    font-size: 16rem;
}

.projects-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gap);
    position: sticky;
    top: 160rem;
}

.project-card {
    position: relative;
    z-index: 1;
    padding: 15rem;
    display: flex;
    flex-direction: column;
    gap: var(--gap2);
    overflow: hidden;
    min-height: 300rem;
}

.project-card::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 24%;
    z-index: -1;
    opacity: 0.5;
    background: linear-gradient(to top, var(--black) 0%, transparent 100%);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.project-card__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
}

.project-card__img img {
    transition: scale .4s ease;
}

.project-card__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10rem;
}

.project-card__badge {
    background: #fff;
    border-radius: 10rem;
    padding: 6rem 10rem;
    font-size: 14rem;
    display: flex;
    align-items: center;
    gap: 10rem;
    color: var(--black);
}

.project-card__badge img {
    width: 12rem;
    height: 12rem;
    object-fit: contain;
}

.project-card__bottom {
    color: #fff;
    display: grid;
    gap: var(--gap2);
}

.project-card__title {
    font-size: 22rem;
    line-height: 110%;
    color: #fff;
    transition: color .4s ease;
    text-transform: uppercase;
}

/* ===== project ===== */
.project__grid {
    display: flex;
    gap: var(--gap);
}

.project__grid>* {
    width: 50%;
}

.project__image {
    height: 560rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15rem;
    overflow: hidden;
}

.project__gallery {
    overflow: hidden;
    width: 60%;
}

.project__gallery-inner {
    position: relative;
}

.project-card__badges--on-slider {
    position: absolute;
    top: 20rem;
    left: 20rem;
    z-index: 2;
}

.project__info {
    width: 40%;
    height: 100%;
    padding: 42rem 50rem;
    border-radius: 15px;
    border: 1px solid #888;
}

.project__thumb {
    height: 60rem;
    cursor: pointer;
    border-radius: 5rem;
    overflow: hidden;
}

.project-slider-thumbs {
    margin: var(--gap2) auto 0;
    width: calc(100% - 140rem);
    overflow: visible;
}

.project-slider-thumbs .swiper-button.prev {
    left: -70rem;
}

.project-slider-thumbs .swiper-button.next {
    right: -70rem;
}

.project__params {
    display: grid;
    gap: var(--gap2);
}

.project__param {
    display: flex;
    align-items: flex-end;
    gap: 8rem;
}

.project__param-label {
    font-size: 16rem;
    color: #4D4D4D;
    font-weight: 500;
    flex-shrink: 0;
}

.project__param-dots {
    flex-grow: 1;
    border-bottom: 2px dotted rgba(77, 77, 77, 0.4);
    margin: 0 4rem;
    min-width: 20rem;
    align-self: flex-end;
    margin-bottom: 4rem;
}

.project__param-value {
    font-size: 16rem;
    color: #000;
    font-weight: 500;
    flex-shrink: 0;
}
.project__info .btn {
    margin-top: var(--gap);
}

.btn--order {
    height: 100%;
    line-height: 1;
    width: 100%;
    max-width: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.project__price {
    display: block;
    margin-top: var(--gap);
    font-size: 35rem;
}

.project__title {
    margin-bottom: var(--gap);
}

.project__description {
    margin-top: var(--gap);
    width: 100%;
}

/* ===== plans ===== */
.plans__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap);
}

.plan__image {
    height: 560rem;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.plan__image img {
    object-fit: contain;
}

.plan__title {
    margin-bottom: var(--gap2);
}

.plans-cta {
    background-color: #fff;
    padding: 50rem;
    margin-top: var(--gap2);
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.plans-cta__wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gap);
}

.plans-cta__content {
    width: 70%;
}

.plans-cta .img-mask {
    position: absolute;
    top: -60rem;
    left: 0;
    width: 400rem;
    z-index: -1;
}

.plans-cta .btn {
    flex: 0 0 auto;
}

/* ===== faq ===== */
.faq__grid {
    display: grid;
    gap: var(--gap2);
    counter-reset: item-counter;
}

.faq__item {
    background-color: #fff;
}

.faq__item-title {
    font-size: 20rem;
    padding: 24rem;
    display: flex;
    align-items: center;
    gap: var(--gap2);
}

.faq__item-title span::before {
    content: counter(item-counter);
    counter-increment: item-counter;
    width: 40rem;
    height: 40rem;
    background: var(--accent);
    display: grid;
    place-items: center;
}

.faq__item-text {
    padding: 0 24rem 30rem;
}

/* ===== toggle ===== */
.js-toggle {
    position: relative;
    cursor: pointer;
    padding-right: 40rem;
}

.js-toggle::after,
.js-toggle::before {
    content: '';
    position: absolute;
    top: 50%;
    right: 10rem;
    width: 10rem;
    height: 2rem;
    background-color: var(--black);
    transition: transform .4s ease;
}

.js-toggle::before {
    transform: translate(-80%, -50%) rotate(45deg);
}

.js-toggle::after {
    transform: translate(-20%, -50%) rotate(-45deg);
}

.js-toggle.is-active::before {
    transform: translate(-80%, -50%) rotate(-45deg);
}

.js-toggle.is-active::after {
    transform: translate(-20%, -50%) rotate(45deg);
}

.toggle-body {
    display: none;
}

/* ===== pagination ===== */
.pagination ul {
    margin-top: var(--gap);
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10rem;
}

.pagination a {
    width: 48rem;
    height: 48rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1rem solid var(--accent);
}

.pagination .current {
    width: 48rem;
    height: 48rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1rem solid var(--accent);
    background-color: var(--accent);
    color: #fff;
}

.pagination a.next,
.pagination a.prev {
    display: none;
}

/* ===== Footer ===== */
.footer {
    margin-top: auto;
}

.footer .h3 {
    text-transform: none;
}

.footer__wrapper {
    padding: 50rem 0;
    border-top: 1rem solid rgba(0, 0, 0, .14);
}

.footer__grid {
    display: grid;
    grid-template-columns: 1.25fr .75fr .75fr;
    gap: var(--gap);
}

.footer__icon {
    display: flex;
    width: 280rem;
}

.footer__icon img {
    width: 100%;
}

.footer__company {
    margin-top: var(--gap);
}

.footer__bottom {
    margin-top: var(--gap);
    font-size: 14rem;
    opacity: .4;
}

.footer__bottom a {
    text-decoration: underline;
}

.footer__nav ul {
    list-style: none;
    display: grid;
    gap: var(--gap2);
}

.footer__nav a {
    font-size: 16rem;
}

.footer__contacts-info {
    font-size: 20rem;
    display: grid;
    gap: 2rem;
}

.footer__address {
    margin: var(--gap2) 0;
    font-size: 16rem;
}

/* ===== socials ===== */
.socials {
    display: flex;
    flex-wrap: wrap;
    gap: 10rem;
}

.social {
    width: 40rem;
    height: 40rem;
    padding: 10rem;
    background-color: #fff;
    border-radius: 50%;
    transition: background-color .4s ease;
}

.social>* {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* ===== modal ===== */
.modal {
    visibility: hidden;
    opacity: 0;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    background: rgba(106, 106, 106, .9);
    z-index: 9999;
    transition: visibility 0s .25s, opacity .25s;
}

.modal.active {
    visibility: visible;
    opacity: 1;
}

.modal__wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.modal__body {
    position: relative;
    margin: 0 var(--indent);
    max-height: 100%;
    width: 560rem;
    max-width: 90%;
    opacity: 0;
    background-color: #fff;
    transition: opacity 0s .25s, opacity .25s;
}

.modal.show .modal__body {
    opacity: 1;
    transition: opacity 0s 0s, opacity .25s;
}

.modal__inner {
    width: 100%;
    height: 100%;
    position: relative;
}

.modal__image img {
    width: 100%;
    height: 360rem;
}

.modal__inner-wrap {
    padding: 40rem 36rem;
    background-color: #fff;
}

.modal__close {
    position: absolute;
    top: 10rem;
    right: 10rem;
    font-size: 40rem;
    height: 20rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    color: var(--black);
    z-index: 2;
    cursor: pointer;
    transition: color .4s ease;
}

.modal-heading {
    width: 80%;
    margin: 0 auto;
}

.modal__text {
    margin-bottom: var(--gap2);
}

.modal form {
    padding: 0;
}

/* ===== load ===== */
.load {
    border: 6rem solid #EAF0F6;
    border-top: 6rem solid var(--accent);
    border-radius: 50%;
    width: 40rem;
    height: 40rem;
    animation: spinner 1s linear infinite;
    padding: 0;
    display: flex;
}

.load-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.load:not(.load-lazy)>* {
    display: none;
}

.load-lazy>* {
    opacity: 0;
    visibility: hidden;
}

.lazy {
    width: 100%;
    height: 100%;
}

@keyframes spinner {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* ===== swiper ===== */
.swiper-button {
    position: absolute;
    top: 0;
    z-index: 1;
    width: 60rem;
    height: 60rem;
    background-color: var(--accent);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 10rem;
}

.swiper-button.prev {
    left: 0;
}

.swiper-button.next {
    right: 0;
}

/* ===== */
.bar-menu {
    display: none;
}

.bg-white {
    background-color: #fff;
}

.text-center {
    text-align: center;
}


.pt-0 {
    padding-top: 0;
}

.pb-0 {
    padding-bottom: 0;
}

.mt-auto {
    margin-top: auto;
}

.mt-0 {
    margin-top: 0;
}

.mb-0 {
    margin-bottom: 0;
}
/* ===== Partners ===== */
.partners__list {
    display: flex;
    flex-direction: column;
    gap: 20rem;
}

.partner-card {
    display: flex;
    align-items: center;
    gap: 40rem;
    padding: 30rem 40rem;
    background-color: var(--bg);
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 12rem;
    text-decoration: none;
    color: inherit;
    transition: transform .4s ease;
}

a.partner-card:hover {
    transform: translateY(-2rem);
}

.partner-card__logo {
    flex: 0 0 50%;
    max-width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-right: 40rem;
    border-right: 1px solid rgba(0, 0, 0, .08);
}

.partner-card__logo img {
    max-width: 100%;
    max-height: 120rem;
    width: auto;
    height: auto;
    object-fit: contain;
}

.partner-card__content {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    gap: 12rem;
}

.partner-card__name {
    font-size: 22rem;
    font-weight: 600;
    margin: 0;
}

a.partner-card:hover .partner-card__logo img {
    transform: scale(1.1);
}

.partner-card__logo img {
    transition: transform .4s ease;
}

/* ===== Village gallery in partner card ===== */
.partner-card__gallery {
    flex: 0 0 50%;
    max-width: 50%;
    overflow: hidden;
    border-radius: 8rem;
}

.village-slide {
    width: 100%;
    aspect-ratio: 16/10;
    overflow: hidden;
}

.village-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.village-slider {
    position: relative;
}

.village-slider .swiper-navigation {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
    pointer-events: none;
    padding: 0 8rem;
}

.village-slider .swiper-button {
    position: static;
    width: 36rem;
    height: 36rem;
    border-radius: 50%;
    pointer-events: all;
    font-size: 18rem;
    opacity: .85;
}

.village-slider .swiper-button:hover {
    opacity: 1;
}

/* ===== Village thumbs ===== */
.village-thumbs {
    margin-top: 8rem;
    position: relative;
}

.village-thumb {
    aspect-ratio: 1/1;
    border-radius: 6rem;
    overflow: hidden;
    cursor: pointer;
    opacity: .5;
    transition: opacity .2s ease;
}

.village-thumbs .swiper-slide-thumb-active .village-thumb {
    opacity: 1;
}

.village-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.village-thumbs .swiper-navigation {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
    pointer-events: none;
    padding: 0 4rem;
}

.village-thumbs .swiper-button {
    position: static;
    width: 24rem;
    height: 24rem;
    border-radius: 50%;
    pointer-events: all;
    font-size: 14rem;
}

/* ===== CTA column layout ===== */
.cta--column .cta__grid {
    grid-template-columns: 1fr;
    max-width: 600rem;
    margin: 0 auto;
    text-align: center;
}

.cta--column .cta__content {
    align-items: center;
}

/* ===== Breadcrumbs ===== */
.breadcrumbs {
    padding: 16rem 0;
    font-size: 14rem;
    color: var(--text-light, #888);
}

.breadcrumbs a {
    color: var(--text-light, #888);
    text-decoration: none;
    transition: color .2s ease;
}

.breadcrumbs a:hover {
    color: var(--accent);
}

.breadcrumbs__sep {
    margin: 0 6rem;
    opacity: .5;
}

.breadcrumbs span:last-child {
    color: var(--text, #333);
}

/* ===== Media gallery (contacts) ===== */
.media-gallery {
    padding-left: 20rem;
    padding-right: 20rem;
}

.media-gallery__block {
    display: flex;
    flex-direction: column;
    gap: 12rem;
}

.media-gallery__block + .media-gallery__block {
    margin-top: 12rem;
}

.media-gallery__row {
    display: grid;
    gap: 12rem;
    height: 280rem;
}

.media-gallery__row.row--a {
    grid-template-columns: 1.3fr 0.7fr 1fr;
}

.media-gallery__row.row--b {
    grid-template-columns: 0.7fr 1fr 1.3fr;
}

.media-gallery__row.row--c {
    grid-template-columns: 1fr 1.3fr 0.7fr;
}

.media-gallery__item {
    display: block;
    position: relative;
    border-radius: 8rem;
    overflow: hidden;
    height: 100%;
}

.media-gallery__item img,
.media-gallery__item video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.media-gallery__item .video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* ===== Portfolio plans slider ===== */
.plans--portfolio {
    overflow: visible;
}

.plans--portfolio .container {
    overflow: visible;
}

.plans--portfolio .plans-slider {
    position: relative;
    overflow: visible;
}

.plans--portfolio .plans-slider .plan {
    height: 100%;
}

.plans--portfolio .plans-slider .plan__image {
    height: 200rem;
}

.plans-slider-nav {
    position: absolute;
    top: 50%;
    left: -30rem;
    right: -30rem;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
    pointer-events: none;
}

.plans-slider-nav .swiper-button {
    position: static;
    pointer-events: all;
    border-radius: 50%;
}

/* ===== Portfolio media (gallery + description) ===== */
.portfolio-media__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gap);
    align-items: start;
    max-width: 100%;
    overflow: hidden;
}

.portfolio-media__gallery {
    min-width: 0;
}

.portfolio-media__slide {
    display: block;
    position: relative;
    aspect-ratio: 16/10;
    border-radius: 8rem;
    overflow: hidden;
}

.portfolio-media__slide img,
.portfolio-media__slide video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.portfolio-media__slide .video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.port-media-thumbs {
    margin-top: 8rem;
    position: relative;
}

.port-media-thumb {
    aspect-ratio: 1/1;
    border-radius: 6rem;
    overflow: hidden;
    cursor: pointer;
    opacity: .5;
    transition: opacity .2s ease;
    position: relative;
}

.port-media-thumbs .swiper-slide-thumb-active .port-media-thumb {
    opacity: 1;
}

.port-media-thumb img,
.port-media-thumb video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.port-media-thumb .video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 24rem;
    height: 24rem;
}

.port-media-thumbs .swiper-navigation {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
    pointer-events: none;
    padding: 0 4rem;
}

.port-media-thumbs .swiper-button {
    position: static;
    width: 24rem;
    height: 24rem;
    border-radius: 50%;
    pointer-events: all;
    font-size: 14rem;
}

.portfolio-media__desc {
    position: sticky;
    top: 100rem;
    min-width: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

.project-card__badge--category:not(:has(img)) {
    padding-left: 10rem;
}

/* ===== Project video slider (block with video) ===== */
.project-video-slider__title {
    margin-bottom: var(--gap);
}

.project-video-slider__gallery {
    min-height: 0;
    position: relative;
}

.project-video-slider-main {
    aspect-ratio: 16/10;
    width: 100%;
    max-height: 70vh;
    border-radius: 15rem;
    overflow: hidden;
}

.project-video-slider-main .swiper-wrapper,
.project-video-slider-main .swiper-slide {
    height: 100%;
}

.project-video-slider__slide {
    display: block;
    position: relative;
    aspect-ratio: 16/10;
    overflow: hidden;
}

.project-video-slider__slide img,
.project-video-slider__slide video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.project-video-slider__slide .video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.project-video-slider-thumbs {
    margin-top: 8rem;
    position: relative;
}

.project-video-slider__thumb {
    aspect-ratio: 1/1;
    border-radius: 8rem;
    overflow: hidden;
    cursor: pointer;
    opacity: .5;
    transition: opacity .2s ease;
    position: relative;
}

.project-video-slider-thumbs .swiper-slide-thumb-active .project-video-slider__thumb {
    opacity: 1;
}

.project-video-slider__thumb img,
.project-video-slider__thumb video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.project-video-slider__thumb .video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 24rem;
    height: 24rem;
}

.project-video-slider-thumbs .swiper-navigation {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
    pointer-events: none;
    padding: 0 4rem;
}

.project-video-slider-thumbs .swiper-button {
    position: static;
    width: 24rem;
    height: 24rem;
    border-radius: 50%;
    pointer-events: all;
    font-size: 14rem;
}

/* Страница «О нас» — блоки миссии: колонка с отступом 100rem */
.page-about__mission-blocks {
    display: flex;
    flex-direction: column;
    gap: 100rem;
    margin-bottom: 100rem;
}