/*
 * VIDA public theme styles.
 *
 * The file follows the production cascade. Keep shared foundations first and
 * page-specific refinements later so equal-specificity rules stay predictable.
 */

/* Roboto Flex, self-hosted under the SIL Open Font License 1.1. */
@font-face {
    font-family: "Roboto Flex";
    src: url("../fonts/RobotoFlex-CyrillicExt.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 1000;
    font-stretch: 25% 151%;
    font-display: swap;
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* First-visit cookie notice: one acknowledgement, no preference manager. */
.cookie-notice {
    position: fixed;
    z-index: 900;
    bottom: max(20px, env(safe-area-inset-bottom));
    right: max(20px, env(safe-area-inset-right));
    width: min(340px, calc(100vw - 40px));
}

.cookie-notice[hidden] {
    display: none;
}

.cookie-notice__card {
    padding: 16px;
    border: 1px solid rgba(6, 47, 80, .12);
    border-radius: 14px;
    color: var(--vida-blue);
    background: var(--vida-white);
    box-shadow: 0 16px 44px rgba(6, 47, 80, .18);
}

.cookie-notice h2 {
    margin: 0 0 6px;
    font-size: 18px;
    line-height: 1.2;
}

.cookie-notice p {
    margin: 0;
    color: rgba(6, 47, 80, .72);
    font-size: 13px;
    line-height: 1.45;
}

.cookie-notice__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
}

.cookie-notice__links {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.cookie-notice__links a {
    color: var(--vida-blue);
    font-size: 12px;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.cookie-notice__accept {
    min-width: 104px;
    padding: 10px 16px;
    font-size: 12px;
}

.cookie-notice__links a:focus-visible,
.cookie-notice__accept:focus-visible {
    outline: 2px solid var(--vida-blue);
    outline-offset: 3px;
}

@media (max-width: 540px) {
    .cookie-notice {
        right: max(12px, env(safe-area-inset-right));
        bottom: max(12px, env(safe-area-inset-bottom));
        left: auto;
        width: min(340px, calc(100vw - 24px));
    }

    .cookie-notice__card {
        padding: 14px;
    }
}

@font-face {
    font-family: "Roboto Flex";
    src: url("../fonts/RobotoFlex-Cyrillic.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 1000;
    font-stretch: 25% 151%;
    font-display: swap;
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: "Roboto Flex";
    src: url("../fonts/RobotoFlex-LatinExt.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 1000;
    font-stretch: 25% 151%;
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Roboto Flex";
    src: url("../fonts/RobotoFlex-Latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 1000;
    font-stretch: 25% 151%;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* A second family alias keeps the wider display typography used by headings. */
@font-face {
    font-family: "Roboto Flex Extended";
    src: url("../fonts/RobotoFlex-CyrillicExt.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 1000;
    font-stretch: 25% 151%;
    font-display: swap;
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
    font-family: "Roboto Flex Extended";
    src: url("../fonts/RobotoFlex-Cyrillic.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 1000;
    font-stretch: 25% 151%;
    font-display: swap;
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: "Roboto Flex Extended";
    src: url("../fonts/RobotoFlex-LatinExt.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 1000;
    font-stretch: 25% 151%;
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Roboto Flex Extended";
    src: url("../fonts/RobotoFlex-Latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 1000;
    font-stretch: 25% 151%;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Mulish Medium is the interface face used by the reference delomdev.ru site. */
@font-face {
    font-family: "Mulish";
    src: url("../fonts/Mulish-Medium-CyrillicExt.woff2") format("woff2");
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
    font-family: "Mulish";
    src: url("../fonts/Mulish-Medium-Cyrillic.woff2") format("woff2");
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: "Mulish";
    src: url("../fonts/Mulish-Medium-LatinExt.woff2") format("woff2");
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Mulish";
    src: url("../fonts/Mulish-Medium-Latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    --vida-blue: #062f50;
    --vida-blue-2: #0e466b;
    --vida-green: #0b543c;
    --vida-cream: #ffddb0;
    --vida-cream-light: #fff1df;
    --vida-paper: #f7f7f5;
    --vida-white: #ffffff;
    --vida-ink: #082d4b;
    --vida-muted: #6f777d;
    --vida-radius: 24px;
    --vida-shadow: 0 24px 70px rgba(3, 32, 53, 0.16);
    --header-height: 78px;
    --font-body: "Mulish", Arial, sans-serif;
    --font-heading: "Roboto Flex", Arial, sans-serif;
    --type-leading-body: 1.5;
    --type-leading-heading: 1.08;
    --type-leading-display: .98;
    --type-tracking-heading: normal;
    --type-tracking-display: normal;
    --space-1: 8px;
    --space-2: 16px;
    --space-3: 24px;
    --space-4: 32px;
    --space-5: 48px;
    --space-6: 64px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    color: var(--vida-ink);
    background: var(--vida-paper);
    font-family: var(--font-body);
    font-weight: 500;
    font-synthesis-weight: none;
    font-size: 16px;
    line-height: var(--type-leading-body);
    letter-spacing: 0;
    -webkit-font-smoothing: antialiased;
}

body.menu-open,
body.modal-open {
    overflow: hidden;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    font: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

h1,
h2,
h3,
p {
    margin-top: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-heading);
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 650;
    line-height: var(--type-leading-heading);
    letter-spacing: var(--type-tracking-heading);
}

h1,
h2 {
    line-height: var(--type-leading-display);
    letter-spacing: var(--type-tracking-display);
}

h1 {
    font-size: clamp(48px, 5vw, 76px);
}

h2 {
    margin-bottom: 24px;
    font-size: clamp(36px, 4vw, 62px);
}

h3 {
    font-size: 24px;
}

p:last-child {
    margin-bottom: 0;
}

.container,
.container-wide {
    width: min(100% - 64px, 1180px);
    margin-inline: auto;
}

.container-wide {
    width: min(100% - 44px, 1240px);
}

.section {
    position: relative;
    padding-block: clamp(76px, 9vw, 132px);
    overflow: hidden;
}

.section--cream {
    background-color: var(--vida-cream-light);
}

.section--light {
    background-color: var(--vida-paper);
}

.section--blue {
    color: var(--vida-white);
    background-color: var(--vida-blue);
}

.section--accent {
    background: var(--vida-cream);
}

.pattern-cream::before,
.pattern-blue::before {
    position: absolute;
    inset: 0;
    z-index: 0;
    content: "";
    pointer-events: none;
    opacity: 0.12;
    background-image: url("../images/pattern-cream.webp");
    background-repeat: repeat;
    background-size: 380px;
}

.pattern-blue::before {
    opacity: 0.08;
    background-image: url("../images/pattern-blue.webp");
}

.pattern-cream > *,
.pattern-blue > * {
    position: relative;
    z-index: 1;
}

.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.screen-reader-text:focus {
    position: fixed !important;
    top: 16px;
    left: 16px;
    z-index: 10000;
    width: auto;
    height: auto;
    padding: 12px 16px;
    margin: 0;
    clip: auto;
    color: var(--vida-white);
    background: var(--vida-blue);
}

.site-header {
    position: fixed;
    inset: 0 0 auto;
    z-index: 100;
    color: var(--vida-white);
    transition: background-color 0.25s ease, backdrop-filter 0.25s ease, transform 0.7s ease, opacity 0.7s ease;
}

@media (min-width: 761px) {
    body.admin-bar .site-header {
        top: var(--wp-admin--admin-bar--height, 32px);
    }
}

.vida-home:not(.hero-ready) .site-header {
    opacity: 0;
    transform: translateY(-20px);
}

.site-header.is-scrolled,
body:not(.vida-home) .site-header {
    color: var(--vida-white);
    backdrop-filter: blur(16px);
}

.site-header__inner {
    display: grid;
    grid-template-columns: 160px 1fr auto;
    align-items: center;
    min-height: var(--header-height);
    gap: 24px;
}

.site-brand {
    display: inline-flex;
    align-items: center;
    width: 130px;
    min-width: 0;
}

.site-brand__image,
.custom-logo {
    width: 100%;
    max-height: 52px;
    object-fit: contain;
    object-position: left center;
}

.site-nav__list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(16px, 2vw, 30px);
    padding: 0;
    margin: 0;
    list-style: none;
}

.site-nav__item {
    position: relative;
}

.site-nav__link,
.site-nav a {
    position: relative;
    font-size: 14px;
    line-height: 1.2;
}

.site-nav__more-toggle {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0;
    color: inherit;
    background: transparent;
    border: 0;
    cursor: pointer;
    font-size: 14px;
    line-height: 1.2;
}

.site-nav__more-icon {
    flex: 0 0 auto;
    transition: transform 0.2s ease;
}

.site-nav__submenu {
    position: absolute;
    top: calc(100% + 18px);
    left: 50%;
    min-width: 190px;
    padding: 12px;
    margin: 0;
    color: var(--vida-white);
    list-style: none;
    background: rgba(6, 47, 80, 0.94);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 16px;
    box-shadow: 0 18px 40px rgba(3, 32, 53, 0.24);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, 8px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s 0.2s;
    backdrop-filter: blur(14px);
}

.site-nav__submenu::before {
    position: absolute;
    right: 0;
    bottom: 100%;
    left: 0;
    height: 18px;
    content: "";
}

.site-nav__item--has-children.is-open .site-nav__submenu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, 0);
    transition-delay: 0s;
}

.site-nav__item--has-children.is-open .site-nav__more-icon {
    transform: rotate(180deg);
}

.site-nav__submenu-link {
    display: block;
    padding: 9px 10px;
    white-space: nowrap;
    border-radius: 10px;
}

.site-nav__submenu-link:hover,
.site-nav__submenu-link:focus-visible {
    background: rgba(255, 255, 255, 0.12);
}

.site-header__actions {
    display: flex;
    align-items: center;
    gap: 18px;
}

.site-header__phone {
    font-size: 15px;
    white-space: nowrap;
}

.site-header__callback {
    padding: 0;
    color: inherit;
    text-transform: uppercase;
    background: transparent;
    border: 0;
    border-bottom: 1px solid currentColor;
    cursor: pointer;
    font-size: 13px;
}

.menu-toggle {
    display: none;
    width: 42px;
    height: 42px;
    padding: 10px;
    color: inherit;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: 50%;
    cursor: pointer;
}

.menu-toggle__line {
    display: block;
    width: 100%;
    height: 1px;
    margin-block: 4px;
    background: currentColor;
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.menu-open .menu-toggle__line:nth-child(1) {
    transform: translateY(5px) rotate(45deg);
}

.menu-open .menu-toggle__line:nth-child(2) {
    opacity: 0;
}

.menu-open .menu-toggle__line:nth-child(3) {
    transform: translateY(-5px) rotate(-45deg);
}

.hero {
    position: relative;
    min-height: max(720px, 100svh);
    overflow: hidden;
    color: var(--vida-white);
    background: var(--vida-blue);
}

.hero__background,
.hero__shade {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.hero__background {
    object-fit: cover;
    object-position: center 58%;
    opacity: 0;
    transform: scale(1.035);
    animation: hero-image-in 0.8s ease forwards;
}

.hero__shade {
    background:
        linear-gradient(180deg, rgba(3, 29, 48, 0.56) 0%, rgba(3, 29, 48, 0.05) 38%, rgba(3, 29, 48, 0.56) 100%),
        linear-gradient(90deg, rgba(3, 29, 48, 0.35) 0%, transparent 56%);
}

.hero__timeline {
    position: absolute;
    top: 38%;
    left: 50%;
    width: min(100% - 64px, 1180px);
    height: 54px;
    transform: translate(-50%, -50%);
}

.hero__word {
    position: absolute;
    top: 50%;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 600;
    white-space: nowrap;
    opacity: 0;
    transform: translate(-50%, -50%);
}

.hero__word--innovation,
.hero__word--balance,
.hero__word--security {
    left: 50%;
}

.hero__content {
    position: absolute;
    inset: auto 0 56px;
    z-index: 3;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 32px;
}

.hero__copy {
    max-width: 690px;
    opacity: 0;
    transform: translateY(18px);
}

.hero__copy h1 {
    margin-bottom: 18px;
    letter-spacing: normal;
    font-weight: 700;
}

.hero__copy p {
    max-width: min(620px, 100%);
    margin-bottom: 0;
    font-family: var(--font-body);
    font-size: clamp(21px, 2vw, 30px);
    font-weight: 500;
    line-height: 1.08;
}

.hero__brand {
    display: inline-flex;
    align-items: center;
    gap: .24em;
    white-space: nowrap;
    vertical-align: -.04em;
}

.hero__brand-logo {
    display: block;
    width: auto;
    height: clamp(18px, .78em, 27px);
    max-width: none;
    flex: 0 0 auto;
}

.hero__button {
    opacity: 0;
    transform: translateY(18px);
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 12px 24px;
    gap: 12px;
    color: var(--vida-blue);
    text-align: center;
    text-transform: uppercase;
    background: transparent;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    font-size: 12px;
    line-height: 1;
    transition: transform 0.2s ease, filter 0.2s ease, background-color 0.2s ease;
}

.button:hover,
.button:focus-visible {
    transform: translateY(-2px);
    filter: brightness(1.04);
}

.button--accent {
    background: var(--vida-cream);
}

.button--primary {
    color: var(--vida-white);
    background: var(--vida-green);
}

.button--green {
    color: var(--vida-white);
    background: var(--vida-green);
}

.button--ghost {
    color: var(--vida-blue);
    border: 1px solid rgba(6, 47, 80, 0.32);
}

.button--wide {
    width: 100%;
}

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

.manifest {
    min-height: 420px;
    display: grid;
    place-items: center;
}

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

.manifest__title span:nth-child(2) {
    color: var(--vida-green);
}

.about__grid,
.contacts__grid,
.layouts__grid,
.happy-life__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    align-items: center;
    gap: clamp(44px, 8vw, 110px);
}

.eyebrow {
    margin-bottom: 18px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 13px;
}

.about__lead {
    font-family: var(--font-body);
}

.stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-top: clamp(64px, 9vw, 120px);
    border-top: 1px solid rgba(6, 47, 80, 0.18);
}

.stat {
    display: flex;
    align-items: end;
    min-height: 170px;
    padding: 30px 36px 0 0;
    gap: 18px;
    border-right: 1px solid rgba(6, 47, 80, 0.18);
}

.stat:last-child {
    border-right: 0;
}

.stat strong {
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(58px, 7vw, 104px);
    font-weight: 400;
    line-height: 0.8;
}

.stat span {
    margin-bottom: 5px;
    font-size: 14px;
    line-height: 1.2;
}

.section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    margin-bottom: 42px;
    gap: 30px;
}

.section-heading h2,
.section-heading p:last-child {
    margin-bottom: 0;
}

.section-heading--inline {
    align-items: flex-start;
}

.section-heading--light {
    color: var(--vida-white);
}

.offer-grid,
.purchase-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.offer-card {
    display: flex;
    flex-direction: column;
    background-color: var(--vida-cream-light);
    background-image: url("../images/pattern-cream.webp");
    background-size: 320px;
}

.offer-card h3 {
    margin-bottom: 16px;
    line-height: 1.06;
}

.offer-card p {
    margin-bottom: 28px;
    color: rgba(6, 47, 80, 0.72);
}

.offer-card .button {
    margin-top: auto;
}

.apartment-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.apartment-card {
    overflow: hidden;
    background: var(--vida-white);
    border: 1px solid rgba(6, 47, 80, 0.06);
    box-shadow: 0 14px 44px rgba(6, 47, 80, 0.06);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.apartment-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--vida-shadow);
}

.apartment-card__image {
    display: grid;
    place-items: center;
    background: #fbfbfa;
}

.apartment-card__image img {
    width: 100%;
    object-fit: contain;
}

.apartment-card h3 {
    margin-bottom: 8px;
    font-size: 19px;
    line-height: 1.15;
}

.apartment-card__status {
    margin-bottom: 8px;
    color: #719b73;
    font-size: 13px;
}

.apartment-card__price {
    margin-bottom: 20px;
    font-size: 22px;
}

.plan-picker__heading {
    display: grid;
}

.plan-picker__heading h2 {
    margin-bottom: 0;
}

.plan-picker__steps {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.plan-picker__steps span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.filters {
    display: flex;
    align-items: center;
    margin-top: 12px;
    gap: 8px;
    flex-wrap: wrap;
    color: var(--vida-muted);
    font-size: 13px;
}

.filter-chip {
    min-height: 30px;
    padding: 6px 13px;
    color: var(--vida-blue);
    background: var(--vida-white);
    border: 1px solid rgba(6,47,80,.12);
    border-radius: 999px;
    cursor: pointer;
}

.filter-chip.is-active,
.filter-chip:hover {
    color: var(--vida-white);
    background: var(--vida-green);
}

.happy-life__grid {
    align-items: start;
}

.happy-life__location {
    overflow: hidden;
    background: rgba(255,255,255,.08);
    border-radius: 24px;
}

.happy-life__location img {
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}

.happy-life__location div {
    padding: 30px;
}

.happy-life__location h3 {
    margin-bottom: 16px;
    font-size: 34px;
}

.purchase {
    padding-top: 0;
}

.purchase-grid {
    border-top: 1px solid rgba(255,255,255,.24);
}

.purchase-card {
    display: flex;
    flex-direction: column;
    min-height: 330px;
    padding: 36px;
    border-right: 1px solid rgba(255,255,255,.24);
}

.purchase-card:last-child {
    border-right: 0;
}

.purchase-card h3 {
    margin-bottom: 20px;
}

.purchase-card .button {
    align-self: flex-start;
}

.layouts {
    padding-top: 30px;
}

.layouts__grid {
    align-items: stretch;
}

.layouts__copy {
    padding-block: 50px;
}

.layouts__copy p:not(.eyebrow) {
    max-width: 570px;
    color: rgba(255,255,255,.78);
    font-size: 18px;
}

.feature-list {
    margin-top: 70px;
    border-top: 1px solid rgba(255,255,255,.25);
}

.feature-row {
    display: grid;
    grid-template-columns: 70px 0.65fr 1fr;
    padding-block: 26px;
    gap: 30px;
    border-bottom: 1px solid rgba(255,255,255,.25);
}

.feature-row > span {
    color: var(--vida-cream);
    font-family: var(--font-body);
    font-size: 28px;
}

.feature-row h3,
.feature-row p {
    margin-bottom: 0;
}

.feature-row p {
    color: rgba(255,255,255,.72);
}

.tag {
    display: inline-flex;
    width: fit-content;
    padding: 7px 12px;
    color: var(--vida-blue);
    text-transform: uppercase;
    background: var(--vida-cream);
    border-radius: 999px;
    font-size: 11px;
}

.news-list {
    display: flex;
}

.news-item {
    flex: 1;
}

.contacts__copy h2 {
    margin-top: 24px;
}

.contacts__copy > p {
    max-width: 560px;
    font-size: clamp(19px, 2vw, 27px);
}

.contacts__details {
    display: grid;
}

.contacts__details a,
.contacts__details span {
    display: block;
    margin-bottom: 6px;
}

.socials a,
.socials span {
    min-width: 42px;
    margin: 0;
    font-family: var(--font-body);
}

.contacts__form-card,
.modal__dialog {
    padding: clamp(28px, 4vw, 48px);
    background: var(--vida-white);
    border-radius: 24px;
    box-shadow: var(--vida-shadow);
}

.field__input:focus {
    border-color: var(--vida-green);
    box-shadow: 0 0 0 3px rgba(11,84,60,.12);
}

.field__select {
    background-image: linear-gradient(45deg, transparent 50%, var(--vida-blue) 50%), linear-gradient(135deg, var(--vida-blue) 50%, transparent 50%);
    background-position: calc(100% - 18px) 21px, calc(100% - 13px) 21px;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
}

.form-notice--success {
    color: #144f35;
    background: #dff3e7;
}

.form-notice--error {
    color: #7a241f;
    background: #ffe6e3;
}

.site-footer {
    color: var(--vida-white);
    background: var(--vida-blue);
}

.site-footer__inner {
    display: grid;
    grid-template-columns: 150px 1fr auto;
    align-items: center;
    min-height: 120px;
    gap: 30px;
}

.site-footer__logo {
    width: 120px;
    max-height: 56px;
    object-fit: contain;
    object-position: left;
}

.site-footer__meta,
.site-footer__links {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    color: rgba(255,255,255,.68);
    font-size: 12px;
}

.site-footer__links {
    justify-content: flex-end;
}

.site-footer__legal {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.7fr) minmax(0, 3fr);
    align-items: start;
    gap: clamp(24px, 4vw, 72px);
    padding-block: 18px 24px;
    color: rgba(255, 255, 255, .62);
    border-top: 1px solid rgba(255, 255, 255, .12);
    font-size: 11px;
    line-height: 1.45;
}

.site-footer__legal a {
    color: inherit;
    text-decoration: none;
    transition: color .2s ease;
}

.site-footer__legal a:hover,
.site-footer__legal a:focus-visible {
    color: var(--vida-white);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.site-footer__legal-brand {
    display: flex;
    align-items: flex-start;
}

.site-footer__legal-links {
    display: grid;
    gap: 6px;
    justify-items: start;
}

.site-footer__notice {
    margin: 0;
}

.modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    visibility: hidden;
    padding: 24px;
    place-items: center;
    opacity: 0;
    transition: visibility 0s .25s, opacity .25s ease;
}

.modal.is-open {
    visibility: visible;
    opacity: 1;
    transition-delay: 0s;
}

.modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(1,20,34,.72);
    backdrop-filter: blur(8px);
}

.modal__dialog {
    position: relative;
    z-index: 1;
    width: min(100%, 560px);
    max-height: calc(100svh - 48px);
    overflow: auto;
    opacity: 0;
    transform: scale(.95);
    transition: opacity .25s ease, transform .25s ease;
}

.modal.is-open .modal__dialog {
    opacity: 1;
    transform: scale(1);
}

.modal__dialog h2 {
    margin: 18px 0;
    font-size: clamp(32px, 5vw, 50px);
}

.modal__close {
    position: absolute;
    top: 16px;
    right: 16px;
    display: grid;
    width: 38px;
    height: 38px;
    padding: 0;
    place-items: center;
    color: var(--vida-blue);
    background: #f0f0ee;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
}

.content-page {
    min-height: 70svh;
    padding: calc(var(--header-height) + 70px) 0 100px;
    background: var(--vida-paper);
}

.content-page__inner {
    width: min(100% - 48px, 900px);
    margin-inline: auto;
}

.content-page__inner h1 {
    max-width: 100%;
    margin-bottom: 40px;
    color: var(--vida-blue);
    -webkit-hyphens: auto;
    hyphens: auto;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.content-page__inner img {
    border-radius: 18px;
}

.content-page .entry-content {
    color: rgba(2, 36, 65, .82);
    font-size: 16px;
    line-height: 1.65;
    overflow-wrap: anywhere;
}

.content-page .entry-content p {
    margin: 0 0 1em;
}

.content-page .entry-content a {
    color: var(--vida-green);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.content-page .legal-document span {
    color: inherit !important;
}

.content-page .legal-document h2 {
    margin: 2.2em 0 .75em;
    color: var(--vida-blue);
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.15;
}

.content-page .legal-document h3 {
    margin: 1.7em 0 .6em;
    color: var(--vida-blue);
    font-size: clamp(19px, 2vw, 23px);
    line-height: 1.3;
}

.content-page .legal-document ul,
.content-page .legal-document ol {
    display: grid;
    gap: .55em;
    margin: 0 0 1.2em;
    padding-left: 1.5em;
}

.content-page .legal-document li {
    padding-left: .2em;
}

.content-page .legal-document strong {
    color: var(--vida-blue);
    font-weight: 700;
}

.content-page .legal-document__purpose {
    margin-top: 1.65em;
}

.content-page .legal-document__confirmation,
.content-page .legal-document__signature {
    padding: 12px 16px;
    background: rgba(255, 255, 255, .58);
    border: 1px solid rgba(2, 36, 65, .12);
    border-radius: 10px;
    font-size: 14px;
}

.content-page .legal-document__hint {
    margin-top: -.8em;
    color: rgba(2, 36, 65, .62);
    font-size: 13px;
    text-align: center;
}

.archive-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.archive-card {
    overflow: hidden;
    background: var(--vida-white);
    border-radius: 20px;
    box-shadow: 0 12px 40px rgba(6,47,80,.08);
}

.archive-card__content {
    padding: 24px;
}

.archive-card h2 {
    font-size: 28px;
}

@keyframes hero-image-in {
    to { opacity: 1; transform: scale(1); }
}

@keyframes word-left {
    0% { left: 50%; opacity: 0; }
    20% { opacity: 1; }
    45% { left: 50%; opacity: 1; }
    100% { left: -8%; opacity: 0; }
}

@keyframes word-right {
    0% { left: 50%; opacity: 0; }
    20% { opacity: 1; }
    45% { left: 50%; opacity: 1; }
    100% { left: 108%; opacity: 0; }
}

@keyframes word-balance {
    from { opacity: 0; transform: translate(-50%, -38%); }
    to { opacity: 1; transform: translate(-50%, -50%); }
}

@keyframes line-grow {
    0% { opacity: 0; transform: scaleX(0); }
    25% { opacity: .65; }
    100% { opacity: .65; transform: scaleX(1); }
}

@keyframes fade-up {
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1024px) {
    :root {
        --header-height: 68px;
    }

    .site-header__inner {
        grid-template-columns: 140px 1fr auto;
    }

    .site-header__phone,
    .site-header__callback {
        display: none;
    }

    .site-nav__list {
        gap: 14px;
    }

    .about__grid,
    .layouts__grid,
    .happy-life__grid,
    .contacts__grid {
        gap: 46px;
    }

    .offer-grid,
    .purchase-grid,
    .apartment-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .purchase-card:last-child,
    .offer-card:last-child,
    .apartment-card:last-child {
        grid-column: 1 / -1;
    }

    .news-layout {
        grid-template-columns: 1fr;
    }

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

    .news-item {
        border-right: 1px solid rgba(6,47,80,.12);
        border-bottom: 0;
    }

    .site-footer__legal {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .site-footer__notice {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {
    :root {
        --vida-radius: 18px;
    }

    body {
        font-size: 15px;
    }

    .container,
    .container-wide,
    .content-page__inner {
        width: min(100% - 32px, 640px);
    }

    .section {
        padding-block: 72px;
    }

    h1 {
        font-size: clamp(46px, 13vw, 64px);
    }

    h2 {
        font-size: clamp(36px, 10vw, 48px);
    }

    .content-page__inner h1 {
        margin-bottom: 28px;
        font-size: clamp(34px, 9vw, 46px);
        line-height: 1.06;
    }

    .menu-toggle {
        display: block;
    }

    .site-nav {
        display: grid;
        place-items: center;
    }

    .site-nav__list {
        flex-direction: column;
        gap: 24px;
    }

    .site-nav__link,
    .site-nav a {
        font-family: var(--font-body);
        font-size: 28px;
    }

    .site-nav__item--has-children {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .site-nav__more-toggle {
        font-family: var(--font-body);
        font-size: 28px;
    }

    .site-nav__submenu {
        position: static;
        min-width: 0;
        padding: 10px 0 0;
        margin: 0;
        text-align: center;
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
        transition: none;
        backdrop-filter: none;
    }

    .site-nav__submenu::before {
        display: none;
    }

    .site-nav__submenu-link {
        padding: 4px 0;
        font-size: 18px;
        opacity: 0.82;
    }

    .hero {
        min-height: 100svh;
    }

    .hero__background {
        object-position: 58% center;
    }

    .hero__timeline {
        right: 18px;
        left: auto;
        transform: none;
    }

    .hero__word {
        top: auto;
        right: 0;
        left: auto !important;
        transform: translateX(28px);
    }

    .hero__content {
        inset: auto 0 34px;
        display: block;
    }

    .hero__copy p {
        max-width: 300px;
        font-size: 24px;
    }

    .hero__button {
        width: 100%;
        margin-top: 26px;
    }

    .manifest {
        min-height: 430px;
    }

    .about__grid,
    .layouts__grid,
    .happy-life__grid,
    .contacts__grid {
        grid-template-columns: 1fr;
    }

    .stats {
        grid-template-columns: 1fr;
        border-top: 0;
    }

    .stat {
        min-height: 120px;
        padding: 24px 0;
        border-top: 1px solid rgba(6,47,80,.18);
        border-right: 0;
    }

    .stat strong {
        min-width: 150px;
        font-size: 70px;
    }

    .section-heading,
    .section-heading--inline,
    .plan-picker__heading {
        display: grid;
        grid-template-columns: 1fr;
        align-items: start;
    }

    .section-heading .button {
        width: 100%;
    }

    .offer-grid,
    .purchase-grid,
    .apartment-grid,
    .news-list,
    .archive-grid {
        grid-template-columns: 1fr;
    }

    .offer-card:last-child,
    .apartment-card:last-child,
    .purchase-card:last-child {
        grid-column: auto;
    }

    .offer-card {
        min-height: 250px;
    }

    .apartment-grid {
        display: flex;
        width: calc(100vw - 16px);
        margin-right: -16px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .apartment-grid::-webkit-scrollbar {
        display: none;
    }

    .apartment-card {
        flex: 0 0 min(84vw, 330px);
        scroll-snap-align: start;
    }

    .apartment-card__image {
        min-height: 250px;
    }

    .plan-picker__steps span:last-child {
        grid-column: 1 / -1;
    }

    .filters {
        align-items: flex-start;
    }

    .purchase-grid {
        border-top: 0;
    }

    .purchase-card {
        min-height: 280px;
        padding: 30px 0;
        border-top: 1px solid rgba(255,255,255,.24);
        border-right: 0;
    }

    .layouts__image {
        order: -1;
    }

    .feature-row {
        grid-template-columns: 54px 1fr;
    }

    .feature-row p {
        grid-column: 2;
    }

    .news-item {
        border-right: 0;
        border-bottom: 1px solid rgba(6,47,80,.12);
    }

    .contacts__details {
        grid-template-columns: 1fr;
        margin-top: 50px;
    }

    .contacts__form-card {
        padding: 26px;
    }

    .site-footer__inner {
        grid-template-columns: 1fr;
        padding-block: 32px;
    }

    .site-footer__links {
        justify-content: flex-start;
    }

    .site-footer__legal {
        grid-template-columns: 1fr;
        gap: 10px;
        padding-block: 18px 28px;
        font-size: 10.5px;
    }

    .site-footer__notice {
        grid-column: auto;
        margin-top: 6px;
    }

    .modal {
        align-items: end;
        padding: 0;
    }

    .modal__dialog {
        width: 100%;
        max-height: 90svh;
        border-radius: 24px 24px 0 0;
    }
}

@media (max-width: 430px) {
    body.page-id-119 .content-page__inner h1 {
        width: calc(100vw - 24px);
        max-width: none;
        margin-left: -4px;
        overflow-wrap: normal;
        word-break: normal;
        -webkit-hyphens: none;
        hyphens: none;
        font-size: clamp(26px, 7.2vw, 28px);
        line-height: 1.1;
        letter-spacing: normal;
    }
}

@keyframes mobile-word-in {
    from { opacity: 0; transform: translateX(28px); }
    to { opacity: 1; transform: translateX(0); }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }

    .vida-home:not(.hero-ready) .site-header,
    .hero__copy,
    .hero__button,
    .hero__word,
    .hero__background {
        opacity: 1;
        transform: none;
    }
}

/* Version 0.2 — scroll-driven motion layer */
.hero__timeline {
    z-index: 5;
}

.hero__word {
    z-index: 2;
    color: #fff;
    text-shadow:
        0 2px 4px rgba(2, 23, 38, 0.72),
        0 6px 22px rgba(2, 23, 38, 0.62);
    will-change: transform, left, opacity;
}

.hero.is-animated .hero__copy {
    animation: fade-up 0.52s 1.55s ease-out forwards;
}

.hero.is-animated .hero__button {
    animation: fade-up 0.5s 1.84s ease-out forwards;
}

@keyframes vida-word-left {
    0% { left: 50%; opacity: 0; transform: translate(-50%, -40%); }
    18% { opacity: 1; transform: translate(-50%, -50%); }
    46% { left: 50%; opacity: 1; }
    100% { left: -12%; opacity: 0; transform: translate(-50%, -50%); }
}

@keyframes vida-word-right {
    0% { left: 50%; opacity: 0; transform: translate(-50%, -40%); }
    18% { opacity: 1; transform: translate(-50%, -50%); }
    46% { left: 50%; opacity: 1; }
    100% { left: 112%; opacity: 0; transform: translate(-50%, -50%); }
}

@keyframes vida-word-balance {
    from { opacity: 0; transform: translate(-50%, -36%) scale(.98); }
    to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

@keyframes vida-line-grow {
    0% { opacity: 0; transform: scaleX(0); }
    20% { opacity: .72; }
    100% { opacity: .72; transform: scaleX(1); }
}

.reveal-ready [data-reveal] {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity .72s cubic-bezier(.22,.61,.36,1) var(--reveal-delay, 0ms),
        transform .72s cubic-bezier(.22,.61,.36,1) var(--reveal-delay, 0ms);
    will-change: opacity, transform;
}

.reveal-ready [data-reveal].is-visible {
    opacity: 1;
    transform: translateY(0);
}

.manifest {
    position: relative;
    min-height: 285svh;
    padding: 0;
    overflow: clip;
}

.manifest__scroll {
    min-height: inherit;
}

.manifest__sticky {
    position: sticky;
    top: 0;
    display: grid;
    height: 100svh;
    min-height: 620px;
    place-items: center;
}

.manifest .container {
    width: min(100% - 64px, 1440px);
}

.manifest__title {
    display: grid;
    margin: 0 auto;
    gap: .08em;
    font-size: clamp(28px, 2.45vw, 40px);
    line-height: 1.02;
    text-align: center;
}

.manifest__line {
    position: relative;
    display: block;
    width: 100%;
    min-height: 1.12em;
}

.manifest__text {
    display: grid;
    width: 100%;
    place-items: center;
    will-change: transform, opacity;
}

.manifest__text--from {
    opacity: var(--from-opacity, 1);
    transform: translateY(var(--from-y, 0%));
}

.manifest__text--to {
    color: var(--vida-green);
    opacity: var(--to-opacity, 0);
    transform: translateY(var(--to-y, 112%));
}



.manifest__text--from,
.manifest__text--to {
    text-align: center;
}

.manifest__progress {
    width: min(360px, 54vw);
    height: 2px;
    margin: 42px auto 0;
    overflow: hidden;
    background: rgba(6, 47, 80, .12);
}

.manifest__progress span {
    display: block;
    width: 100%;
    height: 100%;
    background: var(--vida-green);
    transform: scaleX(var(--manifest-progress, 0));
    transform-origin: left center;
}

.floating-gallery {
    min-height: 190svh;
}

.floating-gallery__card {
    position: absolute;
    margin: 0;
    overflow: hidden;
    border-radius: 24px;
    box-shadow: 0 28px 70px rgba(3, 32, 53, .18);
    will-change: transform, opacity, clip-path;
}

.floating-gallery__card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.floating-gallery__card--left {
    top: 12%;
    left: 2%;
    z-index: 3;
    width: 28%;
    aspect-ratio: 1.25;
    opacity: var(--gallery-side-opacity, 1);
    transform: translate3d(0, var(--drift-y, 0), 0) rotate(-2.2deg);
}

.floating-gallery__card--right {
    top: 15%;
    right: 2%;
    z-index: 3;
    width: 25%;
    aspect-ratio: 1.12;
    opacity: var(--gallery-side-opacity, 1);
    transform: translate3d(0, var(--drift-y, 0), 0) rotate(2deg);
}

.floating-gallery__card--bottom {
    right: 10%;
    bottom: 8%;
    z-index: 3;
    width: 30%;
    aspect-ratio: 1.6;
    opacity: var(--gallery-side-opacity, 1);
    transform: translate3d(0, var(--drift-y, 0), 0) rotate(1deg);
}

.stat {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .55s ease, transform .55s ease;
}

.stats.is-visible .stat {
    opacity: 1;
    transform: translateY(0);
}

.stats.is-visible .stat:nth-child(2) { transition-delay: .12s; }
.stats.is-visible .stat:nth-child(3) { transition-delay: .24s; }

.stat strong i {
    font-style: normal;
}

.happy-life__location img {
    transform: scale(1);
}

.happy-life__location.is-visible img {
    animation: vida-slow-zoom 10s ease-out forwards;
}

@keyframes vida-slow-zoom {
    from { transform: scale(1); }
    to { transform: scale(1.03); }
}

.purchase__sticky {
    display: grid;
}

.purchase__content {
    position: relative;
}

.feature-row.is-visible,
.layouts__grid.is-visible {
    will-change: auto;
}

@media (max-width: 760px) {

    .hero__word {
        text-align: right;
    }

    .hero.is-animated .hero__word--innovation,
    .hero.is-animated .hero__word--balance,
    .hero.is-animated .hero__word--security {
        animation: mobile-word-in .42s ease-out forwards;
    }

    .hero.is-animated .hero__copy { animation-delay: 1.02s; }
    .hero.is-animated .hero__button { animation-delay: 1.3s; }

    .manifest {
        min-height: 235svh;
    }

    .manifest .container {
        width: min(100% - 32px, 640px);
    }

    .manifest__text {
        line-height: 1.02;
    }

    .floating-gallery {
        min-height: 150svh;
    }

    .floating-gallery__stage {
        min-height: 620px;
    }

    .floating-gallery__card {
        border-radius: 16px;
    }

    .floating-gallery__card--left {
        top: 11%;
        left: 0;
        width: 43%;
    }

    .floating-gallery__card--right {
        top: 17%;
        right: 0;
        width: 39%;
    }

    .floating-gallery__card--bottom {
        right: 3%;
        bottom: 10%;
        width: 48%;
    }

    .floating-gallery__card--main {
        border-radius: 20px;
        clip-path: inset(0 var(--gallery-inset, 23%) round 20px);
    }

    .purchase {
        padding-block: 72px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .manifest,
    .floating-gallery,
    .purchase {
        min-height: auto;
    }

    .manifest__sticky,
    .floating-gallery__stage,
    .purchase__sticky {
        position: relative;
        height: auto;
        min-height: 0;
        padding-block: 80px;
    }

    .manifest__text--from {
        position: relative;
        opacity: 1;
        transform: none;
    }

    .manifest__text--to,
    .manifest__progress,
    .floating-gallery__card:not(.floating-gallery__card--main) {
        display: none;
    }

    .floating-gallery__card--main {
        position: relative;
        inset: auto;
        width: 100%;
        height: 520px;
        opacity: 1;
        clip-path: none;
        transform: none;
    }

    .purchase__content {
        opacity: 1;
    }
}
@media (min-width: 992px) {
    .manifest {
        min-height: 248svh;
        overflow: clip;
    }

    .manifest__sticky {
        height: 100svh;
        min-height: 640px;
        padding-block: 56px 86px;
    }

    .manifest .container.section-center {
        margin-inline: auto;
    }

    .manifest__title {
        display: grid;
        width: 100%;
        max-width: 980px;
        min-width: 0;
        margin-inline: auto;
        justify-items: center;
        gap: .08em;
        overflow: visible;
        text-align: center;
    }

    .manifest__line {
        position: relative;
        display: grid;
        grid-template-areas: "manifest-stack";
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
    }

    .manifest__text {
        position: relative;
        inset: auto;
        grid-area: manifest-stack;
        display: flex;
        align-items: center;
        justify-content: center;
        justify-self: center;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        padding-inline: 18px;
        overflow: visible;
        text-align: center;
        white-space: nowrap;
        will-change: transform, opacity;
    }

    .manifest__line:first-child .manifest__text {
        font-size: .92em;
    }

    .manifest__text--from {
        transform: translateY(var(--from-y, 0%));
    }

    .manifest__text--to {
        transform: translateY(var(--to-y, 112%));
    }

    .manifest__progress {
        width: min(320px, 34vw);
        margin-top: 34px;
    }

    .floating-gallery {
        z-index: 2;
        min-height: 172svh;
        margin-top: -14svh;
    }

    .floating-gallery__stage {
        min-height: 760px;
    }

    .floating-gallery__card--left {
        left: 3%;
        top: 18%;
        width: 26%;
    }

    .floating-gallery__card--right {
        right: 3%;
        top: 7%;
        width: 23%;
    }

    .floating-gallery__card--bottom {
        right: 8%;
        bottom: 9%;
        width: 27%;
    }

    .floating-gallery__card--main {
        inset: 19% 0 7%;
    }
}

@media (min-width: 761px) and (max-width: 991px) {
    .manifest {
        min-height: 225svh;
    }

    .manifest__sticky {
        min-height: 560px;
        padding-block: 48px 64px;
    }

    .manifest .container.section-center {
        margin-inline: auto;
    }

    .manifest__title {
        display: grid;
        width: min(100%, 660px);
        max-width: 660px;
        min-width: 0;
        margin-inline: auto;
        gap: .1em;
        overflow: visible;
        text-align: center;
    }

    .manifest__line {
        position: relative;
        display: grid;
        grid-template-areas: "manifest-stack";
        width: 100%;
        min-width: 0;
        overflow: hidden;
    }

    .manifest__text {
        position: relative;
        inset: auto;
        grid-area: manifest-stack;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        padding-inline: 8px;
        text-align: center;
        white-space: nowrap;
    }

    .manifest__text--from {
        transform: translateY(var(--from-y, 0%));
    }

    .manifest__text--to {
        transform: translateY(var(--to-y, 112%));
    }

    .floating-gallery {
        margin-top: -8svh;
    }
}

@media (max-width: 760px) {
    .manifest {
        min-height: 205svh;
    }

    .manifest__sticky {
        min-height: 520px;
        padding-block: 42px 64px;
    }

    .manifest .container.section-center {
        margin-inline: auto;
    }

    .manifest__title {
        display: grid;
        width: 100%;
        max-width: 430px;
        min-width: 0;
        margin-inline: auto;
        gap: .12em;
        overflow: visible;
        text-align: center;
    }

    .manifest__line {
        position: relative;
        display: grid;
        grid-template-areas: "manifest-stack";
        width: 100%;
        min-width: 0;
        min-height: 1.24em;
        overflow: hidden;
    }

    .manifest__text {
        position: relative;
        inset: auto;
        grid-area: manifest-stack;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        text-align: center;
        text-wrap: balance;
        white-space: normal;
    }

    .manifest__text--from {
        transform: translateY(var(--from-y, 0%));
    }

    .manifest__text--to {
        transform: translateY(var(--to-y, 112%));
    }

    .manifest__progress {
        width: min(240px, 66vw);
        margin-top: 28px;
    }

    .floating-gallery {
        min-height: 138svh;
        margin-top: -5svh;
    }

    .floating-gallery__card--main {
        inset: 22% 0 8%;
    }
}
.floating-gallery {
    z-index: 2;
    min-height: 250svh;
    margin-top: -10svh;
    padding: 0;
    overflow: clip;
}

.floating-gallery__stage {
    position: sticky;
    top: 0;
    width: 100vw;
    height: 100svh;
    margin-left: calc(50% - 50vw);
    min-height: 680px;
    margin-inline: auto;
    overflow: visible;
}

.floating-gallery__card {
    transition: none;
}

.floating-gallery__card--main {
    z-index: 4;
    clip-path: inset(0 var(--gallery-inset, 24%) round 28px);
    transform-origin: center center;
    transform: scale(var(--gallery-main-scale, 1.055));
    box-shadow: 0 28px 70px rgba(3, 32, 53, calc(.18 * (1 - var(--gallery-expand, 0))));
}

.floating-gallery__shade {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: block;
    background: #000;
    opacity: var(--gallery-overlay-opacity, 0);
    pointer-events: none;
}

.floating-gallery__caption {
    position: absolute;
    left: clamp(34px, 5vw, 86px);
    right: clamp(34px, 5vw, 86px);
    bottom: clamp(34px, 7vh, 84px);
    z-index: 2;
    display: grid;
    color: #fff;
    opacity: var(--gallery-caption-opacity, 0);
    transform: translateY(var(--gallery-caption-y, 34px));
    will-change: opacity, transform;
}

.floating-gallery__caption strong,
.floating-gallery__caption span {
    font-family: var(--font-body);
    font-weight: 500;
    letter-spacing: normal;
}

.floating-gallery__caption strong {
    font-size: clamp(46px, 5.8vw, 84px);
    line-height: .9;
    white-space: nowrap;
}

.floating-gallery__caption span {
    font-size: clamp(30px, 3.8vw, 54px);
    line-height: 1.02;
    white-space: nowrap;
}

.about {
    z-index: 3;
    padding-bottom: 0;
    overflow: hidden;
}

.about__copy-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    align-items: start;
}

.about__headline h2 {
    color: var(--vida-blue);
}

.about__lead {
    margin: 0;
    color: var(--vida-green);
}

.about__body p {
    margin: 0;
    color: var(--vida-blue);
}

.about__stats-shell {
    padding-block: clamp(70px, 8vw, 110px);
}

.about__stats-shell .stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
        "apartments floors"
        "apartments year";
    margin-top: 0;
}

.about__stats-shell .stat--apartments {
    grid-area: apartments;
    align-self: center;
    align-items: flex-start;
    flex-direction: column;
}

.about__stats-shell .stat--floors {
    grid-area: floors;
    align-self: start;
    align-items: flex-start;
    flex-direction: column;
}

.about__stats-shell .stat--year {
    grid-area: year;
    align-self: end;
    align-items: flex-start;
    flex-direction: column;
}

.about__stats-shell .stat > span {
    font-family: var(--font-body);
}

@media (max-width: 991px) {
    .floating-gallery {
        min-height: 220svh;
        margin-top: 0;
        padding: 0;
        overflow: clip;
    }

    .floating-gallery__stage {
        position: sticky;
        top: 0;
        width: 100%;
        max-width: none;
        height: 100svh;
        min-height: 0;
        margin: 0;
        overflow: hidden;
    }

    .floating-gallery__card:not(.floating-gallery__card--main) {
        display: none;
    }

    .floating-gallery__card--main {
        position: absolute;
        inset:
            0
            var(--gallery-mobile-side-inset, 18px)
            var(--gallery-mobile-bottom-inset, 14svh);
        width: auto;
        height: auto;
        aspect-ratio: auto;
        border-radius: var(--gallery-mobile-radius, 18px);
        clip-path: none;
        transform: scale(var(--gallery-mobile-scale, 1.025));
        box-shadow: 0 24px 58px rgba(3, 32, 53, calc(.18 * (1 - var(--gallery-expand, 0))));
    }

    .floating-gallery__shade {
        opacity: var(--gallery-overlay-opacity, 0);
    }

    .floating-gallery__caption {
        left: 24px;
        right: 24px;
        bottom: 28px;
        opacity: var(--gallery-caption-opacity, 0);
        transform: translateY(var(--gallery-caption-y, 34px));
    }

    .floating-gallery__caption strong {
        font-size: clamp(34px, 7.5vw, 54px);
    }

    .floating-gallery__caption span {
        font-size: clamp(25px, 5.7vw, 40px);
    }

    .about__copy-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .about__body {
        padding-top: 0;
    }

    .about__stats-shell {
        min-height: 720px;
    }

    .about__stats-shell .stats {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "apartments floors"
            "year year";
        min-height: 570px;
        gap: 32px 20px;
    }

    .about__stats-shell .stat--year {
        padding-left: 0;
    }
}

@media (max-width: 600px) {
    .floating-gallery {
        min-height: 205svh;
        padding-top: 0;
    }

    .floating-gallery__stage {
        width: 100%;
    }

    .floating-gallery__card--main {
        width: auto;
        height: auto;
        aspect-ratio: auto;
    }

    .floating-gallery__caption {
        left: 16px;
        right: 16px;
        bottom: 30px;
    }

    .about {
        padding-top: 52px;
    }

    .about__copy-grid {
        padding-bottom: 58px;
    }

    .about__headline h2 {
        font-size: 30px;
    }

    .about__lead {
        font-size: 34px !important;
    }

    .about__body p {
        font-size: 20px;
    }

    .about__stats-shell {
        padding-block: 70px;
    }

    .about__stats-shell .stats {
        grid-template-columns: 1fr;
        grid-template-areas:
            "apartments"
            "floors"
            "year";
        gap: 34px;
    }

    .about__stats-shell .stat,
    .about__stats-shell .stat--floors,
    .about__stats-shell .stat--year {
        align-self: auto;
        padding-left: 0;
    }
}
.about__stats-shell {
    position: relative;
    padding: 0;
    overflow: hidden;
    background: linear-gradient(
        180deg,
        rgba(250, 231, 204, .08) 0%,
        rgba(137, 157, 169, .34) 24%,
        rgba(67, 103, 129, .73) 53%,
        rgba(6, 47, 80, .99) 100%
    );
}

.about__stats-shell::after {
    position: absolute;
    inset: 0;
    z-index: 0;
    content: "";
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.02) 30%, rgba(6,47,80,.10) 58%, rgba(6,47,80,.24) 100%),
        radial-gradient(circle at 48% 4%, rgba(255,255,255,.18), transparent 44%);
}

.about__stats-shell .stats {
    position: relative;
    z-index: 1;
    display: block;
    min-height: 0;
    margin: 0 auto;
    border: 0;
}

.about__stats-shell .stat {
    position: absolute;
    display: flex;
    min-height: 0;
    padding: 0;
    gap: 8px;
    align-items: flex-start;
    flex-direction: column;
    color: #fff;
    border: 0;
}

.about__stats-shell .stat--floors {
    padding-left: 0;
}

.about__stats-shell .stat--year {
    padding-left: 0;
}

.about__stats-shell .stat strong {
    display: flex;
    align-items: baseline;
    min-width: 0;
    margin: 0;
    color: #fff;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 500;
    letter-spacing: 0;
    white-space: nowrap;
}

.about__stats-shell .stat strong > span,
.about__stats-shell .stat strong > i {
    display: inline;
    margin: 0;
    color: inherit;
    font: inherit;
    line-height: inherit;
    letter-spacing: inherit;
}

.about__stats-shell .stat strong > i {
    padding-inline: .015em;
}

.about__stats-shell .stat > span {
    display: grid;
    margin: 0;
    color: #fff;
    font-family: var(--font-body);
    font-weight: 500;
}

.about__stats-shell .stat small {
    color: #fff;
    font-family: var(--font-body);
    font-weight: 700;
    line-height: 1.15;
}

.offers {
    position: relative;
    z-index: 5;
    margin-top: -18px;
    border-radius: 18px 18px 0 0;
}

@media (max-width: 991px) {
    .about__stats-shell,
    .about__stats-shell .stats {
        min-height: 760px;
        height: 760px;
    }

    .about__stats-shell .stats {
        width: min(100% - 40px, 760px);
    }

    .about__stats-shell .stat--apartments {
        top: 45%;
    }

    .about__stats-shell .stat--floors {
        top: 9%;
        right: 2%;
    }

    .about__stats-shell .stat--year {
        right: 0;
        bottom: 8%;
    }

    .about__stats-shell .stat strong,
    .about__stats-shell .stat--apartments strong {
        font-size: clamp(82px, 17vw, 132px);
    }

    .about__stats-shell .stat > span {
        font-size: clamp(26px, 5vw, 38px);
    }
}

@media (max-width: 600px) {
    .about__stats-shell {
        min-height: 850px;
    }

    .about__stats-shell .stats {
        width: min(100% - 32px, 520px);
        height: 850px;
        min-height: 850px;
    }

    .about__stats-shell .stat--floors {
        top: 7%;
        right: 0;
    }

    .about__stats-shell .stat--apartments {
        top: 39%;
        left: 0;
    }

    .about__stats-shell .stat--year {
        right: 0;
        bottom: 6%;
    }

    .about__stats-shell .stat strong,
    .about__stats-shell .stat--apartments strong {
        font-size: clamp(74px, 24vw, 112px);
    }

    .about__stats-shell .stat > span {
        font-size: clamp(24px, 8vw, 34px);
    }

    .offers {
        margin-top: -14px;
        border-radius: 14px 14px 0 0;
    }
}
.stats-transition {
    position: relative;
    z-index: 2;
    background: var(--vida-cream-light);
    isolation: isolate;
}

.stats-transition .about__stats-shell {
    width: 100%;
    background-color: var(--vida-cream-light);
    background-image:
        linear-gradient(
            180deg,
            rgba(255, 241, 223, .94) 0%,
            rgba(247, 231, 211, .84) 18%,
            rgba(190, 201, 203, .76) 42%,
            rgba(99, 132, 155, .88) 67%,
            rgba(6, 47, 80, 1) 100%
        ),
        url("../images/pattern-cream.webp");
    background-position: center top, center top;
    background-repeat: no-repeat, repeat;
    background-size: 100% 100%, 720px auto;
}

/* Numbers stay in place while only their labels wait for the count-up to finish. */
.stats-transition .stat {
    opacity: 1;
    transform: none;
    transition: none;
}

.stats-transition .stat__label {
    opacity: 0;
    transform: translateY(20px);
    transition:
        opacity .55s cubic-bezier(.22,.61,.36,1),
        transform .55s cubic-bezier(.22,.61,.36,1);
    will-change: opacity, transform;
}

.stats-transition .stats.labels-visible .stat__label {
    opacity: 1;
    transform: translateY(0);
}

.stats-transition .stats.labels-visible .stat:nth-child(2) .stat__label {
    transition-delay: .08s;
}

.stats-transition .stats.labels-visible .stat:nth-child(3) .stat__label {
    transition-delay: .16s;
}

/* The following light section rises over the fixed statistics screen. */

@media (max-width: 991px) {
    .stats-transition {
        background: var(--vida-cream-light);
    }

    .stats-transition .about__stats-shell {
        position: relative;
        top: auto;
        height: 760px;
        min-height: 760px;
    }

    .stats-transition .about__stats-shell .stats {
        height: 760px;
        min-height: 760px;
    }
}

@media (max-width: 600px) {
    .stats-transition .about__stats-shell,
    .stats-transition .about__stats-shell .stats {
        height: 850px;
        min-height: 850px;
    }
}
.about-stats-story {
    position: relative;
    z-index: 2;
    isolation: isolate;
    overflow: clip;
}

.about-stats-story::before {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
}

.about-stats-story .about {
    background: transparent;
    overflow: visible;
}

.about-stats-story .stats-transition {
    background: transparent;
}

.about-stats-story .stats-transition .about__stats-shell {
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 100%;
    background-color: transparent;
}

.about-stats-story .stats-transition .about__stats-shell .stats {
    width: min(100% - 56px, 1180px);
    height: clamp(680px, 66vw, 860px);
}

.about-stats-story .stats-transition .about__stats-shell .stat--apartments {
    left: 0.5%;
    top: 48%;
}

.about-stats-story .stats-transition .about__stats-shell .stat--floors {
    right: 8.5%;
}

.about-stats-story .stats-transition .about__stats-shell .stat--year {
    right: 4.5%;
    bottom: 8.5%;
}

.about-stats-story .stats-transition .about__stats-shell .stat strong {
    font-size: clamp(108px, 13.2vw, 176px);
}

.about-stats-story .stats-transition .about__stats-shell .stat--apartments strong {
    font-size: clamp(118px, 15.2vw, 208px);
}

.about-stats-story .stats-transition .about__stats-shell .stat > span {
    font-size: clamp(28px, 3vw, 44px);
}

@media (max-width: 991px) {

    .about-stats-story .stats-transition .about__stats-shell .stats {
        width: min(100% - 32px, 760px);
        height: 700px;
        min-height: 700px;
    }
}
.about-stats-story .stats-transition {
    margin-top: -26px;
    padding-top: 26px;
}

@media (max-width: 991px) {
    .about-stats-story .stats-transition {
        margin-top: -18px;
        padding-top: 18px;
    }
}

.about-stats-story .stats-transition .about__stats-shell .stat--floors {
    top: 10.5%;
}

.about-stats-story .stats-transition .about__stats-shell {
    background-image: linear-gradient(
        180deg,
        rgba(232, 212, 184, .14) 0%,
        rgba(236, 220, 198, .16) 6%,
        rgba(231, 229, 220, .20) 12%,
        rgba(204, 212, 210, .38) 20%,
        rgba(160, 179, 189, .62) 30%,
        rgba(110, 139, 159, .83) 42%,
        rgba(70, 105, 132, .93) 56%,
        rgba(28, 66, 95, .98) 74%,
        rgba(6, 47, 80, 1) 100%
    );
}
.about-stats-story {
    background-color: #f7ead7;
    background-image: none;
}

.about-stats-story::after {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
}

.about-stats-story > * {
    position: relative;
}

.about-stats-story .about,
.about-stats-story .stats-transition,
.about-stats-story .stats-transition .about__stats-shell {
    background: transparent !important;
    background-image: none !important;
}

.about-stats-story .stats-transition .about__stats-shell::after {
    background: none !important;
}
.about {
    padding-top: clamp(56px, 6vw, 84px);
}

.about__copy-grid {
    gap: clamp(36px, 6vw, 92px);
    padding-bottom: clamp(42px, 4vw, 58px);
}

.about__headline h2 {
    max-width: 640px;
    margin-bottom: 10px;
    font-size: clamp(30px, 2.65vw, 42px);
    line-height: 1.04;
    letter-spacing: 0;
    text-wrap: balance;
}

.about__lead {
    max-width: 640px;
    font-size: clamp(30px, 2.5vw, 36px) !important;
    line-height: 1.08;
    letter-spacing: 0;
    text-wrap: wrap;
}

.about__body {
    padding-top: 2px;
}

.about__body p {
    max-width: 500px;
    font-size: clamp(18px, 1.45vw, 24px);
    line-height: 1.25;
}

.about__stats-shell {
    min-height: clamp(700px, 67vw, 840px);
}

.about__stats-shell .stats {
    width: min(100% - 64px, 1180px);
    height: clamp(700px, 67vw, 840px);
}

.about__stats-shell .stat--apartments {
    left: 1%;
    top: 48%;
}

.about__stats-shell .stat--floors {
    right: 8.5%;
    top: 15%;
}

.about__stats-shell .stat--year {
    right: 4.5%;
    bottom: 9%;
}

.about__stats-shell .stat strong {
    font-size: clamp(102px, 11.8vw, 164px);
    line-height: .8;
}

.about__stats-shell .stat--apartments strong {
    font-size: clamp(116px, 14.4vw, 196px);
}

.about__stats-shell .stat > span {
    font-size: clamp(28px, 2.85vw, 42px);
    line-height: .95;
}

.about__stats-shell .stat small {
    margin-top: 12px;
    font-size: clamp(13px, 1.02vw, 16px);
}

@media (max-width: 991px) {
    .about__copy-grid {
        padding-bottom: 48px;
    }

    .about-stats-story::before {
        background-size: 430px auto;
    }
}

@media (max-width: 600px) {
    .about-stats-story::before {
        background-size: 320px auto;
    }
}
.about-stats-story::after {
    z-index: 0;
    background: linear-gradient(
        180deg,
        #f2dcc0 0%,
        #f4e2ca 7%,
        #f4e9d9 13%,
        #e6e4dc 19%,
        #c7cfd1 25%,
        #9eafb9 31%,
        #6c899e 36%,
        #3d6684 41%,
        #214c6d 46%,
        #103a5b 51%,
        #062f50 56%,
        #062f50 100%
    );
}

.about-stats-story::before {
    z-index: 1;
}

.about-stats-story > * {
    z-index: 2;
}

@media (max-width: 991px) {
    .about-stats-story::after {
        background: linear-gradient(
            180deg,
            #f2dcc0 0%,
            #f4e4cf 9%,
            #eee8dc 17%,
            #cbd2d2 25%,
            #96aab6 33%,
            #587a93 40%,
            #285573 47%,
            #103a5b 53%,
            #062f50 58%,
            #062f50 100%
        );
    }
}
.stats-transition .about__stats-shell {
    position: sticky;
    top: 0;
    z-index: 1;
    height: 100svh;
    min-height: 680px;
}

.stats-transition .about__stats-shell .stats {
    height: 100%;
    min-height: 680px;
}

/* The apartment block, not the promotions block, rises over the sticky statistics. */
.stats-transition > .apartments {
    position: relative;
    margin-top: 0;
}

/* The 200 ms pause is controlled in JS after the final counter frame.
   All labels then enter together from 20 px below, as specified. */
.stats-transition .stats.labels-visible .stat:nth-child(2) .stat__label,
.stats-transition .stats.labels-visible .stat:nth-child(3) .stat__label {
    transition-delay: 0s;
}

/* Promotions are a normal section again after the sticky apartment handoff. */
.about-stats-story + .offers {
    margin-top: 0;
    border-radius: 0;
}

@media (max-width: 991px) {
    .stats-transition .about__stats-shell,
    .stats-transition .about__stats-shell .stats {
        height: 100svh;
        min-height: 100svh;
    }
}

@media (max-width: 600px) {
    .stats-transition .about__stats-shell,
    .stats-transition .about__stats-shell .stats {
        height: 100svh;
        min-height: 100svh;
    }
}
.stats-transition > .offers,
.stats-transition > .apartments {
    position: relative;
    z-index: 4;
    margin-top: 0;
}

.stats-transition > .offers {
    min-height: 100svh;
    border-radius: 24px 24px 0 0;
    box-shadow: 0 -18px 42px rgba(3, 32, 53, .12);
}

.stats-transition > .apartments {
    min-height: 100svh;
    box-shadow: none;
}

@media (max-width: 991px) {
    .stats-transition > .offers {
        border-radius: 18px 18px 0 0;
        box-shadow: 0 -14px 34px rgba(3, 32, 53, .10);
    }

    .stats-transition > .apartments {
        box-shadow: none;
    }
}

@media (max-width: 600px) {
    .stats-transition > .offers {
        border-radius: 14px 14px 0 0;
    }
}
.stats-transition > .offers,
.stats-transition > .apartments {
    min-height: auto;
}

@media (max-width: 991px) {
    .stats-transition > .offers {
        min-height: auto;
    }

    .stats-transition > .apartments {
        min-height: auto;
    }
}
.offers .eyebrow {
    margin-bottom: 14px;
    color: var(--vida-blue);
    font-family: var(--font-body);
    font-size: clamp(34px, 3.55vw, 50px);
    font-weight: 500;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
}

.offers .section-heading {
    margin-bottom: clamp(30px, 3.2vw, 42px);
}

.offers .section-heading h2 {
    margin-bottom: 0;
    font-size: clamp(30px, 2.8vw, 40px);
    letter-spacing: normal;
}

.offer-card {
    min-height: 270px;
    padding: 22px;
    border-radius: 28px;
}

.offer-card h3 {
    font-size: clamp(22px, 1.9vw, 26px);
}

.stats-transition > .offers {
    padding-bottom: clamp(30px, 3vw, 38px);
}

.stats-transition > .apartments {
    padding-top: clamp(22px, 2.2vw, 30px);
    overflow: hidden;
    border-radius: 0 0 24px 24px;
}

.apartments .section-heading {
    margin-bottom: clamp(32px, 3.5vw, 46px);
}

.apartment-card {
    border-radius: 28px;
}

.apartment-card__image {
    min-height: 300px;
    padding: 24px;
}

.apartment-card__image img {
    max-height: 270px;
}

.apartment-card__body {
    padding: 26px 28px 28px;
}

@media (max-width: 991px) {
    .offers .eyebrow {
        font-size: clamp(30px, 5vw, 40px);
    }

    .offers .section-heading h2 {
        font-size: clamp(28px, 4vw, 36px);
    }

    .stats-transition > .offers {
        padding-bottom: 28px;
    }

    .stats-transition > .apartments {
        padding-top: 22px;
        border-radius: 0 0 18px 18px;
    }
}

@media (max-width: 600px) {
    .offers .eyebrow {
        margin-bottom: 10px;
        font-size: clamp(28px, 9vw, 36px);
    }

    .offers .section-heading h2 {
        font-size: clamp(26px, 8vw, 32px);
    }

    .offer-card {
        min-height: 250px;
        padding: 20px;
        border-radius: 20px;
    }

    .stats-transition > .offers {
        padding-bottom: 22px;
    }

    .stats-transition > .apartments {
        padding-top: 18px;
        border-radius: 0 0 14px 14px;
    }

    .apartments .section-heading {
        margin-bottom: 28px;
    }

    .apartment-card {
        border-radius: 20px;
    }

    .apartment-card__image {
        min-height: 250px;
        padding: 18px;
    }

    .apartment-card__body {
        padding: 22px;
    }
}

@media (max-width: 760px) {
    body.vida-home .manifest-gallery-story--without-manifest {
        display: none !important;
    }
}
.floating-gallery {
    margin-top: calc(-10svh - 8px);
}

.floating-gallery__card--main {
    inset: 0 0 0;
}

@media (max-width: 991px) {
    .floating-gallery {
        margin-top: 0;
    }

    .floating-gallery__card--main {
        inset:
            0
            var(--gallery-mobile-side-inset, 18px)
            var(--gallery-mobile-bottom-inset, 14svh);
    }
}
:root {
    --vida-ui-paper: #f4f4f5;
    --vida-ui-white: #ffffff;
    --vida-ui-charcoal: #1c2018;
    --vida-ui-blue: #022441;
    --vida-ui-sand: #e0bf9a;
    --vida-ui-cream: #fff8ee;
    --vida-ui-green: #14452f;
}

.plan-picker__heading {
    grid-template-columns: 1fr;
}

.plan-picker__steps span {
    position: relative;
}

.plan-picker__steps b {
    color: inherit;
}

.plan-picker__steps span:not(:last-child)::after {
    position: absolute;
    top: 50%;
    content: "›";
    line-height: 1;
}

@media (max-width: 760px) {

    .plan-picker__steps {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .plan-picker__steps span {
        justify-content: flex-start;
    }
}

.plan-picker__heading {
    align-items: start;
}

.plan-picker__heading h2 {
    color: var(--vida-ui-sand);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 500;
}

.plan-picker__heading .eyebrow {
    color: var(--vida-ui-sand);
    font-family: var(--font-body);
    text-transform: none;
}

.plan-picker__steps span {
    color: var(--vida-ui-sand);
    background: transparent;
    border: 1px solid rgba(224, 191, 154, .40);
    font-family: var(--font-body);
    font-weight: 400;
    letter-spacing: 0;
    text-transform: uppercase;
}

.plan-picker__steps span:first-child {
    color: var(--vida-ui-blue);
    background-color: var(--vida-ui-sand);
    border-color: var(--vida-ui-sand);
}

.plan-picker__steps b {
    font-family: "Roboto Flex", Arial, sans-serif;
    font-weight: 700;
}

.plan-picker__steps span:not(:last-child)::after {
    color: rgba(224, 191, 154, .80);
    font-weight: 400;
    transform: translate(50%, -54%);
}

@media (max-width: 991px) {
    .plan-picker {
        padding-block: 56px 76px;
    }

    .plan-picker__heading {
        gap: 22px;
        margin-bottom: 20px;
    }

    .plan-picker__steps {
        gap: 14px;
    }

    .plan-picker__steps span {
        min-height: 42px;
        padding: 9px 16px;
        font-size: 13px;
    }
}

@media (max-width: 760px) {

    .plan-picker__heading {
        gap: 18px;
    }

    .plan-picker__heading .eyebrow,
    .plan-picker__heading h2 {
        line-height: .96;
    }

    .plan-picker__steps {
        display: flex;
        flex-wrap: wrap;
    }

    .plan-picker__steps span {
        width: auto;
        border-radius: 10px;
    }

    .plan-picker__steps span:not(:last-child)::after {
        display: none;
    }
}
.plan-picker {
    padding-block: clamp(58px, 6vw, 84px);
}

.plan-picker.pattern-blue::before {
    opacity: .13;
    background-size: 340px;
}

.plan-picker .container {
    width: min(100% - 120px, 1360px);
}

.plan-picker__heading {
    gap: 20px;
    margin-bottom: 22px;
}

.plan-picker__heading > div:first-child {
    max-width: 640px;
}

.plan-picker__heading .eyebrow,
.plan-picker__heading h2 {
    font-size: clamp(34px, 3.8vw, 58px);
    line-height: .92;
    letter-spacing: normal;
}

.plan-picker__heading .eyebrow {
    margin-bottom: 0;
    white-space: nowrap;
}

.plan-picker__heading h2 {
    white-space: nowrap;
}

.plan-picker__steps {
    gap: 16px;
}

.plan-picker__steps span {
    min-height: 44px;
    padding: 9px 18px;
    border-color: rgba(224, 191, 154, .55);
    border-radius: 10px;
    font-size: 13px;
}

.plan-picker__steps span:not(:last-child)::after {
    right: -14px;
    font-size: 16px;
}

@media (max-width: 991px) {
    .plan-picker .container {
        width: min(100% - 44px, 980px);
    }

    .plan-picker__heading > div:first-child {
        max-width: 560px;
    }

    .plan-picker__heading .eyebrow,
    .plan-picker__heading h2 {
        font-size: clamp(32px, 5vw, 48px);
        white-space: nowrap;
    }
}

@media (max-width: 760px) {
    .plan-picker {
        padding-block: 46px 60px;
    }

    .plan-picker .container {
        width: min(100% - 24px, 420px);
    }

    .plan-picker__heading > div:first-child {
        max-width: 100%;
    }

    .plan-picker__heading .eyebrow,
    .plan-picker__heading h2 {
        font-size: clamp(28px, 10vw, 40px);
        white-space: normal;
    }

    .plan-picker__steps {
        gap: 10px 12px;
    }

    .plan-picker__steps span {
        min-height: 38px;
        padding: 8px 12px;
        font-size: 12px;
    }
}
.plan-picker__heading > .plan-picker__cta-wrap {
    width: min(100%, 640px);
    max-width: none;
}

.plan-picker__title {
    font: inherit;
}

/* Neutralize the old split eyebrow/h2 rules for this new CTA only. */
.plan-picker__heading .plan-picker__title {
    margin: 0;
}

@media (max-width: 991px) {
    .plan-picker__heading > .plan-picker__cta-wrap {
        width: min(100%, 560px);
    }
}

@media (max-width: 760px) {
    .plan-picker__heading > .plan-picker__cta-wrap {
        width: 100%;
    }
}
.plan-picker__title {
    display: grid;
    gap: .02em;
    margin: 0;
    color: var(--vida-ui-sand);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(34px, 3.8vw, 58px);
    font-weight: 500;
    line-height: .92;
    letter-spacing: normal;
}

.plan-picker__title > span {
    display: block;
    white-space: nowrap;
}

@media (max-width: 991px) {
    .plan-picker__title {
        font-size: clamp(32px, 5vw, 48px);
    }
}

@media (max-width: 760px) {
    .plan-picker__title {
        font-size: clamp(28px, 10vw, 40px);
        line-height: .96;
    }

    .plan-picker__title > span {
        white-space: normal;
    }
}
.plan-picker .genplan-card {
    display: grid;
    grid-template-rows: 38px auto 42px;
    width: 100%;
    max-width: 100%;
    margin: 0;
    overflow: hidden;
    background: rgba(255, 255, 255, .018);
    border: 1px solid rgba(224, 191, 154, .28);
    border-radius: 8px;
    box-sizing: border-box;
}

.plan-picker .genplan-card__head {
    display: flex;
    align-items: center;
    min-width: 0;
    padding: 0 16px;
    color: var(--vida-ui-sand);
    font-family: var(--font-body);
    font-size: 10px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: .075em;
    text-transform: uppercase;
    background: rgba(7, 50, 82, .88);
    border-bottom: 1px solid rgba(224, 191, 154, .18);
    box-sizing: border-box;
}

.plan-picker .genplan-card__media {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 2.08 / 1;
    min-height: 0;
    overflow: hidden;
    background: #d9d9d7;
}

.plan-picker .genplan-card__media img {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: cover;
    object-position: center 52%;
    filter: grayscale(1) contrast(1.03);
    transition: filter .28s ease, transform .35s ease;
}

.plan-picker .genplan-card__media:hover img {
    filter: grayscale(.88) contrast(1.03);
}

.plan-picker .genplan-card__caption {
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 10px 18px;
    color: var(--vida-ui-sand);
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.15;
    text-align: center;
    text-decoration: none;
    background: rgba(255, 255, 255, .14);
    border-top: 1px solid rgba(224, 191, 154, .26);
    box-sizing: border-box;
    transition: background-color .2s ease, border-color .2s ease;
}

.plan-picker .genplan-card__caption:hover,
.plan-picker .genplan-card__caption:focus-visible {
    color: var(--vida-ui-sand);
    background: rgba(255, 255, 255, .18);
    border-color: rgba(224, 191, 154, .36);
}

.plan-picker .genplan-card__caption:focus-visible,
.plan-picker .genplan-card__media:focus-visible {
    outline: 2px solid var(--vida-ui-sand);
    outline-offset: -3px;
}

@media (max-width: 991px) {
    .plan-picker .genplan-card {
        grid-template-rows: 36px auto 40px;
    }

    .plan-picker .genplan-card__head {
        padding-inline: 14px;
        font-size: 9.5px;
    }

    .plan-picker .genplan-card__media {
        aspect-ratio: 1.82 / 1;
    }

    .plan-picker .genplan-card__caption {
        min-height: 40px;
        padding: 9px 14px;
        font-size: 11.5px;
    }
}

@media (max-width: 760px) {
    .plan-picker .genplan-card {
        grid-template-rows: 34px auto 40px;
        border-radius: 7px;
    }

    .plan-picker .genplan-card__head {
        padding-inline: 12px;
        font-size: 9px;
        letter-spacing: .055em;
    }

    .plan-picker .genplan-card__media {
        aspect-ratio: 1.42 / 1;
    }

    .plan-picker .genplan-card__caption {
        min-height: 40px;
        padding: 9px 12px;
        font-size: 11px;
    }
}
.catalog {
    z-index: 4;
    margin-top: -28px;
    padding: clamp(82px, 7.4vw, 104px) 0 clamp(86px, 7vw, 100px);
    overflow: hidden;
    color: var(--vida-blue);
    background: #f6f6f6;
    border-radius: 28px 28px 0 0;
}

.catalog__container {
    width: min(100% - 80px, 1200px);
}

.catalog__filters {
    display: grid;
    gap: 16px;
}

.catalog-filter-row {
    display: grid;
    grid-template-columns: 136px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
}

.catalog-filter-row__label {
    color: #1c2018;
    font-family: var(--font-body);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.2;
}

.catalog-filter-row__options {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.catalog .filter-chip {
    min-height: 36px;
    padding: 7px 20px 6px;
    color: #1c2018;
    background: #fff;
    border: 1px solid rgba(28, 32, 24, .14);
    border-radius: 8px;
    box-shadow: 0 1px 0 rgba(28, 32, 24, .02);
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.catalog .filter-chip:hover,
.catalog .filter-chip:focus-visible,
.catalog .filter-chip.is-active {
    color: #1c2018;
    background: #fff8ee;
    border-color: rgba(28, 32, 24, .30);
    transform: translateY(-1px);
}

.catalog .filter-chip:focus-visible {
    outline: 2px solid rgba(2, 36, 65, .34);
    outline-offset: 2px;
}

.catalog__all-link {
    display: inline-flex;
    min-width: 332px;
    min-height: 56px;
    margin-top: 8px;
    padding: 14px 28px;
    align-items: center;
    justify-content: center;
    gap: 18px;
    color: #1c2018;
    background: #dfc09a;
    border-radius: 999px;
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: normal;
    text-transform: uppercase;
    transition: transform .2s ease, background-color .2s ease;
}

.catalog__all-link:hover,
.catalog__all-link:focus-visible {
    color: #1c2018;
    background: #e8cba8;
    transform: translateY(-2px);
}

.catalog__all-link:focus-visible {
    outline: 2px solid #022441;
    outline-offset: 3px;
}

.catalog .apartment-grid--catalog {
    margin-top: 48px;
    gap: 24px;
}

.catalog .apartment-card--catalog {
    display: grid;
    grid-template-rows: 360px minmax(0, 1fr);
    min-width: 0;
    overflow: hidden;
    background: #fff;
    border: 0;
    border-radius: 28px;
    box-shadow: none;
    transition: transform .25s ease, box-shadow .25s ease;
}

.catalog .apartment-card--catalog:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 46px rgba(2, 36, 65, .08);
}

.catalog .apartment-card--catalog .apartment-card__image {
    display: grid;
    min-height: 0;
    padding: 42px 38px 18px;
    place-items: center;
    background: #fff;
}

.catalog .apartment-card--catalog .apartment-card__image img {
    width: 100%;
    max-width: 310px;
    max-height: 284px;
    object-fit: contain;
    transition: transform .25s ease;
}

.catalog .apartment-card--catalog:hover .apartment-card__image img {
    transform: scale(1.012);
}

.catalog .apartment-card--catalog .apartment-card__body {
    display: flex;
    min-height: 0;
    padding: 12px 32px 30px;
    flex-direction: column;
}

.catalog .apartment-card--catalog h3 {
    margin: 0 0 18px;
    color: #012341;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(19px, 1.65vw, 23px);
    font-weight: 500;
    line-height: 1.05;
    letter-spacing: normal;
}

.catalog .apartment-card--catalog .apartment-card__status {
    margin: 0 0 13px;
    color: #6b9f50;
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.15;
}

.catalog .apartment-card--catalog .apartment-card__price {
    margin: 0 0 28px;
    color: #012341;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(23px, 2vw, 28px);
    font-weight: 500;
    line-height: 1;
    letter-spacing: normal;
}

.catalog .apartment-card--catalog .apartment-card__button {
    margin-top: auto;
    color: #fff;
    background: #13442f;
    border-radius: 999px;
    font-family: var(--font-body);
}

.catalog .apartment-card--catalog .apartment-card__button:hover,
.catalog .apartment-card--catalog .apartment-card__button:focus-visible {
    background: #19563c;
}

@media (max-width: 1100px) {

    .catalog__all-link {
        min-width: 280px;
        padding-inline: 22px;
        font-size: 14px;
    }

    .catalog .apartment-card--catalog {
        grid-template-rows: 320px minmax(0, 1fr);
    }

    .catalog .apartment-card--catalog .apartment-card__image {
        padding-inline: 28px;
    }

    .catalog .apartment-card--catalog .apartment-card__body {
        padding-inline: 26px;
    }
}

@media (max-width: 900px) {
    .catalog {
        margin-top: -20px;
        padding-top: 70px;
        border-radius: 20px 20px 0 0;
    }

    .catalog__container {
        width: min(100% - 48px, 760px);
    }

    .catalog__all-link {
        min-width: 0;
        width: fit-content;
        margin-top: 0;
    }

    .catalog .apartment-card--catalog:last-child {
        display: none;
    }
}

@media (max-width: 620px) {
    .catalog {
        margin-top: -14px;
        padding: 56px 0 64px;
        border-radius: 14px 14px 0 0;
    }

    .catalog__container {
        width: min(100% - 28px, 420px);
    }

    .catalog-filter-row {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .catalog-filter-row__label {
        font-size: 15px;
    }

    .catalog .filter-chip {
        min-height: 34px;
        padding: 7px 14px;
        font-size: 14px;
    }

    .catalog__all-link {
        width: 100%;
        min-height: 50px;
        font-size: 13px;
    }

    .catalog .apartment-grid--catalog {
        margin-top: 34px;
        gap: 18px;
    }

    .catalog .apartment-card--catalog,
    .catalog .apartment-card--catalog:last-child {
        display: grid;
        grid-template-rows: 290px minmax(0, 1fr);
        border-radius: 22px;
    }

    .catalog .apartment-card--catalog .apartment-card__image {
        padding: 30px 26px 12px;
    }

    .catalog .apartment-card--catalog .apartment-card__body {
        padding: 12px 24px 24px;
    }

    .catalog .apartment-card--catalog h3 {
        font-size: 20px;
    }

    .catalog .apartment-card--catalog .apartment-card__price {
        font-size: 25px;
    }

    .catalog .apartment-card--catalog .apartment-card__button {
        min-height: 50px;
        font-size: 14px;
    }
}
.catalog .apartment-card--catalog .apartment-card__currency {
    display: inline-block;
    margin-left: .06em;
    font-family: var(--font-body);
    font-size: .92em;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    transform: translateY(-.015em);
}

.catalog .apartment-card--catalog .apartment-card__button {
    min-height: 48px;
    padding: 12px 22px 11px;
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: .035em;
    text-transform: uppercase;
}

@media (max-width: 760px) {
    .catalog .apartment-card--catalog .apartment-card__button {
        min-height: 46px;
        font-size: 12.5px;
    }
}
.happy-life {
    position: relative;
    color: #fff;
}

.happy-life::before {
    position: absolute;
    inset: 0;
    z-index: 0;
    content: "";
    pointer-events: none;
    background-image: url("../images/pattern-blue.webp");
    background-repeat: repeat;
    background-position: center top;
}

.happy-life > * {
    position: relative;
    z-index: 1;
}

.happy-life__location-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
}

.happy-life__location-row h3 {
    margin: 0;
}

.happy-life__location-row p {
    margin: 0 0 0 auto;
    text-align: right;
}

.happy-life__map {
    position: relative;
    width: 100%;
    margin: 0;
    overflow: hidden;
    background: #edf2ef;
}

.happy-life__map > img {
    width: 100%;
    aspect-ratio: 1660 / 947;
    object-fit: cover;
}

/* Animation specification 06: card reveal, staggered text, slow render zoom. */
.reveal-ready [data-benefit-card] {
    opacity: 0;
    transform: translateY(24px);
    transition:
        opacity .78s cubic-bezier(.22,.61,.36,1) var(--benefit-delay, 0ms),
        transform .78s cubic-bezier(.22,.61,.36,1) var(--benefit-delay, 0ms);
    will-change: opacity, transform;
}

.reveal-ready [data-benefit-card].is-visible {
    opacity: 1;
    transform: translateY(0);
}

.reveal-ready [data-benefit-text] {
    opacity: 0;
    transform: translateY(14px);
    transition:
        opacity .62s cubic-bezier(.22,.61,.36,1) calc(var(--benefit-delay, 0ms) + var(--benefit-text-delay, 180ms)),
        transform .62s cubic-bezier(.22,.61,.36,1) calc(var(--benefit-delay, 0ms) + var(--benefit-text-delay, 180ms));
}

.reveal-ready [data-benefit-card].is-visible [data-benefit-text] {
    opacity: 1;
    transform: translateY(0);
}

.reveal-ready [data-benefit-card].is-visible [data-benefit-image] {
    animation: vida-benefit-zoom 10s ease-in-out forwards;
}

@keyframes vida-benefit-zoom {
    from { transform: scale(1); }
    to { transform: scale(1.03); }
}

@media (max-width: 991px) {
    .happy-life::before {
        background-size: 480px auto;
    }
}

@media (max-width: 760px) {
    .happy-life::before {
        background-size: 360px auto;
    }

    .happy-life__map > img {
        min-height: 430px;
        aspect-ratio: auto;
        object-position: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .reveal-ready [data-benefit-card],
    .reveal-ready [data-benefit-text] {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .reveal-ready [data-benefit-card].is-visible [data-benefit-image] {
        animation: none;
    }
}

/* Lock the Figma composition: large render left, copy panel right. */

/* Same section background and ornament continue behind the location copy. */
.happy-life::before {
    opacity: .09;
    background-size: 620px auto;
}

.happy-life__story {
    background-color: #022441;
    background-image:
        url("../images/happy-life-pattern.webp"),
        linear-gradient(
            180deg,
            #cbb9a8 0%,
            #aaa19b 15%,
            #81858b 29%,
            #657480 41%,
            #465f73 54%,
            #294a65 66%,
            #163956 78%,
            #092b49 89%,
            #022441 100%
        );
    background-repeat: no-repeat, no-repeat;
    background-position: center top, center top;
    background-size: 100% 100%, 100% 100%;
}

.happy-life__story > * {
    position: relative;
    z-index: 1;
}

/* The background belongs to the static story layer, not to an animated card. */
.happy-life__location-row {
    background: transparent !important;
    background-image: none !important;
    min-height: 172px;
    padding: 34px clamp(36px, 3.2vw, 48px) 40px;
    column-gap: clamp(48px, 7vw, 104px);
    border: 0;
}

.happy-life__location-row h3 {
    max-width: 520px;
    color: #fff;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(34px, 3.45vw, 46px);
    font-weight: 500;
    line-height: .98;
    letter-spacing: normal;
}

.happy-life__location-row p {
    max-width: 500px;
    color: rgba(255, 255, 255, .94);
    font-family: var(--font-body);
    font-size: clamp(18px, 1.65vw, 22px);
    font-weight: 400;
    line-height: 1.12;
    letter-spacing: normal;
}

/* Hide animated content before the footer script executes, without hiding the static gradient. */
.js [data-benefit-card] {
    opacity: 0;
    transform: translateY(24px);
}

.js [data-benefit-card].is-visible {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 991px) {
    .happy-life__story {
        background-size: auto 100%, 100% 100%;
    }

    .happy-life__location-row {
        min-height: 156px;
        padding: 30px 32px 36px;
        column-gap: 32px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .js [data-benefit-card] {
        opacity: 1;
        transform: none;
    }
}
@media (min-width: 992px) {

    .happy-life__location-row h3 > span,
.happy-life__location-row p > span {
        display: block;
        white-space: nowrap;
    }

    .happy-life__location-row {
        grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
        column-gap: clamp(54px, 6vw, 92px);
        padding-inline: clamp(38px, 3.4vw, 54px);
    }

    .happy-life__location-row h3 {
        width: max-content;
        max-width: none;
        font-size: clamp(34px, 3.15vw, 42px);
        line-height: .99;
        letter-spacing: normal;
    }

    .happy-life__location-row p {
        width: max-content;
        max-width: none;
        margin-left: auto;
        font-size: clamp(17px, 1.48vw, 20px);
        line-height: 1.16;
        letter-spacing: normal;
        text-align: right;
    }
}

@media (max-width: 991px) {
    .happy-life__location-row h3 > span,
.happy-life__location-row p > span {
        display: block;
    }
}

@media (max-width: 760px) {
    .happy-life__location-row h3 > span,
.happy-life__location-row p > span {
        white-space: normal;
    }
}
@media (max-width: 760px) {
    .happy-life__story {
        background-position: center top, center top;
        background-size: auto 100%, 100% 100%;
    }

    .happy-life__location-row {
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 28px 24px 38px;
        gap: 18px;
        align-items: start;
        background: transparent !important;
    }

    .happy-life__location-row h3 {
        width: max-content;
        max-width: 100%;
        margin: 0;
        font-size: clamp(21px, 6.1vw, 25px);
        font-weight: 500;
        line-height: .98;
        letter-spacing: normal;
    }

    .happy-life__location-row h3 > span {
        display: block;
        white-space: nowrap;
    }

    .happy-life__location-row p {
        width: max-content;
        max-width: 100%;
        margin: 0;
        font-size: clamp(12px, 3.45vw, 14px);
        font-weight: 400;
        line-height: 1.18;
        letter-spacing: normal;
        text-align: left;
    }

    .happy-life__location-row p > span {
        display: block;
        white-space: nowrap;
    }
}

@media (max-width: 380px) {

    .happy-life__location-row p {
        font-size: 11.5px;
    }

    .happy-life__location-row {
        padding-inline: 20px;
    }

    .happy-life__location-row h3 {
        font-size: 20px;
    }
}
.purchase-story {
    position: relative;
    isolation: isolate;
    overflow: clip;
    color: var(--vida-white);
    background: var(--vida-blue);
}

.purchase-story::before {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: .065;
    background-image: url("../images/pattern-blue.webp");
    background-repeat: repeat;
    background-position: center top;
    background-size: 520px auto;
}

.purchase-story > .purchase {
    position: relative;
    z-index: 1;
    color: var(--vida-white);
    background: transparent !important;
}

/* Purchase methods: no cards, no dividers — plain editorial columns as in Figma. */

.purchase__sticky {
    align-items: start;
}

.purchase__content {
    width: min(100% - 72px, 1180px);
}

.purchase__heading {
    margin-bottom: clamp(42px, 5vw, 62px);
}

.purchase__heading h2 {
    margin: 0;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(34px, 3.25vw, 48px);
    font-weight: 500;
    line-height: .98;
    letter-spacing: normal;
}

.purchase-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(38px, 5.5vw, 82px);
    border: 0 !important;
}

.purchase-card,
.purchase-card:last-child {
    grid-column: auto;
    display: flex;
    min-height: 196px;
    padding: 0;
    flex-direction: column;
    color: var(--vida-white);
    background: transparent;
    border: 0 !important;
}

.purchase-card h3 {
    margin: 0 0 14px;
    color: var(--vida-white);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(17px, 1.55vw, 21px);
    font-weight: 500;
    line-height: 1.02;
    letter-spacing: normal;
}

.purchase-card h3 > span {
    display: block;
}

.purchase-card p {
    max-width: 310px;
    margin: 0 0 24px;
    color: rgba(255, 255, 255, .86);
    font-family: var(--font-body);
    font-size: clamp(12px, 1.05vw, 15px);
    font-weight: 400;
    line-height: 1.22;
}

.purchase-card .button {
    width: min(100%, 292px);
    min-height: 44px;
    margin-top: auto;
    padding: 11px 22px;
    color: #082d4b;
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .015em;
    background: #e0bf9a;
    border-radius: 999px;
}

/* Layouts: correct heading hierarchy, copy size and a flush-right portrait crop. */

.layouts__grid.container {
    display: grid;
    width: 100%;
    max-width: none;
    margin: 0;
    padding-left: max(32px, calc((100vw - 1180px) / 2));
    grid-template-columns: minmax(0, 1fr) minmax(460px, 43vw);
    align-items: stretch;
    gap: clamp(44px, 6vw, 88px);
}

.layouts__copy {
    max-width: 610px;
    padding: clamp(62px, 7vw, 92px) 0 clamp(80px, 9vw, 124px);
}

.layouts__copy h2 {
    margin: 0 0 12px;
    color: var(--vida-white);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(38px, 3.5vw, 52px);
    font-weight: 500;
    line-height: .98;
    letter-spacing: normal;
}

.layouts__media {
    min-width: 0;
    min-height: clamp(650px, 61vw, 820px);
    overflow: hidden;
}

.layouts__image {
    width: 100%;
    height: 100%;
    min-height: inherit;
    object-fit: cover;
    object-position: 46% center;
    border-radius: 0;
}

/* The desktop Figma state has no extra rows under the image.
   These benefits are presented as mobile cards, matching the mobile artboard. */
.feature-list {
    display: none;
}

@media (max-width: 1024px) and (min-width: 761px) {
    .purchase__content {
        width: min(100% - 48px, 940px);
    }

    .purchase-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 28px;
    }

    .purchase-card:last-child {
        grid-column: auto;
    }

    .purchase-card h3 {
        font-size: 17px;
    }

    .purchase-card p {
        font-size: 12px;
    }

    .layouts__grid.container {
        padding-left: 32px;
        grid-template-columns: minmax(0, 1fr) minmax(390px, 46vw);
        gap: 34px;
    }

    .layouts__copy {
        padding-block: 56px 82px;
    }
}

@media (max-width: 760px) {
    .purchase-story::before {
        opacity: .07;
        background-size: 360px auto;
    }

    .purchase {
        min-height: auto;
    }

    .purchase__sticky {
        position: relative;
        top: auto;
        display: block;
        height: auto;
        min-height: 0;
        padding: 0;
        overflow: visible;
    }

    .purchase__content {
        width: min(100% - 32px, 520px);
        opacity: 1 !important;
    }

    .purchase__heading {
        margin-bottom: 34px;
    }

    .purchase__heading h2 {
        font-size: clamp(26px, 8vw, 32px);
        line-height: 1;
    }

    .purchase-grid {
        display: flex;
        gap: 24px;
        flex-direction: column;
    }

    .purchase-card,
    .purchase-card:last-child {
        min-height: 0;
        padding: 0;
        border: 0 !important;
    }

    .purchase-card--installment { order: 1; }
    .purchase-card--tranche { order: 2; }
    .purchase-card--family { order: 3; }

    .purchase-card h3 {
        margin-bottom: 8px;
        font-size: 13.5px;
        line-height: 1.04;
    }

    .purchase-card p {
        max-width: 310px;
        margin-bottom: 16px;
        font-size: 10.5px;
        line-height: 1.2;
    }

    .purchase-card .button {
        width: 100%;
        min-height: 34px;
        margin-top: 0;
        padding-block: 9px;
        font-size: 9.5px;
    }

    .layouts__grid.container {
        width: 100%;
        padding: 0 16px;
        grid-template-columns: 1fr;
        gap: 26px;
    }

    .layouts__copy {
        max-width: none;
        padding: 0;
    }

    .layouts__copy h2 {
        margin-bottom: 7px;
        font-size: clamp(27px, 8.4vw, 34px);
    }

    .layouts__media {
        min-height: 0;
        aspect-ratio: 4 / 5;
        order: 2;
    }

    .layouts__image {
        min-height: 0;
        object-position: 44% center;
    }

    .feature-list {
        display: grid;
        width: 100%;
        margin: 0;
        padding: 12px 16px 58px;
        gap: 12px;
        background: transparent;
        border: 0;
    }

    .feature-row {
        display: block;
        min-height: 150px;
        padding: 20px 18px 22px;
        color: var(--vida-blue);
        background: #fff1df;
        border: 0;
        border-radius: 9px;
    }

    .feature-row > span {
        display: block;
        margin-bottom: 18px;
        color: var(--vida-blue);
        font-family: var(--font-body);
        font-size: 26px;
        font-weight: 500;
        line-height: 1;
    }

    .feature-row h3 {
        margin: 0 0 14px;
        color: var(--vida-blue);
        font-family: "Roboto Flex", Arial, sans-serif;
        font-stretch: 100%;
        font-variation-settings: "GRAD" 30;
        font-size: 14px;
        font-weight: 500;
        line-height: 1.05;
    }

    .feature-row p {
        margin: 0;
        color: rgba(6, 47, 80, .82);
        font-family: var(--font-body);
        font-size: 10.5px;
        font-weight: 400;
        line-height: 1.28;
    }
}

@media (max-width: 380px) {
    .purchase__content,
    .layouts__grid.container,
    .feature-list {
        padding-left: 14px;
        padding-right: 14px;
    }

    .purchase__content {
        width: 100%;
    }
}

/* Desktop: do not duplicate the same advantages below “Планировки”. */
@media (min-width: 761px) {
    .feature-list {
        display: none !important;
    }
}
.purchase {
    position: relative;
}

.purchase.is-photo-active .purchase__content a,
.purchase.is-photo-active .purchase__content button,
.purchase.is-photo-active .purchase__content input,
.purchase.is-photo-active .purchase__content select,
.purchase.is-photo-active .purchase__content textarea {
    pointer-events: none !important;
}

@media (max-width: 760px) {
    .purchase.is-photo-active .purchase__content,
    .purchase.is-photo-active .purchase__content a,
    .purchase.is-photo-active .purchase__content button {
        pointer-events: auto !important;
    }
}

.purchase.is-photo-active .purchase__content {
    z-index: 1;
    pointer-events: none !important;
}

@media (max-width: 760px) {

    .purchase__content,
    .purchase.is-photo-active .purchase__content {
        z-index: 2;
        pointer-events: auto !important;
    }
}
@media (min-width: 761px) {
    .purchase {
        min-height: 300svh;
    }
}
.purchase {
    min-height: auto !important;
    padding: clamp(72px, 8vw, 108px) 0 clamp(76px, 8vw, 112px) !important;
    overflow: visible !important;
}

.purchase__sticky {
    position: relative !important;
    top: auto !important;
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    padding-top: 0 !important;
    overflow: visible !important;
}

.purchase__content {
    z-index: auto !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
}

.layouts {
    position: relative;
    min-height: 300svh;
    padding: 0 !important;
    overflow: clip;
}

.layouts-scene__sticky {
    position: sticky;
    top: var(--header-height);
    height: calc(100svh - var(--header-height));
    min-height: 620px;
    overflow: hidden;
}

.layouts-scene__intro,
.layouts-scene__visual {
    position: absolute;
    inset: 0;
}

.layouts-scene__intro {
    z-index: 2;
    opacity: var(--layouts-content-opacity, 1);
    transform: translate3d(calc(var(--layouts-content-shift, 0px) * -1), 0, 0);
    will-change: opacity, transform;
}

.layouts__grid.layouts-scene__intro.container {
    display: grid;
    width: 100%;
    max-width: none;
    margin: 0;
    padding-left: max(32px, calc((100vw - 1180px) / 2));
    padding-right: 0;
    grid-template-columns: minmax(0, 1fr) minmax(460px, 43vw);
    align-items: stretch;
    gap: clamp(44px, 6vw, 88px);
}

.layouts-scene__intro .layouts__copy {
    max-width: 610px;
    padding: clamp(72px, 8.5vw, 108px) 0 clamp(84px, 9vw, 122px);
}

.layouts-scene__intro .layouts__media {
    min-width: 0;
    min-height: 100%;
    overflow: hidden;
}

.layouts-scene__intro .layouts__image {
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
    object-position: 48% center;
}

.layouts-scene__visual {
    z-index: 3;
    overflow: hidden;
    opacity: var(--layouts-visual-opacity, 0);
    clip-path: inset(0 0 0 var(--layouts-clip, 57%) round var(--layouts-radius, 24px));
    pointer-events: none;
    will-change: opacity, clip-path;
}

.layouts-scene__visual > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    transform: scale(var(--layouts-photo-scale, 1.08));
    transform-origin: center center;
    will-change: transform;
}

.layouts-scene__visual::after {
    position: absolute;
    inset: 0;
    z-index: 1;
    content: "";
    pointer-events: none;
    background: linear-gradient(180deg, rgba(6, 47, 80, .02), rgba(6, 47, 80, .12));
}

.layouts-benefits {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(18px, 2vw, 28px);
    align-content: center;
    padding: clamp(36px, 4vw, 64px);
    pointer-events: none;
}

.layouts-benefits__item {
    min-height: clamp(230px, 21vw, 320px);
    padding: clamp(28px, 2.6vw, 40px);
    color: var(--vida-blue);
    background: rgba(255, 248, 238, .94);
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 22px;
    box-shadow: 0 18px 44px rgba(2, 22, 42, .16);
    opacity: 0;
    transform: translate3d(0, 24px, 0);
    transition:
        opacity .72s cubic-bezier(.22,.61,.36,1) var(--layouts-benefit-delay, 0ms),
        transform .72s cubic-bezier(.22,.61,.36,1) var(--layouts-benefit-delay, 0ms);
}

.layouts-benefits.is-visible .layouts-benefits__item {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.layouts-benefits__index {
    display: block;
    margin-bottom: clamp(26px, 2.2vw, 36px);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(38px, 3.8vw, 56px);
    font-weight: 500;
    line-height: .9;
    letter-spacing: normal;
}

.layouts-benefits__item h3 {
    margin: 0 0 20px;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(18px, 1.5vw, 25px);
    font-weight: 500;
    line-height: 1.02;
    letter-spacing: normal;
}

.layouts-benefits__item p {
    margin: 0;
    color: rgba(2, 36, 65, .9);
    font-family: var(--font-body);
    font-size: clamp(14px, 1.05vw, 18px);
    font-weight: 400;
    line-height: 1.32;
}

.layouts-benefits-trigger {
    position: absolute;
    left: 0;
    top: 68%;
    width: 100%;
    height: 18svh;
    pointer-events: none;
}

@media (min-width: 761px) {
    .layouts .feature-list {
        display: none !important;
    }
}

@media (max-width: 980px) and (min-width: 761px) {
    .layouts__grid.layouts-scene__intro.container {
        padding-left: 28px;
        grid-template-columns: minmax(0, 1fr) minmax(390px, 46vw);
        gap: 32px;
    }

    .layouts-benefits {
        gap: 14px;
        padding: 24px;
    }

    .layouts-benefits__item {
        min-height: 230px;
        padding: 24px;
    }
}

@media (max-width: 760px) {
    .purchase {
        padding: 54px 0 62px !important;
    }

    .layouts {
        min-height: auto;
        padding: 42px 0 0 !important;
        overflow: visible;
    }

    .layouts-scene__sticky {
        position: relative;
        top: auto;
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    .layouts-scene__intro {
        position: relative;
        inset: auto;
        opacity: 1 !important;
        transform: none !important;
    }

    .layouts__grid.layouts-scene__intro.container {
        width: 100%;
        padding: 0 16px;
        grid-template-columns: 1fr;
        gap: 26px;
    }

    .layouts-scene__intro .layouts__copy {
        max-width: none;
        padding: 0;
    }

    .layouts-scene__intro .layouts__media {
        min-height: 0;
        aspect-ratio: 4 / 5;
    }

    .layouts-scene__visual,
    .layouts-benefits-trigger {
        display: none;
    }

    .layouts .feature-list {
        display: grid !important;
    }
}

@media (prefers-reduced-motion: reduce) and (min-width: 761px) {
    .layouts {
        min-height: auto;
        overflow: visible;
    }

    .layouts-scene__sticky {
        position: relative;
        top: auto;
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    .layouts-scene__intro {
        position: relative;
        inset: auto;
        opacity: 1 !important;
        transform: none !important;
    }

    .layouts-scene__visual,
    .layouts-benefits-trigger {
        display: none;
    }

    .layouts .feature-list {
        display: grid !important;
    }
}
@media (min-width: 761px) {
    .layouts-benefits-trigger {
        top: 60%;
    }
}
@media (min-width: 761px) {
    /* Keep the grid column for composition, but let the expanding visual be the only visible photo layer. */
    .layouts-scene__intro .layouts__media {
        opacity: 0;
        visibility: hidden;
    }

    /* The expanding visual should be fully opaque from the start; the motion comes from clip-path, not crossfading. */
    .layouts-scene__visual {
        opacity: 1 !important;
    }

    /* Match the crop to the static right-side composition so it feels like the same photo expanding outward. */
    .layouts-scene__visual > img {
        object-position: 48% center;
    }
}
.purchase-story {
    background-color: #022441 !important;
    background-image: url("../images/happy-life-pattern.webp") !important;
    background-repeat: repeat-y !important;
    background-position: center top !important;
    background-size: 100% auto !important;
}

.purchase-story::before {
    display: none !important;
    content: none !important;
}

.purchase-story > .purchase,
.purchase-story .purchase__sticky {
    background-color: transparent !important;
    background-image: none !important;
}

@media (max-width: 760px) {
    .purchase-story {
        background-size: auto 760px !important;
        background-position: center top !important;
    }
}
.news.section--cream.pattern-cream {
    isolation: isolate;
}

.news.section--cream.pattern-cream::before {
    display: none !important;
    content: none !important;
}

.news.section--cream.pattern-cream > * {
    position: relative;
    z-index: 1;
}

@media (max-width: 760px) {
    .news.section--cream.pattern-cream {
        background-size: auto 100%, 100% 100%;
        background-position: center top, center top;
    }
}

.news .section-heading {
    width: min(100%, 1180px);
    margin: 0 auto clamp(36px, 4vw, 52px);
    align-items: center;
}

.news .section-heading h2 {
    margin: 0;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
}

.news .section-heading .button--ghost {
    font-family: var(--font-body);
    text-transform: uppercase;
    border: 0;
    border-radius: 999px;
    box-shadow: none;
}

.news-layout {
    display: grid;
}

.news-featured > a {
    display: grid;
}

.news-featured img,
.news-featured__content {
    grid-area: auto;
}

.news-featured img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 1;
    border-radius: 0;
}

.news-featured__content {
    display: flex;
}

.news-featured__content h3 {
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
}

.news-featured__content p {
    margin: 0 0 12px;
    font-family: var(--font-body);
    font-weight: 400;
}

.news-featured__content time {
    font-family: var(--font-body);
    line-height: 1.2;
}

.news .tag {
    display: inline-flex;
    font-family: var(--font-body);
}

.news-list {
    grid-template-rows: repeat(3, minmax(0, 1fr));
}

.news-item {
    min-height: 0;
    border-bottom: 1px solid rgba(224, 191, 154, .72);
}

.news-item a {
    display: flex;
}

.news-item h3 {
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
}

.news-item p {
    font-family: var(--font-body);
    font-weight: 400;
}

.news-item time {
    font-family: var(--font-body);
    line-height: 1.2;
}

@media (max-width: 900px) {
    .news-layout {
        grid-template-columns: minmax(0, 1.3fr) minmax(280px, .9fr);
    }

    .news-featured > a {
        min-height: 470px;
        grid-template-rows: 210px 1fr;
    }
}

@media (max-width: 760px) {

    .news .section-heading {
        width: min(100% - 32px, 520px);
        align-items: center;
        gap: 16px;
    }

    .news .section-heading .button--ghost {
        white-space: nowrap;
    }

    .news-layout {
        width: min(100% - 32px, 520px);
        grid-template-columns: 1fr;
    }

    .news-featured > a {
        grid-template-rows: auto auto;
    }

    .news-featured img {
        aspect-ratio: 16 / 9;
    }

    .news-featured__content {
        padding-top: 16px;
    }

    .news-featured__content h3 {
        margin-bottom: 12px;
    }

    .news-featured__content p {
        font-size: 10.5px;
    }

    .news-featured__content time {
        margin-top: 14px;
        font-size: 9.5px;
    }

    .news-list {
        grid-template-rows: none;
    }

    .news-item p {
        font-size: 10px;
    }
}
.news.section--cream.pattern-cream {
    --news-ink: #022441;
    --news-sand: #e0bf9a;
    --news-paper: #fff8ee;
}

.news .section-heading {
    margin-bottom: clamp(34px, 3.6vw, 46px);
}

.news .section-heading h2 {
    font-size: clamp(38px, 3.15vw, 46px);
    font-weight: 500;
    line-height: 1;
    letter-spacing: normal;
}

.news .section-heading .button--ghost {
    min-height: 40px;
    padding: 10px 21px;
    color: var(--news-ink);
    font-family: var(--font-body);
    font-size: 10px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: .01em;
    background: var(--news-sand);
}

.news-featured img {
    object-position: center 46%;
}

.news-featured__content {
    padding-top: clamp(16px, 1.5vw, 21px);
}

.news-featured__content .tag {
    margin-bottom: 14px;
    color: var(--news-sand);
    background: rgba(224, 191, 154, .10);
    border: 1px solid rgba(224, 191, 154, .18);
}

.news-featured__content h3 {
    margin-bottom: 14px;
}

.news-featured__content p {
    max-width: 520px;
    margin-bottom: 11px;
    color: rgba(255, 255, 255, .56);
    font-size: 11px;
    line-height: 1.28;
}

.news-featured__content time {
    color: rgba(255, 255, 255, .50);
    font-size: 9.5px;
    letter-spacing: .01em;
}

.news .tag {
    font-family: var(--font-body);
}

.news-item {
    border-bottom-color: rgba(224, 191, 154, .82);
}

.news-item p {
    max-width: 285px;
    color: rgba(2, 36, 65, .38);
    font-size: 10px;
    line-height: 1.28;
}

.news-item time {
    font-size: 9px;
    letter-spacing: .01em;
}

@media (max-width: 900px) and (min-width: 761px) {
    .news-layout {
        grid-template-columns: minmax(0, 1.45fr) minmax(285px, .9fr);
    }

    .news-featured > a {
        min-height: 470px;
        grid-template-rows: 210px 1fr;
    }
}

@media (max-width: 760px) {

    .news .section-heading {
        margin-bottom: 26px;
    }

    .news .section-heading h2 {
        font-size: clamp(27px, 8vw, 33px);
    }

    .news .section-heading .button--ghost {
        min-height: 33px;
        padding: 8px 13px;
        font-size: 8px;
    }

    .news-layout {
        border-radius: 15px;
    }

    .news-featured > a {
        padding: 15px;
    }

    .news-featured__content .tag {
        margin-bottom: 11px;
    }

    .news-featured__content h3 {
        line-height: 1.04;
    }

    .news-item h3 {
        font-size: 13.5px;
    }
}

.contacts__grid {
    display: grid;
}

.contacts .tag {
    text-transform: none;
}

.contacts__copy {
    padding-top: 2px;
}

.contacts__copy h2 {
    color: var(--vida-blue);
}

.contacts__lead,
.contacts__copy > p {
    margin: 0;
}

.contacts__details-item {
    min-width: 0;
}

.contacts__details h3 {
    color: var(--vida-green);
    font-weight: 500;
}

.contacts__link {
    display: block;
    width: fit-content;
    color: var(--vida-green);
    text-decoration-line: underline;
    text-decoration-color: rgba(11, 84, 60, 0.42);
}

.contacts__link:last-child {
    margin-bottom: 0;
}

.socials {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.socials__link,
.socials a,
.socials span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    margin: 0;
    text-decoration: none;
    font-family: var(--font-body);
    line-height: 1;
}

.contacts__form-card {
    width: 100%;
    margin-left: auto;
    background: rgba(255, 255, 255, 0.96);
}

.contacts__form-card h3 {
    text-transform: none;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-weight: 400;
    letter-spacing: 0;
}

@media (max-width: 960px) {

    .contacts__copy h2 {
        margin-bottom: 18px;
    }

    .contacts__details {
        max-width: none;
        margin-top: 38px;
        gap: 28px;
        grid-template-columns: 1fr 1fr;
    }

    .contacts__form-card {
        margin-left: 0;
    }
}

@media (max-width: 640px) {

    .contacts__lead,
    .contacts__copy > p {
        line-height: 1.32;
    }

    .contacts__details {
        grid-template-columns: 1fr;
    }

    .contacts__details h3 {
        margin-bottom: 12px;
    }

    .contacts__link {
        margin-bottom: 10px;
    }

    .socials__link,
    .socials a,
    .socials span {
        font-size: 18px;
    }

    .contacts__form-card {
        max-width: none;
        border-radius: 16px;
    }

    .contact-form {
        gap: 10px;
    }

    .field__input {
        min-height: 40px;
        padding: 10px 12px;
        font-size: 12px;
    }

    .consent {
        font-size: 9px;
    }

    .contact-form__submit {
        justify-content: center;
    }
}
.contacts.section--accent {
    background: linear-gradient(180deg, #f5d6b5 0%, #f1cb9b 100%);
}

.contacts {
    padding-block: 66px 76px;
}

.contacts__grid {
    grid-template-columns: minmax(0, 1fr) 410px;
    gap: clamp(64px, 7vw, 96px);
    align-items: start;
}

.contacts__copy {
    max-width: 610px;
}

.contacts .tag {
    border-color: rgba(224, 191, 154, .82);
    font-family: var(--font-body);
    font-weight: 400;
}

.contacts__copy h2 {
    font-weight: 500;
    line-height: .96;
}

.contacts__lead,
.contacts__copy > p {
    max-width: 385px;
    color: rgba(2, 36, 65, .82);
    font-size: 14px;
    line-height: 1.32;
}

.contacts__details {
    margin-top: 42px;
    grid-template-columns: minmax(0, 1.2fr) minmax(130px, .8fr);
    gap: 44px;
}

.contacts__details h3 {
    margin-bottom: 14px;
    font-size: 16px;
    line-height: 1.05;
    letter-spacing: normal;
}

.contacts__link {
    margin-bottom: 8px;
    font-size: 14px;
    line-height: 1.25;
    text-decoration-thickness: .8px;
    text-underline-offset: 3px;
}

.socials__link,
.socials a,
.socials span {
    font-size: 17px;
    font-weight: 500;
    letter-spacing: normal;
}

.contacts__form-card {
    max-width: 410px;
    padding: 20px 20px 18px;
    border: 1px solid rgba(255, 255, 255, .72);
    border-radius: 16px;
    box-shadow: 0 10px 26px rgba(2, 36, 65, .06);
}

.contacts__form-card h3 {
    margin-bottom: 15px;
    color: rgba(2, 36, 65, .48);
    font-size: 11px;
    line-height: 1.2;
}

.field__input {
    border-color: rgba(2, 36, 65, .18);
}

.consent input {
    margin-top: 1px;
}

@media (max-width: 960px) {
    .contacts {
        padding-block: 56px 68px;
    }

    .contacts__grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .contacts__copy h2 {
        font-size: clamp(40px, 7vw, 52px);
    }

    .contacts__form-card {
        max-width: 410px;
    }
}

@media (max-width: 640px) {
    .contacts {
        padding-block: 46px 54px;
    }

    .contacts__copy h2 {
        margin: 14px 0 15px;
    }

    .contacts__lead,
    .contacts__copy > p {
        max-width: 310px;
        font-size: 12px;
    }

    .contacts__details {
        margin-top: 28px;
        gap: 22px;
    }

    .contacts__details h3 {
        font-size: 15px;
    }

    .contacts__link {
        font-size: 13px;
    }

    .contacts__form-card {
        padding: 16px;
    }

    .contact-form__submit {
        min-width: 190px;
    }
}
.contacts .tag {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 7px 18px 6px;
    color: rgba(2, 36, 65, 0.64);
    background: rgba(255, 248, 238, 0.82);
    border: 1px solid rgba(194, 174, 152, 0.84);
    border-radius: 999px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
    font-size: 11px;
    line-height: 1;
    letter-spacing: normal;
}

.contacts__copy h2 {
    margin: 18px 0 20px;
    font-size: clamp(44px, 4.45vw, 58px);
    letter-spacing: normal;
}

.contacts__details {
    max-width: 500px;
}

.socials {
    gap: 12px;
}

.socials__link,
.socials a,
.socials span {
    width: 28px;
    height: 28px;
    color: var(--vida-green);
}

.socials__link svg,
.socials a svg,
.socials span svg {
    display: block;
    width: 100%;
    height: 100%;
}

@media (max-width: 960px) {
    .contacts__copy h2 {
        max-width: 680px;
    }
}

@media (max-width: 640px) {
    .contacts .tag {
        min-height: 26px;
        padding: 7px 16px 6px;
        font-size: 10px;
    }

    .contacts__copy h2 {
        letter-spacing: normal;
    }

    .socials__link,
    .socials a,
    .socials span {
        width: 24px;
        height: 24px;
    }

    .contact-form__submit {
        width: 100%;
        max-width: 210px;
        justify-self: center;
    }
}
@media (min-width: 961px) {
    .contacts__grid {
        grid-template-columns: minmax(0, 1fr) 410px;
    }

    .contacts__copy {
        min-width: 0;
    }

    .contacts__copy h2 {
        font-size: clamp(42px, 4vw, 54px);
    }
}

.contacts .socials {
    display: flex;
    align-items: center;
    gap: 12px;
}

.contacts .socials__link,
.contacts .socials a.socials__link,
.contacts .socials span.socials__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    min-width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    color: var(--vida-green);
    background: transparent;
    border: 0;
    font-size: 0;
    line-height: 0;
}

.contacts .socials__link svg {
    display: block;
    width: 24px;
    height: 24px;
    overflow: visible;
}

.contacts .contact-form {
    justify-items: stretch;
}

.contacts .contact-form__submit {
    justify-self: center !important;
    margin-inline: auto;
}

@media (max-width: 640px) {
    .contacts__copy h2 {
        width: auto;
    }
}
.contacts .socials__link--max svg {
    width: 23px;
    height: 23px;
}

.contacts .socials__link--max {
    color: var(--vida-green);
}

@media (max-width: 640px) {
    .contacts .socials__link--max svg {
        width: 21px;
        height: 21px;
    }
}
.social-links {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.social-links__item {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    color: var(--vida-green);
    border-radius: 50%;
    cursor: pointer;
    outline: none;
    transition:
        color 0.2s ease,
        background-color 0.2s ease,
        transform 0.2s ease;
}

.social-links__item:hover,
.social-links__item:focus-visible {
    color: var(--vida-blue);
    background: rgba(255, 248, 238, 0.4);
    transform: translateY(-2px);
}

.social-links__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    line-height: 0;
}

.social-links__icon svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
}

/* Optical normalization: equal perceived weight, not identical SVG boxes. */

@media (max-width: 640px) {
    .social-links {
        gap: 9px;
    }

    .social-links__item {
        width: 31px;
        height: 31px;
    }

    .social-links__icon {
        width: 23px;
        height: 23px;
    }
}
.social-links__item,
.social-links__item:visited {
    background: transparent;
    box-shadow: none;
    text-decoration: none;
    transform: none;
}

.social-links__item:hover {
    color: var(--vida-blue);
    background: transparent;
    box-shadow: none;
    transform: none;
}

.social-links__item:focus-visible {
    color: var(--vida-blue);
    background: transparent;
    box-shadow: none;
    outline: 2px solid rgba(11, 84, 60, 0.5);
    outline-offset: 3px;
    transform: none;
}

.social-links__item.is-placeholder::after {
    content: none !important;
    display: none !important;
}

.social-links__icon {
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.social-links__item:hover .social-links__icon {
    opacity: 0.78;
}

.social-links__item:focus-visible .social-links__icon {
    opacity: 1;
}
.social-links__item--vk .social-links__icon {
    width: 30px;
    height: 22px;
    transform: translateY(0.2px);
}

.social-links__item--telegram .social-links__icon {
    width: 22px;
    height: 22px;
    transform: translateY(0.4px);
}

.social-links__item--max .social-links__icon {
    width: 20px;
    height: 20px;
    transform: translateY(0.7px);
}

@media (max-width: 640px) {
    .social-links__item--vk .social-links__icon {
        width: 27px;
        height: 20px;
    }

    .social-links__item--telegram .social-links__icon {
        width: 20px;
        height: 20px;
    }

    .social-links__item--max .social-links__icon {
        width: 18px;
        height: 18px;
    }
}
.plan-picker {
    position: relative;
    isolation: isolate;
}

.plan-picker > * {
    position: relative;
    z-index: 1;
}

@media (max-width: 991px) {
    .plan-picker {
        background-size: 100% 100%, 1280px auto !important;
    }
}
.plan-picker {
    background-color: #022441 !important;
    background-image: url("../images/happy-life-pattern.webp") !important;
    background-repeat: repeat-y !important;
    background-position: center top !important;
    background-size: 100% auto !important;
}

.plan-picker.pattern-blue::before {
    display: none !important;
    content: none !important;
}

@media (max-width: 760px) {
    .plan-picker {
        background-size: auto 760px !important;
        background-position: center top !important;
    }
}
.about-stats-story::before {
    opacity: 1;
    mix-blend-mode: normal;
    background-image: url("../images/happy-life-pattern.webp") !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: 100% auto !important;
}

@media (max-width: 760px) {
    .about-stats-story::before {
        background-size: auto 760px !important;
        background-position: center top !important;
    }
}
.manifest.pattern-cream::before {
    background-image: url("../images/happy-life-pattern.webp") !important;
    background-repeat: repeat-y !important;
    background-position: center top !important;
    background-size: 100% auto !important;
    opacity: 1 !important;
    mix-blend-mode: normal !important;
}

@media (max-width: 760px) {
    .manifest.pattern-cream::before {
        background-repeat: repeat-y !important;
        background-size: auto 760px !important;
        background-position: center top !important;
    }
}
.manifest-gallery-story {
    position: relative;
    isolation: isolate;
    overflow: clip;
    background-color: var(--vida-cream-light);
}

.manifest-gallery-story::before {
    position: absolute;
    inset: 0;
    z-index: 0;
    content: "";
    pointer-events: none;
    background-image: url("../images/happy-life-pattern.webp") !important;
    background-repeat: repeat-y !important;
    background-position: center top !important;
    background-size: 100% auto !important;
    opacity: 1 !important;
    mix-blend-mode: normal !important;
}

.manifest-gallery-story > .manifest,
.manifest-gallery-story > .floating-gallery {
    position: relative;
    z-index: 1;
    background: transparent !important;
}

.manifest-gallery-story--without-manifest > .floating-gallery {
    margin-top: 0;
}

.manifest-gallery-story > .manifest.pattern-cream::before {
    display: none !important;
    content: none !important;
}

@media (max-width: 760px) {
    .manifest-gallery-story::before {
        background-size: auto 760px !important;
        background-position: center top !important;
    }
}
.site-footer__declaration {
    display: inline-flex;
    gap: 0.3em;
    flex-wrap: wrap;
    align-items: baseline;
}
a.filter-chip {
    text-decoration: none;
}
.site-header__phone-icon {
    display: none;
    flex: 0 0 auto;
}

@media (max-width: 760px) {
    .site-header {
        z-index: 1000;
        background: var(--vida-blue);
    }

    .site-header__inner {
        display: grid;
        width: min(100% - 40px, 420px);
        min-height: 70px;
        grid-template-columns: auto 1fr auto !important;
        align-items: center;
        gap: 18px;
    }

    .site-brand {
        width: 124px;
    }

    .site-brand__image,
    .custom-logo {
        max-height: 58px;
    }

    .site-header__actions {
        display: flex;
        align-items: center;
        justify-self: end;
        gap: 14px;
    }

    .site-header__callback {
        display: none !important;
    }

    .site-header__phone,
    .menu-toggle {
        display: inline-flex !important;
        width: 42px;
        height: 42px;
        align-items: center;
        justify-content: center;
        padding: 10px;
        color: var(--vida-white);
        background: transparent;
        border: 1px solid rgba(255, 255, 255, .42);
        border-radius: 50%;
        text-decoration: none;
    }

    .site-header__phone-text {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        white-space: nowrap;
        border: 0;
        clip: rect(0, 0, 0, 0);
    }

    .site-header__phone-icon {
        display: block;
        width: 22px;
        height: 22px;
    }

    .menu-toggle {
        cursor: pointer;
    }

    .site-nav {
        position: fixed !important;
        inset: var(--header-height) 0 0 0 !important;
        z-index: 999 !important;
        display: flex !important;
        width: 100vw;
        height: calc(100svh - var(--header-height));
        padding: clamp(34px, 9vw, 58px) 24px 40px !important;
        align-items: flex-start;
        justify-content: center;
        overflow-y: auto;
        overscroll-behavior: contain;
        visibility: hidden;
        opacity: 0;
        background: rgba(6, 47, 80, .98) !important;
        backdrop-filter: blur(14px);
        transform: translateY(-10px);
        transition:
            visibility 0s .25s,
            opacity .25s ease,
            transform .25s ease;
    }

    .menu-open .site-nav {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
        transition-delay: 0s;
    }

    .site-nav__list {
        width: min(100%, 360px);
        margin: 0;
        padding: 0;
        align-items: center;
    }

    .site-nav__link,
    .site-nav__more-toggle,
    .site-nav a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--vida-white);
        text-align: center;
    }

    .site-nav__more-toggle {
        display: none;
    }

    .site-nav__item--has-children {
        width: 100%;
    }

    .site-nav__submenu {
        display: flex;
        width: 100%;
        flex-direction: column;
        gap: 24px;
        padding-top: 0;
    }

    .site-nav__item--has-children:hover .site-nav__submenu,
    .site-nav__item--has-children:focus-within .site-nav__submenu {
        left: auto;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
    }

    .site-nav__submenu-link {
        padding: 0;
        color: var(--vida-white);
        font-family: var(--font-body);
        font-size: 28px;
        opacity: 1;
    }

    body.menu-open {
        overflow: hidden;
        touch-action: none;
    }
}

/* Honeypot против простого спама: поле есть в DOM, но недоступно пользователю. */
.form-hp {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.contact-form {
    display: grid;
    gap: 11px;
}

.contact-form--compact {
    margin-top: 18px;
    gap: 12px;
}

.field {
    display: grid;
    gap: 5px;
}

.field__label {
    color: rgba(6, 47, 80, .46);
    text-transform: uppercase;
    font-size: 8px;
    line-height: 1.1;
    letter-spacing: .025em;
}

.field__input {
    width: 100%;
    min-height: 42px;
    padding: 10px 12px;
    color: var(--vida-blue);
    background: var(--vida-white);
    border: 1px solid rgba(2, 36, 65, .18);
    border-radius: 7px;
    box-shadow: none;
    outline: none;
    font-size: 12px;
    line-height: 1.2;
}

.field__input::placeholder {
    color: rgba(6, 47, 80, .28);
}

.field__input:focus,
.field__input:focus-visible,
.field__select:focus,
.field__select:focus-visible {
    border-color: rgba(6, 47, 80, .26);
    outline: none;
    box-shadow: 0 0 0 3px rgba(224, 191, 154, .26);
}

.field__select {
    padding-right: 34px;
    appearance: none;
}

.consent {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin-top: 1px;
    color: rgba(6, 47, 80, .55);
    font-size: 10px;
    line-height: 1.35;
}

.contact-form__consents {
    display: grid;
    gap: 7px;
}

.consent input {
    width: 13px;
    height: 13px;
    margin: 1px 0 0;
    flex: 0 0 13px;
    accent-color: var(--vida-green);
}

.consent span {
    padding-top: 0;
}

.consent a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.contact-form__submit {
    justify-self: center;
    min-width: 202px;
    min-height: 42px;
    margin-top: 3px;
    padding: 11px 17px 10px 20px;
    color: var(--vida-blue);
    background: #e0bf9a;
    box-shadow: none;
    text-align: center;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .01em;
}

.contact-form__submit .button__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 2px;
    font-size: 16px;
    line-height: 1;
}

.form-notice {
    padding: 12px 14px;
    margin-bottom: 12px;
    border-radius: 8px;
    font-size: 12px;
}

/* Кастомный select работает поверх нативного select.
   Нативное поле остаётся в форме для отправки и доступности без JS. */
.custom-select {
    position: relative;
    width: 100%;
}

.custom-select__control {
    position: relative;
    display: none;
}

.custom-select.is-enhanced .field__select {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    pointer-events: none;
}

.custom-select.is-enhanced .custom-select__control {
    display: block;
}

.custom-select__trigger {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 42px;
    padding: 10px 38px 10px 12px;
    align-items: center;
    justify-content: space-between;
    color: var(--vida-blue);
    font-family: var(--font-body);
    font-size: 12px;
    line-height: 1.2;
    text-align: left;
    background: var(--vida-white);
    border: 1px solid rgba(2, 36, 65, .18);
    border-radius: 7px;
    box-shadow: none;
    cursor: pointer;
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.custom-select__trigger:hover {
    border-color: rgba(2, 36, 65, .3);
}

.custom-select__trigger:focus-visible,
.custom-select.is-open .custom-select__trigger {
    border-color: rgba(2, 36, 65, .28);
    outline: none;
    box-shadow: 0 0 0 3px rgba(224, 191, 154, .28);
}

.custom-select__chevron {
    position: absolute;
    top: 50%;
    right: 14px;
    width: 12px;
    height: 8px;
    color: rgba(2, 36, 65, .66);
    transform: translateY(-50%);
    transition: transform .2s ease;
    pointer-events: none;
}

.custom-select.is-open .custom-select__chevron {
    transform: translateY(-50%) rotate(180deg);
}

.custom-select__menu {
    position: absolute;
    top: calc(100% + 7px);
    right: 0;
    left: 0;
    z-index: 120;
    display: none;
    max-height: var(--custom-select-menu-max-height, 244px);
    padding: 5px;
    overflow-y: auto;
    overscroll-behavior: contain;
    color: var(--vida-blue);
    background: rgba(255, 255, 255, .985);
    border: 1px solid rgba(2, 36, 65, .14);
    border-radius: 11px;
    box-shadow: 0 18px 42px rgba(2, 36, 65, .16), 0 4px 12px rgba(2, 36, 65, .08);
    scrollbar-width: thin;
    scrollbar-color: rgba(2, 36, 65, .18) transparent;
}

.custom-select.is-open .custom-select__menu {
    display: grid;
}

.custom-select.is-dropup .custom-select__menu {
    top: auto;
    bottom: calc(100% + 7px);
    box-shadow: 0 -18px 42px rgba(2, 36, 65, .15), 0 -4px 12px rgba(2, 36, 65, .07);
}

.custom-select__option {
    display: flex;
    width: 100%;
    min-height: 35px;
    padding: 8px 10px;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    color: var(--vida-blue);
    font-family: var(--font-body);
    font-size: 12px;
    line-height: 1.25;
    text-align: left;
    background: transparent;
    border: 0;
    border-radius: 7px;
    cursor: pointer;
    transition: color .15s ease, background-color .15s ease;
}

.custom-select__option:hover,
.custom-select__option:focus-visible,
.custom-select__option.is-active {
    color: var(--vida-blue);
    background: rgba(224, 191, 154, .26);
    outline: none;
}

.custom-select__option.is-selected {
    color: var(--vida-green);
    background: rgba(224, 191, 154, .17);
    font-weight: 500;
}

.custom-select__option svg {
    width: 14px;
    height: 11px;
    flex: 0 0 auto;
    opacity: 0;
    transition: opacity .15s ease;
}

.custom-select__option.is-selected svg {
    opacity: 1;
}

.custom-select__menu::-webkit-scrollbar {
    width: 7px;
}

.custom-select__menu::-webkit-scrollbar-thumb {
    background: rgba(2, 36, 65, .18);
    border: 2px solid transparent;
    border-radius: 999px;
    background-clip: padding-box;
}

/* Форма в контактах должна позволять select-меню выходить за карточку. */
.contacts {
    overflow: visible;
}

.contacts__form-card {
    position: relative;
    z-index: 5;
    overflow: visible;
}

.contacts__form-card .custom-select.is-open {
    z-index: 30;
}

.contacts__form-card .custom-select__menu {
    max-height: var(--custom-select-menu-max-height, 214px);
}

.contacts__form-card .consent {
    color: rgba(2, 36, 65, .68);
    font-size: 11px;
    line-height: 1.4;
}

/* Модальное окно и его select не должны создавать внутренние скачки прокрутки. */
.modal__dialog {
    overscroll-behavior: contain;
}

.modal__dialog .custom-select__menu {
    z-index: 120;
}

.modal[data-modal="callback"] .modal__dialog {
    width: min(calc(100% - 32px), 430px);
    padding: 32px 30px 34px;
    border-radius: 20px;
}

.modal[data-modal="callback"] .modal__dialog h2 {
    padding-right: 38px;
    margin: 8px 0 12px;
    font-size: clamp(30px, 2.55vw, 34px);
    line-height: .98;
    letter-spacing: normal;
    white-space: nowrap;
}

.modal[data-modal="callback"] .modal__dialog > p {
    max-width: 350px;
    font-size: 14px;
    line-height: 1.4;
}

.modal[data-modal="callback"] .field__input,
.modal[data-modal="callback"] .custom-select__trigger {
    min-height: 44px;
}

.modal[data-modal="callback"] .consent {
    color: rgba(2, 36, 65, .68);
    font-size: 11px;
    line-height: 1.35;
}

.modal[data-modal="callback"] .contact-form__submit {
    min-width: 210px;
}

.modal[data-modal="offer"] .modal__dialog {
    width: min(calc(100% - 32px), 620px);
}

.offer-disclaimer[hidden] {
    display: none;
}

.offer-disclaimer {
    margin: 18px 0 20px;
}

.offer-disclaimer__psc {
    padding: 0;
    margin: 0;
    color: rgba(2, 36, 65, .72);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.35;
}

.offer-disclaimer__conditions {
    padding-top: 16px;
    margin-top: 16px;
    color: rgba(2, 36, 65, .74);
    font-size: 12px;
    line-height: 1.45;
    border-top: 1px solid rgba(2, 36, 65, .14);
}

.offer-disclaimer__conditions h3 {
    margin: 0 0 8px;
    color: var(--vida-blue);
    font-size: 14px;
    font-weight: 650;
    line-height: 1.2;
}

.offer-disclaimer__conditions p {
    margin: 0 0 10px;
}

.offer-disclaimer__conditions a {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.offer-disclaimer__warning {
    color: var(--vida-blue);
    font-weight: 700;
}

/* Крестик рисуем геометрически, чтобы он не зависел от глифа × в системном шрифте. */
.modal__close {
    display: block;
    font-size: 0;
    line-height: 0;
}

.modal__close::before,
.modal__close::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 2px;
    content: "";
    background: currentColor;
    border-radius: 999px;
    transform-origin: center;
}

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

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

.modal__close:hover {
    background: #e8e8e5;
}

.modal__close:focus-visible {
    outline: 2px solid var(--vida-sand);
    outline-offset: 3px;
}

/* iOS Safari автоматически приближает страницу, если поле меньше 16px.
   Масштабирование через viewport не запрещаем — вместо этого увеличиваем сами поля. */
@media (max-width: 760px) {
    input,
    select,
    textarea,
    .field__input,
    .custom-select__trigger,
    .custom-select__option {
        font-size: 16px;
    }

    .field__input,
    .custom-select__trigger {
        min-height: 54px;
    }

    .custom-select__option {
        min-height: 46px;
    }

    .contacts__form-card,
    .modal__dialog {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    .contact-form__submit {
        width: 100%;
        min-height: 54px;
        justify-content: center;
    }

    .custom-select__menu {
        max-height: var(--custom-select-menu-max-height, 216px);
        padding: 4px;
    }

    .modal[data-modal="callback"] .modal__dialog {
        width: min(calc(100% - 24px), 430px);
        padding: 28px 22px;
        border-radius: 18px;
    }

    .modal[data-modal="callback"] .modal__dialog h2 {
        padding-right: 38px;
        font-size: clamp(29px, 9vw, 34px);
        white-space: normal;
    }

    .modal[data-modal="callback"] .modal__dialog > p {
        font-size: 14px;
    }

    .modal[data-modal="offer"] .modal__dialog {
        width: min(calc(100% - 24px), 620px);
        padding: 28px 22px;
        border-radius: 18px;
    }

    .offer-disclaimer {
        margin: 16px 0 18px;
    }

    .modal[data-modal="callback"] .field__input,
    .modal[data-modal="callback"] .custom-select__trigger {
        min-height: 54px;
    }

    .modal[data-modal="callback"] .consent,
    .contacts__form-card .consent {
        font-size: 10.5px;
    }
}
.happy-life {
    padding: 0;
    background: #022441;
    isolation: isolate;
}

.happy-life::before {
    display: none !important;
}

.happy-life__story {
    position: relative;
    isolation: isolate;
}

.happy-life__scene {
    position: relative;
    min-height: 260svh;
}

.happy-life__sticky {
    display: grid;
    width: 100%;
    height: calc(100svh - var(--header-height));
}

.happy-life__main,
.happy-life__content {
    position: relative;
    min-width: 0;
}

.happy-life__render {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    transform: translate3d(0, 18px, 0);
    transition: opacity .72s ease, transform .72s ease;
    overflow: hidden;
    will-change: opacity, transform;
}

.happy-life__render.is-active {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    z-index: 2;
}

.happy-life__render.is-past {
    opacity: 0;
    transform: translate3d(0, -18px, 0);
}

.happy-life__render img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    transform: scale(var(--happy-life-scale, 1));
    transform-origin: center center;
    transition: transform .24s linear;
}

.happy-life__content {
    color: #fff;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(203,185,168,.80) 0%, rgba(103,125,144,.46) 27%, rgba(5,60,104,.9) 68%, rgba(2,36,65,.98) 100%),
        url("../images/happy-life-pattern.webp") center center / cover no-repeat;
}

.happy-life__frame {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: clamp(64px, 7.6vw, 104px) clamp(28px, 4vw, 58px) clamp(34px, 4vw, 48px);
    text-align: center;
    opacity: 0;
    transform: translate3d(0, 24px, 0);
    transition: opacity .62s ease, transform .62s ease;
    pointer-events: none;
    will-change: opacity, transform;
}

.happy-life__frame.is-active {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    pointer-events: auto;
    z-index: 2;
}

.happy-life__frame.is-past {
    transform: translate3d(0, -24px, 0);
}

.happy-life__frame-title,
.happy-life__frame-text,
.happy-life__next-preview {
    opacity: 0;
    transform: translate3d(0, 18px, 0);
    transition: opacity .52s ease, transform .52s ease;
}

.happy-life__frame.is-active .happy-life__frame-title {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: .08s;
}

.happy-life__frame.is-active .happy-life__frame-text {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: .20s;
}

.happy-life__frame.is-active .happy-life__next-preview {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: .32s;
}

.happy-life__frame-title {
    max-width: 410px;
    margin: 0;
    font-family: var(--font-heading);
    font-size: clamp(1.7rem, 2.45vw, 2.45rem);
    font-weight: 500;
    line-height: 1.04;
    letter-spacing: normal;
    text-wrap: balance;
}

.happy-life__frame-text {
    max-width: 390px;
    margin-top: clamp(18px, 2.2vw, 28px);
    font-size: clamp(.94rem, 1vw, 1.08rem);
    line-height: 1.48;
    letter-spacing: normal;
}

.happy-life__frame-text p {
    margin: 0;
}

.happy-life__frame-text p + p {
    margin-top: .74em;
}

.happy-life__next-preview {
    width: clamp(70px, 6.6vw, 96px);
    margin: auto 0 0;
    overflow: hidden;
    box-shadow: 0 14px 34px rgba(0, 20, 36, .2);
}

.happy-life__next-preview img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 112 / 130;
    object-fit: cover;
}

.happy-life__after-scene .happy-life__location-row {
    margin-left: auto;
}

/* Kill old happy-life composition rules without breaking map/location lower part. */

@media (max-width: 900px) {
    .happy-life__story {
        background:
            linear-gradient(180deg, rgba(103,125,144,.58) 0%, rgba(5,60,104,.92) 48%, #022441 100%),
            url("../images/happy-life-pattern.webp") center top / cover no-repeat;
    }

    .happy-life__scene {
        padding: 0;
    }

    .happy-life__sticky {
        display: block;
    }

    .happy-life__main {
        display: block;
        min-height: auto;
    }

    .happy-life__content {
        display: block;
        min-height: auto;
        background: transparent;
    }

    .happy-life__render {
        position: relative;
        inset: auto;
        height: auto;
        min-height: 0;
        opacity: 1;
        transform: none;
    }

    .happy-life__render:not(:first-child) {
        display: none;
    }

    .happy-life__render img {
        width: 100%;
        height: auto;
        aspect-ratio: 640 / 720;
        object-fit: cover;
        transform: scale(1.02);
    }

    .happy-life__frame {
        position: relative;
        inset: auto;
        min-height: 0;
        opacity: 1;
        transform: none;
        pointer-events: auto;
        background:
            linear-gradient(180deg, rgba(103,125,144,.38) 0%, rgba(5,60,104,.80) 100%),
            url("../images/happy-life-pattern.webp") center top / cover no-repeat;
    }

    .happy-life__frame:not(:first-child) {
        display: none;
    }

    .happy-life__frame-title,
    .happy-life__frame-text,
    .happy-life__next-preview {
        opacity: 1;
        transform: none;
    }

    .happy-life__next-preview {
        width: 82px;
        margin-top: 28px;
    }

    .happy-life__after-scene .happy-life__location-row {
        margin-left: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .happy-life__render,
    .happy-life__render img,
    .happy-life__frame,
    .happy-life__frame-title,
    .happy-life__frame-text,
    .happy-life__next-preview {
        transition: none !important;
    }
}
.happy-life {
    overflow: visible !important;
}

.happy-life__story {
    overflow: visible !important;
}

.happy-life__sticky {
    position: sticky !important;
    top: var(--header-height) !important;
    z-index: 2;
}

@media (max-width: 900px) {
    .happy-life {
        overflow: hidden !important;
    }

    .happy-life__story {
        overflow: hidden !important;
    }

    .happy-life__sticky {
        position: relative !important;
        top: auto !important;
    }
}
.happy-life__after-scene {
    display: block;
    padding-top: clamp(56px, 6vw, 86px) !important;
    padding-bottom: clamp(58px, 6.5vw, 92px) !important;
}

.happy-life__after-scene .happy-life__location-row h3 {
    color: #fff;
    text-align: left !important;
}

.happy-life__after-scene .happy-life__location-row h3 span {
    display: block !important;
}

.happy-life__after-scene .happy-life__location-row p {
    color: #fff;
    text-align: left !important;
}

.happy-life__after-scene .happy-life__location-row p span {
    display: block !important;
}
.happy-life__story {
    background:
        linear-gradient(180deg, rgba(203,185,168,.88) 0%, rgba(103,125,144,.54) 30%, rgba(13,66,111,.88) 66%, #022441 100%),
        url("../images/happy-life-pattern.webp") center top / cover no-repeat !important;
}

.happy-life__scene {
    min-height: 260svh !important;
}

.happy-life__sticky {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 41.25vw) !important;
    grid-template-rows: minmax(0, 72%) minmax(174px, 28%) !important;
    height: calc(100svh - var(--header-height)) !important;
    min-height: 640px !important;
    overflow: hidden !important;
    background: transparent !important;
}

.happy-life__main,
.happy-life__content {
    min-height: 0 !important;
    height: 100% !important;
}

.happy-life__main {
    grid-column: 1 / 2 !important;
    grid-row: 1 / 2 !important;
}

.happy-life__content {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 2 !important;
}

.happy-life__after-scene {
    grid-column: 1 / -1 !important;
    grid-row: 2 / 3 !important;
    position: relative !important;
    z-index: 4 !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: clamp(24px, 2.7vw, 38px) max(32px, calc((100vw - 1180px) / 2)) clamp(24px, 3vw, 40px) !important;
    opacity: 1 !important;
    transform: none !important;
    background: transparent !important;
}

.happy-life__after-scene .happy-life__location-row {
    display: grid !important;
    grid-template-columns: minmax(330px, .92fr) minmax(380px, 1fr) !important;
    align-items: center !important;
    column-gap: clamp(42px, 6.6vw, 104px) !important;
    width: min(100%, 1180px) !important;
    max-width: 1180px !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    opacity: 1 !important;
    transform: none !important;
    background: transparent !important;
}

.happy-life__after-scene .happy-life__location-row h3,
.happy-life__after-scene .happy-life__location-row p {
    color: #fff !important;
    text-align: left !important;
    opacity: 1 !important;
    transform: none !important;
}

.happy-life__after-scene .happy-life__location-row h3 {
    max-width: 520px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-family: var(--font-heading);
    font-size: clamp(2.25rem, 3.35vw, 3.6rem) !important;
    line-height: .92 !important;
}

.happy-life__after-scene .happy-life__location-row h3 span,
.happy-life__after-scene .happy-life__location-row p span {
    display: block !important;
}

.happy-life__after-scene .happy-life__location-row p {
    max-width: 520px !important;
    margin: .06em 0 0 !important;
    padding: 0 !important;
    font-size: clamp(1rem, 1.15vw, 1.22rem) !important;
    font-weight: 400 !important;
    line-height: 1.24 !important;
    letter-spacing: normal !important;
}

@media (max-width: 1100px) {
    .happy-life__sticky {
        grid-template-rows: minmax(0, 70%) minmax(170px, 30%) !important;
    }

    .happy-life__after-scene .happy-life__location-row {
        grid-template-columns: minmax(280px, .92fr) minmax(320px, 1fr) !important;
        column-gap: clamp(30px, 5vw, 62px) !important;
    }

    .happy-life__after-scene .happy-life__location-row h3 {
        font-size: clamp(2rem, 3.05vw, 3rem) !important;
    }
}

@media (max-width: 900px) {
    .happy-life__scene {
        min-height: auto !important;
    }

    .happy-life__sticky {
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    .happy-life__after-scene {
        display: block !important;
        padding: clamp(40px, 9vw, 60px) clamp(22px, 6vw, 34px) !important;
    }

    .happy-life__after-scene .happy-life__location-row {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
    }

    .happy-life__after-scene .happy-life__location-row h3 {
        max-width: 340px !important;
        font-size: clamp(2rem, 8vw, 2.8rem) !important;
    }

    .happy-life__after-scene .happy-life__location-row p {
        max-width: 360px !important;
        margin-top: 20px !important;
        font-size: clamp(1.02rem, 4.2vw, 1.18rem) !important;
        line-height: 1.18 !important;
    }
}
@media (min-width: 901px) {
    .happy-life__content {
        background: transparent !important;
    }

    .happy-life__frame {
        background: transparent !important;
    }
}
@media (min-width: 901px) {
    .happy-life__frame {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto 1fr;
        align-content: start;
        justify-items: center;
    }

    .happy-life__frame-title {
        grid-column: 1;
    }

    .happy-life__frame-text {
        grid-column: 1;
    }

    .happy-life__next-preview {
        grid-column: 1;
        margin-top: clamp(124px, 17vh, 220px);
        align-self: start;
        justify-self: center;
    }
}

@media (max-width: 1280px) and (min-width: 901px) {
    .happy-life__frame {
        padding-inline: clamp(34px, 4vw, 54px);
    }

    .happy-life__frame-title {
        font-size: clamp(1.72rem, 2.12vw, 2.1rem);
    }

    .happy-life__frame-text {
        max-width: 360px;
        font-size: clamp(.88rem, .95vw, 1rem);
    }

    .happy-life__next-preview {
        width: clamp(64px, 5vw, 82px);
        margin-top: clamp(104px, 16vh, 184px);
    }
}

/* Нижняя строка остаётся крупной, но без сжатия и с более спокойной дистанцией. */
@media (min-width: 901px) {
    .happy-life__location-row {
        padding-top: clamp(50px, 5.4vw, 80px);
        padding-bottom: clamp(48px, 4.8vw, 74px);
        align-items: start;
    }
}

/* Мобильная версия: заголовок может переноситься, но не должен выглядеть раздутым. */
@media (max-width: 900px) {
    .happy-life__frame {
        padding: 34px 24px 0;
        text-align: left;
    }

    .happy-life__frame-title {
        max-width: 360px;
        margin-bottom: 18px;
        line-height: .98;
        letter-spacing: normal;
    }

    .happy-life__frame-text {
        max-width: 330px;
        line-height: 1.28;
    }
}

/* Сохраняем успешную правку мобильных карточек планировок из 0.4.96/0.4.97. */
.apartments .apartment-card__image {
    background: #fff;
}

@media (max-width: 760px) {
    .apartments.section--light {
        background: #fff;
    }

    .apartments .container {
        width: 100%;
        max-width: none;
    }

    .apartments .section-heading {
        width: min(100% - 40px, 640px);
        margin-inline: auto;
        margin-bottom: 24px;
    }

    .apartments .apartment-grid {
        width: 100%;
        margin: 0;
        padding: 0 20px 22px;
        gap: 12px;
        background: transparent;
    }

    .apartments .apartment-card {
        flex-basis: min(78vw, 340px);
        background: #fff;
        box-shadow: 0 12px 34px rgba(2, 36, 65, .06);
    }

    .reveal-ready .apartments .apartment-card[data-reveal] {
        opacity: 1;
        transform: none;
        transition: none;
        will-change: auto;
    }

    .apartments .apartment-card__image {
        min-height: 236px;
        padding: 18px 18px 8px;
        background: #fff;
    }

    .apartments .apartment-card__body {
        padding: 18px 22px 22px;
    }
}
@media (min-width: 901px) {
    .happy-life__content {
        position: relative;
    }

    .happy-life__frame {
        position: absolute;
        inset: 0;
        display: block;
        padding: 86px 72px 56px;
        text-align: center;
    }

    .happy-life__frame-title {
        display: block;
        width: 100%;
        max-width: none;
        margin: 0 auto 34px;
        color: #fff;
        font-size: 48px;
        line-height: 1.02;
        letter-spacing: normal;
        text-align: center;
        white-space: nowrap;
    }

    .happy-life__frame-text {
        display: block;
        max-width: 500px;
        margin: 0 auto;
        color: rgba(255, 255, 255, .92);
        font-size: 20px;
        line-height: 1.38;
        text-align: center;
    }

    .happy-life__frame-text p {
        margin: 0;
    }

    .happy-life__frame-text p + p {
        margin-top: 14px;
    }

    .happy-life__next-preview {
        position: absolute;
        left: 50%;
        top: 56%;
        width: 100px;
        aspect-ratio: 1;
        margin: 0;
        overflow: hidden;
        border-radius: 0;
        box-shadow: none;
        transform: translate(-50%, -50%);
    }

    .happy-life__next-preview img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .happy-life__location-row {
        width: min(100% - 96px, 1200px);
        grid-template-columns: minmax(500px, .78fr) minmax(430px, .52fr);
        column-gap: 150px;
    }

    .happy-life__location-row h3 {
        max-width: 620px;
        font-size: 58px;
        line-height: .94;
        letter-spacing: normal;
    }

    .happy-life__location-row p {
        max-width: 450px;
        justify-self: start;
        margin-top: 18px;
        font-size: 22px;
        line-height: 1.18;
        letter-spacing: normal;
    }
}

@media (max-width: 1440px) and (min-width: 901px) {
    .happy-life__frame {
        padding: 74px 54px 50px;
    }

    .happy-life__frame-title {
        font-size: 40px;
    }

    .happy-life__frame-text {
        max-width: 430px;
        font-size: 18px;
    }

    .happy-life__next-preview {
        top: 58%;
        width: 86px;
    }

    .happy-life__location-row {
        width: min(100% - 72px, 1080px);
        grid-template-columns: minmax(420px, .78fr) minmax(360px, .52fr);
        column-gap: 110px;
    }

    .happy-life__location-row h3 {
        font-size: 48px;
    }

    .happy-life__location-row p {
        font-size: 19px;
    }
}

@media (max-width: 1100px) and (min-width: 901px) {
    .happy-life__frame {
        padding: 66px 38px 44px;
    }

    .happy-life__frame-title {
        font-size: 32px;
    }

    .happy-life__frame-text {
        max-width: 340px;
        font-size: 16px;
    }

    .happy-life__next-preview {
        top: 59%;
        width: 76px;
    }

    .happy-life__location-row {
        width: min(100% - 56px, 960px);
        grid-template-columns: minmax(360px, .78fr) minmax(300px, .52fr);
        column-gap: 76px;
    }

    .happy-life__location-row h3 {
        font-size: 40px;
    }

    .happy-life__location-row p {
        font-size: 17px;
    }
}

/* На мобильной версии превью не показываем — оно мешает тексту и не несёт навигационной функции. */
@media (max-width: 900px) {
    .happy-life__next-preview {
        display: none;
    }

    .happy-life__frame-title {
        font-size: clamp(2rem, 9vw, 3rem);
    }

    .happy-life__frame-text {
        font-size: clamp(1rem, 4vw, 1.12rem);
    }
}
.apartment-card__placeholder {
    display: grid;
    width: min(100%, 260px);
    aspect-ratio: 1.35;
    place-items: center;
    color: rgba(2, 36, 65, .48);
    text-align: center;
    font-family: var(--font-body);
    font-size: 17px;
    line-height: 1.15;
    background:
        linear-gradient(135deg, rgba(224, 191, 154, .14), rgba(2, 36, 65, .04)),
        #fff;
    border: 1px dashed rgba(2, 36, 65, .18);
    border-radius: 18px;
}

.filter-chip small {
    display: inline-flex;
    min-width: 22px;
    height: 22px;
    margin-left: 4px;
    align-items: center;
    justify-content: center;
    color: rgba(2, 36, 65, .72);
    background: rgba(224, 191, 154, .42);
    border-radius: 999px;
    font-size: 12px;
    line-height: 1;
}

.catalog__empty {
    margin-top: 42px;
    padding: 34px;
    color: rgba(2, 36, 65, .72);
    background: rgba(255, 255, 255, .74);
    border: 1px dashed rgba(2, 36, 65, .18);
    border-radius: 24px;
}

.catalog__empty h3 {
    margin-bottom: 8px;
    color: var(--vida-blue);
    font-size: 24px;
}

.catalog .apartment-card--catalog .apartment-card__status {
    min-height: 2.6em;
}

@media (max-width: 620px) {

    .filter-chip small {
        min-width: 20px;
        height: 20px;
        font-size: 11px;
    }

    .catalog__empty {
        margin-top: 28px;
        padding: 24px;
        border-radius: 18px;
    }
}
.catalog .filter-chip {
    cursor: pointer;
}

.catalog .filter-chip.is-active {
    color: #1c2018;
    background: #dfc09a;
    border-color: #dfc09a;
}

.catalog .apartment-grid--catalog {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.catalog .apartment-card--catalog[hidden],
.catalog__empty[hidden] {
    display: none !important;
}

.filter-chip small {
    display: none !important;
}

@media (max-width: 900px) {
    .catalog .apartment-grid--catalog {
        grid-template-columns: repeat(3, minmax(280px, 1fr));
        overflow-x: auto;
        padding-bottom: 12px;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .catalog .apartment-grid--catalog::-webkit-scrollbar {
        display: none;
    }

    .catalog .apartment-card--catalog {
        scroll-snap-align: start;
    }

    .catalog .apartment-card--catalog:last-child {
        display: grid;
    }
}

@media (max-width: 620px) {
    .catalog .apartment-grid--catalog {
        grid-template-columns: repeat(3, minmax(300px, 86vw));
    }
}
.planning-page {
    color: var(--vida-blue);
}

.planning-catalog .eyebrow {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.2;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.planning-project-tabs button {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    padding: 8px 18px;
    color: #1c2018;
    background: #fff8ee;
    border: 1px solid rgba(224, 191, 154, .72);
    border-radius: 999px;
    font-size: 15px;
    line-height: 1;
}

.planning-gallery {
    padding-top: clamp(72px, 7vw, 110px);
}

.planning-open h2 {
    margin: 0 0 22px;
    color: inherit;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(42px, 5vw, 76px);
    font-weight: 500;
    line-height: .92;
    letter-spacing: normal;
}

.planning-open p {
    margin: 0;
    font-size: 18px;
    line-height: 1.4;
}

.planning-gallery figure {
    margin: 0;
}

.planning-gallery img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 8px;
}

.planning-gallery figcaption {
    margin-top: 10px;
    color: var(--vida-beige);
    font-size: 13px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.planning-picker {
    margin-top: 0;
}

.planning-project-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: -34px 0 32px;
}

.planning-project-tabs button {
    cursor: pointer;
}

.planning-project-tabs button.is-active {
    color: #fff;
    background: #0f5d45;
    border-color: #0f5d45;
}

.planning-project-tabs button:disabled {
    opacity: .52;
    cursor: not-allowed;
}

.planning-catalog__grid {
    align-items: stretch;
}

.planning-open {
    padding: clamp(76px, 7vw, 110px) 0;
}

.planning-open strong {
    display: inline-block;
    margin-top: 28px;
    color: #0f5d45;
    font-size: 24px;
}

.planning-timeline {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    background: rgba(2, 36, 65, .16);
    border: 1px solid rgba(2, 36, 65, .16);
}

.planning-timeline article {
    padding: 24px;
    background: #fff;
}

.planning-timeline span {
    color: #0f5d45;
    font-size: 13px;
    text-transform: uppercase;
}

.planning-timeline h3 {
    margin: 16px 0 10px;
    font-size: 20px;
    line-height: 1.12;
}

.planning-timeline p {
    font-size: 15px;
}

.planning-timeline .is-current {
    background: #fff8ee;
}

@media (max-width: 980px) {

    .planning-timeline {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {

    .planning-timeline {
        grid-template-columns: 1fr;
    }

    .planning-open h2 {
        font-size: clamp(34px, 12vw, 48px);
    }

    .planning-project-tabs {
        margin: -24px 0 26px;
    }

    .planning-catalog__grid.apartment-grid--catalog {
        grid-template-columns: 1fr;
    }
}
.planning-top {
    position: relative;
    overflow: hidden;
    background: var(--vida-blue);
}

.planning-top__inner {
    position: relative;
    z-index: 1;
}

.planning-top__grid {
    display: grid;
    align-items: end;
}

.planning-top__copy h1,
.planning-project__content h2,
.planning-gallery-match__head h2,
.planning-catalog__top h2,
.planning-docs h2 {
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 500;
    letter-spacing: normal;
    text-transform: uppercase;
}

.planning-top__copy p,
.planning-project__content p,
.planning-gallery-match__head p {
    max-width: 560px;
    margin: 0;
    font-size: clamp(16px, 1.45vw, 21px);
    line-height: 1.38;
}

.planning-project__visual > img {
    display: block;
    width: 100%;
    max-height: 320px;
    object-fit: contain;
    padding: 12px;
    background: #fff;
}

.planning-project__numbers {
    display: grid;
    margin-top: 18px;
}

.planning-project__numbers span {
    display: block;
}

.planning-project__numbers b {
    display: block;
}

.planning-project__label {
    display: block;
}

.planning-project__content h2 {
    margin: 0 0 22px;
}

.planning-project__tags {
    display: flex;
    flex-wrap: wrap;
}

.planning-project__tags span,
.planning-project__picker {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    padding: 8px 16px;
    color: #1c2018;
    background: var(--vida-beige);
    border-radius: 999px;
    font-size: 14px;
    line-height: 1;
}

.planning-project__picker {
    text-transform: uppercase;
}

.planning-gallery--match {
    padding-top: clamp(26px, 4vw, 54px);
}

.planning-gallery-match__head h2,
.planning-catalog__top h2,
.planning-docs h2 {
    margin: 0 0 18px;
    font-size: clamp(38px, 4.8vw, 76px);
    line-height: .9;
}
.planning-gallery-match__grid figcaption {
    margin-top: 10px;
}

.planning-picker {
    padding: clamp(52px, 6vw, 92px) 0;
}

.planning-catalog {
    margin-top: 0;
    padding-top: clamp(54px, 6vw, 92px);
}

.planning-catalog__top h2 {
    margin-bottom: 0;
}

.planning-catalog__filters {
    grid-template-columns: 1fr;
    padding: 0;
    background: transparent;
}

.planning-catalog__grid.apartment-grid--catalog {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(18px, 2.2vw, 28px);
}

.planning-flat-card.apartment-card--catalog {
    border-radius: 0;
}

.planning-flat-card .apartment-card__image {
    min-height: 210px;
    padding: 18px;
    background: #fff;
}

.planning-flat-card .apartment-card__body h4 {
    margin: 0 0 8px;
    color: var(--vida-blue);
    font-size: clamp(20px, 2vw, 27px);
    line-height: 1.08;
}

.planning-open {
    background: #fff;
}


@media (max-width: 980px) {
    .planning-top__grid,
.planning-project__grid,
.planning-gallery-match__grid,
.planning-docs__grid {
        grid-template-columns: 1fr;
    }

    .planning-catalog__grid.apartment-grid--catalog,
    .planning-docs__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .planning-top {
        min-height: 330px;
        padding: 80px 0 34px;
    }

    .planning-top__copy h1 {
        max-width: 320px;
        font-size: clamp(42px, 15vw, 58px);
    }

    .planning-top__copy p,
.planning-project__content p,
.planning-gallery-match__head p {
        font-size: 16px;
    }

    .planning-project__grid {
        display: flex;
        flex-direction: column-reverse;
    }

    .planning-project__content h2,
.planning-gallery-match__head h2,
.planning-catalog__top h2,
.planning-docs h2 {
        font-size: clamp(34px, 12vw, 48px);
    }

    .planning-project__numbers,
    .planning-catalog__grid.apartment-grid--catalog,
    .planning-docs__list {
        grid-template-columns: 1fr;
    }

    .planning-catalog .planning-project-tabs {
        gap: 6px;
    }

    .planning-flat-card .apartment-card__image {
        min-height: 170px;
    }
}
.planning-page {
    background: #f4f1ea;
}

.planning-top__grid {
    grid-template-columns: minmax(0, 760px) minmax(320px, 520px);
    gap: 36px;
}

.planning-top__copy h1 {
    margin-bottom: 18px;
}

.planning-top__numbers {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-self: end;
    gap: 0;
    margin-bottom: 12px;
    color: #fff;
}

.planning-top__numbers span {
    padding: 0 30px;
    border-left: 1px solid rgba(255, 255, 255, .58);
    font-size: 18px;
    line-height: 1.15;
}

.planning-top__numbers span:first-child {
    border-left: 0;
}

.planning-top__numbers b {
    display: block;
    margin-bottom: 6px;
    font-size: clamp(42px, 4.4vw, 70px);
    line-height: .85;
}

.planning-project {
    padding: 0;
    overflow: visible;
    color: var(--vida-blue);
    background: #f4f1ea;
}

.planning-project::after {
    display: none;
}

.planning-project__grid {
    display: grid;
    width: min(100%, 1920px);
    margin: 0 auto;
    grid-template-columns: minmax(0, 1fr) minmax(0, .98fr);
    gap: 0;
    align-items: stretch;
}

.planning-project__visual {
    display: flex;
    min-height: clamp(410px, 33vw, 620px);
    flex-direction: column;
    justify-content: center;
    padding: clamp(40px, 4.5vw, 86px) clamp(36px, 6vw, 112px) clamp(32px, 4vw, 70px);
    border: 0;
    background: var(--vida-blue);
}

.planning-project__plan {
    display: grid;
    place-items: center;
    width: min(100%, 420px);
    margin: 0 auto;
    aspect-ratio: 1 / 1;
    background: #fff;
}

.planning-project__plan > img,
.planning-project__visual > img {
    display: block;
    width: 82%;
    max-height: none;
    padding: 0;
    object-fit: contain;
    background: transparent;
}

.planning-project__numbers {
    width: min(100%, 520px);
    margin: clamp(32px, 4vw, 64px) auto 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    background: transparent;
}

.planning-project__numbers span {
    padding: 0 10px;
    color: #fff;
    background: transparent;
    font-size: 16px;
    line-height: 1.15;
    text-align: center;
    text-transform: none;
}

.planning-project__numbers b {
    margin-bottom: 6px;
    color: var(--vida-beige);
    font-size: clamp(28px, 3.3vw, 48px);
    line-height: .9;
}

.planning-project__content {
    padding: clamp(46px, 5.2vw, 96px) clamp(34px, 7vw, 130px);
    background: #f4f1ea;
}

.planning-project__label {
    margin-bottom: 22px;
    color: #0f5d45;
    font-size: 15px;
    line-height: 1.35;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.planning-project__content h2 {
    margin-bottom: 26px;
    color: var(--vida-blue);
    font-size: clamp(40px, 4.2vw, 70px);
    line-height: .93;
    text-transform: none;
}

.planning-project__content h2 em {
    color: #6c9a55;
    font-style: normal;
}

.planning-project__content p {
    max-width: 560px;
    color: #1c2018;
    font-size: clamp(16px, 1.35vw, 20px);
    line-height: 1.28;
}

.planning-project__tags {
    gap: 10px;
    margin-top: 24px;
}

.planning-project__tags span {
    min-height: 29px;
    padding: 6px 18px;
    color: #1c2018;
    background: #fff;
    border: 1px solid rgba(2, 36, 65, .13);
    border-radius: 5px;
    font-size: 14px;
    text-transform: none;
}

.planning-project__picker {
    min-height: 44px;
    margin-top: 36px;
    padding: 13px 28px;
    color: #1c2018;
    background: var(--vida-beige);
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
}

.planning-gallery--match {
    padding: clamp(38px, 5vw, 76px) 0 clamp(42px, 5vw, 78px);
    color: var(--vida-blue);
    background-color: #f7f0e5;
    background-image:
        linear-gradient(180deg, rgba(255, 248, 238, .78), rgba(255, 248, 238, .58)),
        url("../images/pattern-cream.webp");
    background-repeat: no-repeat, repeat;
    background-position: center, center top;
    background-size: cover, 740px auto;
}

.planning-gallery-match__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 430px);
    gap: clamp(20px, 7vw, 120px);
    align-items: start;
    margin-bottom: clamp(28px, 4vw, 50px);
}

.planning-gallery-match__head h2 {
    margin: 0;
    font-size: clamp(38px, 4.2vw, 70px);
    line-height: .92;
    text-transform: none;
}

.planning-gallery-match__head p {
    max-width: 430px;
    margin-top: 4px;
    color: var(--vida-blue);
    font-size: clamp(18px, 1.65vw, 25px);
    line-height: 1.12;
    text-align: right;
}

.planning-gallery-match__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(0, .56fr) minmax(0, .56fr);
    gap: 12px;
    align-items: stretch;
}

.planning-gallery-match__grid figure {
    position: relative;
    min-height: 180px;
    margin: 0;
    overflow: hidden;
}

.planning-gallery-match__wide {
    grid-row: span 2;
}

.planning-gallery-match__grid img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    object-fit: cover;
}

.planning-gallery-match__grid figcaption {
    position: absolute;
    left: 14px;
    bottom: 12px;
    margin: 0;
    padding: 5px 12px;
    color: #fff;
    background: #0f5d45;
    border-radius: 999px;
    font-size: 11px;
    line-height: 1;
    letter-spacing: 0;
    text-transform: none;
}

@media (max-width: 980px) {
    .planning-top__grid,
.planning-project__grid,
.planning-gallery-match__head {
        grid-template-columns: 1fr;
    }

    .planning-top__numbers {
        display: none;
    }

    .planning-project__content {
        order: 1;
    }

    .planning-project__visual {
        order: 2;
    }

    .planning-gallery-match__head p {
        text-align: left;
    }

    .planning-gallery-match__grid {
        grid-template-columns: 1fr 1fr;
    }

    .planning-gallery-match__wide {
        grid-column: span 2;
    }
}

@media (max-width: 760px) {

    .planning-project__grid {
        display: flex;
        flex-direction: column-reverse;
    }

    .planning-project__content {
        padding: 34px 20px 30px;
    }

    .planning-project__content h2 {
        font-size: clamp(29px, 9vw, 38px);
        line-height: .98;
    }

    .planning-project__label,
    .planning-project__content p,
    .planning-project__tags span {
        font-size: 12px;
    }

    .planning-project__visual {
        min-height: auto;
        padding: 32px 20px;
    }

    .planning-project__plan {
        width: min(100%, 250px);
    }

    .planning-project__numbers {
        margin-top: 28px;
    }

    .planning-project__numbers span {
        font-size: 11px;
    }

    .planning-gallery--match {
        padding: 34px 0;
        background-size: cover, 520px auto;
    }

    .planning-gallery-match__head {
        gap: 16px;
        margin-bottom: 22px;
    }

    .planning-gallery-match__head h2 {
        font-size: clamp(28px, 9vw, 38px);
    }

    .planning-gallery-match__head p {
        font-size: 14px;
    }

    .planning-gallery-match__grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .planning-gallery-match__wide {
        grid-column: auto;
    }

    .planning-gallery-match__grid figure {
        min-height: 185px;
    }
}

.planning-catalog__top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 22px;
}

.planning-catalog__top .eyebrow {
    margin: 0 0 2px;
    color: var(--vida-blue);
    font-family: var(--font-body);
    font-size: clamp(30px, 4vw, 54px);
    line-height: .96;
    letter-spacing: normal;
    text-transform: none;
}

.planning-catalog .catalog__all-link {
    min-width: 0;
}

.planning-catalog .planning-project-tabs {
    display: flex;
}

.planning-catalog .planning-project-tabs button {
    flex: 1 1 0;
    cursor: pointer;
}

.planning-catalog__filters {
    display: grid;
    margin: 0 0 clamp(28px, 4vw, 46px);
}

.planning-catalog__filters .catalog-filter-row {
    display: grid;
    align-items: center;
    padding: 0;
}

.planning-catalog__filters .catalog-filter-row__label {
    line-height: 1.2;
}

.planning-catalog__filters .catalog-filter-row__options {
    display: flex;
    flex-wrap: wrap;
}

.planning-catalog__grid.apartment-grid--catalog,
.catalog .planning-catalog__grid.apartment-grid--catalog {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 0;
    overflow: visible;
    padding-bottom: 0;
    scroll-snap-type: none;
}

.planning-catalog__grid .planning-flat-card.apartment-card--catalog,
.catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog,
.catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog:last-child {
    display: grid;
    min-width: 0;
    overflow: hidden;
    background: #fff;
    box-shadow: none;
    scroll-snap-align: unset;
}

.planning-catalog__grid .planning-flat-card.apartment-card--catalog[hidden],
.catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog[hidden] {
    display: none !important;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__image {
    min-height: 0;
    background: #fff;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__image img {
    width: 100%;
    object-fit: contain;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__body h3 {
    margin: 0 0 8px;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-weight: 700;
    letter-spacing: normal;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__status {
    margin: 0 0 8px;
    line-height: 1.2;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__price {
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-weight: 700;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__button {
    padding: 10px 18px;
    text-transform: uppercase;
}

@media (max-width: 900px) {

    .planning-catalog__grid.apartment-grid--catalog,
    .catalog .planning-catalog__grid.apartment-grid--catalog {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: visible;
    }

    .planning-catalog__grid .planning-flat-card.apartment-card--catalog,
    .catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog,
    .catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog:last-child {
        grid-template-rows: 190px minmax(0, 1fr);
        border-radius: 14px;
    }

    .catalog .planning-catalog__grid .planning-flat-card .apartment-card__image {
        padding: 18px 16px 6px;
    }

    .catalog .planning-catalog__grid .planning-flat-card .apartment-card__image img {
        max-height: 160px;
    }

    .catalog .planning-catalog__grid .planning-flat-card .apartment-card__body {
        padding: 8px 16px 16px;
    }
}

@media (max-width: 640px) {
    .planning-catalog {
        border-radius: 0;
    }

    .planning-catalog__top {
        display: block;
        margin-bottom: 18px;
    }

    .planning-catalog__top .catalog__all-link {
        width: auto;
        margin-top: 12px;
    }

    .planning-catalog__filters .catalog-filter-row {
        grid-template-columns: 1fr;
    }

    .planning-catalog__filters .catalog-filter-row__options {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 4px;
        scrollbar-width: none;
    }

    .planning-catalog__filters .catalog-filter-row__options::-webkit-scrollbar {
        display: none;
    }

    .planning-catalog .filter-chip {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .planning-catalog__grid.apartment-grid--catalog,
    .catalog .planning-catalog__grid.apartment-grid--catalog {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .catalog .planning-catalog__grid .planning-flat-card .apartment-card__body {
        padding: 6px 10px 12px;
    }

    .catalog .planning-catalog__grid .planning-flat-card .apartment-card__body h3 {
        font-size: 13px;
    }

    .catalog .planning-catalog__grid .planning-flat-card .apartment-card__status {
        font-size: 10px;
    }

    .catalog .planning-catalog__grid .planning-flat-card .apartment-card__price {
        margin-bottom: 10px;
        font-size: 13px;
    }
}
.planning-catalog .catalog__all-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    text-transform: uppercase;
    line-height: 1;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: auto;
    border: 0;
    border-radius: 999px;
    color: #fff;
    text-decoration: none;
    font-family: var(--font-body);
    font-weight: 700;
    letter-spacing: .03em;
    line-height: 1;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__button:hover,
.catalog .planning-catalog__grid .planning-flat-card .apartment-card__button:focus-visible {
    color: #fff;
    transform: translateY(-1px);
}

@media (max-width: 640px) {

    .catalog .planning-catalog__grid .planning-flat-card .apartment-card__button {
        min-height: 28px;
        padding: 8px 10px;
        font-size: 8px;
    }
}
.planning-catalog {
    background: #f4f4f2;
    padding: clamp(60px, 7vw, 106px) 0 clamp(78px, 8vw, 118px);
}

.planning-catalog .catalog__container {
    width: min(100% - 64px, 1220px);
}

.planning-catalog__top {
    align-items: center;
    margin-bottom: 28px;
}

.planning-catalog__top h2 {
    margin: 0;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: clamp(34px, 4.7vw, 58px);
    font-weight: 700;
    line-height: .98;
}

.planning-catalog .catalog__all-link {
    min-height: 34px;
    padding: 10px 24px;
    border: 1px solid rgba(2, 36, 65, .18);
    border-radius: 999px;
    background: #e0bf9a;
    color: var(--vida-blue);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .01em;
}

.planning-catalog .planning-project-tabs button {
    border-right-color: rgba(2, 36, 65, .64);
}

.planning-catalog__filters {
    gap: 12px;
    max-width: 740px;
}

.planning-catalog__filters .catalog-filter-row {
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 14px;
}

.planning-catalog__filters .catalog-filter-row__label {
    color: rgba(2, 36, 65, .76);
    font-size: 13px;
}

.planning-catalog__filters .catalog-filter-row__options {
    gap: 8px;
}

.planning-catalog .filter-chip {
    min-height: 28px;
    padding: 7px 14px;
    border: 1px solid rgba(2, 36, 65, .14);
    border-radius: 5px;
    background: #fff;
    color: var(--vida-blue);
    font-size: 12px;
    line-height: 1;
    box-shadow: 0 1px 0 rgba(2, 36, 65, .04);
}

.planning-catalog .filter-chip.is-active {
    border-color: #0b5b43;
    background: #0b5b43;
    color: #fff;
}

.planning-catalog__grid.apartment-grid--catalog,
.catalog .planning-catalog__grid.apartment-grid--catalog {
    gap: 30px;
}

.planning-catalog__grid .planning-flat-card.apartment-card--catalog,
.catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog,
.catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog:last-child {
    grid-template-rows: 230px minmax(0, 1fr);
    min-height: 376px;
    border-radius: 18px;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__image {
    align-items: end;
    padding: 26px 22px 4px;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__image img {
    max-width: 228px;
    max-height: 186px;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__body {
    padding: 10px 22px 22px;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__body h3 {
    margin-bottom: 10px;
    font-size: clamp(17px, 1.45vw, 20px);
    line-height: 1.1;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__status {
    margin-bottom: 8px;
    color: #6e9a5e;
    font-size: 13px;
    font-weight: 700;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__price {
    margin: 2px 0 18px;
    font-size: 20px;
    line-height: 1.1;
}

.catalog .planning-catalog__grid .planning-flat-card .apartment-card__button {
    min-height: 36px;
    background: #0b5b43;
    font-size: 11px;
}

@media (max-width: 900px) {
    .planning-catalog .catalog__container {
        width: min(100% - 28px, 640px);
    }

    .planning-catalog__grid.apartment-grid--catalog,
    .catalog .planning-catalog__grid.apartment-grid--catalog {
        gap: 14px;
    }

    .planning-catalog__grid .planning-flat-card.apartment-card--catalog,
    .catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog,
    .catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog:last-child {
        min-height: 0;
    }
}

@media (max-width: 640px) {
    .planning-catalog {
        padding: 44px 0 58px;
    }

    .planning-catalog__top h2 {
        font-size: 28px;
    }

    .planning-catalog .catalog__all-link {
        min-height: 44px;
        padding: 9px 16px;
        font-size: 9px;
    }

    .planning-catalog__filters {
        gap: 10px;
        margin-bottom: 30px;
    }

    .planning-catalog__filters .catalog-filter-row {
        gap: 8px;
    }

    .planning-catalog .filter-chip {
        min-height: 44px;
        padding: 10px 12px;
        font-size: 11px;
    }

    .planning-catalog__grid .planning-flat-card.apartment-card--catalog,
    .catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog,
    .catalog .planning-catalog__grid .planning-flat-card.apartment-card--catalog:last-child {
        grid-template-rows: 140px minmax(0, 1fr);
        border-radius: 14px;
    }
}

.planning-catalog .planning-project-tabs button {
    border-right: 1px solid rgba(2, 36, 65, .72);
}

.planning-catalog .planning-project-tabs button:last-child {
    border-right: 0;
}

.planning-catalog .planning-project-tabs .is-active {
    margin: -1px 0 -1px -1px;
    min-height: 34px;
    border-radius: 999px;
    background: #0b5b43;
    color: #fff;
    font-weight: 700;
}

.planning-catalog__filters {
    margin-bottom: clamp(34px, 4vw, 52px);
}

@media (max-width: 640px) {

    .planning-catalog .planning-project-tabs button {
        min-height: 30px;
    }

    .planning-catalog .planning-project-tabs .is-active {
        min-height: 32px;
    }
}
.planning-catalog .planning-project-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 !important;
    width: min(100%, 470px) !important;
    height: 34px;
    margin: 0 0 18px !important;
    padding: 0 !important;
    overflow: hidden;
    border: 1px solid rgba(2, 36, 65, .72) !important;
    border-radius: 6px !important;
    background: transparent !important;
    box-shadow: none !important;
}

.planning-catalog .planning-project-tabs button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 16px !important;
    appearance: none;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(2, 36, 65, .55) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    transform: none !important;
}

.planning-catalog .planning-project-tabs button:not(:last-child)::after {
    content: "";
    position: absolute;
    top: -1px;
    right: 0;
    bottom: -1px;
    width: 1px;
    background: rgba(2, 36, 65, .72);
    pointer-events: none;
}

.planning-catalog .planning-project-tabs button.is-active,
.planning-catalog .planning-project-tabs .is-active {
    margin: 0 !important;
    background: #0b5b43 !important;
    color: #fff !important;
    font-weight: 700 !important;
}

.planning-catalog .planning-project-tabs button.is-active::after,
.planning-catalog .planning-project-tabs .is-active::after {
    display: none;
}

.planning-catalog .planning-project-tabs button.is-active:first-child,
.planning-catalog .planning-project-tabs .is-active:first-child {
    border-radius: 5px 0 0 5px !important;
}

.planning-catalog .planning-project-tabs button.is-active:last-child,
.planning-catalog .planning-project-tabs .is-active:last-child {
    border-radius: 0 5px 5px 0 !important;
}

.planning-catalog .planning-project-tabs button:disabled {
    opacity: 1 !important;
    cursor: not-allowed;
}

@media (max-width: 640px) {
    .planning-catalog .planning-project-tabs {
        width: 100% !important;
        height: 46px;
        margin-bottom: 14px !important;
    }

    .planning-catalog .planning-project-tabs button {
        padding: 0 10px !important;
        font-size: 11px !important;
    }
}
.planning-page .planning-open {
    padding: clamp(74px, 8vw, 112px) 0 clamp(72px, 8vw, 106px);
    background: #f3efe8;
}

.planning-page .planning-open__inner {
    width: min(100% - 56px, 1180px);
    margin: 0 auto;
}

.planning-page .planning-open__head {
    display: grid;
    grid-template-columns: minmax(260px, .65fr) minmax(320px, .42fr);
    justify-content: space-between;
    align-items: start;
    gap: clamp(34px, 8vw, 140px);
    margin-bottom: clamp(46px, 5vw, 66px);
}

.planning-page .planning-open h2,
.planning-page .planning-open__head h2 {
    margin: 0;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(40px, 4.4vw, 66px);
    font-weight: 500;
    line-height: .98;
    letter-spacing: normal;
}

.planning-page .planning-open p,
.planning-page .planning-open__head p {
    max-width: 420px;
    margin: 0 0 0 auto;
    color: var(--vida-blue);
    font-family: var(--font-body);
    font-size: clamp(18px, 1.65vw, 27px);
    font-weight: 400;
    line-height: 1.12;
    letter-spacing: normal;
    text-align: right;
}

.planning-page .planning-open__progress {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr) 70px;
    align-items: end;
    gap: 18px;
    margin-bottom: clamp(44px, 5vw, 66px);
}

.planning-page .planning-open__progress > span {
    color: rgba(2, 36, 65, .64);
    font-size: 13px;
    line-height: 1.1;
}

.planning-page .planning-open__progress strong {
    color: #0f5d45;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(20px, 2vw, 29px);
    font-weight: 500;
    line-height: 1;
    text-align: right;
}

.planning-page .planning-open__progress-track {
    position: relative;
    height: 4px;
    margin-bottom: 6px;
    background: rgba(2, 36, 65, .12);
}

.planning-page .planning-open__progress-track i {
    position: absolute;
    inset: 0 auto 0 0;
    display: block;
    height: 100%;
    background: #0f5d45;
}

.planning-page .planning-open__progress-track i::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -5px;
    width: 10px;
    height: 10px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #dfbd8c;
    box-shadow: 0 0 0 3px #f3efe8;
}

.planning-page .planning-timeline {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: clamp(44px, 4.8vw, 58px);
    background: rgba(255, 255, 255, .86);
    border: 1px solid rgba(224, 191, 154, .6);
    border-radius: 8px;
    overflow: hidden;
}

.planning-page .planning-timeline article {
    position: relative;
    min-height: 176px;
    padding: 34px 26px 26px;
    background: rgba(255, 255, 255, .72);
    border-right: 1px solid rgba(224, 191, 154, .72);
}

.planning-page .planning-timeline article:last-child {
    border-right: 0;
}

.planning-page .planning-timeline article::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: #0f5d45;
    opacity: .5;
}

.planning-page .planning-timeline article.is-current::before {
    opacity: 1;
}

.planning-page .planning-timeline span {
    display: block;
    min-height: 16px;
    margin-bottom: 16px;
    color: rgba(2, 36, 65, .34);
    font-size: 11px;
    line-height: 1;
    text-transform: none;
}

.planning-page .planning-timeline article.is-current > span {
    padding-right: 72px;
}

.planning-page .planning-timeline .planning-timeline__badge,
.planning-page .planning-timeline span b {
    position: absolute;
    top: 17px;
    right: 18px;
    display: inline-flex;
    min-height: 15px;
    margin: 0;
    padding: 4px 8px 3px;
    align-items: center;
    justify-content: center;
    color: #0f5d45;
    font-size: 8px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .02em;
    text-transform: uppercase;
    background: rgba(15, 93, 69, .12);
    border-radius: 999px;
}

.planning-page .planning-timeline h3 {
    margin: 0 0 14px;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(16px, 1.35vw, 20px);
    font-weight: 500;
    line-height: 1.08;
    letter-spacing: normal;
}

.planning-page .planning-timeline p {
    margin: 0;
    color: rgba(2, 36, 65, .62);
    font-family: var(--font-body);
    font-size: 13px;
    line-height: 1.35;
    text-align: left;
}

.planning-page .planning-build-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: hidden;
    border-radius: 16px 16px 0 0;
}

.planning-page .planning-build-gallery figure {
    position: relative;
    min-height: clamp(180px, 17vw, 246px);
    margin: 0;
    overflow: hidden;
    border-right: 1px solid rgba(255, 248, 238, .72);
    background: var(--vida-blue);
}

.planning-page .planning-build-gallery figure:last-child {
    border-right: 0;
}

.planning-page .planning-build-gallery img {
    width: 100%;
    height: 100%;
    min-height: inherit;
    object-fit: cover;
}

.planning-page .planning-build-gallery figcaption {
    position: absolute;
    left: 16px;
    bottom: 14px;
    z-index: 2;
    padding: 5px 9px 4px;
    color: rgba(224, 191, 154, .86);
    font-family: var(--font-body);
    font-size: 10px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: .02em;
    text-transform: uppercase;
    background: rgba(2, 36, 65, .58);
    border-radius: 2px;
    backdrop-filter: blur(2px);
}

.planning-page .planning-build-gallery figure::after {
    content: "";
    position: absolute;
    inset: 50% 0 0;
    background: linear-gradient(180deg, rgba(2, 36, 65, 0), rgba(2, 36, 65, .58));
    pointer-events: none;
}

.planning-page .planning-open__cta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 28px;
    min-height: 136px;
    padding: 26px 42px;
    background: #dfbd8c;
    border-radius: 0 0 16px 16px;
}

.planning-page .planning-open__cta h3 {
    margin: 0 0 10px;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(22px, 2vw, 31px);
    font-weight: 500;
    line-height: 1.05;
    letter-spacing: normal;
}

.planning-page .planning-open__cta p {
    max-width: none;
    margin: 0;
    color: rgba(2, 36, 65, .56);
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 1.25;
    text-align: left;
}

.planning-page .planning-open__cta .button {
    min-width: 220px;
    min-height: 52px;
    padding: 14px 26px;
    border-radius: 999px;
    font-size: 12px;
}

.planning-page .planning-open__cta .button span {
    margin-left: 8px;
    font-size: 16px;
    line-height: .8;
}

.planning-page .news {
    position: relative;
    padding: clamp(72px, 8vw, 106px) 0 clamp(86px, 9vw, 132px);
    overflow: hidden;
    background-color: var(--vida-blue);
    background-image:
        linear-gradient(180deg, rgba(255, 221, 176, .86) 0%, rgba(255, 221, 176, .55) 18%, rgba(6, 47, 80, .88) 68%, #062f50 100%),
        url("../images/pattern-cream.webp");
    background-size: cover, 760px auto;
    background-position: center top, center top;
}

.planning-page .news .section-heading {
    width: min(100% - 56px, 1180px);
    margin: 0 auto clamp(38px, 4.6vw, 58px);
}

.planning-page .news .section-heading h2 {
    color: var(--vida-blue);
    font-size: clamp(38px, 4vw, 58px);
    letter-spacing: normal;
}

.planning-page .news .section-heading .button,
.planning-page .news .section-heading .button--ghost {
    min-height: 42px;
    padding: 12px 22px;
    color: var(--vida-blue);
    background: #dfbd8c;
    border: 1px solid rgba(2, 36, 65, .18);
    border-radius: 999px;
    font-size: 12px;
}

.planning-page .news-layout {
    width: min(100% - 56px, 1180px);
    grid-template-columns: minmax(0, 1.46fr) minmax(320px, .82fr);
    border-radius: 12px;
    border: 0;
    background: #fffaf4;
    box-shadow: none;
}

.planning-page .news-featured > a {
    min-height: clamp(430px, 40vw, 520px);
    padding: clamp(28px, 3vw, 42px);
    background: #062f50;
}

.planning-page .news-featured img {
    height: clamp(190px, 18vw, 245px);
    object-position: center;
}

.planning-page .news-featured__content h3 {
    font-size: clamp(22px, 2vw, 30px);
}

.planning-page .news-item a {
    padding: clamp(26px, 2.5vw, 38px) clamp(24px, 2.3vw, 34px);
}

.planning-page .contacts {
    padding: clamp(70px, 8vw, 110px) 0 clamp(70px, 8vw, 106px);
    background: #ffd8aa;
}

.planning-page .contacts__grid {
    width: min(100% - 56px, 1180px);
    grid-template-columns: minmax(0, 1fr) minmax(360px, 430px);
    gap: clamp(48px, 7vw, 96px);
}

.planning-page .contacts .tag {
    background: rgba(255, 248, 238, .72);
}

.planning-page .contacts__copy h2 {
    margin-top: 18px;
    font-size: clamp(44px, 4.7vw, 62px);
}

.planning-page .contacts__form-card {
    border-radius: 18px;
}

@media (max-width: 980px) {
    .planning-page .planning-open__head,
    .planning-page .planning-open__progress,
    .planning-page .contacts__grid {
        grid-template-columns: 1fr;
    }

    .planning-page .planning-open__head p {
        margin-left: 0;
        text-align: left;
    }

    .planning-page .planning-open__progress {
        gap: 10px;
    }

    .planning-page .planning-open__progress strong {
        text-align: left;
    }

    .planning-page .planning-timeline,
    .planning-page .planning-docs__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .planning-page .planning-timeline article:nth-child(2n) {
        border-right: 0;
    }

    .planning-page .planning-build-gallery {
        grid-template-columns: 1fr;
    }

    .planning-page .planning-build-gallery figure {
        border-right: 0;
        border-bottom: 1px solid rgba(255, 248, 238, .72);
    }

    .planning-page .planning-open__cta {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .planning-page .news-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .planning-page .planning-open {
        padding: 48px 0 58px;
    }

    .planning-page .planning-open__inner,
    .planning-page .planning-docs__inner,
    .planning-page .news .section-heading,
    .planning-page .news-layout,
    .planning-page .contacts__grid {
        width: min(100% - 28px, 640px);
    }

    .planning-page .planning-open__head {
        gap: 22px;
        margin-bottom: 30px;
    }

    .planning-page .planning-open__head h2,
    .planning-page .planning-open h2,
    .planning-page .planning-docs h2,
    .planning-page .news .section-heading h2,
    .planning-page .contacts__copy h2 {
        font-size: 30px;
        line-height: .98;
    }

    .planning-page .planning-open__head p {
        max-width: 270px;
        font-size: 13px;
        line-height: 1.25;
    }

    .planning-page .planning-open__progress {
        grid-template-columns: 72px minmax(0, 1fr) 46px;
        margin-bottom: 34px;
    }

    .planning-page .planning-open__progress > span {
        font-size: 10px;
    }

    .planning-page .planning-open__progress strong {
        font-size: 15px;
        text-align: right;
    }

    .planning-page .planning-timeline {
        grid-template-columns: 1fr;
        margin-bottom: 32px;
    }

    .planning-page .planning-timeline article {
        min-height: 0;
        padding: 22px 18px 20px;
        border-right: 0;
        border-bottom: 1px solid rgba(224, 191, 154, .72);
    }

    .planning-page .planning-timeline article:last-child {
        border-bottom: 0;
    }

    .planning-page .planning-timeline h3 {
        font-size: 16px;
    }

    .planning-page .planning-build-gallery figure {
        min-height: 152px;
    }

    .planning-page .planning-open__cta {
        min-height: 0;
        padding: 20px;
        gap: 18px;
    }

    .planning-page .planning-open__cta h3 {
        font-size: 19px;
    }

    .planning-page .planning-open__cta .button {
        width: 100%;
        min-width: 0;
    }

    .planning-page .news {
        padding: 48px 0 64px;
    }

    .planning-page .news .section-heading {
        display: flex;
        align-items: center;
        margin-bottom: 22px;
    }

    .planning-page .news .section-heading .button {
        min-height: 32px;
        padding: 9px 14px;
        font-size: 9px;
    }

    .planning-page .news-featured > a {
        min-height: 0;
        padding: 18px;
        grid-template-rows: 150px auto;
    }

    .planning-page .news-featured__content h3 {
        font-size: 17px;
    }

    .planning-page .news-list {
        grid-template-rows: none;
    }

    .planning-page .news-item a {
        min-height: 118px;
        padding: 18px;
    }

    .planning-page .contacts {
        padding: 42px 0 48px;
    }

    .planning-page .contacts__grid {
        gap: 28px;
    }

    .planning-page .contacts__lead,
    .planning-page .contacts__copy > p {
        font-size: 13px;
    }

    .planning-page .contacts__details {
        grid-template-columns: 1fr;
        margin-top: 28px;
        gap: 24px;
    }

    .planning-page .contacts__details h3 {
        font-size: 18px;
        margin-bottom: 10px;
    }

    .planning-page .contacts__link {
        font-size: 14px;
    }

    .planning-page .contacts__form-card {
        max-width: none;
        margin-left: 0;
    }
}

.planning-story > * {
    position: relative;
    z-index: 1;
}

.planning-story .plan-picker,
.planning-story .planning-story-picker {
    background: linear-gradient(180deg, rgba(2, 36, 65, .72) 0%, rgba(2, 36, 65, .90) 100%);
}

.planning-story .planning-gallery--match,
.planning-story .plan-picker {
    margin-top: 0;
}

@media (min-width: 981px) {
    .planning-story {
        background-size: 430px auto;
    }
}

.planning-story .plan-picker.pattern-blue::before {
    display: none;
}

.planning-story .plan-picker,
.planning-story .planning-gallery--match {
    margin-top: 0;
}

.planning-story .planning-gallery--match {
    position: relative;
}

@media (max-width: 980px) {

    .planning-story .planning-gallery--match::after {
        height: 86px;
    }
}
.planning-story {
    background: #022441;
}

.planning-story .planning-gallery--match,
.planning-story .plan-picker,
.planning-story .planning-story-picker {
    overflow: hidden;
    margin-top: 0;
}

.planning-story .planning-gallery--match {
    background-color: #fff8ee;
}

.planning-story .planning-gallery--match::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: clamp(76px, 9vw, 132px);
    background: linear-gradient(180deg, rgba(2, 36, 65, 0) 0%, rgba(2, 36, 65, .86) 100%);
    pointer-events: none;
}

.planning-story .planning-gallery--match .container {
    position: relative;
    z-index: 1;
}

.planning-story .plan-picker.pattern-blue::before {
    display: none !important;
}

.planning-story .plan-picker .container {
    position: relative;
    z-index: 1;
}

@media (max-width: 980px) {

    .planning-story .planning-gallery--match {
        background-image:
            url("../images/planning-pattern-figma.png"),
            radial-gradient(80% 40% at 50% 12%, rgba(224, 191, 154, .42) 0%, rgba(224, 191, 154, .12) 60%, rgba(224, 191, 154, 0) 100%),
            linear-gradient(
                180deg,
                #fff8ee 0%,
                #fff8ee 44%,
                #f6e5cc 62%,
                rgba(114, 121, 118, .88) 80%,
                #022441 100%
            );
    }
}

.planning-story .planning-gallery--match {
    background: transparent !important;
}

.planning-story .planning-gallery--match::after {
    display: none;
}

.planning-story .plan-picker,
.planning-story .planning-story-picker {
    background-color: #022441;
}

@media (max-width: 980px) {

    .planning-story .plan-picker,
    .planning-story .planning-story-picker {
        background-size: 720px auto, 100% 100%;
    }
}

@media (max-width: 980px) {
    .planning-story,
.planning-story .plan-picker,
.planning-story .planning-story-picker,
.planning-story .planning-gallery--match {
        background-size: 100% auto, 100% 100%, 100% 100% !important;
    }
}
.planning-story {
    background-repeat: repeat-y !important;
    background-position: center top !important;
    background-size: 100% auto !important;
}

/* Галерея и строка виртуального тура продолжают один общий фон.
   Здесь остаётся только светлый переходный градиент без повторного PNG. */
.planning-story .planning-gallery--match {
    background-repeat: no-repeat, no-repeat !important;
    background-position: center top, center top !important;
    background-size: 100% 100%, 100% 100% !important;
}

/* Генплан тоже больше не перезапускает PNG. Синий градиент накладывается поверх
   того же фонового полотна, которое уже идёт от .planning-story. */
.planning-story .plan-picker,
.planning-story .planning-story-picker {
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: 100% 100% !important;
}

.planning-story .planning-gallery--match::after {
    display: none !important;
}

@media (max-width: 980px) {
    .planning-story {
        background-size: 100% auto !important;
    }

    .planning-story .planning-gallery--match,
.planning-story .plan-picker,
.planning-story .planning-story-picker {
        background-size: 100% 100% !important;
    }
}
.planning-story {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background-color: #022441;
    background-image: none !important;
}

.planning-story::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background-image: url("../images/planning-pattern-figma.png");
    background-repeat: repeat-y;
    background-position: center top;
    background-size: 100% auto;
}

/* Секции оставляют только градиентные заливки. Сам PNG здесь больше не задаётся. */
.planning-story .planning-gallery--match,
.planning-story .plan-picker,
.planning-story .planning-story-picker {
    position: relative;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: 100% 100% !important;
}

/* Контент поднимается выше общего слоя орнамента, чтобы паттерн не перекрывал текст,
   кнопки, фотографии и интерактивные элементы. */
.planning-story .planning-gallery--match > .container,
.planning-story .plan-picker > .container,
.planning-story .planning-story-picker > .container {
    position: relative;
    z-index: 3;
}

.planning-story .planning-gallery--match {
    background-image:
        radial-gradient(58% 36% at 50% 14%, rgba(224, 191, 154, .46) 0%, rgba(224, 191, 154, .18) 44%, rgba(224, 191, 154, 0) 76%),
        linear-gradient(
            180deg,
            #fff8ee 0%,
            #fff8ee 27%,
            #f6e6d1 41%,
            rgba(195, 181, 163, .92) 54%,
            rgba(95, 106, 119, .94) 66%,
            #0f3656 82%,
            #022441 100%
        ) !important;
}

.planning-story .plan-picker,
.planning-story .planning-story-picker {
    background-image:
        linear-gradient(
            180deg,
            rgba(52, 89, 119, .86) 0%,
            rgba(39, 77, 107, .92) 16%,
            rgba(20, 59, 91, .96) 38%,
            rgba(10, 44, 73, .98) 67%,
            rgba(2, 36, 65, 1) 100%
        ) !important;
}

.planning-story .planning-gallery--match::after,
.planning-story .plan-picker.pattern-blue::before {
    display: none !important;
}

@media (max-width: 980px) {
    .planning-story::before {
        background-size: 100% auto;
    }
}
.planning-top {
    min-height: clamp(350px, 30vw, 430px);
    padding: clamp(32px, 3.2vw, 46px) 0 clamp(40px, 4vw, 58px);
    color: #fff;
}

.planning-top__inner {
    padding-top: 0;
}

.planning-top__grid {
    display: block;
}

.planning-top__copy {
    max-width: 1060px;
}

.planning-top__copy h1 {
    max-width: 1060px;
    margin: 0 0 clamp(18px, 1.8vw, 26px);
    font-size: clamp(54px, 5.55vw, 92px);
    line-height: .98;
    letter-spacing: normal;
    text-transform: none;
}

.planning-top__copy p {
    max-width: 760px;
    font-size: clamp(18px, 1.45vw, 23px);
    line-height: 1.23;
}

.planning-top__numbers {
    display: none !important;
}

@media (max-width: 760px) {
    .planning-top {
        min-height: 300px;
        padding: 26px 0 34px;
    }

    .planning-top__copy h1 {
        max-width: 320px;
        font-size: clamp(39px, 11.5vw, 52px);
        line-height: 1;
    }

    .planning-top__copy p {
        max-width: 315px;
        font-size: 12px;
        line-height: 1.25;
    }
}
.planning-top {
    background-color: #022441;
    background-image:
        url("../images/happy-life-pattern.webp"),
        radial-gradient(64% 58% at 50% 0%, rgba(224, 191, 154, .56) 0%, rgba(224, 191, 154, .24) 42%, rgba(224, 191, 154, 0) 74%),
        linear-gradient(
            180deg,
            #d9c2a8 0%,
            #aaa69e 22%,
            #707f86 45%,
            #31516a 69%,
            #022441 100%
        ) !important;
    background-repeat: no-repeat, no-repeat, no-repeat !important;
    background-position: center top, center top, center top !important;
    background-size: cover, 100% 100%, 100% 100% !important;
}

@media (min-width: 1281px) {
    .planning-top {
        background-size: 100% auto, 100% 100%, 100% 100% !important;
    }
}

@media (max-width: 760px) {
    .planning-top {
        background-size: cover, 100% 100%, 100% 100% !important;
    }
}
.planning-top .breadcrumbs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 clamp(42px, 5vw, 76px);
    line-height: 1;
    letter-spacing: 0;
}

.planning-top .breadcrumbs a {
    text-decoration: none;
    transition: color .2s ease;
}

.planning-top .breadcrumbs a:hover,
.planning-top .breadcrumbs a:focus-visible {
    color: #0f5d45;
}

.planning-top .breadcrumbs span {
    color: #0f5d45;
}

.planning-top .breadcrumbs span[aria-hidden="true"] {
    color: #0f5d45;
    font-size: .95em;
    transform: translateY(-1px);
}

@media (max-width: 760px) {
    .planning-top .breadcrumbs {
        gap: 6px;
    }
}
.planning-top {
    padding-top: clamp(34px, 3.8vw, 56px);
}

.planning-top .breadcrumbs {
    font-weight: 600;
}

.planning-top .breadcrumbs span,
.planning-top .breadcrumbs span[aria-hidden="true"] {
    color: #0f5d45;
}

@media (max-width: 760px) {
    .planning-top {
        padding-top: 22px;
    }

    .planning-top .breadcrumbs {
        margin-bottom: 34px;
        font-size: 13px;
        font-weight: 600;
    }
}
.contacts,
.planning-page .contacts {
    padding: clamp(70px, 8vw, 110px) 0 clamp(70px, 8vw, 106px);
    background: #ffd8aa;
}

.contacts__copy h2,
.planning-page .contacts__copy h2 {
    margin-top: 18px;
}

@media (max-width: 980px) {
    .contacts__grid,
    .planning-page .contacts__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .contacts,
    .planning-page .contacts {
        padding: 42px 0 48px;
    }

    .contacts__details h3,
    .planning-page .contacts__details h3 {
        margin-bottom: 10px;
    }

    .contacts__form-card,
    .planning-page .contacts__form-card {
        margin-left: 0;
    }
}
.contacts.section--accent,
.planning-page .contacts.section--accent {
    background: linear-gradient(180deg, #f5d6b5 0%, #f1cb9b 100%);
}

.contacts,
.planning-page .contacts {
    padding-block: 66px 76px;
}

.contacts__grid,
.planning-page .contacts__grid {
    width: min(100% - 48px, 1180px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) 410px;
    gap: clamp(64px, 7vw, 96px);
    align-items: start;
}

.contacts__copy,
.planning-page .contacts__copy {
    max-width: 610px;
}

.contacts .tag,
.planning-page .contacts .tag {
    min-height: 24px;
    padding: 6px 14px 5px;
    color: rgba(2, 36, 65, .7);
    background: rgba(255, 248, 238, .72);
    border-color: rgba(224, 191, 154, .82);
    font-family: var(--font-body);
    font-size: 10px;
    font-weight: 400;
}

.contacts__copy h2,
.planning-page .contacts__copy h2 {
    max-width: 500px;
    margin: 15px 0 18px;
    font-size: clamp(44px, 4.3vw, 55px);
    font-weight: 500;
    line-height: .96;
    letter-spacing: normal;
}

.contacts__lead,
.contacts__copy > p,
.planning-page .contacts__lead,
.planning-page .contacts__copy > p {
    max-width: 385px;
    color: rgba(2, 36, 65, .82);
    font-size: 14px;
    line-height: 1.32;
}

.contacts__details,
.planning-page .contacts__details {
    max-width: 470px;
    margin-top: 42px;
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(130px, .8fr);
    gap: 44px;
}

.contacts__details h3,
.planning-page .contacts__details h3 {
    margin-bottom: 14px;
    font-size: 16px;
    line-height: 1.05;
    letter-spacing: normal;
}

.contacts__link,
.planning-page .contacts__link {
    margin-bottom: 8px;
    font-size: 14px;
    line-height: 1.25;
    text-decoration-thickness: .8px;
    text-underline-offset: 3px;
}

.contacts__form-card,
.planning-page .contacts__form-card {
    max-width: 410px;
    padding: 20px 20px 18px;
    border: 1px solid rgba(255, 255, 255, .72);
    border-radius: 16px;
    box-shadow: 0 10px 26px rgba(2, 36, 65, .06);
}

.contacts__form-card h3,
.planning-page .contacts__form-card h3 {
    margin-bottom: 15px;
    color: rgba(2, 36, 65, .48);
    font-size: 11px;
    line-height: 1.2;
}

.contacts .contact-form,
.planning-page .contacts .contact-form {
    gap: 11px;
}

.contacts .field,
.planning-page .contacts .field {
    gap: 5px;
}

.contacts .field__label,
.planning-page .contacts .field__label {
    font-size: 8px;
    line-height: 1.1;
    letter-spacing: .025em;
}

.contacts .field__input,
.planning-page .contacts .field__input {
    min-height: 42px;
    padding: 10px 12px;
    border-color: rgba(2, 36, 65, .18);
    border-radius: 7px;
    font-size: 12px;
}

.contacts .consent,
.planning-page .contacts .consent {
    gap: 7px;
    margin-top: 1px;
    font-size: 8px;
    line-height: 1.3;
}

.contacts .consent input,
.planning-page .contacts .consent input {
    width: 11px;
    height: 11px;
    margin-top: 1px;
}

.contacts .contact-form__submit,
.planning-page .contacts .contact-form__submit {
    width: auto;
    min-width: 202px;
    min-height: 42px;
    margin-top: 3px;
    padding: 11px 17px 10px 20px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .01em;
}

@media (max-width: 960px) {
    .contacts,
    .planning-page .contacts {
        padding-block: 56px 68px;
    }

    .contacts__grid,
    .planning-page .contacts__grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .contacts__copy h2,
    .planning-page .contacts__copy h2 {
        font-size: clamp(40px, 7vw, 52px);
    }

    .contacts__form-card,
    .planning-page .contacts__form-card {
        max-width: 410px;
    }
}

@media (max-width: 640px) {
    .contacts,
    .planning-page .contacts {
        padding-block: 46px 54px;
    }

    .contacts__grid,
    .planning-page .contacts__grid {
        width: min(100% - 28px, 640px);
        gap: 28px;
    }

    .contacts__copy h2,
    .planning-page .contacts__copy h2 {
        max-width: 290px;
        margin: 14px 0 15px;
        font-size: 32px;
        line-height: .96;
    }

    .contacts__lead,
    .contacts__copy > p,
    .planning-page .contacts__lead,
    .planning-page .contacts__copy > p {
        max-width: 310px;
        font-size: 12px;
    }

    .contacts__details,
    .planning-page .contacts__details {
        grid-template-columns: minmax(0, 1.2fr) minmax(130px, .8fr);
        margin-top: 28px;
        gap: 22px;
    }

    .contacts__details h3,
    .planning-page .contacts__details h3 {
        font-size: 15px;
    }

    .contacts__link,
    .planning-page .contacts__link {
        font-size: 13px;
    }

    .contacts__form-card,
    .planning-page .contacts__form-card {
        max-width: none;
        padding: 16px;
    }

    .contacts .contact-form__submit,
    .planning-page .contacts .contact-form__submit {
        width: auto;
        min-width: 190px;
        justify-self: start;
    }
}
.flat-page {
    background: #f4f0e9;
}

.flat-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    padding-top: var(--header-height);
    background: #f4f0e9;
}

.flat-hero__info {
    padding: clamp(36px, 4.4vw, 74px) clamp(30px, 4.8vw, 72px) clamp(34px, 4vw, 60px);
}

.flat-hero__title-row {
    display: flex;
}

.flat-hero h1 {
    margin: 0;
    color: var(--vida-blue);
    line-height: .96;
}

.flat-hero__reserve {
    color: var(--vida-blue);
    border-radius: 999px;
    font-weight: 800;
}

.flat-price-row {
    display: grid;
    align-items: start;
}

.flat-price-row strong {
    display: block;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 500;
    line-height: 1;
}

.flat-price-row span {
    display: block;
    margin-top: 10px;
    color: rgba(28, 32, 24, .74);
    font-size: 14px;
}

.flat-price-row > div:first-child span {
    text-decoration-thickness: 1px;
}

.flat-specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0 0 30px;
    border: 1px solid rgba(224, 191, 154, .92);
    background: rgba(255, 221, 176, .16);
}

.flat-specs div {
    border-right: 1px solid rgba(224, 191, 154, .92);
    border-bottom: 1px solid rgba(224, 191, 154, .92);
}

.flat-specs div:nth-child(2n),
.flat-specs div:last-child {
    border-right: 0;
}

.flat-specs div:nth-last-child(-n+2) {
    border-bottom: 0;
}

.flat-specs__wide {
    grid-column: 1 / -1;
}

.flat-specs dt {
    margin: 0 0 6px;
    color: rgba(8, 45, 75, .70);
}

.flat-specs dd {
    margin: 0;
    color: var(--vida-blue);
    font-family: var(--font-heading);
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 500;
    line-height: 1.02;
}

.flat-features h2 {
    margin: 0 0 16px;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-weight: 600;
    line-height: 1.2;
}

.flat-features > div {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.flat-features span {
    display: inline-flex;
    align-items: center;
    color: var(--vida-blue);
    background: #fff;
    border: 1px solid rgba(2, 36, 65, .08);
}

.flat-hero__visual {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    color: #fff;
    background: #022441;
}

.flat-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    background: #e0bf9a;
}

.flat-tabs button {
    border: 0;
    padding: 0 18px;
    color: rgba(8, 45, 75, .56);
    background: transparent;
    font-weight: 700;
    cursor: pointer;
}

.flat-tabs button.is-active {
    color: var(--vida-blue);
    background: rgba(255, 221, 176, .58);
}

.flat-plan-viewer {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(42px, 5vw, 74px) clamp(64px, 8vw, 112px) 28px;
}

.flat-plan-viewer figure {
    margin: 0 auto;
    padding: 0;
    background: #fff;
}

.flat-plan-viewer img {
    width: 100%;
    height: auto;
    max-height: 330px;
    object-fit: contain;
}

.flat-plan-viewer__arrow {
    position: absolute;
    top: 50%;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    color: rgba(255, 255, 255, .9);
    background: transparent;
    font-size: 34px;
    line-height: 1;
    transform: translateY(-50%);
    cursor: pointer;
}

.flat-plan-viewer__arrow--prev {
    left: 62px;
}

.flat-plan-viewer__arrow--next {
    right: 62px;
}

.flat-hero__stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    padding: 22px clamp(42px, 5vw, 72px) clamp(46px, 5vw, 70px);
    color: #e0bf9a;
}

.flat-hero__stats span {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.flat-hero__stats b {
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 500;
    line-height: .9;
}

.flat-mortgage {
    background: #f4f0e9;
}

.flat-mortgage__grid {
    display: grid;
}

.flat-mortgage h2 {
    margin: 0 0 52px;
    color: var(--vida-blue);
}

.flat-mortgage__calc label {
    display: grid;
    align-items: center;
    color: #1c2018;
    font-weight: 700;
}

.flat-mortgage__calc input {
    width: 100%;
    color: #1c2018;
    background: #fff;
    border: 1px solid #73a855;
    border-radius: 3px;
}

.flat-mortgage__programs {
    display: grid;
}

.flat-mortgage__programs article:nth-child(3),
.flat-mortgage__programs .button {
    grid-column: 1 / -1;
}

.flat-mortgage__programs h3 {
    margin: 0 0 14px;
    color: var(--vida-blue);
}

.flat-mortgage__programs p {
    margin: 0;
    color: rgba(28, 32, 24, .72);
}

.flat-mortgage__programs .button {
    justify-self: stretch;
}

.flat-not-found {
    min-height: 70vh;
    padding: calc(var(--header-height) + 60px) 0 80px;
}

.flat-not-found h1 {
    color: var(--vida-blue);
}

@media (max-width: 1100px) {
    .flat-hero {
        grid-template-columns: 1fr;
    }

    .flat-tabs {
        overflow-x: auto;
        grid-template-columns: repeat(4, max-content);
    }

    .flat-tabs button {
        min-width: max-content;
    }
}

@media (max-width: 760px) {

    .flat-hero__title-row,
    .flat-price-row,
    .flat-mortgage__grid,
    .flat-mortgage__programs {
        grid-template-columns: 1fr;
    }

    .flat-hero__title-row {
        display: grid;
        gap: 18px;
    }

    .flat-specs div:last-child {
        border-bottom: 0;
    }
}
.flat-hero {
    min-height: clamp(610px, 55vw, 720px);
}

.flat-hero__info {
    padding-top: clamp(54px, 5vw, 92px);
}

.flat-hero__title-row {
    align-items: center;
    gap: clamp(18px, 2vw, 32px);
    margin-bottom: 20px;
}

.flat-hero h1 {
    font-size: clamp(42px, 4.15vw, 64px);
    letter-spacing: normal;
    text-transform: none;
}

.flat-hero__reserve {
    min-height: 48px;
    padding: 13px 26px;
    font-size: 12px;
    letter-spacing: .02em;
}

.flat-price-row {
    grid-template-columns: minmax(0, .86fr) minmax(220px, .76fr);
    gap: clamp(24px, 3vw, 46px);
    margin-bottom: 26px;
}

.flat-price-row strong {
    font-size: clamp(32px, 3vw, 48px);
    letter-spacing: 0;
}

.flat-price-row > div:first-child span {
    display: inline-block;
    color: rgba(28, 32, 24, .64);
    text-decoration: none;
    position: relative;
}

.flat-price-row > div:first-child span::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: currentColor;
    opacity: .85;
}

.flat-price-row__mortgage strong {
    color: #6fa653;
    font-size: clamp(24px, 2.15vw, 34px);
}

.flat-price-row__mortgage span {
    color: rgba(28, 32, 24, .68);
}

.flat-specs {
    max-width: 620px;
    margin-bottom: 30px;
}

.flat-specs div {
    min-height: 76px;
    padding: 15px 18px;
}

.flat-specs dt {
    font-size: 13px;
}

.flat-specs dd {
    font-size: clamp(22px, 2vw, 30px);
}

.flat-features h2 {
    margin-bottom: 12px;
    color: rgba(8, 45, 75, .78);
    font-size: 13px;
}

.flat-features span {
    min-height: 31px;
    padding: 7px 16px;
    border-radius: 6px;
    font-size: 13px;
}

.flat-tabs {
    min-height: 58px;
}

.flat-tabs button {
    font-size: 14px;
}

.flat-plan-viewer {
    min-height: 405px;
    padding-top: clamp(52px, 5vw, 82px);
    padding-bottom: 18px;
}

.flat-plan-viewer figure {
    width: min(54%, 430px);
}

.flat-hero__stats {
    padding-top: 18px;
    padding-bottom: clamp(42px, 4.6vw, 64px);
}

.flat-hero__stats span {
    color: #fff;
    font-size: 14px;
}

.flat-hero__stats b {
    color: #e0bf9a;
    font-size: clamp(38px, 3.4vw, 56px);
}

.flat-mortgage h2 {
    text-transform: none;
}

.flat-mortgage__calc input {
    font-size: 16px;
}

.flat-mortgage__programs h3 {
    text-transform: none;
}

.flat-page .news {
    display: block;
}

.flat-page .news.section--cream.pattern-cream {
    padding-top: clamp(46px, 5vw, 78px);
    padding-bottom: clamp(72px, 7vw, 110px);
}

.flat-page .contacts {
    margin-top: 0;
}

@media (max-width: 1100px) {
    .flat-hero {
        padding-top: var(--header-height);
    }

    .flat-hero__visual {
        min-height: 520px;
    }
}
.flat-mortgage {
    padding: clamp(66px, 6.2vw, 92px) 0 clamp(58px, 5.4vw, 82px);
}

.flat-mortgage__grid {
    grid-template-columns: minmax(360px, .88fr) minmax(560px, 1.12fr);
    gap: clamp(48px, 6vw, 96px);
}

.flat-mortgage h2 {
    max-width: 560px;
    margin-bottom: clamp(36px, 3.5vw, 48px);
    font-size: clamp(42px, 4.4vw, 64px);
    line-height: .95;
    letter-spacing: normal;
}

.flat-mortgage__calc {
    max-width: 620px;
}

.flat-mortgage__calc label {
    grid-template-columns: 180px minmax(200px, 270px);
    gap: 22px;
    margin-bottom: 18px;
    font-size: 18px;
    line-height: 1.1;
}

.flat-mortgage__calc input {
    min-height: 46px;
    padding: 10px 20px;
}

.flat-mortgage__programs article {
    min-width: 0;
}

.flat-mortgage__programs article:nth-child(1) {
    max-width: 360px;
}

.flat-mortgage__programs article:nth-child(2) {
    max-width: 390px;
}

.flat-mortgage__programs article:nth-child(3) {
    max-width: 460px;
}

.flat-mortgage__programs h3 {
    margin-bottom: 14px;
    font-size: clamp(24px, 1.9vw, 30px);
    line-height: 1.02;
    letter-spacing: normal;
}

.flat-mortgage__programs p {
    font-size: 15px;
    line-height: 1.3;
}

.flat-mortgage__programs .button {
    min-height: 56px;
    margin-top: 6px;
}

@media (max-width: 1180px) {
    .flat-mortgage__grid {
        grid-template-columns: minmax(320px, .82fr) minmax(480px, 1fr);
        gap: 44px;
    }

    .flat-mortgage h2 {
        font-size: clamp(40px, 4.2vw, 56px);
    }

    .flat-mortgage__programs h3 {
        font-size: clamp(22px, 2.1vw, 28px);
    }
}

@media (max-width: 980px) {
    .flat-mortgage__grid {
        grid-template-columns: 1fr;
    }

    .flat-mortgage__calc,
    .flat-mortgage h2 {
        max-width: none;
    }

    .flat-mortgage__programs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {

    .flat-mortgage h2 {
        margin-bottom: 30px;
    }

    .flat-mortgage__programs h3 {
        font-size: 24px;
    }
}
.flat-mortgage__programs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(38px, 4.4vw, 58px) clamp(46px, 5.2vw, 78px);
}

.flat-mortgage__programs article,
.flat-mortgage__programs article:nth-child(1),
.flat-mortgage__programs article:nth-child(2),
.flat-mortgage__programs article:nth-child(3) {
    max-width: none;
    min-width: 0;
}

.flat-mortgage__programs h3,
.flat-mortgage__programs article:nth-child(1) h3,
.flat-mortgage__programs article:nth-child(2) h3,
.flat-mortgage__programs article:nth-child(3) h3 {
    margin: 0 0 14px;
    letter-spacing: normal;
}

.flat-mortgage__programs p {
    max-width: 360px;
}

.flat-mortgage__programs .button {
    grid-column: 1 / -1;
    width: 100%;
    max-width: none;
}

@media (max-width: 1180px) {
    .flat-mortgage__programs h3,
    .flat-mortgage__programs article:nth-child(1) h3,
    .flat-mortgage__programs article:nth-child(2) h3,
    .flat-mortgage__programs article:nth-child(3) h3 {
        font-size: clamp(24px, 2.2vw, 30px);
    }
}
.planning-page .news.section--cream.pattern-cream,
.flat-page .news.section--cream.pattern-cream,
.news.section--cream.pattern-cream {
    display: block;
    padding: clamp(72px, 7.5vw, 106px) 0 clamp(88px, 8vw, 118px) !important;
    overflow: hidden;
    isolation: isolate;
    background-color: #f6d7b2 !important;
    background-image:
        url("../images/happy-life-pattern.webp"),
        linear-gradient(
            180deg,
            #fae3c2 0%,
            #f8ddb9 42%,
            #f4d0a5 100%
        ) !important;
    background-repeat: no-repeat, no-repeat !important;
    background-position: center top, center top !important;
    background-size: 100% 100%, 100% 100% !important;
}

.planning-page .news.section--cream.pattern-cream::before,
.flat-page .news.section--cream.pattern-cream::before,
.news.section--cream.pattern-cream::before {
    display: none !important;
    content: none !important;
}

.planning-page .news .section-heading,
.flat-page .news .section-heading,
.news .section-heading {
    width: min(100%, 1180px) !important;
    margin: 0 auto clamp(36px, 4vw, 52px) !important;
    align-items: center !important;
}

.planning-page .news .section-heading h2,
.flat-page .news .section-heading h2,
.news .section-heading h2 {
    margin: 0 !important;
    color: var(--vida-blue) !important;
    font-family: "Roboto Flex", Arial, sans-serif !important;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(36px, 3.25vw, 48px) !important;
    font-weight: 500 !important;
    line-height: .98 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}

.planning-page .news .section-heading .button,
.planning-page .news .section-heading .button--ghost,
.flat-page .news .section-heading .button,
.flat-page .news .section-heading .button--ghost,
.news .section-heading .button,
.news .section-heading .button--ghost {
    min-height: 42px !important;
    padding: 11px 22px !important;
    color: var(--vida-blue) !important;
    font-family: var(--font-body) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: .015em !important;
    text-transform: uppercase !important;
    background: rgba(224, 191, 154, .88) !important;
    border: 0 !important;
    border-radius: 999px !important;
    box-shadow: none !important;
}

.planning-page .news-layout,
.flat-page .news-layout,
.news-layout {
    display: grid !important;
    width: min(100%, 1180px) !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1.48fr) minmax(330px, .82fr) !important;
    overflow: hidden !important;
    background: #fffaf4 !important;
    border: 1px solid rgba(2, 36, 65, .06) !important;
    border-radius: 20px !important;
    box-shadow: none !important;
}

.planning-page .news-featured > a,
.flat-page .news-featured > a,
.news-featured > a {
    display: grid !important;
    min-height: 510px !important;
    padding: clamp(26px, 2.6vw, 38px) !important;
    grid-template-rows: clamp(200px, 20vw, 260px) 1fr !important;
    color: var(--vida-white) !important;
    background: var(--vida-blue) !important;
}

.planning-page .news-featured img,
.flat-page .news-featured img,
.news-featured img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    opacity: 1 !important;
    border-radius: 0 !important;
}

.planning-page .news-featured__content h3,
.flat-page .news-featured__content h3,
.news-featured__content h3 {
    max-width: 640px !important;
    margin: 0 0 18px !important;
    color: var(--vida-white) !important;
    font-family: "Roboto Flex", Arial, sans-serif !important;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(22px, 2.05vw, 31px) !important;
    font-weight: 500 !important;
    line-height: 1.04 !important;
    letter-spacing: normal !important;
}

.planning-page .news-item a,
.flat-page .news-item a,
.news-item a {
    display: flex !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: clamp(26px, 2.35vw, 36px) clamp(24px, 2.2vw, 34px) !important;
    flex-direction: column !important;
    color: var(--vida-blue) !important;
    background: transparent !important;
}

@media (max-width: 900px) {
    .planning-page .news-layout,
    .flat-page .news-layout,
    .news-layout {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 760px) {
    .planning-page .news.section--cream.pattern-cream,
    .flat-page .news.section--cream.pattern-cream,
    .news.section--cream.pattern-cream {
        padding: 48px 0 64px !important;
        background-size: auto 100%, 100% 100% !important;
        background-position: center top, center top !important;
    }

    .planning-page .news .section-heading,
    .flat-page .news .section-heading,
    .news .section-heading {
        width: min(100% - 32px, 1180px) !important;
        margin-bottom: 22px !important;
    }

    .planning-page .news .section-heading h2,
    .flat-page .news .section-heading h2,
    .news .section-heading h2 {
        font-size: 34px !important;
    }

    .planning-page .news .section-heading .button,
    .planning-page .news .section-heading .button--ghost,
    .flat-page .news .section-heading .button,
    .flat-page .news .section-heading .button--ghost,
    .news .section-heading .button,
    .news .section-heading .button--ghost {
        min-height: 32px !important;
        padding: 9px 14px !important;
        font-size: 9px !important;
    }

    .planning-page .news-layout,
    .flat-page .news-layout,
    .news-layout {
        width: min(100% - 32px, 1180px) !important;
    }

    .planning-page .news-featured > a,
    .flat-page .news-featured > a,
    .news-featured > a {
        min-height: 0 !important;
        padding: 18px !important;
        grid-template-rows: 150px auto !important;
    }

    .planning-page .news-featured__content h3,
    .flat-page .news-featured__content h3,
    .news-featured__content h3 {
        font-size: 17px !important;
    }

    .planning-page .news-item a,
    .flat-page .news-item a,
    .news-item a {
        min-height: 118px !important;
        padding: 18px !important;
    }
}
.flat-mortgage__grid {
    align-items: start;
}

.flat-mortgage h2 {
    margin-top: 0;
}

.flat-mortgage__programs {
    padding-top: 0;
    align-items: start;
}

.flat-mortgage__programs article {
    display: grid;
    grid-template-rows: auto auto;
    align-content: start;
}

.flat-mortgage__programs h3,
.flat-mortgage__programs article:nth-child(1) h3,
.flat-mortgage__programs article:nth-child(2) h3,
.flat-mortgage__programs article:nth-child(3) h3 {
    margin-top: 0;
    margin-bottom: 14px;
    font-size: clamp(26px, 2vw, 32px);
    line-height: 1.02;
    font-weight: 700;
}

/* Выравнивание текстовых уровней верхних ипотечных программ. */
.flat-mortgage__programs article:nth-child(1) h3,
.flat-mortgage__programs article:nth-child(2) h3 {
    min-height: calc(clamp(26px, 2vw, 32px) * 3.08);
}

.flat-mortgage__programs article:nth-child(1) p,
.flat-mortgage__programs article:nth-child(2) p {
    align-self: start;
}

@media (max-width: 1180px) {
    .flat-mortgage__programs article:nth-child(1) h3,
    .flat-mortgage__programs article:nth-child(2) h3 {
        min-height: calc(clamp(24px, 2.2vw, 30px) * 3.08);
    }
}

@media (max-width: 980px) {
    .flat-mortgage__programs article:nth-child(1) h3,
    .flat-mortgage__programs article:nth-child(2) h3 {
        min-height: 0;
    }
}
@media (max-width: 760px) {
    .flat-page {
        background: #f4f0e9;
    }

    .flat-hero {
        display: flex;
        flex-direction: column;
        min-height: 0;
        padding-top: 0;
        background: #f4f0e9;
    }

    .flat-hero__info {
        display: grid;
        grid-template-columns: 1fr;
        padding: 28px 16px 0;
        background: #f4f0e9;
    }

    .flat-hero__title-row {
        display: contents;
    }

    .flat-hero h1 {
        order: 2;
        margin: 0 0 24px;
        font-size: clamp(38px, 11.2vw, 44px);
        line-height: .96;
        letter-spacing: normal;
    }

    .flat-price-row {
        order: 3;
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
        margin: 0 0 22px;
    }

    .flat-price-row strong {
        display: block;
        font-size: clamp(24px, 7.2vw, 30px);
        line-height: 1;
        letter-spacing: 0;
    }

    .flat-price-row > div:first-child span {
        margin-top: 8px;
        font-size: 13px;
        line-height: 1.1;
    }

    .flat-price-row__mortgage strong {
        color: #6fa653;
        font-size: clamp(22px, 6.4vw, 26px);
        line-height: 1;
    }

    .flat-price-row__mortgage span {
        display: block;
        margin-top: 8px;
        color: rgba(28, 32, 24, .68);
        font-size: 14px;
        line-height: 1.2;
    }

    .flat-hero__reserve {
        order: 4;
        justify-self: stretch;
        width: 100%;
        min-height: 54px;
        margin: 0 0 24px;
        padding: 15px 24px;
        border-radius: 999px;
        font-size: 13px;
        letter-spacing: .01em;
    }

    .flat-specs {
        order: 5;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        max-width: none;
        margin: 0 0 24px;
        border: 1px solid rgba(224, 191, 154, .92);
    }

    .flat-specs div,
    .flat-specs div:nth-child(2n),
    .flat-specs div:last-child {
        min-height: 76px;
        padding: 14px 14px;
        border: 0;
        border-right: 1px solid rgba(224, 191, 154, .92);
        border-bottom: 1px solid rgba(224, 191, 154, .92);
    }

    .flat-specs div:nth-child(2n),
    .flat-specs div:last-child {
        border-right: 0;
    }

    .flat-specs__wide {
        grid-column: 1 / -1;
    }

    .flat-specs div:nth-last-child(-n+2) {
        border-bottom: 0;
    }

    .flat-specs dt {
        margin-bottom: 7px;
        font-size: 14px;
        line-height: 1.1;
    }

    .flat-specs dd {
        font-size: 21px;
        line-height: 1;
    }

    .flat-features {
        order: 7;
        margin: 0 0 28px;
    }

    .flat-features h2 {
        margin-bottom: 12px;
        color: rgba(28, 32, 24, .72);
        font-size: 14px;
    }

    .flat-features > div {
        gap: 8px;
    }

    .flat-features span {
        min-height: 30px;
        padding: 7px 15px;
        border-radius: 6px;
        font-size: 13px;
        white-space: nowrap;
    }

    .flat-hero__visual {
        order: 2;
        display: grid !important;
        min-height: 0;
        margin: 0 14px 42px;
        overflow: hidden;
        grid-template-rows: auto auto auto;
        background: #022441;
        border-radius: 14px;
    }

    .flat-tabs {
        display: flex;
        min-height: 42px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        background: #e0bf9a;
        scrollbar-width: none;
    }

    .flat-tabs::-webkit-scrollbar {
        display: none;
    }

    .flat-tabs button {
        min-width: max-content;
        padding: 0 15px;
        flex: 0 0 auto;
        font-size: 11px;
        line-height: 1;
        white-space: nowrap;
    }

    .flat-plan-viewer {
        min-height: 252px;
        padding: 28px 38px 18px;
    }

    .flat-plan-viewer figure {
        width: min(82%, 260px);
        padding: 0;
    }

    .flat-plan-viewer img {
        display: block;
        width: 100%;
        max-height: 210px;
        object-fit: contain;
    }

    .flat-plan-viewer__arrow {
        width: 30px;
        height: 30px;
        font-size: 26px;
    }

    .flat-plan-viewer__arrow--prev {
        left: 8px;
    }

    .flat-plan-viewer__arrow--next {
        right: 8px;
    }

    .flat-hero__stats {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        padding: 18px 18px 24px;
    }

    .flat-hero__stats span {
        gap: 3px;
        font-size: 11px;
        line-height: 1.1;
    }

    .flat-hero__stats b {
        font-size: 26px;
        line-height: .95;
    }

    .flat-mortgage {
        padding: 44px 0 56px;
        background: #f4f0e9;
    }

    .flat-mortgage__grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 34px;
        padding-inline: 16px;
    }

    .flat-mortgage__calc {
        max-width: none;
    }

    .flat-mortgage h2 {
        max-width: 300px;
        margin: 0 0 28px;
        font-size: clamp(29px, 8.7vw, 34px);
        line-height: .98;
        letter-spacing: normal;
    }

    .flat-mortgage__calc label {
        display: grid;
        grid-template-columns: minmax(112px, .72fr) minmax(0, 1fr);
        gap: 12px;
        align-items: center;
        margin-bottom: 12px;
        font-size: 15px;
        line-height: 1.1;
    }

    .flat-mortgage__calc input {
        min-height: 42px;
        padding: 9px 14px;
        font-size: 16px;
        border-radius: 4px;
    }

    .flat-mortgage__programs {
        display: grid;
        gap: 27px;
        padding-top: 0;
    }

    .flat-mortgage__programs article,
    .flat-mortgage__programs article:nth-child(1),
    .flat-mortgage__programs article:nth-child(2),
    .flat-mortgage__programs article:nth-child(3) {
        display: block;
        max-width: none;
    }

    .flat-mortgage__programs h3,
    .flat-mortgage__programs article:nth-child(1) h3,
    .flat-mortgage__programs article:nth-child(2) h3,
    .flat-mortgage__programs article:nth-child(3) h3 {
        min-height: 0;
        margin: 0 0 12px;
        font-size: clamp(21px, 6.4vw, 24px);
        line-height: 1.02;
        letter-spacing: normal;
    }

    .flat-mortgage__programs p {
        max-width: 310px;
        font-size: 15px;
        line-height: 1.22;
    }

    .flat-mortgage__programs .button {
        width: 100%;
        min-height: 54px;
        margin-top: 8px;
        border-radius: 999px;
        font-size: 13px;
    }
}

@media (max-width: 380px) {
    .flat-mortgage__calc label {
        grid-template-columns: 122px minmax(0, 1fr);
    }
}
.planning-docs,
.planning-page .planning-docs,
.flat-page .planning-docs {
    position: relative;
    display: block;
    padding: clamp(74px, 8vw, 112px) 0 clamp(64px, 7vw, 92px) !important;
    overflow: hidden;
    isolation: isolate;
    background-color: #fff8ee !important;
    background-image:
        radial-gradient(circle at 82% 16%, rgba(255, 221, 176, .72), rgba(255, 221, 176, 0) 38%),
        url("../images/happy-life-pattern.webp"),
        linear-gradient(180deg, #fff8ee 0%, #fff8ee 58%, #f4dcc0 100%) !important;
    background-repeat: no-repeat, no-repeat, no-repeat !important;
    background-position: center top, center top, center top !important;
    background-size: 100% 100%, 100% 100%, 100% 100% !important;
}

.planning-docs::before,
.planning-page .planning-docs::before,
.flat-page .planning-docs::before {
    display: none !important;
}

.planning-docs__inner,
.planning-page .planning-docs__inner,
.flat-page .planning-docs__inner {
    position: relative;
    z-index: 1;
    width: min(100% - 56px, 1180px);
    margin: 0 auto;
}

.planning-docs h2,
.planning-page .planning-docs h2,
.flat-page .planning-docs h2 {
    margin: 0 0 clamp(44px, 5vw, 62px);
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(40px, 4vw, 58px);
    font-weight: 500;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
}

.planning-docs__list,
.planning-page .planning-docs__list,
.flat-page .planning-docs__list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    background: rgba(224, 191, 154, .72);
    border: 1px solid rgba(224, 191, 154, .72);
    border-radius: 14px;
}

.planning-docs__list a,
.planning-page .planning-docs__list a,
.flat-page .planning-docs__list a {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    min-height: 96px;
    padding: 20px 22px;
    color: var(--vida-blue);
    background: rgba(255, 255, 255, .86);
    transition: background-color .22s ease;
}

.planning-docs__list a:hover,
.planning-docs__list a:focus-visible,
.planning-page .planning-docs__list a:hover,
.planning-page .planning-docs__list a:focus-visible,
.flat-page .planning-docs__list a:hover,
.flat-page .planning-docs__list a:focus-visible {
    background: #fff;
}

.planning-docs__icon,
.planning-page .planning-docs__icon,
.flat-page .planning-docs__icon {
    position: relative;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    background: #dfbd8c;
    border-radius: 0;
}

.planning-docs__icon::before,
.planning-page .planning-docs__icon::before,
.flat-page .planning-docs__icon::before {
    content: "";
    display: block;
    width: 22px;
    height: 22px;
    background-image: url("../icons/document-file.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.planning-docs__icon::after,
.planning-page .planning-docs__icon::after,
.flat-page .planning-docs__icon::after {
    content: none;
}

.planning-docs__list a > span:last-child,
.planning-page .planning-docs__list a > span:last-child,
.flat-page .planning-docs__list a > span:last-child {
    display: block;
    color: var(--vida-blue);
    font-family: var(--font-body);
    font-size: clamp(14px, 1.2vw, 17px);
    font-weight: 500;
    line-height: 1.12;
    letter-spacing: normal;
}

.planning-docs__list small,
.planning-page .planning-docs__list small,
.flat-page .planning-docs__list small {
    display: block;
    margin-top: 8px;
    color: rgba(2, 36, 65, .45);
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: 400;
    line-height: 1.15;
}

@media (max-width: 760px) {
    .planning-docs,
    .planning-page .planning-docs,
    .flat-page .planning-docs {
        padding: 48px 0 54px !important;
    }

    .planning-docs__inner,
    .planning-page .planning-docs__inner,
    .flat-page .planning-docs__inner {
        width: min(100% - 28px, 1180px);
    }

    .planning-docs h2,
    .planning-page .planning-docs h2,
    .flat-page .planning-docs h2 {
        margin-bottom: 28px;
        font-size: 34px;
    }

    .planning-docs__list,
    .planning-page .planning-docs__list,
    .flat-page .planning-docs__list {
        grid-template-columns: 1fr;
        border-radius: 10px;
    }

    .planning-docs__list a,
    .planning-page .planning-docs__list a,
    .flat-page .planning-docs__list a {
        min-height: 74px;
        padding: 14px 16px;
        grid-template-columns: 34px minmax(0, 1fr);
        gap: 12px;
    }

    .planning-docs__icon,
    .planning-page .planning-docs__icon,
    .flat-page .planning-docs__icon {
        width: 34px;
        height: 34px;
    }

    .planning-docs__icon::before,
    .planning-page .planning-docs__icon::before,
    .flat-page .planning-docs__icon::before {
        width: 18px;
        height: 18px;
    }

    .planning-docs__list a > span:last-child,
    .planning-page .planning-docs__list a > span:last-child,
    .flat-page .planning-docs__list a > span:last-child {
        font-size: 13px;
    }
}
.company-page {
    color: var(--vida-blue);
    background: #fff8ee;
}

.company-hero {
    position: relative;
    padding: calc(var(--header-height) + clamp(24px, 3vw, 42px)) 0 clamp(48px, 5vw, 76px);
    overflow: hidden;
    color: #fff;
    background-color: #022441;
    background-image:
        url("../images/happy-life-pattern.webp"),
        linear-gradient(180deg, rgba(255, 221, 176, .92) 0%, rgba(150, 146, 139, .78) 46%, rgba(2, 36, 65, .94) 100%);
    background-repeat: no-repeat, no-repeat;
    background-position: center top, center top;
    background-size: 100% 100%, 100% 100%;
}

.company-hero__inner {
    position: relative;
    z-index: 1;
}

.company-hero h1 {
    margin: 0 0 24px;
    color: #fff;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 500;
}

.company-hero p {
    margin: 0;
    color: rgba(255, 255, 255, .94);
}

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

.company-about__copy,
.company-about__statement {
    padding: clamp(56px, 7vw, 98px) max(32px, calc((100vw - 1180px) / 2)) clamp(54px, 6vw, 86px);
}

.company-about__copy {
    background: #fff8ee;
}

.company-about__statement {
    color: #fff;
    background: #022441;
}

.company-about h2,
.company-awards h2,
.company-projects h2,
.company-partners h2 {
    margin: 0;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 500;
    line-height: .93;
    letter-spacing: normal;
}

.company-about__text {
    color: rgba(28, 32, 24, .72);
}

.company-about__text p {
    margin: 0 0 22px;
}

.company-about__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.company-about__tags span {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 7px 14px;
    color: #fff;
    background: #0f5d45;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}

.company-about__statement h2 {
    margin: 0 0 clamp(28px, 4vw, 48px);
    color: #fff;
}

.company-about__statement h2 em {
    color: #6fa653;
    font-style: normal;
}

.company-about__stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border: 1px solid rgba(224, 191, 154, .72);
    border-right: 0;
    border-bottom: 0;
}

.company-about__stats div {
    border-right: 1px solid rgba(224, 191, 154, .72);
    border-bottom: 1px solid rgba(224, 191, 154, .72);
}

.company-about__stats b {
    display: block;
    color: #fff;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 500;
    line-height: 1;
}

.company-about__stats span {
    display: block;
    max-width: 220px;
    color: rgba(255, 255, 255, .72);
}

.company-about__statement > p {
    margin: clamp(22px, 3vw, 36px) 0 0;
    color: #e0bf9a;
}

.company-awards-story {
    position: relative;
    overflow: hidden;
    background-color: #022441;
    background-image:
        url("../images/happy-life-pattern.webp"),
        linear-gradient(
            180deg,
            #fff8ee 0%,
            #fae3c2 34%,
            rgba(72, 87, 92, .88) 68%,
            #022441 100%
        );
    background-position: center top, center top;
    background-size: 100% auto, 100% 100%;
}

.company-awards {
    padding: clamp(72px, 8vw, 118px) 0 clamp(46px, 5vw, 72px);
}

.company-awards__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 460px);
    gap: 32px;
    align-items: start;
    margin-bottom: clamp(42px, 5vw, 64px);
}

.company-awards h2,
.company-projects h2,
.company-partners h2 {
    font-size: clamp(40px, 4.6vw, 68px);
}

.company-awards__head p,
.company-partners__head p {
    margin: 0;
    color: rgba(2, 36, 65, .88);
    font-size: clamp(17px, 1.5vw, 22px);
    text-align: right;
}

.company-awards__list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid rgba(224, 191, 154, .86);
    border-radius: 14px;
    background: rgba(224, 191, 154, .86);
    gap: 1px;
}

.company-award-card {
    display: flex;
    flex-direction: column;
    min-height: 190px;
    padding: 28px 30px 24px;
    background: rgba(255, 248, 238, .96);
}

.company-award-card__heading {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    margin-bottom: 14px;
}

.company-award-card__icon {
    display: block;
    color: #e0a64b;
    font-size: 24px;
    line-height: 1;
}

.company-award-card h3 {
    margin: 0;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(17px, 1.5vw, 22px);
    font-weight: 500;
    letter-spacing: normal;
}

.company-award-card p {
    margin: 0 0 14px;
    font-size: 14px;
}

.company-award-card small {
    margin-top: auto;
    font-size: 12px;
    line-height: 1.2;
}

@media (min-width: 981px) {
    .company-award-card h3 {
        min-height: 3.24em;
    }
}

.company-projects {
    padding: clamp(72px, 8vw, 116px) 0 clamp(70px, 8vw, 108px);
    background: #f4f0e9;
}

.company-projects h2 {
    margin-bottom: clamp(16px, 2vw, 24px);
}

.company-projects__intro {
    max-width: 680px;
    margin: 0 0 clamp(42px, 5vw, 60px);
    color: rgba(2, 36, 65, .78);
    font-size: clamp(15px, 1.35vw, 19px);
    line-height: 1.45;
}

.company-projects__table {
    overflow: hidden;
    border: 1px solid rgba(224, 191, 154, .94);
    border-radius: 2px;
    background: #fff8ee;
}

.company-projects__head,
.company-project-row {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr) 170px;
    align-items: center;
}

.company-projects__head {
    min-height: 42px;
    color: rgba(2, 36, 65, .54);
    background: #e0bf9a;
    font-size: 13px;
    font-weight: 700;
}

.company-projects__head span {
    padding: 0 22px;
}

.company-projects__head span:last-child {
    text-align: right;
}

.company-project-row {
    min-height: 138px;
    border-top: 1px solid rgba(224, 191, 154, .94);
}

.company-project-row[href] {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .25s ease;
}

.company-project-row[href]:hover,
.company-project-row[href]:focus-visible {
    background: #fff2dc;
}

.company-project-row[href]:focus-visible {
    outline: 2px solid #6fa653;
    outline-offset: -2px;
}

.company-project-row__media {
    padding: 18px 22px;
}

.company-project-row__media img {
    display: block;
    width: 136px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.company-project-row__name,
.company-project-row__params {
    padding: 18px 22px;
}

.company-project-row h3 {
    margin: 0 0 8px;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(20px, 1.7vw, 26px);
    font-weight: 500;
    line-height: 1;
}

.company-project-row p {
    margin: 0;
    color: rgba(2, 36, 65, .62);
    font-size: 15px;
}

.company-project-row__params {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    justify-items: end;
    text-align: right;
}

.company-project-row__params span {
    display: block;
    color: rgba(2, 36, 65, .68);
    font-size: 14px;
}

.company-project-row__params b {
    display: block;
    margin-bottom: 4px;
    color: #6fa653;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(19px, 1.7vw, 26px);
    font-weight: 500;
    line-height: 1;
}

.company-partners {
    position: relative;
    padding: clamp(68px, 7vw, 104px) 0 clamp(64px, 7vw, 96px);
    overflow: hidden;
    background-color: #fff8ee;
    background-image:
        url("../images/happy-life-pattern.webp"),
        linear-gradient(180deg, #fff8ee 0%, #fae3c2 100%);
    background-repeat: no-repeat, no-repeat;
    background-position: center top, center top;
    background-size: 100% 100%, 100% 100%;
}

.company-partners__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 520px);
    gap: 32px;
    align-items: start;
    margin-bottom: clamp(38px, 5vw, 58px);
}

.company-partners__slider {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    gap: 1px;
    overflow: hidden;
    border-radius: 10px;
}

.company-partners__slider button,
.company-partners__list span {
    display: grid;
    place-items: center;
    min-height: 82px;
    border: 0;
    color: var(--vida-blue);
    background: rgba(255, 255, 255, .86);
    font-family: var(--font-body);
    font-size: 17px;
    font-weight: 700;
    line-height: 1;
}

.company-partners__slider button {
    color: rgba(2, 36, 65, .42);
    font-size: 28px;
    cursor: pointer;
}

.company-partners__list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
}

@media (max-width: 980px) {
    .company-about__grid,
.company-awards__head,
.company-partners__head {
        grid-template-columns: 1fr;
    }

    .company-about__copy,
    .company-about__statement {
        min-height: 0;
    }

    .company-awards__head p,
    .company-partners__head p {
        max-width: 520px;
    }

    .company-awards__list {
        grid-template-columns: 1fr;
    }

    .company-projects__head {
        display: none;
    }

    .company-project-row {
        grid-template-columns: 140px minmax(0, 1fr);
        gap: 0;
        align-items: start;
        padding: 16px;
    }

    .company-project-row__media {
        padding: 0 16px 0 0;
        grid-row: span 2;
    }

    .company-project-row__media img {
        width: 124px;
    }

    .company-project-row__name,
    .company-project-row__params {
        padding: 0;
    }

    .company-project-row__params {
        margin-top: 18px;
    }

    .company-partners__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .company-hero {
        padding: calc(var(--header-height) + 26px) 0 44px;
        background-size: auto 100%, 100% 100%;
    }

    .company-about__copy h2 {
        margin-bottom: 18px;
        line-height: .98;
    }

    .company-about__text {
        font-size: 13px;
        line-height: 1.34;
    }

    .company-about__text p {
        margin-bottom: 16px;
    }

    .company-about__tags {
        gap: 6px;
        margin-top: 20px;
    }

    .company-about__tags span {
        min-height: 28px;
        padding: 7px 11px;
        font-size: 11px;
    }

    .company-about__stats {
        grid-template-columns: 1fr 1fr;
    }

    .company-about__stats b {
        font-size: 18px;
    }

    .company-about__stats span {
        font-size: 10px;
    }

    .company-about__statement > p {
        font-size: 12px;
    }

    .company-awards-story {
        background-size: 720px auto, 100% 100%;
        background-repeat: repeat-y, no-repeat;
    }

    .company-awards {
        padding: 46px 0 28px;
    }

    .company-awards__head {
        gap: 20px;
        margin-bottom: 28px;
    }

    .company-awards h2,
    .company-projects h2,
    .company-partners h2 {
        font-size: 28px;
        line-height: 1;
    }

    .company-awards__head p,
    .company-partners__head p {
        font-size: 13px;
        line-height: 1.3;
    }

    .company-award-card {
        min-height: 0;
        padding: 20px;
    }

    .company-award-card h3 {
        font-size: 16px;
    }

    .company-award-card p,
    .company-award-card small {
        font-size: 11px;
    }

    .company-projects h2 {
        margin-bottom: 16px;
    }

    .company-project-row {
        grid-template-columns: 92px minmax(0, 1fr);
    }

    .company-project-row__media {
        padding-right: 12px;
    }

    .company-project-row__params {
        margin-top: 10px;
    }

    .company-partners {
        padding: 46px 0 44px;
        background-size: auto 100%, 100% 100%;
    }

    .company-partners__head {
        gap: 18px;
        margin-bottom: 24px;
    }

    .company-partners__slider {
        grid-template-columns: 32px minmax(0, 1fr) 32px;
    }

    .company-partners__slider button,
    .company-partners__list span {
        min-height: 58px;
        font-size: 11px;
    }
}
.company-hero,
.company-awards-story,
.company-partners {
    background-repeat: no-repeat, no-repeat !important;
    background-position: center top, center top !important;
    background-size: 100% auto, 100% 100% !important;
}

.company-awards__head p,
.company-partners__head p {
    max-width: 520px;
    justify-self: end;
    line-height: 1.24;
}

.company-award-card h3 {
    max-width: 360px;
    line-height: 1.08;
}

.company-award-card p {
    max-width: 390px;
    line-height: 1.34;
}

@media (max-width: 980px) {
    .company-awards__head p,
    .company-partners__head p {
        justify-self: start;
        text-align: left;
    }
}

@media (max-width: 760px) {
    .company-hero,
    .company-awards-story,
    .company-partners {
        background-size: 720px auto, 100% 100% !important;
        background-position: center top, center top !important;
    }

    .company-about__statement {
        padding: 38px 20px 42px;
    }

    .company-about__statement h2 {
        margin-bottom: 22px;
    }

    .company-about__stats {
        width: 100%;
    }

    .company-about__stats div {
        padding: 12px;
    }
}
.company-open-stack,
.planning-open-stack,
.docs-news-stack {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background-color: #fff8ee;
    background-image:
        url("../images/happy-life-pattern.webp"),
        linear-gradient(
            180deg,
            #fff8ee 0%,
            #fdf0dc 24%,
            #f8ddb9 50%,
            rgba(161, 153, 139, .88) 72%,
            rgba(28, 69, 96, .94) 88%,
            #022441 100%
        );
    background-repeat: repeat-y, no-repeat;
    background-position: center top, center top;
    background-size: min(100vw, 1920px) auto, 100% 100%;
}

.company-open-stack > *,
.planning-open-stack > *,
.docs-news-stack > * {
    position: relative;
    z-index: 1;
}

.company-open-stack .company-partners,
.company-open-stack .planning-docs,
.company-open-stack .news,
.planning-open-stack .planning-docs,
.planning-open-stack .news,
.docs-news-stack .planning-docs,
.docs-news-stack .news,
.company-partners--transparent,
.planning-docs--transparent,
.news--transparent {
    background: transparent !important;
    background-image: none !important;
}

.company-open-stack .company-partners::before,
.company-open-stack .planning-docs::before,
.company-open-stack .news::before,
.planning-open-stack .planning-docs::before,
.planning-open-stack .news::before,
.docs-news-stack .planning-docs::before,
.docs-news-stack .news::before,
.company-partners--transparent::before,
.planning-docs--transparent::before,
.news--transparent::before {
    display: none !important;
    content: none !important;
}

.company-open-stack .company-partners {
    padding-bottom: clamp(44px, 5vw, 70px);
}

.company-open-stack .planning-docs,
.planning-open-stack .planning-docs,
.docs-news-stack .planning-docs {
    padding-top: clamp(46px, 5vw, 74px) !important;
    padding-bottom: clamp(42px, 4.5vw, 68px) !important;
}

.company-open-stack .news,
.planning-open-stack .news,
.docs-news-stack .news {
    padding-top: clamp(54px, 6vw, 86px) !important;
    padding-bottom: clamp(88px, 8vw, 124px) !important;
}

@media (max-width: 760px) {
    .company-open-stack,
    .planning-open-stack,
    .docs-news-stack {
        background-repeat: repeat-y, no-repeat;
        background-size: 720px auto, 100% 100%;
        background-position: center top, center top;
    }

    .company-open-stack .company-partners {
        padding-bottom: 34px;
    }

    .company-open-stack .planning-docs,
    .planning-open-stack .planning-docs,
    .docs-news-stack .planning-docs {
        padding-top: 34px !important;
        padding-bottom: 34px !important;
    }

    .company-open-stack .news,
    .planning-open-stack .news,
    .docs-news-stack .news {
        padding-top: 40px !important;
        padding-bottom: 58px !important;
    }
}


/* About section layout */
.company-about__grid {
    align-items: stretch;
}

.company-about__copy,
.company-about__statement {
    min-height: 0;
    padding-top: clamp(56px, 5.8vw, 82px);
    padding-bottom: clamp(56px, 5.8vw, 82px);
}

.company-about__copy {
    /* Левая карточка «Dелом Девелопмент»: внутренний отступ от края блока,
       а не от глобального контейнера, чтобы визуально соответствовать правой синей карточке. */
    padding-left: clamp(58px, 6.2vw, 108px);
    padding-right: clamp(42px, 5.2vw, 86px);
}

.company-about__copy h2 {
    margin-bottom: clamp(26px, 2.8vw, 36px);
    font-size: clamp(46px, 4.35vw, 68px);
    line-height: .92;
}

.company-about__text {
    max-width: 690px;
    font-size: clamp(16px, 1.22vw, 19px);
    line-height: 1.42;
}

.company-about__text p {
    margin-bottom: clamp(18px, 2vw, 24px);
}

.company-about__tags {
    margin-top: clamp(22px, 2.4vw, 30px);
}

.company-about__statement {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: clamp(58px, 6.2vw, 108px);
    padding-right: clamp(42px, 5.2vw, 86px);
}

.company-about__statement h2 {
    max-width: none;
    margin-bottom: clamp(28px, 3vw, 40px);
    font-size: clamp(34px, 2.85vw, 48px);
    line-height: 1.08;
    letter-spacing: normal;
}

.company-about__statement h2 span {
    display: block;
}

.company-about__stats {
    width: min(100%, 640px);
}

.company-about__stats div {
    min-height: 84px;
    padding: 16px 20px;
}

.company-about__stats b {
    margin-bottom: 5px;
    font-size: clamp(23px, 1.95vw, 32px);
}

.company-about__stats span {
    font-size: 12px;
    line-height: 1.2;
}

.company-about__statement > p {
    margin-top: clamp(22px, 2.5vw, 30px);
    font-size: 16px;
}

@media (min-width: 981px) {
    .company-about__statement h2 span {
        white-space: nowrap;
    }
}

@media (max-width: 1180px) and (min-width: 981px) {
    .company-about__copy,
    .company-about__statement {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .company-about__copy {
        padding-left: 42px;
        padding-right: 42px;
    }

    .company-about__statement {
        padding-left: 48px;
        padding-right: 42px;
    }

    .company-about__statement h2 {
        font-size: clamp(31px, 3.25vw, 40px);
    }

    .company-about__stats div {
        min-height: 78px;
        padding: 14px 16px;
    }

    .company-about__stats b {
        font-size: clamp(21px, 2.2vw, 28px);
    }
}

@media (max-width: 760px) {
    .company-about__copy,
    .company-about__statement {
        padding-top: 42px;
        padding-bottom: 42px;
    }

    .company-about__stats div {
        min-height: 72px;
    }
}


/* Company hero */
.company-hero {
    min-height: clamp(360px, 28vw, 500px);
    padding-top: calc(var(--header-height) + clamp(22px, 2.5vw, 34px));
    padding-bottom: clamp(36px, 4vw, 60px);
}

.company-hero h1 {
    max-width: 980px;
    margin-bottom: clamp(18px, 2vw, 26px);
    font-size: clamp(56px, 6vw, 96px);
    line-height: .9;
    letter-spacing: normal;
}

.company-hero h1 span {
    white-space: nowrap;
}

.company-hero p {
    max-width: 760px;
    font-size: clamp(17px, 1.45vw, 22px);
    line-height: 1.3;
}

@media (max-width: 760px) {
    .company-hero {
        min-height: 350px;
        padding-top: calc(var(--header-height) + 24px);
        padding-bottom: 40px;
    }

    .company-hero h1 {
        margin-bottom: 16px;
        font-size: clamp(38px, 15vw, 54px);
        line-height: .92;
    }

    .company-hero p {
        max-width: 320px;
        font-size: 13px;
        line-height: 1.35;
    }
}


/* Секция наград использует общий орнамент и плавный переход к тёмному блоку 3D-тура. */
.company-awards-story {
    background-repeat: no-repeat, repeat-y;
}


/* Цвета текстов карточек наград. */
.company-award-card p {
    color: #14452F;
}

.company-award-card small {
    color: #022441;
}


/* Мобильное отображение карточек реализованных проектов. */

@media (max-width: 760px) {
    .company-projects {
        padding: 48px 0 58px;
        background: #f4f0e9;
    }

    .company-projects .container {
        width: min(100% - 28px, 1180px);
    }

    .company-projects h2 {
        max-width: 320px;
        margin: 0 0 16px;
        font-size: 28px;
        line-height: 1.03;
        letter-spacing: normal;
    }

    .company-projects__intro {
        margin-bottom: 30px;
        font-size: 14px;
        line-height: 1.4;
    }

    .company-projects__table {
        overflow: hidden;
        border: 1px solid rgba(224, 191, 154, .95);
        border-radius: 0;
        background: #f4f0e9;
    }

    .company-projects__head {
        display: none;
    }

    .company-project-row {
        display: block;
        min-height: 0;
        padding: 24px 22px 22px;
        border-top: 0;
        background: #f4f0e9;
    }

    .company-project-row + .company-project-row {
        border-top: 1px solid rgba(224, 191, 154, .95);
    }

    .company-project-row__media {
        padding: 0;
        margin: 0 0 18px;
    }

    .company-project-row__media img {
        width: 100%;
        max-width: none;
        aspect-ratio: 16 / 6.7;
        border-radius: 3px;
        object-fit: cover;
    }

    .company-project-row__name {
        padding: 0;
        margin: 0 0 18px;
    }

    .company-project-row h3 {
        margin: 0 0 10px;
        font-size: 20px;
        line-height: 1.02;
        letter-spacing: normal;
    }

    .company-project-row p {
        margin: 0;
        color: var(--vida-blue);
        font-size: 16px;
        line-height: 1.25;
    }

    .company-project-row__params {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
        padding: 0;
        margin: 0;
        justify-items: start;
        text-align: left;
    }

    .company-project-row__params b {
        margin-bottom: 4px;
        color: #6fa653;
        font-size: 20px;
        line-height: 1;
    }

    .company-project-row__params span {
        color: var(--vida-blue);
        font-size: 14px;
        line-height: 1.2;
    }
}


/* Company about statement */
@media (max-width: 760px) {
    .company-about__statement h2 {
        line-height: 1.12;
        letter-spacing: normal;
    }

    .company-about__statement h2 span:first-child {
        max-width: 310px;
    }
}
/* Общая оболочка страницы: задаёт базовые цвета и фон для всех секций. */
.purchase-page {
    color: #022441;
    background: #f5f4f1;
}

/* Hero-блок: крупный первый экран с орнаментом и градиентом. */
.purchase-hero {
    position: relative;
    min-height: clamp(320px, 28vw, 430px);
    padding: calc(var(--header-height) + clamp(24px, 3vw, 40px)) 0 clamp(42px, 5vw, 70px);
    overflow: hidden;
    color: #fff;
    background-color: #022441;
    background-image:
        url("../images/happy-life-pattern.webp"),
        radial-gradient(72% 66% at 47% 6%, rgba(224, 191, 154, .54) 0%, rgba(224, 191, 154, .22) 38%, rgba(224, 191, 154, 0) 74%),
        linear-gradient(180deg, #ddc4a7 0%, #a7a79f 28%, #697d88 54%, #24445d 78%, #022441 100%);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-position: center top, center top, center top;
    background-size: cover, 100% 100%, 100% 100%;
}

.purchase-hero__inner {
    position: relative;
    z-index: 1;
}

.purchase-hero h1 {
    margin: 0 0 clamp(16px, 2vw, 26px);
    color: #fff;
}

.purchase-hero p {
    max-width: 760px;
    margin: 0;
    color: rgba(255, 255, 255, .94);
    font-size: clamp(17px, 1.35vw, 22px);
    line-height: 1.32;
}

/* Карточки способов покупки под первым экраном. */
.purchase-methods {
    padding: clamp(48px, 5vw, 70px) 0 clamp(28px, 4vw, 48px);
    background: #f7f7f5;
}

.purchase-methods__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
}

.purchase-method-card {
    display: grid;
    align-content: start;
    row-gap: 10px;
    min-height: 164px;
    padding: clamp(28px, 2.35vw, 34px) clamp(24px, 2.1vw, 30px) clamp(22px, 2vw, 28px);
    border-top: 2px solid rgba(224, 191, 154, .98);
    border-left: 1px solid rgba(224, 191, 154, .34);
    background: #f8f6f2;
}

.purchase-method-card:first-child {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.purchase-method-card:last-child {
    border-right: 1px solid rgba(224, 191, 154, .34);
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.purchase-method-card h2 {
    max-width: none;
    margin: 0;
    color: #022441;
    font-size: clamp(18px, 1.48vw, 22px);
    line-height: 1.04;
    letter-spacing: normal;
}

.purchase-method-card p {
    max-width: 235px;
    margin: 0;
    color: rgba(28, 32, 24, .84);
    font-size: clamp(14px, .95vw, 15px);
    line-height: 1.46;
}

.purchase-method-card--mortgage p {
    max-width: 180px;
}

.purchase-method-card--trade-in p {
    max-width: 225px;
}

.purchase-method-card--online p {
    max-width: 228px;
}

.purchase-method-card--capital h2 {
    max-width: 235px;
    font-size: clamp(17px, 1.34vw, 21px);
    white-space: normal;
}

.purchase-method-card--capital p {
    max-width: 228px;
}

/* Ипотечный блок: текстовая колонка, вкладки и калькулятор. */
.purchase-mortgage {
    padding: 0 0 clamp(80px, 9vw, 132px);
    background: #f7f7f5;
}

.purchase-mortgage__layout {
    display: grid;
    grid-template-columns: minmax(0, .94fr) minmax(360px, .9fr);
    gap: clamp(38px, 5vw, 82px);
    align-items: start;
}

.purchase-mortgage__content h2 {
    margin: 0 0 clamp(22px, 2.4vw, 34px);
    font-size: clamp(42px, 4.7vw, 72px);
    line-height: .96;
    letter-spacing: normal;
}

.purchase-mortgage__lead {
    max-width: 600px;
    margin: 0 0 clamp(24px, 3vw, 38px);
    color: rgba(28, 32, 24, .78);
    font-size: clamp(15px, 1.05vw, 17px);
    line-height: 1.45;
}

.purchase-mortgage__stats {
    display: grid;
    max-width: 640px;
    margin: 0 0 clamp(28px, 3vw, 42px);
    border-top: 2px solid rgba(15, 93, 69, .72);
}

.purchase-mortgage__stat {
    padding: 18px 16px 14px 0;
    border-right: 1px solid rgba(15, 93, 69, .32);
}

.purchase-mortgage__stat:last-child {
    border-right: 0;
}

.purchase-mortgage__stats strong {
    display: block;
    margin-bottom: 6px;
    color: #022441;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 500;
    line-height: .92;
    text-wrap: balance;
}

.purchase-mortgage__stats span {
    display: block;
    color: rgba(28, 32, 24, .55);
    font-size: 12px;
    line-height: 1.25;
}

.purchase-program-copy h3 {
    margin: 0 0 14px;
    color: #022441;
    font-size: clamp(22px, 2vw, 30px);
    line-height: 1.08;
    letter-spacing: normal;
}

.purchase-program-copy p {
    margin: 0 0 28px;
    color: rgba(28, 32, 24, .78);
    font-size: 15px;
    line-height: 1.48;
}

.purchase-program-copy h4 {
    margin: 0 0 16px;
    color: #022441;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: 16px;
    font-weight: 500;
}

.purchase-program-copy ul {
    display: grid;
    gap: 0;
    padding: 0;
    margin: 0 0 38px;
    list-style: none;
}

.purchase-program-copy li {
    position: relative;
    min-height: 42px;
    padding: 12px 0 12px 34px;
    color: rgba(28, 32, 24, .78);
    border-bottom: 1px solid rgba(2, 36, 65, .08);
    font-size: 15px;
    line-height: 1.28;
}

.purchase-program-copy li::before {
    position: absolute;
    top: 12px;
    left: 0;
    display: grid;
    width: 17px;
    height: 17px;
    place-items: center;
    content: "✓";
    color: #e0bf9a;
    border: 1px solid rgba(224, 191, 154, .9);
    font-size: 11px;
    line-height: 1;
}

.purchase-mortgage__approval {
    min-width: 230px;
}

.purchase-mortgage__side {
    padding-top: clamp(6px, .9vw, 12px);
}

.purchase-mortgage-tabs {
    display: grid;
    border: 1px solid rgba(15, 93, 69, .72);
}

.purchase-mortgage-tabs__item {
    color: #022441;
    border: 0;
    border-right: 1px solid rgba(15, 93, 69, .42);
    border-bottom: 1px solid rgba(15, 93, 69, .42);
    cursor: pointer;
    transition: color .2s ease, background .2s ease;
}

.purchase-mortgage-tabs__item:nth-child(even) {
    border-right: 0;
}

.purchase-mortgage-tabs__item:nth-last-child(-n + 2) {
    border-bottom: 0;
}

.purchase-mortgage-tabs__item.is-active {
    color: #fff;
    background: #0f5d45;
}

/* Карточка калькулятора и контейнер для будущей вставки из плагина. */
.purchase-calculator,
.purchase-calculator-embed {
    color: #fff;
    background: linear-gradient(145deg, #194c73 0%, #052a48 72%);
    border-radius: 6px;
    box-shadow: 0 28px 80px rgba(2, 36, 65, .16);
}

.purchase-calculator {
    padding: clamp(28px, 3vw, 38px) clamp(28px, 3.2vw, 42px) clamp(30px, 3.2vw, 42px);
}

.purchase-calculator h3 {
    margin: 0 0 8px;
    color: #fff;
    font-size: clamp(24px, 2.1vw, 32px);
    letter-spacing: normal;
}

.purchase-calculator > p {
    margin: 0 0 22px;
    color: rgba(255, 255, 255, .66);
    font-size: 13px;
}

.purchase-calculator__programs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 22px;
}

.purchase-calculator__chip {
    padding: 8px 13px;
    color: rgba(255, 255, 255, .86);
    background: transparent;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 0;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
    transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.purchase-calculator__chip.is-active {
    color: #022441;
    background: #e0bf9a;
    border-color: #e0bf9a;
}

.purchase-calculator__fields {
    display: grid;
}

.purchase-calculator__field {
    display: grid;
    gap: 9px;
}

.purchase-calculator__field > span {
    color: rgba(255, 255, 255, .72);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.purchase-calculator__field input[type="text"] {
    width: 100%;
    min-height: 44px;
    padding: 11px 14px;
    color: #fff;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 0;
    outline: 0;
    font-size: 15px;
}

.purchase-calculator__field input[type="text"]:focus {
    border-color: rgba(224, 191, 154, .8);
}

.purchase-calculator__field input[type="range"] {
    width: 100%;
    height: 20px;
    margin: -4px 0 0;
    accent-color: #e0bf9a;
}

.purchase-calculator__field em {
    display: flex;
    justify-content: space-between;
    margin-top: -7px;
    color: rgba(255, 255, 255, .52);
    font-size: 11px;
    font-style: normal;
    line-height: 1;
}

.purchase-calculator__result {
    display: grid;
    gap: 12px;
    padding: clamp(24px, 2.5vw, 30px);
    margin: 30px 0 0;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .08);
}

.purchase-calculator__result div {
    display: grid;
    align-items: baseline;
    gap: 16px;
}

.purchase-calculator__result dt,
.purchase-calculator__result dd {
    margin: 0;
}

.purchase-calculator__result dt {
    color: rgba(255, 255, 255, .68);
    font-size: 13px;
}

.purchase-calculator__result dd {
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    text-align: right;
}

.purchase-calculator__result-main dd {
    color: #e0bf9a;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(26px, 2.8vw, 38px);
    font-weight: 500;
    letter-spacing: normal;
}

/* Блок trade-in: фон с орнаментом и две компактные сценарные карточки. */
.purchase-exchange {
    position: relative;
    padding: clamp(58px, 6.5vw, 92px) 0 clamp(66px, 7.5vw, 106px);
    overflow: hidden;
    background-color: #022441;
    background-image:
        url("../images/happy-life-pattern.webp"),
        linear-gradient(180deg, #fbf8f0 0%, #fff1df 20%, #f7c990 38%, #234963 72%, #022441 100%);
    background-repeat: no-repeat, no-repeat;
    background-position: center top, center top;
    background-size: cover, 100% 100%;
}

.purchase-exchange h2 {
    max-width: 760px;
    margin: 0 0 clamp(30px, 3.4vw, 44px);
    color: #022441;
    font-size: clamp(42px, 4.3vw, 66px);
    line-height: .96;
    letter-spacing: normal;
}

.purchase-exchange__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    align-items: stretch;
}

.purchase-trade-card {
    min-height: 455px;
    padding: clamp(34px, 3.4vw, 48px) clamp(34px, 3.6vw, 54px);
}

.purchase-trade-card h3 {
    margin: 0 0 16px;
    font-size: clamp(31px, 3vw, 46px);
    line-height: .98;
    letter-spacing: normal;
}

.purchase-trade-card p {
    margin: 0 0 10px;
    font-size: clamp(14px, .98vw, 16px);
    line-height: 1.42;
}

.purchase-trade-card ol {
    display: grid;
    gap: 0;
    padding: 0;
    margin: clamp(18px, 2vw, 28px) 0 0;
    list-style: none;
}

.purchase-trade-card li {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 16px;
    padding: 11px 0;
    border-top: 1px solid currentColor;
}

.purchase-trade-card li:first-child {
    border-top: 0;
}

.purchase-trade-card li span {
    opacity: .7;
    font-size: 13px;
}

.purchase-trade-card li p {
    margin: 0;
}

.purchase-trade-card--dark {
    color: #fff;
    background: linear-gradient(145deg, #052a48 0%, #255172 100%);
    border-radius: 7px 0 0 7px;
}

.purchase-trade-card--dark p,
.purchase-trade-card--dark li {
    color: rgba(255, 255, 255, .82);
}

.purchase-trade-card--dark li {
    border-color: rgba(255, 255, 255, .13);
}

.purchase-trade-card--light {
    color: #022441;
    background: #fffaf3;
    border: 1px solid rgba(224, 191, 154, .44);
    border-left: 0;
    border-radius: 0 7px 7px 0;
}

.purchase-trade-card--light p,
.purchase-trade-card--light li {
    color: rgba(28, 32, 24, .72);
}

.purchase-trade-card--light li {
    border-color: rgba(2, 36, 65, .09);
}

.purchase-trade-card--light strong {
    color: #022441;
}

.purchase-trade-card__note {
    padding: 16px 20px;
    margin: 18px 0 22px;
    color: rgba(28, 32, 24, .68);
    background: #fff3e5;
    font-size: 13px;
    line-height: 1.38;
}

/* Маткапитал: крупные цифры, синхронные заголовки и поясняющая плашка. */
.purchase-maternity {
    padding: clamp(68px, 7vw, 104px) 0 clamp(76px, 7.4vw, 108px);
    background: #f1eee8;
}

.purchase-maternity h2 {
    margin: 0 0 24px;
    font-size: clamp(44px, 4.6vw, 72px);
    line-height: .96;
    letter-spacing: normal;
}

.purchase-maternity__lead {
    max-width: 1120px;
    margin: 0 0 clamp(34px, 4vw, 54px);
    color: rgba(28, 32, 24, .8);
    font-size: clamp(17px, 1.25vw, 20px);
    line-height: 1.48;
}

.purchase-maternity__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border: 1px solid rgba(224, 191, 154, .42);
    background: #fffdf9;
}

.purchase-maternity__stats article {
    display: grid;
    grid-template-rows: minmax(54px, auto) minmax(42px, auto) 1fr;
    align-content: start;
    min-height: 205px;
    padding: clamp(28px, 3.2vw, 44px) clamp(24px, 2.8vw, 38px);
    border-right: 1px solid rgba(224, 191, 154, .42);
}

.purchase-maternity__stats article:last-child {
    border-right: 0;
}

.purchase-maternity__stats strong {
    display: block;
    margin-bottom: 10px;
    color: #f3bd75;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(30px, 3.1vw, 44px);
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
}

.purchase-maternity__stats h3 {
    align-self: start;
    margin: 0;
    font-size: clamp(18px, 1.45vw, 23px);
    line-height: 1.08;
    letter-spacing: normal;
    white-space: nowrap;
}

.purchase-maternity__stats p {
    margin: 0;
    color: rgba(28, 32, 24, .68);
    font-size: 15px;
    line-height: 1.5;
}

.purchase-maternity__note {
    padding: 24px 30px;
    margin: 0;
    color: rgba(28, 32, 24, .76);
    background: #fff3e5;
    border: 1px solid rgba(224, 191, 154, .38);
    border-top: 0;
    font-size: clamp(15px, 1.05vw, 17px);
    line-height: 1.48;
}

.purchase-maternity__note strong {
    color: #0f5d45;
}

/* Финальный CTA с контактами и формой заявки. */
.purchase-contacts {
    padding: clamp(72px, 8vw, 116px) 0 clamp(54px, 6vw, 84px);
    background: #ffddb0;
}

.purchase-contacts__grid {
    display: grid;
    grid-template-columns: minmax(0, .98fr) minmax(420px, 484px);
    gap: clamp(70px, 8.4vw, 142px);
    align-items: start;
}

.purchase-contacts__copy {
    max-width: 690px;
    padding-top: clamp(10px, 1.4vw, 22px);
}

.purchase-contacts .tag {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 8px 28px;
    margin-bottom: 30px;
    color: rgba(2, 36, 65, .82);
    background: rgba(255, 255, 255, .52);
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
}

.purchase-contacts h2 {
    max-width: 640px;
    margin: 0 0 28px;
    font-size: clamp(34px, 2.8vw, 42px);
    line-height: .98;
    letter-spacing: normal;
}

.purchase-contacts h2 span {
    display: block;
}

.purchase-contacts h2 span:first-child {
    white-space: nowrap;
}

.purchase-contacts__copy > p {
    max-width: 500px;
    margin: 0 0 clamp(42px, 4.2vw, 66px);
    color: rgba(2, 36, 65, .78);
    font-size: clamp(16px, 1.12vw, 18px);
    line-height: 1.34;
}

.purchase-contacts__details {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(170px, auto);
    gap: clamp(34px, 5vw, 72px);
    align-items: start;
    max-width: 640px;
}

.purchase-contacts__details h3 {
    margin: 0 0 18px;
    color: #0f5d45;
    font-size: clamp(22px, 1.7vw, 32px);
    line-height: 1.02;
    letter-spacing: normal;
}

.purchase-contacts__details a {
    display: block;
    width: fit-content;
    color: #0f5d45;
    border-bottom: 1px solid currentColor;
    font-size: clamp(18px, 1.45vw, 22px);
    line-height: 1.34;
}

.purchase-contacts__details a + a {
    margin-top: 8px;
}

.social-links--purchase {
    display: flex;
    gap: 16px;
    align-items: center;
}

.social-links--purchase .social-links__item {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    color: #0f5d45;
    border: 0;
}

.social-links--purchase .social-links__icon,
.social-links--purchase svg {
    width: 26px;
    height: 26px;
}

.purchase-contacts__form-card {
    width: 100%;
    padding: clamp(26px, 2.7vw, 40px) clamp(24px, 2.5vw, 36px) clamp(30px, 3vw, 42px);
    background: #f7f7f7;
    border-radius: 22px;
    box-shadow: 0 24px 60px rgba(2, 36, 65, .08);
}

.purchase-contacts__form-card h3 {
    margin: 0 0 20px;
    color: rgba(2, 36, 65, .82);
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.purchase-contacts__form-card .contact-form {
    gap: 14px;
}

.purchase-contacts__form-card .field {
    gap: 8px;
}

.purchase-contacts__form-card .field__label {
    color: rgba(2, 36, 65, .62);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .04em;
}

.purchase-contacts__form-card .field__input,
.purchase-contacts__form-card .custom-select__trigger {
    min-height: 48px;
    padding: 12px 16px;
    font-size: 14px;
    border-color: rgba(2, 36, 65, .22);
    border-radius: 12px;
    background: #f7f7f7;
}

.purchase-contacts__form-card .custom-select__trigger {
    padding-right: 44px;
}

.purchase-contacts__form-card .field__input::placeholder,
.purchase-contacts__form-card .custom-select__trigger span {
    color: rgba(2, 36, 65, .32);
}

.purchase-contacts__form-card .consent {
    margin-top: 2px;
    color: rgba(2, 36, 65, .62);
    font-size: 12px;
    line-height: 1.38;
}

.purchase-contacts__form-card .consent input {
    width: 15px;
    height: 15px;
    margin-top: 1px;
    flex-basis: 15px;
}

.purchase-contacts__form-card .contact-form__submit {
    justify-self: center;
    min-width: 276px;
    min-height: 58px;
    margin-top: 10px;
    padding: 15px 24px 14px 26px;
    font-size: 13px;
    font-weight: 500;
}

.purchase-contacts__form-card .contact-form__submit .button__arrow {
    margin-left: 8px;
    font-size: 18px;
}

/* Планшеты: ключевые двухколоночные блоки складываются в одну колонку. */
@media (max-width: 1040px) {
    .purchase-mortgage__layout,
    .purchase-contacts__grid {
        grid-template-columns: 1fr;
    }

    .purchase-mortgage__side,
    .purchase-contacts__form-card {
        max-width: 620px;
    }

    .purchase-contacts__copy {
        max-width: none;
        padding-top: 0;
    }

    .purchase-exchange__grid {
        grid-template-columns: 1fr;
    }

    .purchase-trade-card--dark {
        border-radius: 7px 7px 0 0;
    }

    .purchase-trade-card--light {
        border-left: 1px solid rgba(224, 191, 154, .44);
        border-top: 0;
        border-radius: 0 0 7px 7px;
    }
}

/* Мобильная версия страницы: уменьшаем типографику и переводим карточки в вертикальный поток. */
@media (max-width: 760px) {
    .purchase-page .container,
    .purchase-page .container-wide {
        width: min(100% - 40px, 1180px);
    }

    .purchase-hero {
        min-height: 335px;
        padding: calc(var(--header-height) + 20px) 0 36px;
        background-size: cover, 100% 100%, 100% 100%;
    }

    .purchase-hero h1 {
        letter-spacing: normal;
    }

    .purchase-hero p {
        max-width: 318px;
        font-size: 13px;
        line-height: 1.36;
    }

    .purchase-methods {
        padding: 34px 0 30px;
    }

    .purchase-methods__grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .purchase-method-card,
    .purchase-method-card:first-child,
    .purchase-method-card:last-child {
        min-height: 0;
        padding: 22px 22px 20px;
        border: 1px solid rgba(224, 191, 154, .92);
        border-top-width: 2px;
        border-radius: 9px;
    }

    .purchase-method-card h2,
    .purchase-method-card p,
    .purchase-method-card--mortgage p,
    .purchase-method-card--trade-in p,
    .purchase-method-card--online h2,
    .purchase-method-card--online p,
    .purchase-method-card--capital h2,
    .purchase-method-card--capital p {
        max-width: none;
    }

    .purchase-method-card h2 {
        min-height: 0;
        margin-bottom: 0;
        font-size: 20px;
    }

    .purchase-method-card p {
        font-size: 13px;
        line-height: 1.42;
    }


    .purchase-mortgage {
        padding-bottom: 70px;
    }

    .purchase-mortgage__layout {
        gap: 28px;
    }

    .purchase-mortgage__content h2,
    .purchase-exchange h2,
    .purchase-maternity h2,
    .purchase-contacts h2 {
        font-size: clamp(32px, 11vw, 46px);
        line-height: .98;
    }

    .purchase-mortgage__lead,
    .purchase-program-copy p,
    .purchase-maternity__lead,
    .purchase-contacts__copy > p {
        font-size: 13px;
        line-height: 1.4;
    }

    .purchase-mortgage__stats {
        grid-template-columns: 1fr;
        margin-bottom: 22px;
        max-width: none;
    }

    .purchase-mortgage__stat {
        display: grid;
        align-items: end;
        padding: 12px 0;
        border-right: 0;
        border-bottom: 1px solid rgba(15, 93, 69, .22);
    }

    .purchase-mortgage__stats strong {
        margin: 0;
        font-size: 28px;
    }

    .purchase-mortgage__stat--limit strong {
        max-width: none;
        font-size: 24px;
    }

    .purchase-program-copy li {
        min-height: 0;
        padding: 10px 0 10px 28px;
        font-size: 13px;
    }

    .purchase-program-copy li::before {
        top: 10px;
    }

    .purchase-mortgage-tabs__item {
        min-height: 38px;
        padding: 9px 10px;
        font-size: 12px;
    }

    .purchase-calculator > p {
        font-size: 12px;
    }

    .purchase-calculator__programs {
        gap: 6px;
    }

    .purchase-calculator__chip {
        padding: 7px 9px;
        font-size: 10px;
    }

    .purchase-calculator__field > span,
    .purchase-calculator__field input[type="text"] {
        font-size: 12px;
    }

    .purchase-calculator__result dt,
    .purchase-calculator__result dd {
        font-size: 12px;
    }

    .purchase-calculator__result-main dd {
        font-size: 24px;
    }

    .purchase-exchange {
        padding: 58px 0 66px;
    }

    .purchase-trade-card {
        min-height: 0;
        padding: 30px 22px;
    }

    .purchase-trade-card h3 {
        font-size: 31px;
    }

    .purchase-trade-card p,
    .purchase-trade-card li p {
        font-size: 13px;
    }

    .purchase-trade-card li {
        grid-template-columns: 28px minmax(0, 1fr);
        gap: 16px;
        padding: 13px 0;
    }

    .purchase-maternity {
        padding: 58px 0 64px;
    }

    .purchase-maternity__stats {
        grid-template-columns: 1fr;
    }

    .purchase-maternity__stats article {
        display: block;
        min-height: 0;
        padding: 24px 22px;
        border-right: 0;
        border-bottom: 1px solid rgba(224, 191, 154, .42);
    }

    .purchase-maternity__stats article:last-child {
        border-bottom: 0;
    }

    .purchase-maternity__stats strong {
        font-size: 38px;
    }

    .purchase-maternity__stats h3 {
        margin-bottom: 10px;
        font-size: 18px;
        white-space: normal;
    }

    .purchase-maternity__stats p,
    .purchase-maternity__note {
        font-size: 13px;
    }

    .purchase-maternity__lead {
        font-size: 14px;
    }

    .purchase-maternity__note {
        padding: 18px 20px;
    }

    .purchase-contacts {
        padding: 54px 0 58px;
    }

    .purchase-contacts__grid {
        gap: 34px;
    }

    .purchase-contacts .tag {
        min-height: 24px;
        padding: 6px 14px;
        margin-bottom: 18px;
        font-size: 10px;
    }

    .purchase-contacts h2 {
        max-width: 320px;
        margin-bottom: 18px;
        font-size: clamp(32px, 10vw, 42px);
        line-height: .98;
        white-space: normal;
    }

    .purchase-contacts h2 span:first-child {
        white-space: normal;
    }

    .purchase-contacts__copy > p {
        max-width: 320px;
        margin-bottom: 28px;
        font-size: 13px;
        line-height: 1.35;
    }

    .purchase-contacts__details {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .purchase-contacts__details h3 {
        margin-bottom: 10px;
        font-size: 16px;
    }

    .purchase-contacts__details a {
        font-size: 14px;
    }

    .purchase-contacts__form-card {
        padding: 24px 18px;
        border-radius: 18px;
    }

    .purchase-contacts__form-card h3 {
        font-size: 13px;
    }

    .purchase-contacts__form-card .field__label {
        font-size: 10px;
    }

    .purchase-contacts__form-card .field__input,
    .purchase-contacts__form-card .custom-select__trigger {
        min-height: 44px;
        font-size: 13px;
        border-radius: 10px;
    }

    .purchase-contacts__form-card .consent {
        font-size: 11px;
    }

    .purchase-contacts__form-card .contact-form__submit {
        min-width: 220px;
        min-height: 50px;
        font-size: 12px;
    }
}

/* Узкие экраны: дополнительная подстройка отступов и вкладок. */
@media (max-width: 390px) {
    .purchase-page .container,
    .purchase-page .container-wide {
        width: min(100% - 32px, 1180px);
    }

    .purchase-mortgage-tabs__item {
        font-size: 11px;
    }
}

/* Блок «Dелом Девелопмент»: на планшетах секции идут друг под другом,
   поэтому убираем слишком широкие десктопные внутренние отступы. */
@media (max-width: 980px) {
    .company-about__grid {
        grid-template-columns: 1fr;
    }

    .company-about__copy,
    .company-about__statement {
        padding: 50px clamp(22px, 5vw, 42px);
    }

    .company-about__copy h2 {
        max-width: 560px;
    }

    .company-about__text {
        max-width: 680px;
    }

    .company-about__statement {
        display: block;
    }

    .company-about__statement h2 {
        max-width: 680px;
    }

    .company-about__statement h2 span {
        white-space: normal;
    }
}

/* Узкий десктоп: сохраняем двухколоночную композицию, но не даём слогану
   и таблице показателей упираться в край синей карточки. */
@media (min-width: 981px) and (max-width: 1280px) {
    .company-about__copy {
        padding-left: clamp(42px, 4.6vw, 58px);
        padding-right: clamp(36px, 4vw, 48px);
    }

    .company-about__statement {
        padding-left: clamp(42px, 4.6vw, 58px);
        padding-right: clamp(36px, 4vw, 48px);
    }

    .company-about__statement h2 {
        font-size: clamp(31px, 3.1vw, 40px);
    }

    .company-about__statement h2 span {
        white-space: normal;
    }

    .company-about__stats {
        width: 100%;
    }
}

/* Награды: на средних экранах карточки остаются читабельными и не сжимаются
   в слишком узкие колонки. */
@media (min-width: 761px) and (max-width: 980px) {
    .company-awards__list {
        grid-template-columns: 1fr;
    }

    .company-award-card {
        min-height: 0;
    }
}

/* 3D-тур: на планшетах кнопка не должна прижиматься к тексту. */

/* Реализованные проекты: планшетный вид оставляет картинку слева,
   а текстовые параметры — справа, без скрытых переполнений. */
@media (min-width: 761px) and (max-width: 980px) {
    .company-project-row {
        grid-template-columns: 156px minmax(0, 1fr);
        gap: 0;
        padding: 18px;
    }

    .company-project-row__media img {
        width: 136px;
    }

    .company-project-row__params {
        grid-template-columns: minmax(0, 180px);
        gap: 8px;
        justify-items: start;
        text-align: left;
    }
}

/* Мобильный финальный слой: подчищает конфликт старых и новых правил,
   чтобы блоки не получали планшетные отступы на ширине телефона. */
@media (max-width: 760px) {
    .company-about__copy,
    .company-about__statement {
        padding: 42px 20px;
    }

    .company-about__copy h2 {
        max-width: 320px;
        font-size: clamp(30px, 9vw, 34px);
    }

    .company-about__text {
        max-width: 320px;
    }

    .company-about__statement h2 {
        max-width: 340px;
        font-size: clamp(25px, 7.2vw, 30px);
    }
}
.news-archive-page {
    background:
        url("../images/pattern-cream.webp") center top / min(1640px, 122vw) auto repeat-y,
        #fff8ee;
}

.news-archive-page,
.news-archive-page * {
    min-width: 0;
}

.news-archive__hero h1,
.news-archive-card__title,
.news-archive-card__date,
.news-archive__empty,
.news-archive__pagination {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.news-archive__hero {
    position: relative;
    overflow: hidden;
    min-height: clamp(340px, 33vw, 430px);
    padding: calc(var(--header-height) + clamp(24px, 3vw, 40px)) 0 clamp(58px, 6vw, 86px);
    color: #fff;
    background: linear-gradient(180deg, rgba(255, 221, 176, .76) 0%, rgba(6, 47, 80, .80) 100%);
}

.news-archive__hero-inner {
    position: relative;
    z-index: 1;
}

.news-archive__hero h1 {
    max-width: 1120px;
    margin: 0;
    color: #fff;
    font-size: clamp(54px, 5.35vw, 78px);
    line-height: .96;
    letter-spacing: normal;
}

@media (min-width: 761px) {
    .news-archive__hero h1 {
        white-space: nowrap;
    }
}

.news-archive__list {
    position: relative;
    overflow: hidden;
    padding: clamp(76px, 7.8vw, 112px) 0 clamp(76px, 8vw, 116px);
    background: linear-gradient(180deg,
        rgba(244, 244, 244, .93) 0%,
        rgba(255, 248, 238, .74) 18%,
        rgba(255, 221, 176, .66) 50%,
        rgba(112, 138, 137, .46) 74%,
        rgba(50, 91, 112, .58) 100%);
}

.news-archive__list-inner {
    position: relative;
    z-index: 1;
}

.news-archive__grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: clamp(46px, 5.4vw, 82px) clamp(28px, 4vw, 76px);
    align-items: start;
}

.news-archive-card {
    display: grid;
    gap: 24px;
    grid-column: span 4;
    color: #1c2018;
}

.news-archive-card:nth-child(1) {
    grid-column: 1 / span 6;
}

.news-archive-card:nth-child(2) {
    grid-column: 8 / span 5;
}

.news-archive-card:nth-child(6n+6) {
    grid-column: 7 / span 6;
}

.news-archive-card:nth-child(6n+5) {
    grid-column: 1 / span 5;
    color: #fff;
}

.news-archive-card:nth-child(6n+6),
.news-archive-card:nth-child(6n+6) .news-archive-card__title a,
.news-archive-card:nth-child(6n+6) .news-archive-card__date,
.news-archive-card:nth-child(6n+5) .news-archive-card__title a,
.news-archive-card:nth-child(6n+5) .news-archive-card__date {
    color: #1c2018;
}

.news-archive-card__media {
    display: block;
    overflow: hidden;
    width: 100%;
    background: rgba(2, 36, 65, .08);
}

.news-archive-card__image,
.news-archive-card__placeholder {
    display: block;
    width: 100%;
    height: clamp(250px, 25vw, 332px);
    object-fit: cover;
    object-position: center;
    transition: transform .45s ease;
}

.news-archive-card:nth-child(3) .news-archive-card__image,
.news-archive-card:nth-child(4) .news-archive-card__image,
.news-archive-card:nth-child(5) .news-archive-card__image,
.news-archive-card:nth-child(3) .news-archive-card__placeholder,
.news-archive-card:nth-child(4) .news-archive-card__placeholder,
.news-archive-card:nth-child(5) .news-archive-card__placeholder {
    height: clamp(330px, 30vw, 420px);
}

.news-archive-card:nth-child(6n+6) .news-archive-card__image,
.news-archive-card:nth-child(6n+6) .news-archive-card__placeholder {
    height: clamp(300px, 29vw, 420px);
}

.news-archive-card__placeholder {
    background:
        linear-gradient(180deg, rgba(255, 221, 176, .46), rgba(2, 36, 65, .28)),
        url("../images/pattern-cream.webp") center / cover no-repeat;
}

.news-archive-card__media:hover .news-archive-card__image {
    transform: scale(1.025);
}

.news-archive-card__body {
    display: grid;
    gap: 14px;
}

.news-archive-card__title {
    max-width: 430px;
    margin: 0;
    color: inherit;
    font-size: clamp(22px, 1.65vw, 30px);
    line-height: .98;
    letter-spacing: normal;
}

.news-archive-card:nth-child(1) .news-archive-card__title,
.news-archive-card:nth-child(2) .news-archive-card__title,
.news-archive-card:nth-child(6n+6) .news-archive-card__title {
    max-width: 520px;
}

.news-archive-card__title a {
    color: inherit;
}

.news-archive-card__title a:hover {
    color: #0b543c;
}

.news-archive-card:nth-child(6n+5) .news-archive-card__title a:hover,
.news-archive-card:nth-child(6n+6) .news-archive-card__title a:hover {
    color: #0b543c;
}

.news-archive-card__date {
    color: rgba(2, 36, 65, .92);
    font-size: 15px;
    line-height: 1.25;
}

.news-archive__pagination {
    display: grid;
    gap: 24px;
    justify-items: center;
    margin-top: clamp(54px, 7vw, 96px);
}

.news-archive__load-more {
    display: none;
    align-items: center;
    justify-content: center;
    min-width: 210px;
    min-height: 48px;
    padding: 14px 28px;
    color: #fff;
    background: #0b543c;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.news-archive__pagination-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    align-items: center;
}

.news-archive__pagination-list .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    padding: 0 14px;
    color: #fff;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 999px;
    font-size: 14px;
    line-height: 1;
}

.news-archive__pagination-list .page-numbers.current {
    color: #022441;
    background: #ffddb0;
    border-color: #ffddb0;
}

.news-archive__empty {
    max-width: 740px;
    margin: 0 auto;
    padding: clamp(44px, 6vw, 72px);
    color: #022441;
    text-align: center;
    background: rgba(255, 255, 255, .72);
    border-radius: 24px;
}

.news-archive__empty h2 {
    margin: 0 0 16px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: 1;
}

.news-archive__empty p {
    margin: 0;
    color: rgba(2, 36, 65, .78);
    font-size: 17px;
    line-height: 1.4;
}

@media (max-width: 1040px) {
    .news-archive__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 44px 28px;
    }

    .news-archive-card,
    .news-archive-card:nth-child(1),
    .news-archive-card:nth-child(2),
    .news-archive-card:nth-child(6n+5),
    .news-archive-card:nth-child(6n+6) {
        grid-column: auto;
    }

    .news-archive-card__image,
    .news-archive-card__placeholder,
    .news-archive-card:nth-child(3) .news-archive-card__image,
    .news-archive-card:nth-child(4) .news-archive-card__image,
    .news-archive-card:nth-child(5) .news-archive-card__image,
    .news-archive-card:nth-child(6n+6) .news-archive-card__image,
    .news-archive-card:nth-child(3) .news-archive-card__placeholder,
    .news-archive-card:nth-child(4) .news-archive-card__placeholder,
    .news-archive-card:nth-child(5) .news-archive-card__placeholder,
    .news-archive-card:nth-child(6n+6) .news-archive-card__placeholder {
        height: clamp(230px, 32vw, 360px);
    }
}

@media (max-width: 760px) {
    .news-archive__hero {
        min-height: 300px;
        padding: calc(var(--header-height) + 20px) 0 48px;
    }

    .news-archive__hero h1 {
        max-width: 290px;
        font-size: clamp(36px, 13vw, 48px);
        line-height: .98;
        letter-spacing: normal;
    }

    .news-archive__list {
        padding: 34px 0 42px;
        background: linear-gradient(180deg,
            rgba(244, 244, 244, .90) 0%,
            rgba(255, 248, 238, .72) 24%,
            rgba(255, 221, 176, .62) 52%,
            rgba(38, 82, 104, .62) 100%);
    }

    .news-archive__grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .news-archive-card {
        gap: 12px;
    }

    .news-archive-card:nth-child(n+5),
    .news-archive-card:nth-child(n+5) .news-archive-card__title a,
    .news-archive-card:nth-child(n+5) .news-archive-card__date {
        color: #1c2018;
    }

    .news-archive-card__image,
    .news-archive-card__placeholder,
    .news-archive-card:nth-child(3) .news-archive-card__image,
    .news-archive-card:nth-child(4) .news-archive-card__image,
    .news-archive-card:nth-child(5) .news-archive-card__image,
    .news-archive-card:nth-child(6n+6) .news-archive-card__image,
    .news-archive-card:nth-child(3) .news-archive-card__placeholder,
    .news-archive-card:nth-child(4) .news-archive-card__placeholder,
    .news-archive-card:nth-child(5) .news-archive-card__placeholder,
    .news-archive-card:nth-child(6n+6) .news-archive-card__placeholder {
        height: clamp(174px, 58vw, 230px);
    }

    .news-archive-card__title {
        max-width: 315px;
        font-size: 20px;
        line-height: 1;
    }

    .news-archive-card__date {
        font-size: 11px;
    }

    .news-archive__pagination {
        margin-top: 28px;
    }

    .news-archive__load-more {
        display: inline-flex;
        width: 100%;
        min-height: 48px;
    }

    .news-archive__pagination-list {
        display: none;
    }
}
.article-detail-page {
    background: #f4f4f4;
}


/* Защита детальной страницы от разъезда сетки при длинных словах, URL и технических строках в контенте. */
.article-detail,
.article-detail * {
    min-width: 0;
}

.article-detail__intro p,
.article-content,
.article-content a,
.article-content__heading,
.article-content__text,
.article-content__quote,
.article-content__quote blockquote,
.article-content__media-text-copy,
.article-content__button,
.article-cta h2,
.article-cta__copy > p,
.article-cta__contacts,
.article-cta__contacts a,
.article-cta__form-card,
.article-cta__form-card .field__input,
.article-cta__form-card .custom-select__trigger {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.article-content img,
.article-content iframe,
.article-content video,
.article-content table,
.article-content pre,
.article-content code {
    max-width: 100%;
}

.article-content pre,
.article-content code {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.article-content table {
    display: block;
    overflow-x: auto;
    width: 100%;
    border-collapse: collapse;
}

.article-detail__hero {
    position: relative;
    overflow: hidden;
    min-height: clamp(292px, 31vw, 386px);
    padding: clamp(28px, 3.4vw, 52px) 0 clamp(60px, 8vw, 106px);
    color: #fff;
    background:
        linear-gradient(180deg, rgba(255, 221, 176, .74) 0%, rgba(6, 47, 80, .78) 100%),
        url("../images/pattern-cream.webp") center 42% / cover no-repeat;
}

.article-detail__hero-inner {
    position: relative;
    z-index: 1;
}

.article-detail__hero .article-detail__hero-title {
    max-width: min(780px, 72vw);
    margin: 0;
    color: #fff;
    font-size: clamp(58px, 6.4vw, 92px);
    line-height: .9;
    letter-spacing: normal;
    overflow-wrap: break-word;
    word-break: normal;
    text-wrap: balance;
    hyphens: auto;
}

.article-detail__hero .article-detail__hero-title--long {
    max-width: min(1120px, 82vw);
    font-size: clamp(50px, 5.15vw, 78px);
    line-height: .95;
    letter-spacing: normal;
}

.article-detail__hero .article-detail__hero-title--very-long {
    max-width: min(1180px, 84vw);
    font-size: clamp(42px, 4.35vw, 64px);
    line-height: 1;
    letter-spacing: normal;
}

.article-detail__intro {
    padding: clamp(72px, 7.5vw, 112px) 0 clamp(70px, 7.4vw, 108px);
    background: #f4f4f4;
}

.article-detail__intro-grid {
    display: grid;
    grid-template-columns: minmax(0, 960px);
    gap: 22px;
    justify-content: center;
    align-items: start;
}

.article-detail__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 18px;
    max-width: 960px;
    color: rgba(28, 32, 24, .62);
    font-size: 13px;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.article-detail__meta span {
    color: #0b543c;
    font-weight: 700;
}

.article-detail__intro p {
    max-width: 960px;
    margin: 0;
    color: #1c2018;
    font-family: var(--font-body);
    font-size: clamp(26px, 2.28vw, 36px);
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: normal;
}

.article-detail__cover {
    width: 100%;
    margin: 0;
    background: #0b0d0f;
}

.article-detail__cover-image {
    width: 100%;
    height: clamp(360px, 44vw, 620px);
    object-fit: cover;
    object-position: center;
}

.article-detail__body {
    padding: clamp(86px, 9vw, 128px) 0 clamp(94px, 10vw, 146px);
    background: #f4f4f4;
}

.article-detail__content-container {
    width: min(100% - 64px, 960px);
}

.article-content {
    color: #1c2018;
}

.article-content > *:first-child {
    margin-top: 0;
}

.article-content__heading {
    max-width: 900px;
    margin: 0 0 clamp(28px, 3vw, 42px);
    color: #1c2018;
    letter-spacing: normal;
}

.article-content__heading--h2 {
    font-size: clamp(42px, 4.3vw, 68px);
    line-height: .98;
}

.article-content__heading--h3 {
    font-size: clamp(30px, 3vw, 46px);
    line-height: 1.04;
}

.article-content__heading--h4 {
    font-size: clamp(22px, 2vw, 30px);
    line-height: 1.1;
}

.article-content__text {
    max-width: 900px;
    margin: 0 0 clamp(28px, 3vw, 42px);
    color: rgba(28, 32, 24, .86);
    font-size: clamp(17px, 1.25vw, 20px);
    line-height: 1.36;
}

.article-content__text p {
    margin-bottom: 1.18em;
}

.article-content__text ul,
.article-content__text ol {
    margin: 0 0 1.25em 1.25em;
    padding: 0;
}

.article-content__text li + li {
    margin-top: .45em;
}

.article-content__image,
.article-content__video,
.article-content__gallery,
.article-content__media-text,
.article-content__quote {
    margin: clamp(56px, 6.4vw, 94px) 0;
}

.article-content__image img,
.article-content__gallery img,
.article-content__quote-image img,
.article-content__media-text-image img {
    width: 100%;
    height: auto;
    border-radius: 10px;
    object-fit: cover;
}

.article-content__image figcaption,
.article-content__video figcaption {
    margin-top: 12px;
    color: rgba(28, 32, 24, .56);
    font-size: 13px;
    line-height: 1.35;
}

.article-content__image--wide {
    width: min(100%, 1060px);
    margin-left: 50%;
    transform: translateX(-50%);
}

.article-content__image--full {
    width: calc(100vw - 64px);
    max-width: 1180px;
    margin-left: 50%;
    transform: translateX(-50%);
}

.article-content__gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.article-content__gallery--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.article-content__gallery figure {
    margin: 0;
}

.article-content__gallery img {
    aspect-ratio: 1.18 / 1;
    object-fit: cover;
}

.article-content__quote {
    display: grid;
    gap: clamp(28px, 4vw, 62px);
    align-items: end;
}

.article-content__quote--with-image {
    grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
}

.article-content__quote blockquote {
    margin: 0;
    color: rgba(28, 32, 24, .92);
    font-size: clamp(18px, 1.35vw, 22px);
    line-height: 1.32;
}

.article-content__quote blockquote p {
    margin-bottom: 0;
}

.article-content__quote figcaption {
    margin-top: 14px;
    color: #0b543c;
    font-size: 14px;
    font-weight: 700;
}

.article-content__quote-image {
    margin: 0;
}

.article-content__quote-image img {
    aspect-ratio: 1.45 / 1;
}

.article-content__media-text {
    display: grid;
    grid-template-columns: minmax(240px, 360px) minmax(0, 1fr);
    gap: clamp(28px, 4vw, 58px);
    align-items: center;
}

.article-content__media-text--right .article-content__media-text-image {
    order: 2;
}

.article-content__media-text-image {
    margin: 0;
}

.article-content__media-text-copy h3 {
    margin-bottom: 18px;
    font-size: clamp(26px, 2.5vw, 40px);
    line-height: 1.04;
    letter-spacing: normal;
}

.article-content__media-text-copy {
    color: rgba(28, 32, 24, .86);
    font-size: clamp(17px, 1.25vw, 20px);
    line-height: 1.36;
}

.article-content__video {
    overflow: hidden;
    border-radius: 12px;
}

.article-content__video iframe,
.article-content__video video {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
}

.article-content__button-wrap {
    margin: clamp(32px, 4vw, 54px) 0;
}

.article-content__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 15px 26px;
    color: #fff;
    background: #0b543c;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.article-content__button--secondary {
    color: #082d4b;
    background: #e0bf9a;
}

/* Нижний CTA на детальной странице статьи использует общий обработчик формы темы. */
.article-cta {
    padding: clamp(72px, 8vw, 112px) 0 clamp(58px, 7vw, 88px);
    background: #ffddb0;
}

.article-cta__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(380px, 440px);
    grid-template-areas:
        "copy form"
        "contacts form";
    column-gap: clamp(60px, 10vw, 158px);
    row-gap: clamp(36px, 5vw, 72px);
    align-items: start;
}

.article-cta__copy {
    grid-area: copy;
    max-width: 680px;
}

.article-cta__tag {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 7px 22px;
    margin-bottom: 22px;
    color: rgba(2, 36, 65, .82);
    background: rgba(255, 255, 255, .58);
    border-radius: 999px;
    font-size: 12px;
    line-height: 1;
}

.article-cta h2 {
    max-width: 690px;
    margin: 0 0 26px;
    color: #022441;
    font-size: clamp(42px, 4.2vw, 66px);
    line-height: .94;
    letter-spacing: normal;
}

.article-cta__copy > p {
    max-width: 500px;
    margin: 0;
    color: rgba(2, 36, 65, .84);
    font-size: clamp(16px, 1.13vw, 18px);
    line-height: 1.32;
}

.article-cta__contacts {
    grid-area: contacts;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(170px, auto);
    gap: clamp(34px, 5vw, 72px);
    align-items: start;
    max-width: 620px;
}

.article-cta__contacts h3 {
    margin: 0 0 16px;
    color: #0b543c;
    font-size: clamp(20px, 1.6vw, 28px);
    line-height: 1.05;
    letter-spacing: normal;
}

.article-cta__contacts a {
    display: block;
    width: fit-content;
    color: #0b543c;
    border-bottom: 1px solid currentColor;
    font-size: clamp(17px, 1.35vw, 21px);
    line-height: 1.34;
}

.article-cta__contacts a + a {
    margin-top: 8px;
}

.social-links--article {
    display: flex;
    gap: 18px;
    align-items: center;
}

.social-links--article .social-links__item {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    color: #0b543c;
    border: 0;
}

.social-links--article .social-links__icon,
.social-links--article svg {
    width: 26px;
    height: 26px;
}

.article-cta__form-card {
    grid-area: form;
    width: 100%;
    padding: clamp(26px, 2.7vw, 38px) clamp(24px, 2.5vw, 34px) clamp(30px, 3vw, 40px);
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 22px 58px rgba(2, 36, 65, .08);
}

.article-cta__form-card h3 {
    margin: 0 0 20px;
    color: rgba(2, 36, 65, .82);
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.article-cta__form-card .contact-form {
    gap: 14px;
}

.article-cta__form-card .field {
    gap: 8px;
}

.article-cta__form-card .field__label {
    color: rgba(2, 36, 65, .62);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .04em;
}

.article-cta__form-card .field__input,
.article-cta__form-card .custom-select__trigger {
    min-height: 48px;
    padding: 12px 16px;
    font-size: 14px;
    border-color: rgba(2, 36, 65, .24);
    border-radius: 10px;
    background: #fff;
}

.article-cta__form-card .custom-select__trigger {
    padding-right: 44px;
}

.article-cta__form-card .consent {
    margin-top: 2px;
    color: rgba(2, 36, 65, .62);
    font-size: 11px;
    line-height: 1.38;
}

.article-cta__form-card .consent input {
    width: 15px;
    height: 15px;
    flex-basis: 15px;
    margin-top: 1px;
}

.article-cta__form-card .contact-form__submit {
    justify-self: center;
    min-width: 250px;
    min-height: 56px;
    margin-top: 10px;
    padding: 15px 24px 14px 26px;
    font-size: 13px;
    font-weight: 500;
}

@media (max-width: 1040px) {
    .article-detail__intro-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .article-detail__meta {
        display: flex;
        flex-wrap: wrap;
        max-width: none;
    }

    .article-cta__grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "copy"
            "form"
            "contacts";
        gap: 34px;
    }

    .article-cta__form-card {
        max-width: 520px;
    }
}

@media (max-width: 760px) {
    .article-detail__hero {
        min-height: 254px;
        padding: 18px 0 42px;
        background-position: center top;
    }

    .article-detail__hero .article-detail__hero-title {
        max-width: 300px;
        font-size: clamp(38px, 14vw, 52px);
        line-height: .96;
        letter-spacing: normal;
    }

    .article-detail__hero .article-detail__hero-title--long {
        max-width: min(100%, 350px);
        font-size: clamp(30px, 8.4vw, 34px);
        line-height: 1.03;
        overflow-wrap: normal;
        word-break: normal;
        hyphens: none;
    }

    .article-detail__hero .article-detail__hero-title--very-long {
        max-width: min(100%, 350px);
        font-size: clamp(28px, 8.6vw, 34px);
        line-height: 1.04;
        overflow-wrap: normal;
        word-break: normal;
        hyphens: none;
    }

    .article-detail__intro {
        padding: 34px 0 32px;
    }

    .article-detail__intro-grid {
        gap: 14px;
    }

    .article-detail__meta {
        gap: 6px 12px;
        font-size: 10px;
    }

    .article-detail__intro p {
        font-size: clamp(18px, 6vw, 24px);
        line-height: 1.12;
        letter-spacing: normal;
    }

    .article-detail__cover-image {
        height: clamp(220px, 73vw, 360px);
        object-position: center;
    }

    .article-detail__body {
        padding: 46px 0 58px;
    }

    .article-detail__content-container {
        width: min(100% - 28px, 960px);
    }

    .article-content__heading {
        margin-bottom: 18px;
    }

    .article-content__heading--h2 {
        font-size: clamp(28px, 9.2vw, 38px);
        line-height: 1.02;
    }

    .article-content__heading--h3 {
        font-size: clamp(23px, 7.4vw, 30px);
    }

    .article-content__heading--h4 {
        font-size: 20px;
    }

    .article-content__text,
    .article-content__media-text-copy,
    .article-content__quote blockquote {
        font-size: 14px;
        line-height: 1.28;
    }

    .article-content__image,
    .article-content__video,
    .article-content__gallery,
    .article-content__media-text,
    .article-content__quote {
        margin: 36px 0;
    }

    .article-content__image--wide,
    .article-content__image--full {
        width: 100%;
        margin-left: 0;
        transform: none;
    }

    .article-content__gallery,
    .article-content__gallery--three,
    .article-content__media-text,
    .article-content__quote--with-image {
        grid-template-columns: 1fr;
    }

    .article-content__gallery {
        gap: 10px;
    }

    .article-content__gallery--three {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .article-content__media-text--right .article-content__media-text-image {
        order: 0;
    }

    .article-content__quote-image img,
    .article-content__media-text-image img {
        aspect-ratio: 1.55 / 1;
    }

    .article-content__button {
        width: 100%;
        min-height: 50px;
        font-size: 12px;
    }

    .article-cta {
        padding: 54px 0 58px;
    }

    .article-cta__grid {
        gap: 24px;
    }

    .article-cta__tag {
        min-height: 24px;
        padding: 6px 14px;
        margin-bottom: 16px;
        font-size: 10px;
    }

    .article-cta h2 {
        max-width: 310px;
        margin-bottom: 18px;
        font-size: clamp(28px, 9vw, 38px);
        line-height: 1.02;
    }

    .article-cta__copy > p {
        max-width: 320px;
        font-size: 12px;
        line-height: 1.34;
    }

    .article-cta__form-card {
        padding: 22px 18px 24px;
        border-radius: 16px;
    }

    .article-cta__form-card h3 {
        margin-bottom: 16px;
        font-size: 11px;
    }

    .article-cta__form-card .field__label {
        font-size: 9px;
    }

    .article-cta__form-card .field__input,
    .article-cta__form-card .custom-select__trigger {
        min-height: 42px;
        padding: 10px 13px;
        font-size: 12px;
    }

    .article-cta__form-card .consent {
        font-size: 10px;
    }

    .article-cta__form-card .contact-form__submit {
        min-width: 210px;
        min-height: 48px;
        font-size: 11px;
    }

    .article-cta__contacts {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .article-cta__contacts h3 {
        margin-bottom: 10px;
        font-size: 16px;
    }

    .article-cta__contacts a {
        font-size: 14px;
    }

    .social-links--article {
        gap: 14px;
    }

    .social-links--article .social-links__item {
        width: 26px;
        height: 26px;
    }

    .social-links--article .social-links__icon,
    .social-links--article svg {
        width: 22px;
        height: 22px;
    }
}
/* Общая оболочка контактной страницы и защита от горизонтальных переполнений. */
.contacts-page,
.contacts-page * {
    min-width: 0;
    overflow-wrap: anywhere;
}

.contacts-page {
    color: #022441;
    background: #fff8ee;
}

/* Первый экран страницы: общий орнамент, градиент и контактная информация. */
.contacts-page-hero {
    position: relative;
    min-height: clamp(420px, 38vw, 560px);
    padding: calc(var(--header-height) + clamp(24px, 3vw, 40px)) 0 clamp(56px, 6vw, 92px);
    color: #fff;
    background-color: #022441;
    background-image:
        url("../images/happy-life-pattern.webp"),
        radial-gradient(70% 60% at 50% 0%, rgba(224, 191, 154, .48) 0%, rgba(224, 191, 154, .2) 42%, rgba(224, 191, 154, 0) 72%),
        linear-gradient(180deg, rgba(224, 191, 154, .88) 0%, rgba(153, 164, 160, .82) 40%, rgba(50, 84, 106, .9) 72%, rgba(2, 36, 65, .98) 100%);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-position: center top, center top, center top;
    background-size: cover, 100% 100%, 100% 100%;
}

.contacts-page-hero__inner {
    position: relative;
    z-index: 1;
}

.contacts-page-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 650px);
    gap: clamp(46px, 7vw, 120px);
    align-items: start;
}

.contacts-page-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(64px, 7vw, 110px);
    line-height: .94;
    letter-spacing: normal;
}

.contacts-page-hero__details {
    display: grid;
    gap: clamp(18px, 2vw, 26px);
    padding-top: clamp(0px, .7vw, 10px);
}

.contacts-page-hero__detail {
    display: grid;
    gap: 8px;
}

.contacts-page-hero__detail a,
.contacts-page-hero__detail strong {
    display: block;
    color: #fff;
    font-size: clamp(26px, 2.9vw, 42px);
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: normal;
}

.contacts-page-hero__detail span {
    color: #e0bf9a;
    font-size: clamp(15px, 1.2vw, 19px);
    line-height: 1.2;
}

/* Карта: интерактивный блок с fallback-iframe и точками офиса/объектов. */
.contacts-map {
    position: relative;
    height: clamp(420px, 43vw, 610px);
    overflow: hidden;
    background: #e8eee9;
}

.contacts-map__canvas,
.contacts-map__fallback,
.contacts-map .happy-life__map-instance {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.contacts-map__canvas::before {
    position: absolute;
    inset: 0;
    z-index: 2;
    content: "";
    background:
        linear-gradient(90deg, rgba(2, 36, 65, .18), rgba(2, 36, 65, 0) 38%, rgba(2, 36, 65, .06) 100%),
        linear-gradient(0deg, rgba(2, 36, 65, .14), rgba(2, 36, 65, 0) 44%);
    pointer-events: none;
}

.contacts-map__card {
    position: absolute;
    left: max(24px, calc((100vw - 1180px) / 2));
    bottom: clamp(22px, 3.2vw, 46px);
    z-index: 3;
    display: grid;
    width: min(360px, calc(100% - 48px));
    padding: clamp(18px, 2vw, 24px);
    color: #fff;
    background: rgba(2, 36, 65, .92);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 16px;
    box-shadow: 0 26px 80px rgba(2, 36, 65, .26);
    backdrop-filter: blur(16px);
}

.contacts-map__kicker {
    margin-bottom: 12px;
    color: rgba(255, 255, 255, .62);
    font-family: var(--font-heading);
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.contacts-map__card strong {
    margin-bottom: 16px;
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(24px, 2.2vw, 34px);
    font-weight: 700;
    line-height: .98;
    letter-spacing: 0;
}

.contacts-map__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.contacts-map__legend li {
    display: inline-flex;
    min-height: 28px;
    padding: 7px 10px;
    align-items: center;
    gap: 7px;
    color: rgba(255, 255, 255, .82);
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.contacts-map__dot {
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
}

.contacts-map__dot--vida {
    background: #ffd8a2;
}

.contacts-map__dot--office {
    background: #ff9f43;
}

.contacts-map__dot--project {
    background: #72d490;
}

.contacts-map .vida-yandex-logo-pin {
    z-index: 2;
}

.contacts-map .vida-yandex-poi-pin--office {
    color: #fff;
    background: rgba(222, 113, 34, .96);
}

.contacts-map .vida-yandex-poi-pin--project {
    color: #fff;
    background: rgba(43, 143, 74, .96);
}

.contacts-map .vida-yandex-poi-pin--office .vida-yandex-poi-pin__abbr,
.contacts-map .vida-yandex-poi-pin--project .vida-yandex-poi-pin__abbr {
    color: inherit;
    background: rgba(255, 255, 255, .18);
}

/* Сотрудники: горизонтальная витрина с fallback-карточками до подключения плагина сотрудников. */
.contacts-team {
    position: relative;
    overflow: hidden;
    padding: clamp(78px, 8vw, 124px) 0 clamp(72px, 8vw, 120px);
    color: #fff;
    background-color: #fff8ee;
    background-image: url("../images/happy-life-pattern.webp");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% auto;
}

.contacts-team__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 480px);
    gap: 42px;
    align-items: start;
    margin-bottom: clamp(44px, 6vw, 82px);
}

.contacts-team h2 {
    margin: 0;
    color: #022441;
    font-size: clamp(42px, 4.5vw, 72px);
    line-height: .94;
    letter-spacing: normal;
}

.contacts-team__head p {
    max-width: 440px;
    margin: 0 0 0 auto;
    color: rgba(2, 36, 65, .88);
    font-size: clamp(20px, 1.7vw, 30px);
    line-height: 1.15;
    text-align: right;
}

.contacts-team__viewport {
    display: grid;
    grid-template-columns: none;
    grid-auto-columns: clamp(200px, 17vw, 250px);
    grid-auto-flow: column;
    justify-content: start;
    gap: clamp(38px, 4.8vw, 76px);
    margin-inline: auto;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x proximity;
    scrollbar-color: rgba(255, 255, 255, .44) transparent;
}

.contacts-team__viewport::-webkit-scrollbar {
    height: 8px;
}

.contacts-team__viewport::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, .14);
    border-radius: 999px;
}

.contacts-team__viewport::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .46);
    border-radius: 999px;
}

.contacts-team-card {
    min-width: 0;
    text-align: center;
    scroll-snap-align: start;
}

.contacts-team-card__photo {
    width: min(100%, 250px);
    aspect-ratio: 1;
    margin: 0 auto clamp(20px, 2.2vw, 30px);
    overflow: hidden;
    background: #d9d9d9;
    border-radius: 50%;
}

.contacts-team-card__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contacts-team-card h3 {
    margin: 0 0 10px;
    color: #fff;
    font-size: clamp(22px, 2vw, 32px);
    line-height: 1.02;
    letter-spacing: normal;
}

.contacts-team-card p {
    max-width: 230px;
    margin: 0 auto;
    color: #fff;
    font-size: clamp(15px, 1.24vw, 19px);
    font-weight: 700;
    line-height: 1.12;
}

@media (max-width: 1040px) {
    .contacts-page-hero__grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .contacts-page-hero__details {
        max-width: 560px;
    }

    .contacts-team__head {
        grid-template-columns: 1fr;
    }

    .contacts-team__head p {
        margin-left: 0;
        text-align: left;
    }
}

@media (max-width: 760px) {
    .contacts-page-hero {
        min-height: 456px;
        padding: calc(var(--header-height) + 14px) 0 38px;
        background-position: center top, center top, center top;
        background-size: auto 100%, 100% 100%, 100% 100%;
    }

    .contacts-page-hero h1 {
        font-size: clamp(42px, 14vw, 54px);
        line-height: .96;
    }

    .contacts-page-hero__grid {
        gap: 26px;
    }

    .contacts-page-hero__details {
        gap: 17px;
    }

    .contacts-page-hero__detail {
        gap: 6px;
    }

    .contacts-page-hero__detail a,
    .contacts-page-hero__detail strong {
        max-width: 310px;
        font-size: clamp(18px, 6.2vw, 25px);
        line-height: 1.06;
    }

    .contacts-page-hero__detail span {
        font-size: 12px;
    }

    .contacts-map {
        height: 366px;
    }

    .contacts-map__card {
        left: 18px;
        right: 18px;
        bottom: 18px;
        width: auto;
        padding: 18px;
        border-radius: 14px;
    }

    .contacts-map__card strong {
        font-size: 24px;
    }

    .contacts-team {
        padding: 50px 0 50px;
        background-size: auto 100%, 100% 100%, 100% 100%;
    }

    .contacts-team__head {
        gap: 14px;
        margin-bottom: 28px;
    }

    .contacts-team h2 {
        font-size: clamp(32px, 10vw, 42px);
        line-height: 1;
    }

    .contacts-team__head p {
        max-width: 250px;
        color: #022441;
        font-size: 14px;
        line-height: 1.25;
    }

    .contacts-team__viewport {
        grid-template-columns: none;
        grid-auto-columns: 118px;
        grid-auto-flow: column;
        justify-content: start;
        gap: 28px;
        width: 100%;
        overflow-x: auto;
        padding: 0 18px 10px;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .contacts-team-card {
        scroll-snap-align: start;
    }

    .contacts-team-card__photo {
        width: 118px;
        margin-bottom: 16px;
    }

    .contacts-team-card h3 {
        margin-bottom: 8px;
        font-size: 16px;
        line-height: 1.05;
    }

    .contacts-team-card p {
        max-width: 116px;
        font-size: 11px;
        line-height: 1.1;
    }
}

/* Contacts page final layout pass: designer desktop/mobile compositions. */

.contacts-page .contacts-page-hero h1 {
    overflow-wrap: normal;
    word-break: normal;
}

.contacts-page .contacts-map {
    height: clamp(430px, 43vw, 610px);
}

.contacts-page .contacts-team {
    padding-bottom: clamp(64px, 6.5vw, 96px);
}

.contacts-page .contacts-team::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        radial-gradient(52% 42% at 50% 30%, rgba(255, 190, 103, .42) 0%, rgba(255, 209, 144, .3) 36%, rgba(255, 248, 238, 0) 72%),
        linear-gradient(180deg, rgba(255, 248, 238, .74) 0%, rgba(250, 222, 184, .48) 25%, rgba(2, 36, 65, .72) 67%, #022441 100%);
    pointer-events: none;
}

.contacts-page .contacts-team > * {
    position: relative;
    z-index: 1;
}

.contacts-page .contacts-team-card__photo {
    border: 0;
}

.contacts-page .contacts-team-card__photo:empty::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #d9d9d9;
}

.contacts-page .contacts__grid--split-details {
    grid-template-areas:
        "copy form"
        "details form";
    row-gap: 34px;
}

.contacts-page .contacts__grid--split-details .contacts__copy {
    grid-area: copy;
}

.contacts-page .contacts__grid--split-details .contacts__form-card {
    grid-area: form;
}

.contacts-page .contacts__grid--split-details .contacts__details--split {
    grid-area: details;
    margin-top: 0;
}

@media (max-width: 760px) {

    .contacts-page .contacts-map {
        height: 370px;
    }

    .contacts-page .contacts-team {
        padding-top: 48px;
        padding-bottom: 42px;
        background-size: auto 100%;
    }

    .contacts-page .contacts-team::before {
        inset: auto 0 0;
        height: 55%;
        background: linear-gradient(180deg, rgba(2, 36, 65, 0) 0%, rgba(2, 36, 65, .92) 58%, #022441 100%);
    }

    .contacts-page .contacts-team__viewport {
        grid-auto-columns: 120px;
        grid-auto-flow: column;
        justify-content: start;
        overflow-x: auto;
        padding-inline: 16px;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .contacts-page .contacts-team__viewport::-webkit-scrollbar {
        display: none;
    }

    .contacts-page .contacts-team-card {
        scroll-snap-align: start;
    }

    .contacts-page .contacts.section--accent {
        padding-top: 48px;
    }

    .contacts-page .contacts__grid--split-details {
        grid-template-areas:
            "copy"
            "form"
            "details";
        gap: 28px;
    }

    .contacts-page .contacts__grid--split-details .contacts__details--split {
        grid-template-columns: 1fr;
        gap: 26px;
        margin-top: 0;
    }

    .contacts-page .contacts__grid--split-details .contacts__form-card {
        max-width: none;
    }
}

@media (max-width: 380px) {
    .contacts-page .contacts-page-hero__detail a,
    .contacts-page .contacts-page-hero__detail strong {
        max-width: 250px;
    }

    .contacts-page .contacts__grid--split-details .contacts__form-card {
        padding: 16px;
    }
}
.hero.is-animated .hero__word--balance {
    animation: vida-word-stay-left 1s .35s cubic-bezier(.22,.61,.36,1) forwards;
}

.hero.is-animated .hero__word--innovation {
    animation: vida-word-stay-center .62s 2.44s cubic-bezier(.22,.61,.36,1) forwards;
}

.hero.is-animated .hero__word--security {
    animation: vida-word-stay-right 1s 1.38s cubic-bezier(.22,.61,.36,1) forwards;
}

.hero.is-animated .hero__copy {
    animation-delay: 3.28s;
}

.hero.is-animated .hero__button {
    animation-delay: 3.54s;
}

@keyframes vida-word-stay-center {
    0% { left: 50%; opacity: 0; transform: translate(-50%, -34%) scale(.985); }
    30% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
    100% { left: 50%; opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

.contacts-team::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: clamp(72px, 8vw, 120px);
    left: 0;
    z-index: 1;
    height: 220px;
    pointer-events: none;
    background: linear-gradient(90deg, #fff8ee 0%, rgba(255, 248, 238, 0) 10%, rgba(255, 248, 238, 0) 90%, #fff8ee 100%);
    opacity: .78;
}

.contacts-team__head,
.contacts-team__viewport {
    position: relative;
    z-index: 2;
}

.contacts-team__viewport {
    width: 100%;
    padding: 0 max(32px, calc((100vw - 1420px) / 2 + 32px)) 2px;
    scroll-padding-inline: max(32px, calc((100vw - 1420px) / 2 + 32px));
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.contacts-team__viewport::-webkit-scrollbar {
    display: none;
}

.contacts-team-card {
    transition: transform .24s ease;
}

.contacts-team-card:hover {
    transform: translateY(-6px);
}

.contacts-page .contacts-team::after {
    display: none !important;
}

@media (max-width: 760px) {
    .hero__timeline {
        top: 15%;
        width: min(100% - 32px, 520px);
        height: 120px;
    }

    .hero.is-animated .hero__word--balance,
    .hero.is-animated .hero__word--innovation,
    .hero.is-animated .hero__word--security {
        left: 50%;
        animation: mobile-word-in .56s cubic-bezier(.22,.61,.36,1) forwards;
    }

    .hero__word--balance { top: 0; }
    .hero__word--innovation { top: 40px; }
    .hero__word--security { top: 80px; }
    .hero.is-animated .hero__word--balance { animation-delay: .3s; }
    .hero.is-animated .hero__word--innovation { animation-delay: .58s; }
    .hero.is-animated .hero__word--security { animation-delay: .86s; }

    .contacts-team::after {
        display: none;
    }

    .contacts-team__viewport {
        padding-inline: 24px;
        scroll-padding-inline: 24px;
    }
}
.flat-mortgage__grid--calculator {
    align-items: center;
}

.flat-mortgage__intro p {
    max-width: 520px;
    margin: -22px 0 24px;
    color: rgba(2, 36, 65, .72);
    font-size: clamp(16px, 1.25vw, 19px);
    line-height: 1.36;
}

.flat-mortgage__base-price {
    display: inline-flex;
    padding: 10px 14px;
    color: #022441;
    background: rgba(224, 191, 154, .28);
    border: 1px solid rgba(224, 191, 154, .48);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
}

.flat-mortgage__calculator .vida-mortgage-demo {
    max-width: none;
    margin: 0;
}

.flat-mortgage__calculator .vida-demo-card {
    border: 1px solid rgba(224, 191, 154, .58);
    border-radius: 6px;
    box-shadow: 0 26px 70px rgba(2, 36, 65, .12);
}

.flat-mortgage__calculator .vida-demo-card h2 {
    margin: 0 0 10px;
    font-size: clamp(28px, 2.3vw, 38px);
    line-height: 1;
}

.flat-mortgage__calculator .vida-demo-card > p {
    margin: 0 0 24px;
    color: rgba(2, 36, 65, .68);
}

.flat-mortgage__calculator .vida-demo-card label {
    display: grid;
    align-items: center;
    margin: 14px 0;
    color: rgba(2, 36, 65, .84);
    font-size: 14px;
    font-weight: 700;
}

.flat-mortgage__calculator .vida-demo-card input,
.flat-mortgage__calculator .vida-demo-card select {
    min-height: 44px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid rgba(2, 36, 65, .16);
    background: #fff;
}

.flat-mortgage__calculator .vida-demo-card button {
    width: 100%;
    min-height: 48px;
    margin-top: 14px;
    border-radius: 0;
    background: #5fa24f;
}

.flat-mortgage__calculator .vida-demo-result {
    margin-top: 18px;
    border-radius: 4px;
    background: rgba(95, 162, 79, .12);
}

@media (max-width: 980px) {
    .flat-mortgage__grid--calculator {
        grid-template-columns: 1fr;
    }

    .flat-mortgage__intro p {
        margin-top: -18px;
    }
}

@media (max-width: 600px) {
    .flat-mortgage__calculator .vida-demo-card label {
        grid-template-columns: 1fr;
        gap: 7px;
    }
}
.agents-page {
    background: #fff8ee;
}

.agents-hero {
    position: relative;
    min-height: min(760px, 82svh);
    display: grid;
    overflow: hidden;
    color: #fff;
    padding: calc(var(--header-height) + 46px) 0 clamp(54px, 7vw, 96px);
}

.agents-hero > img,
.agents-hero__overlay {
    position: absolute;
    inset: 0;
}

.agents-hero > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.agents-hero__content {
    position: relative;
    z-index: 1;
}

.agents-hero .breadcrumbs {
    margin-bottom: clamp(34px, 4vw, 56px);
    color: rgba(255, 255, 255, .72);
}

.agents-hero h1 {
    margin: 0;
    line-height: .88;
}

.agents-hero p {
    max-width: 640px;
    margin: 24px 0 0;
    color: rgba(255, 255, 255, .84);
    font-size: clamp(18px, 1.45vw, 23px);
    line-height: 1.32;
}

.agents-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.button--light {
    color: #fff;
    border-color: rgba(255, 255, 255, .48);
    background: rgba(255, 255, 255, .12);
}

.agents-benefits__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.agents-benefit {
    padding: clamp(22px, 2.4vw, 32px);
    color: #022441;
    background: #fff;
    border: 1px solid rgba(224, 191, 154, .42);
    border-radius: 6px;
    box-shadow: 0 18px 42px rgba(2, 36, 65, .08);
}

.agents-benefit span {
    display: block;
    color: #5fa24f;
    font-family: var(--font-body);
    font-size: 28px;
}

.agents-benefit h3 {
    margin: 0 0 14px;
    font-size: clamp(22px, 1.8vw, 28px);
    line-height: 1.02;
}

.agents-benefit p {
    margin: 0;
    color: rgba(2, 36, 65, .76);
    line-height: 1.38;
}

.agents-flow {
    color: #fff;
    background: #022441;
}

.agents-flow .eyebrow,
.agents-flow h2 {
    color: #fff;
}

.agents-flow__grid {
    display: grid;
    grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr);
    gap: clamp(40px, 6vw, 90px);
    align-items: start;
}

.agents-flow__grid h2 {
    max-width: 560px;
    margin: 0;
    font-size: clamp(42px, 4.4vw, 68px);
    line-height: .94;
}

.agents-flow__steps {
    display: grid;
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: agents-step;
}

.agents-flow__steps li {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .16);
    counter-increment: agents-step;
}

.agents-flow__steps li::before {
    content: counter(agents-step, decimal-leading-zero);
    color: #e0bf9a;
    font-family: var(--font-body);
    font-size: 28px;
    line-height: 1;
}

.agents-flow__steps strong,
.agents-flow__steps span {
    grid-column: 2;
}

.agents-flow__steps strong {
    color: #fff;
    font-size: 22px;
}

.agents-flow__steps span {
    color: rgba(255, 255, 255, .72);
    line-height: 1.36;
}

.agents-tools__grid,
.agents-form-section__grid {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(360px, 1.05fr);
    gap: clamp(36px, 5vw, 78px);
    align-items: center;
}

.agents-tools__media {
    overflow: hidden;
    border-radius: 6px;
}

.agents-tools__media img {
    width: 100%;
    aspect-ratio: 1.22;
    object-fit: cover;
}

.agents-tools__copy h2,
.agents-form-section h2 {
    margin: 0 0 20px;
    font-size: clamp(40px, 4.3vw, 66px);
    line-height: .96;
}

.agents-tools__copy p,
.agents-form-section p {
    max-width: 560px;
    margin: 0 0 24px;
    color: rgba(2, 36, 65, .72);
    font-size: 18px;
    line-height: 1.38;
}

.agents-tools__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.agents-form {
    display: grid;
    background: #fff;
    border: 1px solid rgba(224, 191, 154, .48);
}

.agents-form label {
    position: relative;
    display: grid;
    gap: 8px;
    color: rgba(2, 36, 65, .72);
    font-size: 13px;
    font-weight: 700;
}

.agents-form input,
.agents-form textarea {
    width: 100%;
    min-height: 46px;
    padding: 11px 13px;
    color: #022441;
    background: #fff;
    border: 1px solid rgba(2, 36, 65, .16);
    border-radius: 0;
    outline: none;
}

.agents-form input:focus,
.agents-form textarea:focus {
    border-color: #5fa24f;
}

.agents-form label.is-invalid input,
.agents-form label.is-invalid textarea {
    border-color: #b42318;
    box-shadow: 0 0 0 3px rgba(180, 35, 24, .1);
}

.agents-city-list {
    position: absolute;
    right: 0;
    left: 0;
    z-index: 20;
    max-height: 220px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid rgba(2, 36, 65, .14);
}

.agents-city-list button {
    display: block;
    width: 100%;
    padding: 9px 10px;
    color: #022441;
    text-align: left;
    background: transparent;
    border: 0;
    cursor: pointer;
}

.agents-city-list button:hover,
.agents-city-list button.is-active {
    color: #0b543c;
    background: rgba(95, 162, 79, .12);
}

.agents-form .agents-form__trap {
    position: absolute !important;
    top: 0;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    pointer-events: none;
}

.agents-form__consent {
    display: flex !important;
    font-weight: 400 !important;
}

.agents-form__consent input {
    width: 18px;
    min-height: 18px;
    margin-top: 2px;
}

.agents-form-alert {
    padding: 14px 16px;
    margin-top: 0;
    font-weight: 700;
}

.agents-form-alert[hidden] {
    display: none !important;
}

.agents-form-alert ul {
    margin: 8px 0 0;
    padding-left: 18px;
}

.agents-form-alert--success {
    color: #145539;
    background: rgba(95, 162, 79, .14);
    border: 1px solid rgba(95, 162, 79, .32);
}

.agents-form-alert--error {
    color: #8a1f16;
    background: rgba(180, 35, 24, .1);
    border: 1px solid rgba(180, 35, 24, .24);
}

.agents-form__submit[disabled] {
    cursor: wait;
    opacity: .72;
}

@media (max-width: 980px) {
    .agents-benefits__grid,
    .agents-flow__grid,
    .agents-tools__grid,
    .agents-form-section__grid {
        grid-template-columns: 1fr;
    }

    .agents-benefits__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .agents-hero {
        min-height: 680px;
    }

    .agents-benefits__grid,
    .agents-form {
        grid-template-columns: 1fr;
    }

    .agents-flow__steps li {
        grid-template-columns: 44px minmax(0, 1fr);
    }
}

.site-nav__favorite-count {
    display: inline-flex;
    min-width: 19px;
    height: 19px;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
    color: var(--vida-blue);
    background: var(--vida-white);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
}

.favorite-toggle {
    position: relative;
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 12px 18px;
    overflow: visible;
    color: var(--vida-blue);
    background: rgba(255, 255, 255, .94);
    border: 1px solid rgba(6, 47, 80, .12);
    border-radius: 999px;
    box-shadow: 0 12px 30px rgba(6, 47, 80, .12);
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    isolation: isolate;
    transform-origin: center;
    transition:
        color .2s ease,
        background .2s ease,
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;
}

.favorite-toggle:hover,
.favorite-toggle:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(6, 47, 80, .18);
}

.favorite-toggle__icon {
    position: relative;
    z-index: 1;
    display: inline-grid;
    width: 18px;
    height: 18px;
    place-items: center;
    line-height: 1;
}

.favorite-toggle__icon::before {
    content: "\2661";
    font-size: 20px;
    line-height: 1;
}

.favorite-toggle__label {
    position: relative;
    z-index: 1;
    display: inline-block;
    white-space: nowrap;
}

.favorite-toggle.is-active {
    color: #fff;
    background: linear-gradient(135deg, #ff7a45 0%, #e7683d 56%, #d95631 100%);
    border-color: #e7683d;
    box-shadow: 0 18px 38px rgba(231, 104, 61, .28);
}

.favorite-toggle.is-active .favorite-toggle__icon::before {
    content: "\2665";
}

.favorite-toggle.is-just-added {
    animation: vida-favorite-pop .7s cubic-bezier(.18, .89, .32, 1.28);
}

.favorite-toggle.is-just-added .favorite-toggle__icon {
    animation: vida-favorite-heart .72s ease-out;
}

.favorite-toggle.is-just-added::before,
.favorite-toggle.is-just-added::after {
    position: absolute;
    content: "";
    pointer-events: none;
    border-radius: inherit;
    z-index: 0;
}

.favorite-toggle.is-just-added::before {
    inset: -8px;
    border: 2px solid rgba(231, 104, 61, .34);
    animation: vida-favorite-ring .7s ease-out;
}

.favorite-toggle.is-just-added::after {
    left: 50%;
    top: 50%;
    width: 8px;
    height: 8px;
    background: #ffd2ba;
    box-shadow:
        0 -34px 0 rgba(255, 122, 69, .9),
        26px -22px 0 rgba(255, 210, 186, .95),
        34px 0 0 rgba(255, 122, 69, .8),
        22px 26px 0 rgba(255, 210, 186, .85),
        0 34px 0 rgba(255, 122, 69, .75),
        -26px 22px 0 rgba(255, 210, 186, .9),
        -34px 0 0 rgba(255, 122, 69, .8),
        -22px -26px 0 rgba(255, 210, 186, .85);
    transform: translate(-50%, -50%) scale(.2);
    animation: vida-favorite-sparks .72s ease-out;
}

.apartment-card {
    position: relative;
}

.apartment-card__favorite {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 4;
    width: 46px;
    height: 46px;
    min-height: 46px;
    padding: 0;
}

.apartment-card__favorite .favorite-toggle__label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.flat-hero__favorite {
    min-height: 54px;
    min-width: 164px;
    padding-inline: 22px;
    flex-shrink: 0;
    color: var(--vida-blue);
    background: rgba(255, 255, 255, .76);
    font-size: 14px;
    letter-spacing: .01em;
}

.flat-hero__favorite.is-active {
    color: #fff;
    background: linear-gradient(135deg, #ff7a45 0%, #e7683d 58%, #d95631 100%);
    border-color: rgba(231, 104, 61, .94);
}

@keyframes vida-favorite-pop {
    0% {
        transform: scale(1);
    }

    34% {
        transform: scale(1.1);
    }

    62% {
        transform: scale(.97);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes vida-favorite-heart {
    0% {
        transform: scale(.82) rotate(-8deg);
    }

    42% {
        transform: scale(1.38) rotate(7deg);
    }

    100% {
        transform: scale(1) rotate(0);
    }
}

@keyframes vida-favorite-ring {
    0% {
        opacity: .7;
        transform: scale(.82);
    }

    100% {
        opacity: 0;
        transform: scale(1.45);
    }
}

@keyframes vida-favorite-sparks {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(.15) rotate(0deg);
    }

    28% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(1.08) rotate(28deg);
    }
}

.favorites-hero {
    padding-top: calc(var(--header-height) + clamp(42px, 5vw, 76px));
    padding-bottom: clamp(34px, 5vw, 70px);
}

.favorites-hero__inner {
    display: grid;
    gap: clamp(26px, 4vw, 64px);
}

.favorites-hero .breadcrumbs {
    margin-bottom: 0;
}

.favorites-hero__copy h1 {
    margin: 0;
    color: var(--vida-blue);
}

.favorites-hero__copy p:last-child {
    margin: 18px 0 0;
    color: rgba(6, 47, 80, .68);
    font-size: clamp(16px, 1.5vw, 19px);
}

.favorites-list {
    padding-top: 0;
}

.favorites-empty {
    display: grid;
    min-height: 320px;
    place-items: center;
    padding: clamp(34px, 6vw, 76px);
    text-align: center;
    background: rgba(255, 255, 255, .62);
    border: 1px solid rgba(6, 47, 80, .08);
}

.favorites-empty h2 {
    margin: 0;
    color: var(--vida-blue);
    font-size: clamp(30px, 4vw, 48px);
}

.favorites-empty p {
    max-width: 520px;
    margin: 12px auto 24px;
    color: rgba(6, 47, 80, .66);
}

.favorites-grid {
    align-items: stretch;
}

@media (max-width: 991px) {
    .favorites-hero__inner {
        align-items: start;
    }
}

@media (max-width: 640px) {
    .flat-hero__favorite {
        width: 54px;
        min-width: 54px;
        padding: 0;
    }

    .flat-hero__favorite .favorite-toggle__label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }

    .favorites-empty {
        min-height: 280px;
        border-radius: 14px;
    }
}
.agents-hero {
    min-height: clamp(640px, 78svh, 820px);
    align-items: center;
}

.agents-hero__overlay {
    background:
        linear-gradient(90deg, rgba(2, 36, 65, .92) 0%, rgba(2, 36, 65, .7) 48%, rgba(2, 36, 65, .32) 100%),
        linear-gradient(180deg, rgba(2, 36, 65, .18), rgba(2, 36, 65, .58));
}

.agents-hero .eyebrow {
    margin: 0 0 14px;
    color: #e0bf9a;
}

.agents-hero h1 {
    max-width: 900px;
    font-size: clamp(54px, 7vw, 108px);
}

.agents-hero p:not(.eyebrow) {
    max-width: 690px;
}

.agents-benefits__grid {
    gap: clamp(14px, 1.6vw, 22px);
}

.agents-benefit {
    min-height: 260px;
    display: grid;
    grid-template-rows: auto auto 1fr;
    border-color: rgba(224, 191, 154, .52);
}

.agents-benefit span {
    margin-bottom: 34px;
}

.agents-flow__copy p {
    max-width: 480px;
    margin: 18px 0 0;
    color: rgba(255, 255, 255, .74);
    font-size: 18px;
    line-height: 1.45;
}

.agents-flow__steps li {
    min-height: 104px;
    align-items: start;
    padding: 24px 0;
}

.agents-tools__grid {
    grid-template-columns: minmax(0, 1fr) minmax(360px, .82fr);
}

.agents-tools__media {
    box-shadow: 0 22px 54px rgba(2, 36, 65, .11);
}

.agents-form-section__grid {
    align-items: start;
}

.agents-form {
    align-self: start;
}

.agents-form small {
    margin-top: -2px;
}

.favorites-loading,
.favorites-empty {
    min-height: 320px;
    padding: clamp(34px, 6vw, 76px);
    text-align: center;
    background: rgba(255, 255, 255, .66);
    border: 1px solid rgba(6, 47, 80, .08);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(6, 47, 80, .06);
}

.favorites-loading {
    display: grid;
    place-items: center;
    gap: 14px;
    color: rgba(6, 47, 80, .68);
}

.favorites-loading span {
    width: 34px;
    height: 34px;
    border: 3px solid rgba(6, 47, 80, .14);
    border-top-color: #5fa24f;
    border-radius: 50%;
    animation: vida-favorites-spin .8s linear infinite;
}

.favorites-loading p {
    margin: 0;
    font-weight: 800;
}

.favorites-empty {
    border-radius: 8px;
}

.favorites-page.is-ready .favorites-loading {
    display: none;
}

.favorites-loading[hidden],
.favorites-empty[hidden],
.favorites-grid[hidden] {
    display: none !important;
}

.favorite-card {
    min-height: 100%;
}

.favorite-card .apartment-card__button {
    margin-top: auto;
}

@keyframes vida-favorites-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 980px) {
    .agents-hero {
        min-height: 620px;
    }

    .agents-tools__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .agents-hero h1 {
        font-size: clamp(44px, 13vw, 64px);
    }

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

    .agents-tools__actions .button {
        width: 100%;
    }

    .agents-benefit {
        min-height: 0;
    }

    .favorites-loading,
    .favorites-empty {
        min-height: 280px;
        border-radius: 8px;
    }
}
.hero__word {
    font-size: clamp(20px, 1.9vw, 32px);
    letter-spacing: 0;
}

@keyframes vida-word-stay-left {
    0% { left: 50%; opacity: 0; transform: translate(-50%, -36%) scale(.985); }
    24% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
    42% { left: 50%; opacity: 1; }
    100% { left: clamp(88px, 12vw, 168px); opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

@keyframes vida-word-stay-right {
    0% { left: 50%; opacity: 0; transform: translate(-50%, -36%) scale(.985); }
    24% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
    42% { left: 50%; opacity: 1; }
    100% { left: calc(100% - clamp(92px, 12vw, 174px)); opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

.purchase-mortgage-tabs {
    gap: 1px;
    padding: 1px;
    overflow: hidden;
    background: rgba(15, 93, 69, .86);
    border-color: rgba(15, 93, 69, .72);
    border-radius: 8px;
}

.purchase-mortgage-tabs__item,
.purchase-mortgage-tabs__item:nth-child(even),
.purchase-mortgage-tabs__item:nth-last-child(-n + 2) {
    min-width: 0;
}

.purchase-mortgage-tabs__item {
    min-height: 46px;
    padding: 11px 12px;
    overflow-wrap: anywhere;
    background: #f7f7f5;
    font-size: 13px;
    line-height: 1.18;
    text-align: center;
}

.purchase-calculator,
.purchase-calculator * {
    box-sizing: border-box;
}

.purchase-calculator__programs {
    align-items: stretch;
}

.purchase-calculator__chip {
    max-width: 100%;
    min-height: 32px;
    overflow-wrap: anywhere;
    white-space: normal;
    line-height: 1.15;
    text-align: left;
}

.purchase-calculator__field > span {
    line-height: 1.24;
    white-space: normal;
}

.purchase-calculator__field input[type="text"] {
    min-width: 0;
}

.purchase-calculator__result div {
    grid-template-columns: minmax(0, 1fr) minmax(112px, max-content);
}

.purchase-calculator__result-main {
    grid-template-columns: 1fr;
    gap: 8px;
}

.purchase-calculator__result-main dd {
    text-align: left;
}

.purchase-calculator__result dt,
.purchase-calculator__result dd,
.purchase-mortgage__stat strong,
.purchase-mortgage__stat span {
    min-width: 0;
    overflow-wrap: anywhere;
}
.purchase-mortgage__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.purchase-mortgage__stat {
    min-width: 0;
    padding-right: clamp(10px, 1.1vw, 16px);
}

.purchase-mortgage__stats strong {
    font-size: clamp(30px, 2.7vw, 44px);
    letter-spacing: 0;
}

.purchase-mortgage__stat--limit strong {
    max-width: none;
    font-size: clamp(28px, 2.45vw, 40px);
}

.purchase-program-copy {
    max-width: 600px;
}

.purchase-program-copy [data-purchase-program-description] {
    display: block;
    max-width: 560px;
    margin-bottom: 30px;
    text-wrap: pretty;
}

@media (max-width: 980px) {
    .purchase-mortgage__stats {
        grid-template-columns: 1fr;
        max-width: 560px;
    }

    .purchase-mortgage__stat {
        display: grid;
        grid-template-columns: minmax(120px, max-content) minmax(0, 1fr);
        align-items: center;
        gap: 18px;
        padding: 12px 0;
        border-right: 0;
        border-bottom: 1px solid rgba(15, 93, 69, .22);
    }

    .purchase-mortgage__stat:last-child {
        border-bottom: 0;
    }

    .purchase-mortgage__stats strong,
    .purchase-mortgage__stat--limit strong {
        margin: 0;
        font-size: clamp(25px, 5.8vw, 34px);
        line-height: 1;
    }

    .purchase-program-copy [data-purchase-program-description] {
        max-width: none;
    }
}

@media (max-width: 760px) {
    .purchase-mortgage__stat {
        grid-template-columns: minmax(94px, max-content) minmax(0, 1fr);
        gap: 14px;
    }

    .purchase-program-copy [data-purchase-program-description] {
        margin-bottom: 22px;
    }
}

.news__all-link {
    min-width: 150px;
    justify-content: center;
    text-transform: uppercase;
}

.news-featured > a {
    position: relative;
    overflow: hidden;
}

.news-list {
    display: grid;
}

.news-item__label {
    width: fit-content;
    margin-bottom: 18px;
    color: #5fa24f;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    line-height: 1;
    text-transform: uppercase;
}

.news-item h3 {
    margin-bottom: 12px;
}

.news-item p {
    margin-bottom: 18px;
}

.news-item time {
    color: rgba(6, 47, 80, .52);
    font-weight: 700;
}

.news--transparent .news-item {
    background: rgba(255, 255, 255, .88);
}

.news .news-layout {
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

@media (max-width: 1040px) {

    .news-item,
    .news-item:last-child {
        border: 1px solid rgba(6, 47, 80, .08);
    }
}

@media (max-width: 760px) {
    .hero__word {
        font-size: clamp(21px, 5vw, 30px);
    }

    .purchase-calculator__result div,
    .purchase-calculator__result-main {
        grid-template-columns: 1fr;
    }

    .purchase-calculator__result dd {
        text-align: left;
    }
}

/* News block final layout: keep the current article source, but restore the
   original visual grid from the approved theme version. */
.news {
    padding-top: clamp(72px, 8vw, 118px) !important;
    padding-bottom: clamp(76px, 8vw, 124px) !important;
}

.news__heading {
    align-items: end !important;
    margin-bottom: clamp(30px, 3.8vw, 46px) !important;
}

.news__heading h2 {
    max-width: 720px !important;
    margin: 0 !important;
    font-size: clamp(36px, 4vw, 62px) !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
}

.news-layout {
    display: grid !important;
    width: min(100%, 1180px) !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1.55fr) minmax(330px, .85fr) !important;
    gap: 0 !important;
    overflow: hidden !important;
    background: var(--vida-white) !important;
    border: 0 !important;
    border-radius: 24px !important;
    box-shadow: var(--vida-shadow) !important;
}

.news-featured {
    min-width: 0 !important;
    background: var(--vida-blue) !important;
}

.news-featured > a {
    display: grid !important;
    min-height: clamp(500px, 40vw, 560px) !important;
    padding: 0 !important;
    grid-template-rows: none !important;
    color: var(--vida-white) !important;
    background:
        linear-gradient(180deg, rgba(6, 47, 80, .18) 0%, rgba(6, 47, 80, .88) 100%),
        url("../images/building.webp") center / cover no-repeat,
        var(--vida-blue) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.news-featured__content {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    min-height: 0 !important;
    padding: clamp(28px, 3vw, 40px) !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    background: linear-gradient(180deg, transparent 22%, rgba(6, 47, 80, .96) 100%) !important;
}

.news-featured__content h3 {
    max-width: 620px !important;
    margin: 18px 0 14px !important;
    color: var(--vida-white) !important;
    font-size: clamp(30px, 3vw, 48px) !important;
    font-weight: 500 !important;
    line-height: 1.02 !important;
    letter-spacing: 0 !important;
}

.news-list {
    display: flex !important;
    min-width: 0 !important;
    flex-direction: column !important;
    gap: 0 !important;
    background: var(--vida-white) !important;
}

.news-item,
.news-item:last-child {
    flex: 1 1 0 !important;
    min-height: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(6, 47, 80, .12) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.news-item:last-child {
    border-bottom: 0 !important;
}

.news-item a {
    display: flex !important;
    height: 100% !important;
    min-height: 170px !important;
    padding: clamp(24px, 2vw, 30px) !important;
    flex-direction: column !important;
    color: var(--vida-blue) !important;
    background: transparent !important;
    transition: background-color .25s ease !important;
}

.news-item h3 {
    max-width: 360px !important;
    margin: 0 0 10px !important;
    color: var(--vida-blue) !important;
    font-size: clamp(18px, 1.45vw, 22px) !important;
    font-weight: 500 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
}

.news-item p,
.news-item time {
    max-width: 340px !important;
    color: var(--vida-muted) !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
}

.news-item p {
    margin: 0 0 12px !important;
}

.news-item time {
    margin-top: auto !important;
}

.news--transparent .news-layout {
    box-shadow: 0 22px 48px rgba(6, 47, 80, .08) !important;
}

@media (max-width: 1040px) {
    .news-layout {
        grid-template-columns: 1fr !important;
    }

    .news-list {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .news-item,
    .news-item:last-child {
        border-bottom: 0 !important;
        border-right: 1px solid rgba(6, 47, 80, .12) !important;
    }

    .news-item:last-child {
        border-right: 0 !important;
    }
}

@media (max-width: 760px) {
    .news {
        padding-top: 56px !important;
        padding-bottom: 68px !important;
    }

    .news__heading {
        align-items: flex-start !important;
        gap: 18px !important;
    }

    .news__heading h2 {
        font-size: clamp(34px, 10vw, 46px) !important;
    }

    .news-layout,
    .news-list {
        grid-template-columns: 1fr !important;
    }

    .news-list {
        display: flex !important;
    }

    .news-featured > a {
        min-height: 430px !important;
    }

    .news-featured__content {
        padding: 24px !important;
    }

    .news-featured__content h3 {
        font-size: clamp(25px, 8vw, 34px) !important;
    }

    .news-item,
    .news-item:last-child {
        border-right: 0 !important;
        border-bottom: 1px solid rgba(6, 47, 80, .12) !important;
    }

    .news-item:last-child {
        border-bottom: 0 !important;
    }

    .news-item a {
        min-height: 132px !important;
        padding: 22px !important;
    }
}

/* News block: Figma composition, article data stays dynamic. */
.news.section--cream.pattern-cream {
    padding: clamp(58px, 6.4vw, 92px) 0 clamp(76px, 7.4vw, 112px) !important;
    background-color: #f4d3aa !important;
    background-repeat: no-repeat, no-repeat !important;
    background-position: center top, center top !important;
    background-size: 100% 100%, 100% 100% !important;
}

.news .container {
    position: relative !important;
    z-index: 1 !important;
}

.news__heading,
.news .section-heading.news__heading {
    width: min(100%, 1180px) !important;
    margin: 0 auto clamp(28px, 3vw, 40px) !important;
    align-items: center !important;
}

.news__heading h2,
.news .section-heading.news__heading h2 {
    max-width: none !important;
    margin: 0 !important;
    color: var(--vida-blue) !important;
    font-size: clamp(34px, 3.8vw, 54px) !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
}

.news__all-link,
.news .button.news__all-link {
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 10px 20px !important;
    justify-content: center !important;
    color: var(--vida-blue) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
    background: rgba(255, 250, 244, .72) !important;
    border: 0 !important;
    border-radius: 999px !important;
    box-shadow: none !important;
}

.news-layout,
.news .news-layout {
    display: grid !important;
    width: min(100%, 1180px) !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1.58fr) minmax(320px, .82fr) !important;
    gap: 0 !important;
    overflow: hidden !important;
    background: var(--vida-white) !important;
    border: 0 !important;
    border-radius: 16px !important;
    box-shadow: none !important;
}

.news-featured,
.news .news-featured {
    min-width: 0 !important;
    background: var(--vida-blue) !important;
}

.news-featured > a,
.news .news-featured > a {
    display: grid !important;
    min-height: clamp(460px, 37vw, 545px) !important;
    padding: clamp(26px, 2.7vw, 38px) !important;
    grid-template-rows: clamp(190px, 18vw, 250px) 1fr !important;
    gap: clamp(22px, 2.2vw, 30px) !important;
    color: var(--vida-white) !important;
    background: var(--vida-blue) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.news-featured__image,
.news-featured img,
.news-featured__content {
    grid-area: auto !important;
}

.news-featured__image,
.news-featured img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    object-fit: cover !important;
    object-position: center !important;
    opacity: 1 !important;
    border-radius: 0 !important;
}

.news-featured__content,
.news .news-featured__content {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    min-height: 0 !important;
    padding: 0 !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    background: none !important;
}

.news .tag {
    display: inline-flex !important;
    width: fit-content !important;
    min-height: 22px !important;
    padding: 5px 10px !important;
    align-items: center !important;
    color: var(--vida-blue) !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    background: #e0bf9a !important;
    border-radius: 999px !important;
}

.news-featured__content h3,
.news .news-featured__content h3 {
    max-width: 650px !important;
    margin: 16px 0 12px !important;
    color: var(--vida-white) !important;
    font-size: clamp(22px, 2.1vw, 31px) !important;
    font-weight: 500 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
}

.news-featured__content p,
.news-featured__content time {
    max-width: 500px !important;
    margin: 0 !important;
    color: rgba(255, 255, 255, .66) !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
}

.news-featured__content time {
    margin-top: 14px !important;
}

.news-list,
.news .news-list {
    display: grid !important;
    min-width: 0 !important;
    grid-template-rows: repeat(3, minmax(0, 1fr)) !important;
    gap: 0 !important;
    background: #fffaf4 !important;
}

.news-item,
.news-item:last-child,
.news .news-item,
.news .news-item:last-child {
    min-height: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(6, 47, 80, .22) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.news-item:last-child,
.news .news-item:last-child {
    border-bottom: 0 !important;
}

.news-item a,
.news .news-item a {
    display: flex !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: clamp(24px, 2.35vw, 34px) clamp(22px, 2.2vw, 32px) !important;
    flex-direction: column !important;
    color: var(--vida-blue) !important;
    background: transparent !important;
    transition: background-color .25s ease !important;
}

.news-item a:hover,
.news-item a:focus-visible {
    background: rgba(224, 191, 154, .12) !important;
}

.news-item__label {
    display: none !important;
}

.news-item h3,
.news .news-item h3 {
    max-width: 335px !important;
    margin: 0 0 12px !important;
    color: var(--vida-blue) !important;
    font-size: clamp(14px, 1.12vw, 17px) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
}

.news-item p,
.news-item time,
.news .news-item p,
.news .news-item time {
    max-width: 300px !important;
    color: rgba(6, 47, 80, .52) !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
}

.news-item p,
.news .news-item p {
    margin: 0 0 10px !important;
}

.news-item time,
.news .news-item time {
    margin-top: auto !important;
}

.reveal-ready .news [data-reveal],
.news [data-reveal] {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

@media (max-width: 1040px) {
    .news-layout,
    .news .news-layout {
        grid-template-columns: 1fr !important;
    }

    .news-list,
    .news .news-list {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        grid-template-rows: none !important;
    }

    .news-item,
    .news-item:last-child,
    .news .news-item,
    .news .news-item:last-child {
        border-bottom: 0 !important;
        border-right: 1px solid rgba(6, 47, 80, .18) !important;
    }

    .news-item:last-child,
    .news .news-item:last-child {
        border-right: 0 !important;
    }
}

@media (max-width: 760px) {
    .news.section--cream.pattern-cream {
        padding: 52px 0 66px !important;
    }

    .news__heading,
    .news .section-heading.news__heading {
        align-items: flex-start !important;
        gap: 18px !important;
    }

    .news__heading h2,
    .news .section-heading.news__heading h2 {
        font-size: clamp(32px, 10vw, 44px) !important;
    }

    .news-layout,
    .news-list,
    .news .news-layout,
    .news .news-list {
        grid-template-columns: 1fr !important;
    }

    .news-list,
    .news .news-list {
        display: flex !important;
    }

    .news-featured > a,
    .news .news-featured > a {
        min-height: 430px !important;
        padding: 20px !important;
        grid-template-rows: 170px auto !important;
    }

    .news-featured__content h3,
    .news .news-featured__content h3 {
        font-size: clamp(22px, 7vw, 30px) !important;
    }

    .news-item,
    .news-item:last-child,
    .news .news-item,
    .news .news-item:last-child {
        border-right: 0 !important;
        border-bottom: 1px solid rgba(6, 47, 80, .18) !important;
    }

    .news-item:last-child,
    .news .news-item:last-child {
        border-bottom: 0 !important;
    }

    .news-item a,
    .news .news-item a {
        min-height: 126px !important;
        padding: 20px !important;
    }
}

/* News block Figma pass: wider frame and earlier start. */
.news.section--cream.pattern-cream {
    padding-top: clamp(42px, 4vw, 58px) !important;
}

.news .container {
    width: min(100% - 96px, 1288px) !important;
}

.news__heading,
.news .section-heading.news__heading,
.news-layout,
.news .news-layout {
    width: 100% !important;
}

.news__heading,
.news .section-heading.news__heading {
    margin-bottom: clamp(20px, 2.2vw, 28px) !important;
}

@media (max-width: 760px) {
    .news .container {
        width: min(100% - 32px, 1288px) !important;
    }
}

/* News background polish: remove the hard horizontal color break. */
.news.section--cream.pattern-cream {
    background-image:
        url("../images/happy-life-pattern.webp"),
        linear-gradient(
            180deg,
            #fae3c2 0%,
            #f7dbb7 38%,
            #e8c396 54%,
            #4b7888 69%,
            #073452 100%
        ) !important;
}

@media (max-width: 760px) {
    .news.section--cream.pattern-cream {
        background-image:
            url("../images/happy-life-pattern.webp"),
            linear-gradient(
                180deg,
                #fae3c2 0%,
                #f7dbb7 36%,
                #e8c396 52%,
                #4b7888 67%,
                #073452 100%
            ) !important;
    }
}

/* Favorites page polish: ornamental hero and stable one-line desktop title. */
.favorites-page {
    background:
        linear-gradient(180deg, #fae3c2 0%, #f7efe3 320px, #f4f0e9 100%) !important;
}

.favorites-hero.section--cream {
    padding-top: calc(var(--header-height) + clamp(34px, 4vw, 58px)) !important;
    padding-bottom: clamp(46px, 6vw, 86px) !important;
    isolation: isolate;
    background-color: #f8ddb9 !important;
    background-repeat: no-repeat, no-repeat !important;
}

.favorites-hero::before {
    position: absolute;
    inset: auto -8% -46px;
    z-index: 0;
    height: 140px;
    content: "";
    pointer-events: none;
    background: linear-gradient(180deg, rgba(244, 240, 233, 0) 0%, #f4f0e9 74%);
}

.favorites-hero > * {
    position: relative;
    z-index: 1;
}

.favorites-hero__copy {
    min-width: 0;
}

.favorites-hero__copy h1 {
    letter-spacing: 0 !important;
}

.favorites-hero__copy p:last-child {
    max-width: 620px !important;
}

.favorites-list.section--cream {
    background:
        linear-gradient(180deg, #f4f0e9 0%, #f7efe3 100%) !important;
}

@media (max-width: 1120px) {
    .favorites-hero__copy h1 {
        font-size: clamp(42px, 6.4vw, 66px) !important;
    }
}

@media (max-width: 720px) {
    .favorites-hero.section--cream {
        padding-top: calc(var(--header-height) + 28px) !important;
        padding-bottom: 54px !important;
    }

    .favorites-hero__copy h1 {
        line-height: 1 !important;
        white-space: normal;
    }
}

/* Favorites hero final visual tuning. */
.favorites-hero.section--cream {
    background-image:
        url("../images/happy-life-pattern.webp"),
        linear-gradient(180deg, rgba(250, 227, 194, .92) 0%, rgba(247, 219, 183, .84) 45%, rgba(244, 240, 233, .98) 100%) !important;
    background-position: center 36%, center top !important;
    background-size: max(100vw, 1700px) auto, 100% 100% !important;
}

@media (max-width: 720px) {
    .favorites-hero.section--cream {
        background-size: max(100vw, 760px) auto, 100% 100% !important;
    }

    .favorites-hero__copy h1 {
        font-size: clamp(34px, 11vw, 50px) !important;
    }
}

@media (max-width: 640px) {
    .favorites-page {
        overflow-x: hidden;
    }

    .favorites-hero__copy h1,
    .favorites-hero__copy p:last-child,
    .favorites-empty h2,
    .favorites-empty p {
        max-width: 100% !important;
        overflow-wrap: anywhere;
    }

    .favorites-empty h2 {
        font-size: clamp(30px, 9vw, 40px) !important;
        line-height: 1.05 !important;
    }
}
@media (min-width: 992px) {
    .floating-gallery__stage {
        width: 100%;
        max-width: none;
        margin-inline: 0;
    }

    .floating-gallery__card--main {
        --floating-gallery-main-radius: 28px;
        overflow: hidden;
        border-radius: var(--floating-gallery-main-radius);
    }

    .floating-gallery__card--main img,
    .floating-gallery__shade {
        border-radius: inherit;
    }
}

/* Match the visible color behind the expanded "Время идёт" lower corners to
   the warm ornamental section below, instead of the default pale section base. */
@media (min-width: 992px) {
    .floating-gallery__stage::after {
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        height: 76px;
        content: "";
        pointer-events: none;
        background: #f4e1c9;
    }

    .floating-gallery__card--main {
        background: #f4e1c9;
    }
}

/* Unified breadcrumbs and favorites hero layout. */
.breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: rgba(28, 32, 24, .56);
    font-size: clamp(15px, 1.05vw, 17px);
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: 0;
}

.breadcrumbs a {
    color: rgba(28, 32, 24, .58);
    text-decoration: none;
    transition: color .2s ease;
}

.breadcrumbs a:hover,
.breadcrumbs a:focus-visible {
    color: #0f5d45;
}

.breadcrumbs span,
.breadcrumbs span[aria-hidden="true"],
.breadcrumbs span:last-child {
    color: #0f5d45;
}

.breadcrumbs span[aria-hidden="true"] {
    transform: translateY(-1px);
}

.breadcrumbs span:last-child {
    font-weight: 700;
}

.planning-top .breadcrumbs {
    color: rgba(28, 32, 24, .56);
    margin-bottom: clamp(48px, 5.5vw, 82px);
    font-size: clamp(15px, 1.05vw, 17px);
}

.planning-top .breadcrumbs a {
    color: rgba(28, 32, 24, .58);
}

.planning-top .breadcrumbs span,
.planning-top .breadcrumbs span[aria-hidden="true"],
.planning-top .breadcrumbs span:last-child {
    color: #0f5d45;
}

.flat-hero__info > .breadcrumbs,
.flat-not-found .breadcrumbs {
    margin-bottom: clamp(34px, 4vw, 52px);
}

.company-hero .breadcrumbs {
    margin-bottom: clamp(38px, 4vw, 58px);
}

.purchase-hero .breadcrumbs {
    margin-bottom: clamp(34px, 4.8vw, 66px);
}

.news-archive__hero .breadcrumbs {
    margin-bottom: clamp(44px, 5.4vw, 72px);
    overflow-wrap: anywhere;
    word-break: break-word;
}

.article-detail__hero .breadcrumbs {
    gap: 10px;
    margin-bottom: clamp(58px, 7.4vw, 96px);
    overflow-wrap: anywhere;
    word-break: break-word;
}

.contacts-page-hero .breadcrumbs {
    margin-bottom: clamp(70px, 9vw, 132px);
}

.agents-hero .breadcrumbs,
.agents-hero .breadcrumbs a {
    color: rgba(255, 255, 255, .76);
}

.agents-hero .breadcrumbs span,
.agents-hero .breadcrumbs span[aria-hidden="true"],
.agents-hero .breadcrumbs span:last-child {
    color: #ffd8aa;
}

.favorites-hero__inner {
    grid-template-columns: minmax(0, 1fr) max-content !important;
    align-items: center !important;
    column-gap: clamp(28px, 5vw, 88px) !important;
    row-gap: clamp(30px, 4vw, 58px) !important;
}

.favorites-hero .breadcrumbs {
    grid-column: 1 / -1;
}

.favorites-hero__copy h1 {
    max-width: 100% !important;
    font-size: clamp(42px, 4.1vw, 66px) !important;
    line-height: .96 !important;
    white-space: nowrap !important;
    text-wrap: balance;
}

.favorites-hero__inner > .button {
    justify-self: end;
    align-self: center;
    white-space: nowrap;
    flex-shrink: 0;
}

@media (max-width: 991px) {
    .favorites-hero__inner {
        grid-template-columns: 1fr !important;
    }

    .favorites-hero__inner > .button {
        justify-self: start;
    }
}

@media (max-width: 760px) {
    .breadcrumbs {
        gap: 6px;
        font-size: 12px;
    }

    .planning-top .breadcrumbs,
    .flat-hero__info > .breadcrumbs,
    .flat-not-found .breadcrumbs {
        margin-bottom: 28px;
    }

    .article-detail__hero .breadcrumbs {
        gap: 6px;
        margin-bottom: 74px;
        overflow: hidden;
        font-size: 10px;
        white-space: nowrap;
    }

    .article-detail__hero .breadcrumbs span:last-child {
        overflow: hidden;
        max-width: 150px;
        text-overflow: ellipsis;
    }

    .favorites-hero__copy h1 {
        white-space: normal !important;
    }
}

/* Agent registration form final alignment. */
.agents-form {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    align-items: start;
    gap: 18px 16px;
    width: min(100%, 640px);
    margin-left: auto;
    padding: clamp(26px, 3vw, 38px);
    border-color: rgba(2, 36, 65, .1);
    border-radius: 8px;
    box-shadow: 0 22px 54px rgba(2, 36, 65, .1);
}

.agents-form label:not(.agents-form__trap):not(.agents-form__consent) {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    color: #26465f;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;
}

.agents-form label:not(.agents-form__trap):not(.agents-form__consent) > span {
    display: block;
    min-height: 16px;
}

.agents-form input:not([type="checkbox"]),
.agents-form textarea {
    display: block;
    width: 100%;
    box-sizing: border-box;
    color: #022441;
    background: #fff;
    border: 1px solid rgba(2, 36, 65, .18);
    border-radius: 6px;
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.agents-form input:not([type="checkbox"]) {
    height: 50px;
    min-height: 50px;
    padding: 0 15px;
}

.agents-form textarea {
    min-height: 104px;
    padding: 15px;
    line-height: 1.4;
    resize: vertical;
}

.agents-form input::placeholder,
.agents-form textarea::placeholder {
    color: rgba(2, 36, 65, .48);
    font-weight: 700;
}

.agents-form input:not([type="checkbox"]):focus,
.agents-form textarea:focus {
    border-color: rgba(95, 162, 79, .84);
    box-shadow: 0 0 0 3px rgba(95, 162, 79, .14);
}

.agents-form label.is-invalid input:not([type="checkbox"]),
.agents-form label.is-invalid textarea {
    border-color: #b42318;
    box-shadow: 0 0 0 3px rgba(180, 35, 24, .11);
}

.agents-form small {
    display: block;
    margin: -1px 0 0;
    color: rgba(2, 36, 65, .56);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
}

.agents-form__city {
    z-index: 6;
}

.agents-city-list {
    top: calc(100% + 8px);
    padding: 7px;
    border-color: rgba(2, 36, 65, .12);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(2, 36, 65, .16);
}

.agents-city-list button {
    min-height: 38px;
    border-radius: 6px;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
}

.agents-form__wide,
.agents-form__consents,
.agents-form-alert,
.agents-form__submit {
    grid-column: 1 / -1;
}

.agents-form__consents {
    display: grid;
    gap: 12px;
}

.agents-form__consent {
    display: grid !important;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: start;
    gap: 12px !important;
    margin-top: 2px;
    color: rgba(2, 36, 65, .72);
    font-size: 13px;
    line-height: 1.35;
}

.agents-form__consent input[type="checkbox"] {
    width: 18px;
    height: 18px;
    min-height: 18px;
    margin: 0;
    accent-color: #0b543c;
}

.agents-form__consent a {
    color: #0b543c;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.agents-form__field-error {
    margin-top: -2px;
    color: #8a1f16 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.agents-form-alert {
    max-width: none;
    margin: 0;
    border-radius: 8px;
}

.agents-form__submit {
    width: 100%;
    min-height: 52px;
    margin-top: 0;
    border-radius: 999px;
}

@media (max-width: 760px) {
    .agents-form {
        grid-template-columns: 1fr;
        width: 100%;
        padding: 22px;
    }
}
.happy-life__map.happy-life__map--interactive {
    position: relative;
    display: block;
    min-height: clamp(430px, 57vw, 760px);
    margin: 0;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(232, 239, 235, .92), rgba(204, 218, 213, .86)),
        #e8efeb;
    border: 0;
    isolation: isolate;
}

.happy-life__map-canvas,
.happy-life__map-fallback,
.happy-life__map-instance {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.happy-life__map-canvas {
    z-index: 1;
}

.happy-life__map-canvas::before {
    position: absolute;
    inset: 0;
    z-index: 2;
    content: "";
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(2, 36, 65, .20) 0%, rgba(2, 36, 65, 0) 34%, rgba(2, 36, 65, 0) 66%, rgba(2, 36, 65, .10) 100%),
        linear-gradient(0deg, rgba(2, 36, 65, .12), rgba(2, 36, 65, 0) 42%);
}

.happy-life__map-instance {
    z-index: 1;
}

.happy-life__map-instance [class*="-balloon__tail"] {
    display: none !important;
}

.happy-life__map-card {
    position: absolute;
    left: max(24px, calc((100vw - 1180px) / 2));
    bottom: clamp(24px, 3.6vw, 52px);
    z-index: 3;
    display: grid;
    width: min(340px, calc(100% - 48px));
    padding: clamp(18px, 2vw, 24px);
    color: #fff;
    background: rgba(2, 36, 65, .92);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 16px;
    box-shadow: 0 26px 80px rgba(2, 36, 65, .26);
    backdrop-filter: blur(16px);
}

.happy-life__map-kicker {
    margin-bottom: 13px;
    color: rgba(255, 255, 255, .62);
    font-family: var(--font-heading);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .09em;
    line-height: 1;
    text-transform: uppercase;
}

.happy-life__map-card strong {
    margin-bottom: 9px;
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(26px, 2.4vw, 36px);
    font-weight: 700;
    line-height: .98;
    letter-spacing: normal;
}

.happy-life__map-card > span:not(.happy-life__map-kicker) {
    max-width: 260px;
    color: rgba(255, 255, 255, .78);
    font-size: 15px;
    line-height: 1.35;
}

.happy-life__map-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
    margin: 18px 0 0;
    list-style: none;
}

.happy-life__map-legend li {
    display: inline-flex;
    min-height: 28px;
    padding: 7px 10px;
    align-items: center;
    gap: 7px;
    color: rgba(255, 255, 255, .82);
    background: rgba(255, 255, 255, .09);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 999px;
    font-size: 12px;
    line-height: 1;
}

.happy-life__map-dot {
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ffd8a2;
}

.happy-life__map-dot--school {
    background: #7db8ff;
}

.happy-life__map-dot--kindergarten {
    background: #7bd68f;
}

.happy-life__map-dot--medical {
    background: #ff8a8a;
}

.vida-yandex-logo-pin {
    position: relative;
    display: grid;
    min-width: 96px;
    padding: 8px 10px 9px;
    place-items: center;
    color: #fff;
    background: #022441;
    border: 2px solid rgba(255, 255, 255, .92);
    border-radius: 14px;
    box-shadow: 0 18px 44px rgba(2, 36, 65, .30);
    transform: translate(-50%, calc(-100% - 12px));
}

.vida-yandex-logo-pin::after {
    position: absolute;
    left: 50%;
    bottom: -8px;
    width: 14px;
    height: 14px;
    content: "";
    background: #022441;
    border-right: 2px solid rgba(255, 255, 255, .92);
    border-bottom: 2px solid rgba(255, 255, 255, .92);
    transform: translateX(-50%) rotate(45deg);
}

.vida-yandex-logo-pin__logo {
    position: relative;
    z-index: 1;
    display: grid;
    width: 68px;
    height: 34px;
    place-items: center;
}

.vida-yandex-logo-pin img {
    display: block;
    width: 68px;
    height: auto;
    max-height: 34px;
    object-fit: contain;
}

.vida-yandex-logo-pin span {
    position: relative;
    z-index: 1;
    margin-top: 2px;
    font-family: var(--font-heading);
    font-size: 8px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.vida-yandex-poi-pin {
    --pin-offset-x: 0px;
    --pin-offset-y: 0px;
    position: relative;
    display: inline-flex;
    width: 42px;
    height: 42px;
    padding: 0;
    align-items: center;
    justify-content: center;
    color: #022441;
    background: rgba(255, 216, 162, .96);
    border: 3px solid #fff;
    border-radius: 999px;
    box-shadow: 0 14px 30px rgba(2, 36, 65, .22);
    cursor: pointer;
    transform: translate(calc(-50% + var(--pin-offset-x)), calc(-100% - 10px + var(--pin-offset-y))) scale(1);
    transform-origin: 50% 100%;
    transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
    white-space: nowrap;
}

.vida-yandex-poi-pin::after {
    position: absolute;
    left: 50%;
    bottom: -6px;
    width: 12px;
    height: 12px;
    content: "";
    background: inherit;
    border-right: 3px solid #fff;
    border-bottom: 3px solid #fff;
    transform: translateX(-50%) rotate(45deg);
}

.vida-yandex-poi-pin:hover {
    filter: saturate(1.08);
    box-shadow: 0 18px 34px rgba(2, 36, 65, .28);
    transform: translate(calc(-50% + var(--pin-offset-x)), calc(-100% - 10px + var(--pin-offset-y))) scale(1.06);
}

.vida-yandex-poi-pin__abbr {
    position: relative;
    z-index: 1;
    display: grid;
    min-width: 28px;
    height: 28px;
    place-items: center;
    color: #fff;
    background: rgba(2, 36, 65, .82);
    border-radius: 999px;
    font-family: var(--font-heading);
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.vida-yandex-poi-pin__title {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 11px);
    z-index: 3;
    display: block;
    width: max-content;
    max-width: 190px;
    padding: 8px 10px;
    color: #022441;
    background: #fffaf4;
    border: 1px solid rgba(2, 36, 65, .12);
    border-radius: 10px;
    box-shadow: 0 14px 28px rgba(2, 36, 65, .18);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.15;
    opacity: 0;
    pointer-events: none;
    text-align: center;
    transform: translate(-50%, 6px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
    visibility: hidden;
    white-space: normal;
}

.vida-yandex-poi-pin:hover .vida-yandex-poi-pin__title {
    opacity: 1;
    transform: translate(-50%, 0);
    visibility: visible;
}

.vida-yandex-poi-pin--school {
    color: #fff;
    background: rgba(29, 111, 183, .96);
}

.vida-yandex-poi-pin--kindergarten {
    color: #fff;
    background: rgba(43, 143, 74, .96);
}

.vida-yandex-poi-pin--medical {
    color: #fff;
    background: rgba(205, 72, 86, .96);
}

.vida-yandex-poi-pin--school .vida-yandex-poi-pin__abbr,
.vida-yandex-poi-pin--kindergarten .vida-yandex-poi-pin__abbr,
.vida-yandex-poi-pin--medical .vida-yandex-poi-pin__abbr {
    color: inherit;
    background: rgba(255, 255, 255, .18);
}

@media (max-width: 900px) {
    .happy-life__map.happy-life__map--interactive {
        min-height: 560px;
    }

    .happy-life__map-card {
        left: 20px;
        right: 20px;
        bottom: 20px;
        width: auto;
        padding: 20px;
        border-radius: 14px;
    }
}

@media (max-width: 560px) {
    .happy-life__map.happy-life__map--interactive {
        min-height: 520px;
    }

    .happy-life__map-canvas::before {
        background:
            linear-gradient(0deg, rgba(2, 36, 65, .18), rgba(2, 36, 65, 0) 52%),
            linear-gradient(90deg, rgba(2, 36, 65, .10), rgba(2, 36, 65, 0) 54%);
    }

    .happy-life__map-card strong {
        font-size: 25px;
    }

    .happy-life__map-card > span:not(.happy-life__map-kicker) {
        font-size: 14px;
    }

    .vida-yandex-logo-pin {
        min-width: 86px;
    }

    .vida-yandex-logo-pin__logo,
    .vida-yandex-logo-pin img {
        width: 58px;
    }

    .vida-yandex-poi-pin {
        width: 34px;
        height: 34px;
    }

    .vida-yandex-poi-pin__abbr {
        min-width: 22px;
        height: 22px;
    }

    .vida-yandex-poi-pin__title {
        display: none;
    }
}

.manifest__line:first-child .manifest__text {
    font-size: 1em !important;
}

.manifest__title,
.manifest__line,
.manifest__text {
    text-align: center !important;
}

.render-stories {
    position: relative;
    z-index: 2;
    margin: 0;
    padding-top: clamp(28px, 3.2vw, 52px);
    padding-bottom: clamp(28px, 3.2vw, 52px);
    color: var(--vida-blue);
    background: linear-gradient(180deg, var(--vida-cream-light) 0%, #fffaf4 100%) !important;
}

.stats-transition {
    overflow: visible;
}

.stats-transition::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    z-index: 3;
    height: clamp(72px, 7vw, 128px);
    background: linear-gradient(180deg, var(--vida-cream-light) 0%, #fff1df 100%);
    pointer-events: none;
}

.stats-transition > .apartments {
    z-index: 4;
    background: #fff !important;
}

.apartment-card__old-price {
    display: inline-block;
    width: fit-content;
    margin: 2px 0 6px;
    color: rgba(1, 35, 65, .52);
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.15;
    text-decoration: line-through;
    text-decoration-color: rgba(1, 35, 65, .58);
    text-decoration-thickness: 1px;
}

.apartment-card__old-price + .apartment-card__price {
    margin-top: 0;
}

.catalog .apartment-card--catalog .apartment-card__old-price,
.catalog .planning-catalog__grid .planning-flat-card .apartment-card__old-price {
    margin-top: 0;
    margin-bottom: 6px;
    color: rgba(1, 35, 65, .5);
    font-size: 14px;
}

.offers .section-heading h2,
.apartments .section-heading h2,
.render-stories .section-heading h2 {
    max-width: 820px !important;
    font-size: clamp(34px, 3.8vw, 58px) !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.render-stories .section-heading {
    align-items: end;
    margin-bottom: clamp(14px, 1.6vw, 22px);
}

.render-stories .section-heading p {
    max-width: 560px;
    margin-top: 16px;
    color: rgba(6, 47, 80, .68);
    font-size: clamp(16px, 1.25vw, 19px);
    line-height: 1.45;
}

.render-stories__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
    grid-template-areas:
        "wide story-one"
        "wide story-two";
    height: clamp(500px, 64svh, 640px);
    gap: clamp(14px, 1.5vw, 22px);
    align-items: stretch;
}

.render-story-card {
    position: relative;
    display: block;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    color: var(--vida-white);
    background: var(--vida-blue);
    border-radius: 8px;
    box-shadow: 0 22px 54px rgba(6, 47, 80, .16);
}

.render-story-card--wide {
    grid-area: wide;
    min-height: 0;
}

.render-story-card:nth-child(2) {
    grid-area: story-one;
}

.render-story-card:nth-child(3) {
    grid-area: story-two;
}

.render-story-card img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: cover;
    opacity: .82;
}

.render-story-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(2, 36, 65, 0) 24%, rgba(2, 36, 65, .88) 100%);
    pointer-events: none;
}

.render-story-card div {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    padding: clamp(18px, 2vw, 30px);
}

.render-story-card h3 {
    max-width: 560px;
    margin: 0 0 8px;
    font-size: clamp(22px, 1.92vw, 31px);
    font-weight: 500;
    line-height: 1.05;
    letter-spacing: 0;
}

.render-story-card p {
    max-width: 520px;
    margin: 0;
    color: rgba(255, 255, 255, .78);
    font-size: clamp(14px, .96vw, 16px);
    line-height: 1.45;
}

.render-story-card:not(.render-story-card--wide) h3 {
    margin-top: 0;
    margin-bottom: 6px;
    font-size: clamp(18px, 1.32vw, 24px);
    line-height: 1.02;
}

.render-story-card:not(.render-story-card--wide) p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: clamp(12px, .84vw, 14px);
    line-height: 1.34;
}

.render-story-card:not(.render-story-card--wide) div {
    padding: clamp(14px, 1.45vw, 24px);
}

.offer-card {
    position: relative;
    overflow: hidden;
    background: rgba(255, 250, 244, .92) !important;
}

.offer-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: url("../images/pattern-cream.webp") center / 360px repeat;
    opacity: .18;
    pointer-events: none;
}

.offer-card > * {
    position: relative;
    z-index: 1;
}

.happy-life__next-preview {
    display: none !important;
}

.happy-life__after-scene .happy-life__location-row h3 {
    font-family: "Roboto Flex", Arial, sans-serif !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
}

.planning-catalog__top h2 {
    text-transform: none !important;
    letter-spacing: normal !important;
}

.planning-project__numbers,
.planning-top__numbers,
.flat-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

@media (max-width: 900px) {
    .render-stories__grid {
        height: auto;
        grid-template-columns: 1fr;
        grid-template-rows: none;
        grid-template-areas: none;
    }

    .render-story-card,
    .render-story-card--wide {
        grid-area: auto;
        min-height: 360px;
    }
}

@media (max-width: 560px) {
    .offers .section-heading h2,
    .apartments .section-heading h2,
    .render-stories .section-heading h2 {
        font-size: clamp(30px, 9vw, 40px) !important;
    }

    .render-story-card,
    .render-story-card--wide {
        min-height: 320px;
    }
}
.site-header__favorite {
    position: relative;
    display: inline-flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    color: inherit;
    border: 1px solid rgba(255, 255, 255, .34);
    border-radius: 50%;
    text-decoration: none;
    transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}

.site-header__favorite:hover,
.site-header__favorite:focus-visible {
    background: rgba(255, 255, 255, .12);
    border-color: rgba(255, 255, 255, .62);
    transform: translateY(-1px);
}

.site-header__favorite-icon {
    width: 19px;
    height: 19px;
}

.site-header__favorite-count {
    position: absolute;
    top: -7px;
    right: -7px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    color: var(--vida-blue);
    background: var(--vida-cream);
    border: 1px solid rgba(6, 47, 80, .18);
    font-size: 10px;
}

.planning-catalog .planning-project-tabs > * {
    position: relative;
    display: flex !important;
    width: 100%;
    height: 100%;
    min-height: 0 !important;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    padding: 0 16px !important;
    color: rgba(2, 36, 65, .55) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-align: center;
    text-decoration: none;
    transform: none !important;
}

.planning-catalog .planning-project-tabs > *:not(:last-child)::after {
    position: absolute;
    top: -1px;
    right: 0;
    bottom: -1px;
    display: block;
    width: 1px;
    content: "";
    background: rgba(2, 36, 65, .72);
    pointer-events: none;
}

.planning-catalog .planning-project-tabs > .is-active {
    color: #fff !important;
    background: #0b5b43 !important;
    font-weight: 700 !important;
}

.planning-catalog .planning-project-tabs > .is-active::after {
    display: none;
}

.planning-catalog .planning-project-tabs > a:hover,
.planning-catalog .planning-project-tabs > a:focus-visible {
    color: #022441 !important;
    background: rgba(2, 36, 65, .06) !important;
}

@media (max-width: 1024px) {
    .site-header__favorite {
        width: 42px;
        height: 42px;
    }
}

@media (max-width: 760px) {
    .site-header__favorite {
        display: inline-flex !important;
        color: var(--vida-white);
        background: transparent;
        border-color: rgba(255, 255, 255, .42);
    }

    .site-header__favorite-count {
        top: -5px;
        right: -5px;
    }
}
.manifest {
    display: block;
}

.manifest__scroll,
.manifest__sticky {
    width: 100%;
    min-width: 0;
}

.manifest .container.section-center {
    min-width: 0;
}

.manifest__title {
    width: 100%;
    min-width: 0;
    max-width: min(100%, 1120px) !important;
    overflow: visible;
    letter-spacing: 0;
}

.manifest__line {
    display: grid;
    grid-template-areas: "manifest-stack";
    min-width: 0;
    overflow: hidden;
}

.manifest__text {
    position: relative;
    inset: auto;
    grid-area: manifest-stack;
    max-width: 100%;
    min-width: 0;
    padding-inline: clamp(4px, 1.4vw, 18px);
    overflow: visible;
    line-height: 1.08;
    letter-spacing: 0;
    overflow-wrap: anywhere;
    text-wrap: balance;
    white-space: normal !important;
    word-break: normal;
}

@media (min-width: 992px) {
    .manifest .container.section-center {
        width: min(calc(100% - 64px), 1120px);
        max-width: 1120px;
    }

    .manifest__title {
        font-size: clamp(30px, 3.2vw, 42px);
        line-height: 1.08;
    }

    .manifest__line {
        min-height: 1.24em;
    }
}

@media (min-width: 761px) and (max-width: 991px) {
    .manifest .container.section-center {
        width: min(calc(100% - 40px), 760px);
        max-width: 760px;
    }

    .manifest__title {
        font-size: clamp(27px, 4.2vw, 34px);
        line-height: 1.08;
    }

    .manifest__line {
        min-height: 1.24em;
    }
}

@media (max-width: 760px) {
    .manifest .container.section-center {
        width: min(calc(100% - 28px), 460px);
        max-width: 460px;
    }

    .manifest__title {
        font-size: clamp(22px, 7vw, 30px);
        line-height: 1.1;
    }

    .manifest__text {
        padding-inline: 0;
    }
}

@media (max-width: 420px) {
    .manifest .container.section-center {
        width: min(calc(100% - 24px), 380px);
    }

    .manifest__title {
        font-size: clamp(20px, 6.4vw, 24px);
    }
}
#purchase-calculator,
#purchase-online,
#purchase-exchange,
#purchase-maternity {
    scroll-margin-top: calc(var(--header-height, 88px) + 24px);
}

.purchase-hero h1 {
    max-width: min(100%, 1120px);
    font-size: clamp(44px, 5.15vw, 78px);
    line-height: 1.02;
    letter-spacing: 0;
    text-wrap: balance;
}

.purchase-method-card {
    position: relative;
    color: inherit;
    grid-template-rows: auto 1fr;
    min-width: 0;
    overflow: visible;
    text-decoration: none;
    cursor: pointer;
    transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.purchase-method-card::after {
    position: absolute;
    right: clamp(18px, 1.8vw, 26px);
    bottom: clamp(16px, 1.8vw, 24px);
    content: "↓";
    color: rgba(15, 93, 69, .58);
    font-size: 18px;
    line-height: 1;
    transition: color .2s ease, transform .2s ease;
}

.purchase-method-card:hover,
.purchase-method-card:focus-visible {
    border-color: rgba(15, 93, 69, .52);
    background: #fffaf3;
    box-shadow: 0 18px 38px rgba(2, 36, 65, .08);
    transform: translateY(-2px);
}

.purchase-method-card:hover::after,
.purchase-method-card:focus-visible::after {
    color: #0f5d45;
    transform: translateY(3px);
}

.purchase-method-card h2 {
    min-width: 0;
    padding-right: 18px;
    overflow-wrap: normal;
    text-wrap: balance;
}

.purchase-method-card p {
    padding-right: 18px;
}

.purchase-method-card--online h2 {
    max-width: 260px;
    white-space: normal;
}

.purchase-online {
    padding: clamp(68px, 7vw, 104px) 0 clamp(70px, 7.4vw, 108px);
    background: #fffaf3;
}

.purchase-online__grid {
    display: grid;
    grid-template-columns: minmax(0, .82fr) minmax(440px, 1fr);
    gap: clamp(38px, 5vw, 82px);
    align-items: center;
}

.purchase-online .tag {
    display: inline-flex;
    width: fit-content;
    min-height: 32px;
    align-items: center;
    padding: 8px 22px;
    margin-bottom: 22px;
    color: #0f5d45;
    background: #f1e2ce;
    border: 1px solid rgba(224, 191, 154, .6);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.purchase-online h2 {
    max-width: 640px;
    margin: 0 0 24px;
    color: #022441;
    font-size: clamp(42px, 4.6vw, 70px);
    line-height: .98;
    letter-spacing: 0;
    text-wrap: balance;
}

.purchase-online__copy p {
    max-width: 640px;
    margin: 0 0 30px;
    color: rgba(28, 32, 24, .78);
    font-size: clamp(16px, 1.15vw, 18px);
    line-height: 1.5;
}

.purchase-online__steps {
    display: grid;
    overflow: hidden;
    background: #f7f7f5;
    border: 1px solid rgba(224, 191, 154, .58);
    border-radius: 8px;
    box-shadow: 0 22px 52px rgba(2, 36, 65, .08);
}

.purchase-online__step {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: clamp(18px, 2vw, 28px);
    padding: clamp(24px, 2.8vw, 36px);
    border-bottom: 1px solid rgba(224, 191, 154, .5);
}

.purchase-online__step:last-child {
    border-bottom: 0;
}

.purchase-online__step > span {
    color: #e0bf9a;
    font-family: var(--font-body);
    font-size: clamp(25px, 2.4vw, 36px);
    line-height: 1;
}

.purchase-online__step h3 {
    margin: 0 0 10px;
    color: #022441;
    font-size: clamp(20px, 1.7vw, 27px);
    line-height: 1.05;
    letter-spacing: 0;
}

.purchase-online__step p {
    margin: 0;
    color: rgba(28, 32, 24, .72);
    font-size: 15px;
    line-height: 1.45;
}

@media (max-width: 1180px) {
    .purchase-method-card {
        padding-right: clamp(20px, 2vw, 28px);
        padding-left: clamp(20px, 2vw, 28px);
    }

    .purchase-method-card h2 {
        font-size: clamp(17px, 1.75vw, 21px);
    }
}

@media (max-width: 1040px) {
    .purchase-online__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .purchase-hero h1 {
        max-width: 100%;
        font-size: clamp(28px, 8.2vw, 34px);
        line-height: 1.1;
        text-wrap: normal;
    }

    .purchase-method-card::after {
        right: 20px;
        bottom: 20px;
    }

    .purchase-method-card--online h2 {
        max-width: none;
    }

    .purchase-online {
        padding: 56px 0 62px;
    }

    .purchase-online h2 {
        font-size: clamp(32px, 10vw, 45px);
    }

    .purchase-online__copy p,
    .purchase-online__step p {
        font-size: 13px;
    }

    .purchase-online__step {
        grid-template-columns: 38px minmax(0, 1fr);
        padding: 22px;
    }

    .purchase-online__step > span {
        font-size: 24px;
    }
}
@media (min-width: 961px) {
    .contacts__copy h2 {
        width: auto;
        max-width: min(100%, 680px);
        overflow-wrap: normal;
        text-wrap: balance;
    }
}
.planning-catalog__more {
    display: flex;
    justify-content: center;
    margin-top: clamp(30px, 4vw, 48px);
}

.planning-catalog__more .button {
    min-width: min(100%, 260px);
}

.full-catalog-page {
    background-color: #fff8ee;
    background-image: url("../images/pattern-cream.webp");
    background-position: center top;
    background-size: clamp(520px, 52vw, 960px) auto;
    background-repeat: repeat;
}

.full-catalog-page,
.full-catalog-page * {
    min-width: 0;
}

.full-catalog-hero {
    position: relative;
    overflow: hidden;
    padding: calc(var(--header-height, 88px) + clamp(28px, 3.8vw, 56px)) 0 clamp(56px, 6.8vw, 92px);
    color: #fff;
    background-color: #022441;
    background-image:
        url("../images/happy-life-pattern.webp"),
        radial-gradient(64% 58% at 50% 0%, rgba(224, 191, 154, .56) 0%, rgba(224, 191, 154, .24) 42%, rgba(224, 191, 154, 0) 74%),
        linear-gradient(180deg, #d9c2a8 0%, #aaa69e 22%, #707f86 45%, #31516a 69%, #022441 100%);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover, 100% 100%, 100% 100%;
}

.full-catalog-hero .breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin: 0 0 clamp(42px, 5.5vw, 76px);
    color: rgba(28, 32, 24, .56);
    font-size: clamp(13px, 1vw, 16px);
    font-weight: 600;
    line-height: 1;
}

.full-catalog-hero .breadcrumbs a {
    color: rgba(28, 32, 24, .58);
    text-decoration: none;
}

.full-catalog-hero .breadcrumbs span,
.full-catalog-hero .breadcrumbs span[aria-hidden="true"] {
    color: #0f5d45;
}

.full-catalog-hero__copy {
    max-width: 1040px;
}

.full-catalog-hero h1 {
    max-width: 1040px;
    margin: 0 0 clamp(18px, 2vw, 28px);
    color: #fff;
    font-size: clamp(50px, 5.4vw, 86px);
    line-height: .98;
    letter-spacing: normal;
    text-wrap: balance;
}

.full-catalog-hero p {
    max-width: 720px;
    margin: 0;
    color: rgba(255, 255, 255, .86);
    font-size: clamp(17px, 1.35vw, 22px);
    line-height: 1.34;
}

.full-catalog {
    padding: clamp(58px, 6.4vw, 92px) 0 clamp(78px, 8vw, 118px);
}

.full-catalog__container {
    display: grid;
    gap: clamp(28px, 3.4vw, 44px);
}

.full-catalog__filters {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
    align-items: end;
    padding: clamp(20px, 2.2vw, 28px);
}

.full-catalog-filter {
    display: grid;
    gap: 8px;
}

.full-catalog-filter label,
.full-catalog-filter > label,
.full-catalog-filter--checkbox span {
    line-height: 1;
}

.full-catalog-filter select,
.full-catalog-filter input[type="text"] {
    width: 100%;
    padding: 0 13px;
    background: #fffaf3;
    font: inherit;
    outline: none;
}

.full-catalog-filter select:focus,
.full-catalog-filter input[type="text"]:focus {
    border-color: #0f5d45;
    box-shadow: 0 0 0 3px rgba(15, 93, 69, .12);
}

.full-catalog-filter--range {
    grid-column: span 2;
}

.full-catalog-filter--range > div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.full-catalog-filter--checkbox {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 13px;
    border-radius: 6px;
    cursor: pointer;
}

.full-catalog-filter--checkbox input {
    width: 18px;
    height: 18px;
    accent-color: #0f5d45;
}

.full-catalog-filter--checkbox-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.full-catalog-filter--checkbox-group .full-catalog-filter--checkbox {
    min-width: 0;
    white-space: nowrap;
}

.full-catalog__filter-actions {
    grid-column: span 2;
    display: flex;
    gap: 12px;
    align-items: center;
}

.full-catalog__filter-actions .button {
    min-height: 44px;
}

.full-catalog__reset {
    color: rgba(2, 36, 65, .62);
    font-size: 13px;
    font-weight: 700;
    text-decoration-thickness: .8px;
    text-underline-offset: 4px;
}

.full-catalog__grid.apartment-grid--catalog {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2vw, 24px);
    overflow: visible;
}

.full-catalog__grid .planning-flat-card.apartment-card--catalog,
.full-catalog__grid .planning-flat-card.apartment-card--catalog:last-child {
    grid-template-rows: auto minmax(0, 1fr);
    min-height: 0;
}

.full-catalog__grid .planning-flat-card .apartment-card__image {
    min-height: clamp(288px, 22vw, 320px);
    padding: clamp(20px, 2.2vw, 30px) clamp(22px, 2.8vw, 34px) 14px;
    overflow: hidden;
    align-items: center;
    justify-items: center;
    place-items: center;
}

.full-catalog__grid .planning-flat-card .apartment-card__image img {
    width: min(100%, 310px);
    max-width: 310px;
    max-height: 265px;
    height: auto;
    object-fit: contain;
}

.full-catalog__grid .planning-flat-card .apartment-card__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 18px clamp(22px, 2.4vw, 30px) 24px;
}

.full-catalog__grid .planning-flat-card .apartment-card__button {
    width: 100%;
    margin-top: auto;
}

.full-catalog-card__meta {
    margin: -2px 0 14px;
    color: rgba(28, 32, 24, .58);
    font-size: 13px;
    line-height: 1.35;
}

.full-catalog__empty {
    background: rgba(255, 253, 249, .9);
}

.full-catalog__pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: center;
    margin-top: clamp(10px, 2vw, 24px);
}

.full-catalog__pagination-pages {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: center;
}

.full-catalog__pagination-link,
.full-catalog__pagination-ellipsis {
    min-width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 13px;
    color: #022441;
    border: 1px solid rgba(224, 191, 154, .74);
    border-radius: 6px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
}

.full-catalog__pagination-link--wide {
    min-width: 94px;
}

.full-catalog__pagination-link:hover,
.full-catalog__pagination-link:focus-visible,
.full-catalog__pagination-link.is-current {
    color: #fff;
    background: #0f5d45;
    border-color: #0f5d45;
}

.full-catalog__pagination-ellipsis {
    background: transparent;
    border-color: transparent;
}

@media (max-width: 1100px) {
    .full-catalog__filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .full-catalog-filter--range,
    .full-catalog__filter-actions {
        grid-column: span 1;
    }

    .full-catalog__grid.apartment-grid--catalog {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .full-catalog-hero {
        padding-top: calc(var(--header-height, 78px) + 22px);
        padding-bottom: 44px;
    }

    .full-catalog-hero .breadcrumbs {
        gap: 6px;
        margin-bottom: 30px;
        font-size: 12px;
    }

    .full-catalog-hero h1 {
        font-size: clamp(34px, 10.5vw, 46px);
        line-height: 1.03;
        text-wrap: normal;
    }

    .full-catalog-hero p {
        font-size: 13px;
    }

    .full-catalog {
        padding: 44px 0 68px;
    }

    .full-catalog__filters,
    .full-catalog__grid.apartment-grid--catalog {
        grid-template-columns: 1fr;
    }

    .full-catalog__grid .planning-flat-card .apartment-card__image {
        min-height: clamp(286px, 84vw, 318px);
        padding: 20px 22px 12px;
    }

    .full-catalog__grid .planning-flat-card .apartment-card__image img {
        width: min(100%, 300px);
        max-width: 300px;
        max-height: 264px;
    }

    .full-catalog-filter--range > div {
        grid-template-columns: 1fr;
    }

    .full-catalog__pagination {
        justify-content: flex-start;
    }
}
@media (max-width: 640px) {
    .catalog .planning-catalog__grid .planning-flat-card .apartment-card__image {
        padding: 18px 18px 8px;
        overflow: hidden;
        align-items: center;
        justify-items: center;
        place-items: center;
    }

    .catalog .planning-catalog__grid .planning-flat-card .apartment-card__image img {
        max-height: 108px;
    }
}
.full-catalog-page {
    background: #f4f4f2;
}

.full-catalog {
    background: #f4f4f2;
}

.full-catalog__filters {
    background: rgba(255, 255, 255, .94);
    border: 1px solid rgba(2, 36, 65, .12);
    border-radius: 8px;
    box-shadow: none;
}

.full-catalog-filter label,
.full-catalog-filter > label,
.full-catalog-filter--checkbox span {
    color: rgba(2, 36, 65, .68);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.full-catalog-filter select,
.full-catalog-filter input[type="text"] {
    min-height: 44px;
    color: #022441;
    background-color: #fff;
    border: 1px solid rgba(2, 36, 65, .18);
    border-radius: 6px;
    box-shadow: 0 1px 0 rgba(2, 36, 65, .03);
    font-size: 14px;
}

.full-catalog-filter select {
    appearance: none;
    padding-right: 38px;
    background-image:
        linear-gradient(45deg, transparent 50%, rgba(2, 36, 65, .72) 50%),
        linear-gradient(135deg, rgba(2, 36, 65, .72) 50%, transparent 50%);
    background-position:
        calc(100% - 18px) 50%,
        calc(100% - 13px) 50%;
    background-repeat: no-repeat;
    background-size: 5px 5px, 5px 5px;
}

.full-catalog-filter select:hover,
.full-catalog-filter input[type="text"]:hover,
.full-catalog-filter--checkbox:hover {
    border-color: rgba(2, 36, 65, .32);
}

.full-catalog-filter select:focus,
.full-catalog-filter input[type="text"]:focus,
.full-catalog-filter--checkbox:focus-within {
    border-color: #0b5b43;
    box-shadow: 0 0 0 3px rgba(11, 91, 67, .12);
}

.full-catalog-filter--checkbox {
    background: #fff;
    border: 1px solid rgba(2, 36, 65, .18);
    box-shadow: 0 1px 0 rgba(2, 36, 65, .03);
}

.full-catalog__results {
    position: relative;
    z-index: 1;
    display: grid;
    gap: clamp(28px, 3.4vw, 44px);
}

.full-catalog__container.is-loading .full-catalog__results {
    opacity: .48;
    pointer-events: none;
    transition: opacity .18s ease;
}

.full-catalog__grid .planning-flat-card.apartment-card--catalog,
.full-catalog__grid .planning-flat-card.apartment-card--catalog:last-child {
    background: #fff;
    border: 1px solid rgba(2, 36, 65, .06);
    border-radius: 18px;
    box-shadow: none;
}

.full-catalog__pagination-link,
.full-catalog__pagination-ellipsis {
    background: #fff;
    border-color: rgba(2, 36, 65, .14);
}
@media (max-width: 640px) {
    .flat-tabs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        min-height: 0;
        overflow: visible;
    }

    .flat-tabs button {
        min-width: 0;
        min-height: 42px;
        padding: 8px 10px;
        white-space: normal;
        line-height: 1.12;
    }
}
.full-catalog__filters {
    position: relative;
    z-index: 30;
    overflow: visible;
}

.full-catalog-filter .custom-select {
    z-index: 1;
}

.full-catalog-filter .custom-select.is-open {
    z-index: 40;
}

.full-catalog-select .custom-select__trigger {
    min-height: 44px;
    padding: 0 42px 0 14px;
    background: #fff;
    border: 1px solid rgba(2, 36, 65, .18);
    border-radius: 8px;
    box-shadow: 0 1px 0 rgba(2, 36, 65, .03);
    font-size: 14px;
    line-height: 1.15;
}

.full-catalog-select .custom-select__trigger:hover {
    border-color: rgba(2, 36, 65, .32);
    background: #fffdfa;
}

.full-catalog-select.custom-select.is-open .custom-select__trigger,
.full-catalog-select .custom-select__trigger:focus-visible {
    border-color: #0b5b43;
    box-shadow: 0 0 0 3px rgba(11, 91, 67, .12);
}

.full-catalog-select .custom-select__chevron {
    right: 15px;
    color: #0b5b43;
}

.full-catalog-select .custom-select__menu {
    top: calc(100% + 8px);
    width: max(100%, 238px);
    max-width: min(320px, calc(100vw - 32px));
    padding: 6px;
    background: rgba(255, 255, 255, .99);
    border: 1px solid rgba(2, 36, 65, .12);
    border-radius: 12px;
    box-shadow: 0 20px 48px rgba(2, 36, 65, .16), 0 5px 14px rgba(2, 36, 65, .08);
}

.full-catalog-select.custom-select.is-dropup .custom-select__menu {
    top: auto;
    bottom: calc(100% + 8px);
}

.full-catalog-select .custom-select__option {
    min-height: 38px;
    padding: 9px 11px;
    border-radius: 8px;
    font-size: 13px;
}

.full-catalog-select .custom-select__option[hidden] {
    display: none;
}

.full-catalog-select .custom-select__option:hover,
.full-catalog-select .custom-select__option:focus-visible,
.full-catalog-select .custom-select__option.is-active {
    color: #022441;
    background: rgba(224, 191, 154, .24);
}

.full-catalog-select .custom-select__option.is-selected {
    color: #0b5b43;
    background: rgba(11, 91, 67, .1);
    font-weight: 700;
}

#catalog-sort + .custom-select__control [data-custom-select-value] {
    white-space: nowrap;
}

.full-catalog__filter-actions {
    justify-content: flex-end;
}

.full-catalog__filter-actions .button {
    min-width: 190px;
}

@media (min-width: 1101px) {
    .full-catalog__filters {
        grid-template-columns: repeat(12, minmax(0, 1fr));
    }

    .full-catalog-filter {
        grid-column: span 2;
    }

    .full-catalog-filter--range {
        grid-column: span 3;
    }

    .full-catalog-filter--range:has(input[name="floor_min"]) {
        grid-column: span 2;
    }

    .full-catalog-filter:has(#catalog-sort) {
        grid-column: span 3;
    }

    .full-catalog-filter--checkbox-group {
        grid-column: span 4;
    }

    .full-catalog__filter-actions {
        grid-column: 10 / span 3;
    }
}

@media (max-width: 760px) {
    .full-catalog-select .custom-select__menu {
        width: 100%;
        max-width: 100%;
    }

    .full-catalog__filter-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .full-catalog__filter-actions .button {
        width: 100%;
        min-width: 0;
    }

    .full-catalog__reset {
        text-align: center;
    }
}
@media (min-width: 1181px) {
    .flat-hero {
        grid-template-columns: minmax(0, 52%) minmax(0, 48%);
        min-height: 100vh;
        min-height: 100svh;
    }

    body.admin-bar .flat-hero {
        min-height: calc(100vh - var(--wp-admin--admin-bar--height, 32px));
        min-height: calc(100svh - var(--wp-admin--admin-bar--height, 32px));
    }

    .flat-hero__visual {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: calc(100vh - var(--header-height));
        min-height: calc(100svh - var(--header-height));
        padding-top: 48px;
    }

    body.admin-bar .flat-hero__visual {
        min-height: calc(100vh - var(--header-height) - var(--wp-admin--admin-bar--height, 32px));
        min-height: calc(100svh - var(--header-height) - var(--wp-admin--admin-bar--height, 32px));
    }

    .flat-hero__favorite {
        min-width: 150px;
    }

    .flat-price-row span {
        margin-top: 6px;
        font-size: 13px;
    }

    .flat-specs dt {
        margin-bottom: 6px;
    }

    .flat-tabs {
        top: 0;
        right: 0;
        left: 0;
        z-index: 2;
    }

    .flat-tabs button {
        padding: 0 12px;
    }

    .flat-plan-viewer {
        flex: 0 0 auto;
        width: 100%;
    }

    .flat-hero__stats {
        flex: 0 0 auto;
    }
}

@media (min-width: 1181px) and (max-height: 820px) {

    .flat-hero__info > .breadcrumbs {
        font-size: 13px;
    }

    .flat-hero__title-row {
        gap: 10px 14px;
    }

    .flat-hero__reserve,
    .flat-hero__favorite {
        min-height: 40px;
        padding: 10px 20px;
    }

    .flat-price-row {
        margin-bottom: 12px;
    }

    .flat-price-row strong {
        font-size: clamp(27px, 2.35vw, 34px);
    }

    .flat-price-row__mortgage strong {
        font-size: clamp(21px, 1.8vw, 28px);
    }

    .flat-features span {
        min-height: 26px;
        padding: 5px 12px;
    }

    .flat-tabs {
        min-height: 44px;
    }

    .flat-hero__visual {
        padding-top: 44px;
    }

    .flat-hero__stats {
        padding-top: 8px;
    }

    .flat-hero__stats b {
        font-size: 46px;
    }
}
.flat-mortgage__grid--calculator {
    width: min(100% - 64px, 1320px);
    grid-template-columns: minmax(280px, .62fr) minmax(640px, 1.38fr);
    gap: clamp(44px, 5.2vw, 88px);
}

.flat-mortgage__calculator {
    min-width: 0;
}

.flat-mortgage__calculator .vida-mortgage-demo,
.flat-mortgage__calculator .vida-demo-card {
    width: 100%;
}

.flat-mortgage__calculator .vida-demo-card {
    padding: clamp(30px, 3.2vw, 46px);
}

.flat-mortgage__calculator .vida-demo-card label {
    grid-template-columns: minmax(140px, 190px) minmax(0, 1fr);
    gap: 18px 22px;
}

.flat-mortgage__calculator .vida-demo-card input,
.flat-mortgage__calculator .vida-demo-card select {
    border-color: rgba(2, 36, 65, .18);
    border-radius: 8px;
    box-shadow: 0 1px 0 rgba(2, 36, 65, .03);
}

.flat-mortgage__calculator .vida-demo-card input:hover,
.flat-mortgage__calculator .vida-demo-card select:hover {
    border-color: rgba(2, 36, 65, .32);
}

.flat-mortgage__calculator .vida-demo-card input:focus,
.flat-mortgage__calculator .vida-demo-card select:focus {
    border-color: #0b5b43;
    outline: none;
    box-shadow: 0 0 0 3px rgba(11, 91, 67, .12);
}

.flat-mortgage__calculator .vida-demo-card select {
    appearance: none;
    padding-right: 42px;
    background-image:
        linear-gradient(45deg, transparent 50%, rgba(2, 36, 65, .72) 50%),
        linear-gradient(135deg, rgba(2, 36, 65, .72) 50%, transparent 50%);
    background-position:
        calc(100% - 19px) 50%,
        calc(100% - 13px) 50%;
    background-repeat: no-repeat;
    background-size: 6px 6px, 6px 6px;
}

.flat-mortgage-select {
    z-index: 1;
}

.flat-mortgage-select.is-open {
    z-index: 50;
}

.flat-mortgage-select .custom-select__trigger {
    min-height: 46px;
    width: 100%;
    margin: 0;
    padding: 0 44px 0 14px;
    color: #022441;
    background: #fff;
    border: 1px solid rgba(2, 36, 65, .18);
    border-radius: 8px;
    box-shadow: 0 1px 0 rgba(2, 36, 65, .03);
    font-size: 14px;
    font-weight: 700;
}

.flat-mortgage-select .custom-select__trigger:hover {
    border-color: rgba(2, 36, 65, .32);
    background: #fffdfa;
}

.flat-mortgage-select.custom-select.is-open .custom-select__trigger,
.flat-mortgage-select .custom-select__trigger:focus-visible {
    border-color: #0b5b43;
    box-shadow: 0 0 0 3px rgba(11, 91, 67, .12);
}

.flat-mortgage-select .custom-select__chevron {
    right: 16px;
    color: #0b5b43;
}

.flat-mortgage-select .custom-select__menu {
    top: calc(100% + 8px);
    padding: 6px;
    background: rgba(255, 255, 255, .99);
    border: 1px solid rgba(2, 36, 65, .12);
    border-radius: 12px;
    box-shadow: 0 20px 48px rgba(2, 36, 65, .16), 0 5px 14px rgba(2, 36, 65, .08);
}

.flat-mortgage-select.custom-select.is-dropup .custom-select__menu {
    top: auto;
    bottom: calc(100% + 8px);
}

.flat-mortgage-select .custom-select__option {
    min-height: 38px;
    width: 100%;
    margin: 0;
    padding: 9px 11px;
    color: #022441;
    background: transparent;
    border-radius: 8px;
    font-size: 13px;
}

.flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__trigger,
.flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__option {
    width: 100%;
    margin: 0;
    color: #022441;
    border-radius: 8px;
    box-shadow: none;
}

.flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__trigger {
    min-height: 48px;
    background: #fff;
}

.flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__option {
    min-height: 38px;
    background: transparent;
}

.flat-mortgage-select .custom-select__option:hover,
.flat-mortgage-select .custom-select__option:focus-visible,
.flat-mortgage-select .custom-select__option.is-active,
.flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__option:hover,
.flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__option:focus-visible,
.flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__option.is-active {
    color: #022441;
    background: rgba(224, 191, 154, .24);
}

.flat-mortgage-select .custom-select__option.is-selected,
.flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__option.is-selected {
    color: #0b5b43;
    background: rgba(11, 91, 67, .1);
    font-weight: 700;
}

@media (max-width: 1100px) {
    .flat-mortgage__grid--calculator {
        width: min(100% - 44px, 1180px);
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .flat-mortgage__grid--calculator {
        width: min(100% - 32px, 1180px);
    }

    .flat-mortgage__calculator .vida-demo-card {
        padding: 24px 18px;
    }
}
@media (min-width: 1181px) {
    .flat-page {
        background: #f4f0e9;
    }

    .flat-hero,
    body.admin-bar .flat-hero {
        grid-template-columns: minmax(0, 50.5%) minmax(0, 49.5%);
        min-height: clamp(600px, 46vw, 700px);
        background: #f4f0e9;
    }

    .flat-hero__info {
        align-self: start;
        padding: clamp(30px, 3.4vw, 56px) clamp(40px, 4.2vw, 68px) clamp(28px, 3vw, 48px);
    }

    .flat-hero__info > .breadcrumbs {
        margin-bottom: clamp(22px, 2.2vw, 34px);
    }

    .flat-hero__title-row {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 14px 18px;
        margin-bottom: clamp(18px, 1.8vw, 26px);
    }

    .flat-hero h1 {
        width: 100%;
        flex: 0 0 100%;
        max-width: 720px;
        font-size: clamp(40px, 3.6vw, 58px);
        line-height: .96;
        letter-spacing: normal;
    }

    .flat-hero__reserve,
    .flat-hero__favorite {
        min-height: 44px;
        padding: 12px 24px;
        font-size: 12px;
    }

    .flat-price-row {
        grid-template-columns: minmax(0, 1fr) minmax(220px, .86fr);
        gap: clamp(20px, 3.2vw, 52px);
        margin-bottom: clamp(18px, 2vw, 28px);
    }

    .flat-price-row strong {
        font-size: clamp(31px, 2.65vw, 44px);
    }

    .flat-price-row__mortgage strong {
        font-size: clamp(22px, 2vw, 31px);
    }

    .flat-specs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 650px;
        margin-bottom: clamp(18px, 2vw, 28px);
    }

    .flat-specs__wide {
        grid-column: auto;
    }

    .flat-specs div {
        min-height: 76px;
        padding: 15px 18px;
        border-right: 1px solid rgba(224, 191, 154, .92);
        border-bottom: 1px solid rgba(224, 191, 154, .92);
    }

    .flat-specs div:nth-child(2n),
    .flat-specs div:last-child {
        border-right: 0;
    }

    .flat-specs div:nth-last-child(-n+2) {
        border-bottom: 0;
    }

    .flat-specs dt {
        font-size: 13px;
    }

    .flat-specs dd {
        font-size: clamp(23px, 2vw, 30px);
    }

    .flat-features h2 {
        margin-bottom: 12px;
        font-size: 13px;
    }

    .flat-features span {
        min-height: 30px;
        padding: 7px 15px;
        font-size: 12px;
    }

    .flat-hero__visual,
    body.admin-bar .flat-hero__visual {
        display: grid;
        grid-template-rows: 48px minmax(340px, 1fr) auto;
        min-height: 0;
        padding-top: 0;
        align-self: stretch;
        justify-content: initial;
        background: #022441;
    }

    .flat-tabs {
        position: static;
        min-height: 48px;
    }

    .flat-tabs button {
        font-size: 13px;
    }

    .flat-plan-viewer {
        display: flex;
        min-height: clamp(335px, 31vw, 445px);
        padding: clamp(42px, 4.2vw, 72px) clamp(54px, 6vw, 104px) clamp(22px, 2.2vw, 34px);
    }

    .flat-plan-viewer figure {
        width: min(68%, 500px);
        max-width: 500px;
    }

    .flat-plan-viewer img {
        max-height: clamp(280px, 27vw, 380px);
    }

    .flat-plan-viewer__arrow--prev {
        left: clamp(36px, 4vw, 72px);
    }

    .flat-plan-viewer__arrow--next {
        right: clamp(36px, 4vw, 72px);
    }

    .flat-hero__stats {
        width: min(72%, 560px);
        margin: 0 auto;
        padding: 0 0 clamp(34px, 3.6vw, 58px);
        gap: clamp(54px, 7vw, 116px);
    }

    .flat-hero__stats span {
        font-size: 13px;
    }

    .flat-hero__stats b {
        font-size: clamp(42px, 4vw, 58px);
    }

    .flat-mortgage {
        padding: clamp(48px, 5vw, 74px) 0 clamp(58px, 6vw, 88px);
        overflow: visible;
    }

    .flat-mortgage__grid--calculator {
        width: min(100% - 64px, 1180px);
        display: grid;
        grid-template-columns: minmax(300px, .78fr) minmax(0, 1.22fr);
        gap: clamp(20px, 2.4vw, 34px) clamp(56px, 7vw, 118px);
        align-items: start;
    }

    .flat-mortgage__intro {
        grid-column: 1;
    }

    .flat-mortgage__intro h2,
    .flat-mortgage h2 {
        margin: 0 0 clamp(24px, 2.6vw, 36px);
        font-size: clamp(42px, 4.1vw, 62px);
        line-height: .98;
        letter-spacing: normal;
    }

    .flat-mortgage__intro p,
    .flat-mortgage__base-price {
        display: none;
    }

    .flat-mortgage__calculator {
        grid-column: 1;
        min-width: 0;
    }

    .flat-mortgage__calculator .vida-mortgage-demo {
        max-width: 380px;
        margin: 0;
    }

    .flat-mortgage__calculator .vida-demo-card {
        padding: 0;
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .flat-mortgage__calculator .vida-demo-card h2,
    .flat-mortgage__calculator .vida-demo-card > p {
        display: none;
    }

    .flat-mortgage__calculator .vida-demo-card label {
        grid-template-columns: minmax(112px, .72fr) minmax(0, 1fr);
        gap: 14px 18px;
        margin: 0 0 12px;
        align-items: center;
        font-size: 14px;
        line-height: 1.15;
    }

    .flat-mortgage__calculator .vida-demo-card input,
    .flat-mortgage__calculator .vida-demo-card select,
    .flat-mortgage-select .custom-select__trigger,
    .flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__trigger {
        min-height: 38px;
        padding: 8px 12px;
        background: #fffdf8;
        border: 1px solid rgba(95, 162, 79, .55);
        border-radius: 3px;
        box-shadow: none;
        font-size: 13px;
        font-weight: 500;
    }

    .flat-mortgage-select .custom-select__trigger,
    .flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__trigger {
        padding-right: 38px;
    }

    .flat-mortgage__calculator .vida-demo-card button:not(.custom-select__trigger):not(.custom-select__option) {
        min-height: 44px;
        margin-top: 12px;
        border-radius: 999px;
        background: #0b5b43;
        font-size: 13px;
    }

    .flat-mortgage__calculator .vida-demo-result {
        margin-top: 14px;
        padding: 14px 16px;
        border-radius: 6px;
        background: rgba(95, 162, 79, .11);
    }

    .flat-mortgage__programs {
        grid-column: 2;
        grid-row: 1 / span 2;
        align-self: center;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: clamp(26px, 3vw, 42px) clamp(42px, 5vw, 78px);
        padding-top: clamp(6px, 1vw, 12px);
    }

    .flat-mortgage__programs article,
    .flat-mortgage__programs article:nth-child(1),
    .flat-mortgage__programs article:nth-child(2),
    .flat-mortgage__programs article:nth-child(3) {
        grid-column: auto;
        min-height: 0;
        padding: 0;
        background: transparent;
        border: 0;
        box-shadow: none;
    }

    .flat-mortgage__programs h3,
    .flat-mortgage__programs article:nth-child(1) h3,
    .flat-mortgage__programs article:nth-child(2) h3,
    .flat-mortgage__programs article:nth-child(3) h3 {
        min-height: 0;
        margin: 0 0 10px;
        font-size: clamp(18px, 1.55vw, 23px);
        line-height: 1.08;
        letter-spacing: normal;
    }

    .flat-mortgage__programs p,
    .flat-mortgage__programs article:nth-child(1) p,
    .flat-mortgage__programs article:nth-child(2) p {
        min-height: 0;
        max-width: 290px;
        margin: 0;
        font-size: 14px;
        line-height: 1.32;
    }

    .flat-mortgage__programs .button {
        grid-column: 1 / -1;
        min-height: 48px;
        margin-top: clamp(8px, 1vw, 14px);
        border-radius: 999px;
    }
}

@media (min-width: 1181px) and (max-height: 820px) {
    .flat-hero,
    body.admin-bar .flat-hero {
        min-height: clamp(560px, 44vw, 650px);
    }

    .flat-hero__info {
        padding-top: 26px;
        padding-bottom: 28px;
    }

    .flat-hero h1 {
        font-size: clamp(36px, 3vw, 46px);
    }

    .flat-plan-viewer {
        min-height: clamp(300px, 30vw, 370px);
        padding-top: 34px;
        padding-bottom: 18px;
    }

    .flat-plan-viewer figure {
        width: min(68%, 420px);
    }

    .flat-plan-viewer img {
        max-height: 300px;
    }
}

@media (max-width: 1180px) {
    .flat-mortgage__grid--calculator {
        width: min(100% - 44px, 1180px);
        grid-template-columns: 1fr;
    }

    .flat-mortgage__programs {
        grid-column: auto;
        grid-row: auto;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px 32px;
    }
}

@media (max-width: 760px) {
    .flat-mortgage__programs {
        grid-template-columns: 1fr;
    }
}
.flat-mortgage__calculator .vida-demo-card h2,
.flat-mortgage__calculator .vida-demo-card > p {
    display: none;
}

@media (min-width: 1181px) and (max-height: 820px) {
    .flat-hero__info > .breadcrumbs {
        margin-bottom: 18px;
    }

    .flat-hero__title-row {
        margin-bottom: 14px;
    }

    .flat-price-row,
    .flat-specs {
        margin-bottom: 14px;
    }

    .flat-specs div {
        min-height: 68px;
        padding: 12px 16px;
    }

    .flat-features h2 {
        margin-bottom: 8px;
    }

    .flat-hero__stats {
        margin: 0 auto 24px;
        padding-bottom: 0;
    }
}

@media (max-width: 760px) {
    .flat-mortgage__calculator .vida-demo-card label {
        grid-template-columns: 1fr;
        gap: 7px;
        align-items: start;
    }

    .flat-mortgage__calculator .vida-demo-card input,
    .flat-mortgage__calculator .vida-demo-card select,
    .flat-mortgage-select,
    .flat-mortgage-select .custom-select__trigger,
    .flat-mortgage__calculator .vida-demo-card .flat-mortgage-select .custom-select__trigger {
        width: 100%;
        min-width: 0;
    }
}
.purchase-page .purchase-hero .breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin: 0 0 clamp(28px, 3.6vw, 54px);
    color: rgba(28, 32, 24, .56);
    font-size: clamp(13px, .95vw, 15px);
    font-weight: 700;
    line-height: 1.2;
}

.purchase-page .purchase-hero .breadcrumbs a {
    color: rgba(28, 32, 24, .6);
    text-decoration: none;
}

.purchase-page .purchase-hero .breadcrumbs span,
.purchase-page .purchase-hero .breadcrumbs span[aria-hidden="true"] {
    color: #0f5d45;
}

.purchase-mortgage-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: clamp(20px, 2.2vw, 28px);
}

.purchase-mortgage-tabs__item,
.purchase-mortgage-tabs__item:nth-child(even),
.purchase-mortgage-tabs__item:nth-last-child(-n + 2) {
    min-height: 48px;
    border: 0;
}

.purchase-calculator__programs {
    display: none;
}

.purchase-calculator {
    padding-top: clamp(26px, 2.8vw, 36px);
}

.purchase-calculator h3 {
    max-width: 560px;
    line-height: 1.06;
}

.purchase-calculator > p {
    margin-bottom: 24px;
}

.purchase-calculator__fields {
    gap: 16px;
}

.purchase-calculator__result {
    margin-top: 24px;
    border-radius: 6px;
}

@media (min-width: 761px) and (max-width: 900px) {
    .purchase-methods__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .purchase-method-card,
    .purchase-method-card:first-child,
    .purchase-method-card:last-child {
        min-height: 178px;
        border: 1px solid rgba(224, 191, 154, .72);
        border-top-width: 2px;
        border-radius: 9px;
    }

    .purchase-method-card h2,
    .purchase-method-card p {
        max-width: none;
    }
}

@media (max-width: 760px) {
    .purchase-page .purchase-hero .breadcrumbs {
        gap: 6px;
        margin-bottom: 26px;
        font-size: 12px;
    }

    .purchase-method-card {
        min-height: 126px;
    }

    .purchase-mortgage-tabs {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1px;
        margin-bottom: 18px;
    }

    .purchase-mortgage-tabs__item,
    .purchase-mortgage-tabs__item:nth-child(even),
    .purchase-mortgage-tabs__item:nth-last-child(-n + 2) {
        min-height: 50px;
        padding: 9px 7px;
        font-size: 11px;
        line-height: 1.18;
    }

    .purchase-calculator {
        padding: 24px 20px 22px;
        border-radius: 10px;
    }

    .purchase-calculator h3 {
        font-size: clamp(23px, 7.2vw, 28px);
        line-height: 1.08;
    }

    .purchase-calculator > p {
        margin-bottom: 20px;
        line-height: 1.35;
    }

    .purchase-calculator__field > span {
        font-size: 11px;
        letter-spacing: .035em;
    }

    .purchase-calculator__field input[type="text"] {
        min-height: 42px;
        border-radius: 6px;
    }

    .purchase-calculator__result {
        padding: 18px 16px;
        margin-top: 22px;
    }
}
@media (min-width: 992px) {
    .floating-gallery__caption {
        left: max(22px, calc((100vw - 1240px) / 2));
        right: max(22px, calc((100vw - 1240px) / 2));
    }

    .about__copy-grid {
        width: min(100% - 44px, 1240px);
    }
}
.floating-gallery__card--main {
    border-radius: 0;
}

@media (min-width: 992px) {
    .floating-gallery__card--main {
        clip-path: inset(0 var(--gallery-inset, 24%) round 0);
    }
}

@media (max-width: 991px) {
    .floating-gallery__card--main {
        clip-path: none;
    }
}
@media (min-width: 992px) {
    body.vida-home .about-stats-story .stats-transition .about__stats-shell .stats,
    body.vida-home .about__stats-shell .stats,
    body.vida-home .offers > .container,
    body.vida-home .apartments > .container,
    body.vida-home .render-stories > .container,
    body.vida-home .plan-picker > .container,
    body.vida-home .catalog__container,
    body.vida-home .happy-life__after-scene .happy-life__location-row,
    body.vida-home .happy-life__location-row,
    body.vida-home .purchase__content,
    body.vida-home .news > .container,
    body.vida-home .contacts__grid {
        width: min(100% - 44px, 1240px);
        max-width: 1240px;
    }

    body.vida-home .layouts__grid.container {
        padding-left: max(22px, calc((100vw - 1240px) / 2));
    }

    body.vida-home .happy-life__after-scene {
        padding-left: max(22px, calc((100vw - 1240px) / 2)) !important;
        padding-right: max(22px, calc((100vw - 1240px) / 2)) !important;
    }

    body.vida-home .happy-life__after-scene .happy-life__location-row {
        width: 100% !important;
        max-width: 1240px !important;
    }
}
@media (min-width: 992px) {
    body.vida-home .floating-gallery__caption strong {
        transform: translateX(-0.11em);
    }
}
@media (min-width: 992px) {
    body.vida-home .about__body {
        justify-self: end;
        width: min(100%, 500px);
    }

    body.vida-home .about__body p {
        max-width: none;
    }

    body.vida-home .about-stats-story .stats-transition .about__stats-shell .stat--apartments {
        left: 0;
    }

    body.vida-home .about-stats-story .stats-transition .about__stats-shell .stat--floors,
    body.vida-home .about-stats-story .stats-transition .about__stats-shell .stat--year {
        right: 0;
        align-items: flex-end;
        text-align: right;
    }
}
.planning-page #planning-picker,
.planning-page #planning-catalog {
    scroll-margin-top: 96px;
}

@media (min-width: 992px) {
    .planning-page .planning-top > .container,
.planning-page .planning-gallery--match > .container,
.planning-page .planning-story .plan-picker > .container,
.planning-page .planning-catalog .catalog__container,
.planning-page .contacts__grid {
        width: min(100% - 44px, 1240px) !important;
        max-width: 1240px !important;
    }

    .planning-page .planning-project__visual {
        padding-left: max(22px, calc((100vw - 1240px) / 2));
    }

    .planning-page .planning-project__content {
        padding-right: max(22px, calc((100vw - 1240px) / 2));
    }
}
.planning-page .planning-project__title-line {
    display: block;
}

@media (min-width: 981px) {
    .planning-page .planning-top__copy {
        max-width: 1240px;
    }

    .planning-page .planning-top__copy h1 {
        max-width: none;
        white-space: nowrap;
        font-size: clamp(50px, 5vw, 78px);
    }

    .planning-page .planning-project__content h2 {
        max-width: 620px;
        font-size: clamp(36px, 3vw, 45px);
        line-height: 1.02;
        letter-spacing: normal;
        text-wrap: balance;
    }

    .planning-page .planning-project__title-line {
        white-space: nowrap;
    }
}

@media (max-width: 760px) {
    .planning-page .planning-project__content h2 {
        font-size: clamp(29px, 8vw, 34px);
        line-height: 1.04;
    }

    .planning-page .planning-project__title-line {
        white-space: nowrap;
    }
}

@media (max-width: 991px) {
    .planning-page #planning-picker,
    .planning-page #planning-catalog {
        scroll-margin-top: 84px;
    }
}

@media (max-width: 760px) {
    .planning-page .planning-top {
        min-height: 330px;
        padding-top: 52px;
    }

    .planning-page .planning-top .breadcrumbs {
        margin-bottom: 22px;
    }

    .planning-page .planning-top__copy h1 {
        font-size: clamp(37px, 11vw, 48px);
        line-height: 1.02;
    }

    .planning-page .planning-story .plan-picker > .container,
    .planning-page .planning-catalog .catalog__container,
    .planning-page .contacts__grid {
        width: min(100% - 28px, 640px) !important;
    }
}
.purchase-page #purchase-mortgage,
.purchase-page #purchase-calculator,
.purchase-page #purchase-online,
.purchase-page #purchase-exchange,
.purchase-page #purchase-maternity,
.purchase-page #purchase-contacts {
    scroll-margin-top: 96px;
}

.purchase-page #purchase-calculator {
    scroll-margin-top: calc(var(--header-height, 78px) + 42px);
}

@media (min-width: 761px) {
    .purchase-page .purchase-hero > .container,
    .purchase-page .purchase-methods > .container,
    .purchase-page .purchase-mortgage > .container,
    .purchase-page .purchase-online > .container,
    .purchase-page .purchase-exchange > .container,
    .purchase-page .purchase-maternity > .container,
    .purchase-page .purchase-contacts > .container {
        width: min(100% - 44px, 1240px) !important;
        max-width: 1240px !important;
    }
}

@media (min-width: 992px) {
    .purchase-page .purchase-online h2 {
        max-width: 640px;
        font-size: clamp(40px, 4vw, 62px);
        line-height: 1;
    }

    .purchase-page .purchase-exchange h2 {
        max-width: 980px;
        font-size: clamp(40px, 4.05vw, 62px);
        line-height: 1;
    }
}

@media (max-width: 991px) {
    .purchase-page #purchase-mortgage,
    .purchase-page #purchase-calculator,
    .purchase-page #purchase-online,
    .purchase-page #purchase-exchange,
    .purchase-page #purchase-maternity,
    .purchase-page #purchase-contacts {
        scroll-margin-top: 84px;
    }

    .purchase-page #purchase-calculator {
        scroll-margin-top: 108px;
    }
}
.contacts-page .contacts-page-hero {
    min-height: clamp(520px, 38vw, 620px);
    padding-bottom: clamp(54px, 6vw, 84px);
}

.contacts-page .contacts-page-hero,
.contacts-page .contacts-page-hero * {
    overflow-wrap: normal;
    word-break: normal;
}

.contacts-page .contacts-page-hero .breadcrumbs {
    margin-bottom: clamp(42px, 5.2vw, 74px);
}

.contacts-page .contacts-page-hero__grid {
    grid-template-columns: 1fr;
    gap: clamp(32px, 4vw, 50px);
}

.contacts-page .contacts-page-hero h1 {
    width: 100%;
    max-width: 1240px;
    font-size: clamp(54px, 4.6vw, 74px);
    line-height: 1.02;
    letter-spacing: 0;
    text-wrap: balance;
}

.contacts-page .contacts-page-hero__details {
    grid-template-columns: minmax(230px, .82fr) minmax(340px, 1.12fr) minmax(390px, 1.38fr);
    gap: clamp(18px, 2vw, 30px);
    align-items: start;
    max-width: none;
    padding-top: 0;
}

.contacts-page .contacts-page-hero__detail a,
.contacts-page .contacts-page-hero__detail strong {
    max-width: none;
    font-size: clamp(21px, 1.65vw, 26px);
    line-height: 1.08;
    letter-spacing: normal;
}

.contacts-page .contacts-page-hero__detail a[href^="mailto:"] {
    letter-spacing: normal;
}

@media (min-width: 1100px) {
    .contacts-page .contacts-page-hero__detail a,
    .contacts-page .contacts-page-hero__detail strong {
        white-space: nowrap;
    }
}

.contacts-page .contacts-map__card {
    left: max(22px, calc((100vw - 1240px) / 2));
}

/* Карта контактов повторяет чистую картографическую систему главной страницы. */
.contacts-page .contacts-map-layout {
    position: relative;
}

.contacts-page .contacts-map {
    height: clamp(350px, 31vw, 440px);
    background: #022441;
}

.contacts-page .contacts-map__hours {
    position: absolute;
    top: clamp(20px, 2.4vw, 32px);
    left: max(22px, calc((100vw - 1240px) / 2));
    z-index: 4;
    width: min(310px, calc(100% - 44px));
    padding: 18px 20px 17px;
    color: #fff;
    background: rgba(2, 36, 65, .94);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 16px;
    box-shadow: 0 18px 46px rgba(2, 36, 65, .26);
    backdrop-filter: blur(14px);
    pointer-events: none;
}

.contacts-page .contacts-map__hours-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 15px;
}

.contacts-page .contacts-map__hours-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    color: #022441;
    background: #e0bf9a;
    border-radius: 50%;
}

.contacts-page .contacts-map__hours-icon svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.contacts-page .contacts-map__hours-heading div {
    display: grid;
    gap: 3px;
}

.contacts-page .contacts-map__hours-heading span:not(.contacts-map__hours-icon) {
    color: rgba(255, 255, 255, .62);
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.contacts-page .contacts-map__hours-heading strong {
    color: #fff;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
}

.contacts-page .contacts-map__schedule {
    display: grid;
    gap: 0;
    margin: 0;
}

.contacts-page .contacts-map__schedule > div {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    padding: 8px 0;
    align-items: baseline;
    border-top: 1px solid rgba(255, 255, 255, .12);
}

.contacts-page .contacts-map__schedule dt,
.contacts-page .contacts-map__schedule dd {
    margin: 0;
    color: #fff;
    font-size: 14px;
    line-height: 1.15;
}

.contacts-page .contacts-map__schedule dt {
    color: rgba(255, 255, 255, .68);
    font-weight: 600;
}

.contacts-page .contacts-map__schedule dd {
    font-weight: 800;
    letter-spacing: .01em;
}

.contacts-page .contacts-map__canvas::before,
.contacts-page .contacts-map__card {
    display: none;
}

.contacts-page .contacts-map .happy-life__map-instance [class*="ground-pane"] {
    filter: grayscale(.72) saturate(.42) sepia(.10) hue-rotate(116deg) brightness(1.08) contrast(.93);
}

.contacts-page .contacts-map .happy-life__map-instance [class*="controls-pane"],
.contacts-page .contacts-map .happy-life__map-instance [class*="zoom"],
.contacts-page .contacts-map .happy-life__map-instance [class*="fullscreen"] {
    display: none !important;
}

.contacts-page .contacts-map .vida-yandex-logo-pin {
    display: grid;
    width: 82px;
    height: 52px;
    min-width: 0;
    padding: 0;
    place-items: center;
    background: #022441;
    border: 0;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(2, 36, 65, .3);
    transform: translate(-50%, -50%);
    transition: box-shadow .2s ease, transform .2s ease;
}

.contacts-page .contacts-map .vida-yandex-logo-pin::after,
.contacts-page .contacts-map .vida-yandex-logo-pin > span {
    display: none;
}

.contacts-page .contacts-map .vida-yandex-logo-pin__logo {
    position: relative;
    width: 68px;
    height: 38px;
    padding: 3px 5px;
    overflow: hidden;
    background: #fff8ee;
    border: 0;
    border-radius: 9px;
    box-sizing: border-box;
}

.contacts-page .contacts-map .vida-yandex-logo-pin img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: contain;
}

.contacts-page .contacts-map .vida-yandex-logo-pin:hover {
    box-shadow: 0 16px 32px rgba(2, 36, 65, .36);
    transform: translate(-50%, -50%) scale(1.06);
}

.contacts-page .contacts-map .vida-yandex-poi-pin--logo {
    display: inline-flex;
    width: 82px;
    height: 52px;
    padding: 0;
    align-items: center;
    justify-content: center;
    background: #022441;
    border: 0;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(2, 36, 65, .3);
    transform: translate(calc(-50% + var(--pin-offset-x)), calc(-50% + var(--pin-offset-y))) scale(1);
}

.contacts-page .contacts-map .vida-yandex-poi-pin--logo::after {
    display: none;
}

.contacts-page .contacts-map .vida-yandex-poi-pin--logo:hover {
    filter: none;
    box-shadow: 0 16px 32px rgba(2, 36, 65, .36);
    transform: translate(calc(-50% + var(--pin-offset-x)), calc(-50% + var(--pin-offset-y))) scale(1.06);
}

.contacts-page .contacts-map .vida-yandex-poi-pin--logo.vida-yandex-poi-pin--office {
    width: 58px;
    height: 58px;
    border-radius: 50%;
}

.contacts-page .contacts-map .vida-yandex-poi-pin__media {
    position: relative;
    z-index: 1;
    display: grid;
    width: 68px;
    height: 38px;
    padding: 5px 6px;
    overflow: hidden;
    place-items: center;
    background: #fff8ee;
    border-radius: 9px;
    box-sizing: border-box;
}

.contacts-page .contacts-map .vida-yandex-poi-pin__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.contacts-page .contacts-map .vida-yandex-poi-pin--office .vida-yandex-poi-pin__media {
    width: 50px;
    height: 50px;
    padding: 0;
    background: transparent;
    border-radius: 50%;
}

@media (min-width: 761px) and (max-width: 1099px) {
    .contacts-page .contacts-page-hero h1 {
        max-width: 760px;
        font-size: clamp(50px, 7vw, 64px);
    }

    .contacts-page .contacts-page-hero__details {
        grid-template-columns: 1fr;
        max-width: 680px;
    }
}

@media (max-width: 760px) {
    .contacts-page .contacts-map-layout {
        display: flex;
        flex-direction: column;
        background: #fff8ee;
    }

    .contacts-page .contacts-map {
        height: 420px;
    }

    .contacts-page .contacts-map__hours {
        position: relative;
        top: auto;
        right: auto;
        left: auto;
        width: auto;
        margin: 14px 14px 18px;
        padding: 14px 16px 13px;
        border-radius: 14px;
    }

    .contacts-page .contacts-map__hours-heading {
        gap: 10px;
        margin-bottom: 10px;
    }

    .contacts-page .contacts-map__hours-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }

    .contacts-page .contacts-map__hours-icon svg {
        width: 20px;
        height: 20px;
    }

    .contacts-page .contacts-map__hours-heading strong {
        font-size: 19px;
    }

    .contacts-page .contacts-map__schedule {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }

    .contacts-page .contacts-map__schedule > div {
        display: grid;
        grid-template-columns: 1fr;
        gap: 3px;
        padding: 8px 9px;
        background: rgba(255, 255, 255, .08);
        border: 0;
        border-radius: 9px;
    }

    .contacts-page .contacts-map__schedule dt,
    .contacts-page .contacts-map__schedule dd {
        font-size: 12px;
        white-space: nowrap;
    }

    .contacts-page .contacts-map .vida-yandex-logo-pin {
        width: 72px;
        height: 46px;
    }

    .contacts-page .contacts-map .vida-yandex-logo-pin__logo {
        width: 60px;
        height: 34px;
        padding: 5px;
    }

    .contacts-page .contacts-map .vida-yandex-poi-pin--logo {
        width: 72px;
        height: 46px;
    }

    .contacts-page .contacts-map .vida-yandex-poi-pin--logo.vida-yandex-poi-pin--office {
        width: 52px;
        height: 52px;
    }

    .contacts-page .contacts-map .vida-yandex-poi-pin__media {
        width: 60px;
        height: 34px;
        padding: 5px;
    }

    .contacts-page .contacts-map .vida-yandex-poi-pin--office .vida-yandex-poi-pin__media {
        width: 44px;
        height: 44px;
    }

    .contacts-page .contacts-page-hero {
        min-height: 562px;
        padding-bottom: 34px;
    }

    .contacts-page .contacts-page-hero .breadcrumbs {
        margin-bottom: 42px;
    }

    .contacts-page .contacts-page-hero__grid {
        gap: 24px;
    }

    .contacts-page .contacts-page-hero h1 {
        font-size: clamp(32px, 9.2vw, 38px);
        line-height: 1.03;
    }

    .contacts-page .contacts-page-hero__details {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .contacts-page .contacts-page-hero__detail a,
    .contacts-page .contacts-page-hero__detail strong {
        font-size: clamp(19px, 5.6vw, 23px);
        line-height: 1.08;
    }

    .contacts-page .contacts-page-hero__detail a[href^="mailto:"] {
        font-size: clamp(16px, 4.6vw, 18px);
    }
}
@media (max-width: 760px) {
    .company-page .company-hero h1 {
        max-width: 100%;
        font-size: clamp(31px, 8.6vw, 36px);
        line-height: 1.04;
        letter-spacing: 0;
        text-wrap: balance;
        overflow-wrap: normal;
        word-break: normal;
    }

    .company-page .company-hero h1 span {
        white-space: normal;
    }
}

@media (min-width: 981px) {
    .company-page .company-hero h1 {
        max-width: none;
        white-space: nowrap;
    }

    .company-page .company-hero h1 br {
        display: none;
    }

    .company-page .company-hero h1 span {
        margin-left: .18em;
    }
}

@media (max-width: 760px) {
    .agents-page .agents-hero__content {
        width: min(100% - 32px, 640px) !important;
        max-width: 640px;
        margin-inline: auto;
    }

    .agents-page .agents-hero h1 {
        max-width: 100%;
        font-size: clamp(38px, 10.8vw, 44px);
        line-height: .98;
        letter-spacing: 0;
        overflow-wrap: normal;
        word-break: normal;
    }

    .agents-page .agents-hero .eyebrow {
        max-width: 100%;
        font-size: clamp(14px, 4vw, 16px);
        line-height: 1.25;
    }

    .agents-page .agents-hero p:not(.eyebrow) {
        max-width: 100%;
        font-size: clamp(16px, 4.6vw, 18px);
        line-height: 1.38;
    }

    .agents-page .agents-form-section__grid,
    .agents-page .agents-form,
    .agents-page .agents-form label {
        min-width: 0;
    }

    .agents-page .agents-form select {
        max-width: 100%;
    }
}
.planning-page .planning-project__visual[data-reveal],
.planning-page .planning-project__content[data-reveal],
.company-page .company-about__statement[data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto;
}

@media (min-width: 981px) {
    .planning-page .planning-project__visual {
        min-height: clamp(500px, 35vw, 640px);
        padding-top: clamp(46px, 4vw, 68px);
        padding-bottom: clamp(34px, 3.1vw, 52px);
    }

    .planning-page .planning-project__plan {
        width: min(100%, 430px);
    }

    .planning-page .planning-project__numbers {
        width: min(100%, 430px);
        margin-top: clamp(26px, 2.4vw, 38px);
    }

    .planning-page .planning-project__numbers b {
        font-size: clamp(34px, 3.1vw, 46px);
    }
}

.purchase-page .purchase-mortgage__stat {
    min-width: 0;
}

.purchase-page .purchase-mortgage__stats strong,
.purchase-page .purchase-mortgage__stats span {
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}

.purchase-page .purchase-mortgage__stat--limit strong {
    font-size: clamp(26px, 2.25vw, 36px);
    line-height: 1.02;
    text-wrap: balance;
}

@media (min-width: 981px) and (max-width: 1240px) {
    .purchase-page .purchase-mortgage__layout {
        grid-template-columns: minmax(0, .98fr) minmax(340px, .82fr);
        gap: clamp(30px, 3.6vw, 52px);
    }

    .purchase-page .purchase-mortgage__stats {
        max-width: 680px;
    }
}

.company-page .company-projects h2 {
    max-width: none;
    text-wrap: balance;
}

@media (min-width: 761px) {
    .company-page .company-projects h2 {
        white-space: nowrap;
        font-size: clamp(42px, 4.4vw, 68px);
        line-height: 1;
    }
}

.contacts-page .contacts-team__viewport {
    display: grid;
    width: min(100% - 44px, 1240px);
    max-width: 1240px;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    grid-auto-flow: row;
    gap: clamp(30px, 3vw, 46px);
    justify-content: center;
    justify-items: center;
    margin-inline: auto;
    overflow: visible;
    padding: 0;
    scroll-padding-inline: 0;
    scroll-snap-type: none;
}

.contacts-page .contacts-team-card {
    width: min(100%, 210px);
    scroll-snap-align: unset;
}

.contacts-page .contacts-team-card__photo {
    width: min(100%, 210px);
}

@media (max-width: 760px) {
    .contacts-page .contacts-team__viewport {
        width: 100%;
        max-width: none;
        grid-template-columns: none;
        grid-auto-columns: clamp(144px, 42vw, 168px);
        grid-auto-flow: column;
        gap: 18px;
        justify-content: start;
        justify-items: stretch;
        margin-inline: 0;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0 16px 18px;
        scroll-padding-inline: 16px;
        scroll-snap-type: x proximity;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .contacts-page .contacts-team-card {
        width: 100%;
        scroll-snap-align: start;
    }

    .contacts-page .contacts-team-card__photo {
        width: min(100%, 150px);
    }

    .contacts-page .contacts-team-card h3 {
        font-size: clamp(18px, 5vw, 22px);
    }

    .contacts-page .contacts-team-card p {
        font-size: 12px;
        line-height: 1.14;
    }
}

@media (min-width: 981px) {
    .agents-page .agents-tools__copy h2 {
        white-space: nowrap;
        font-size: clamp(36px, 3.15vw, 46px);
        line-height: 1;
    }
}

@media (max-width: 980px) {
    .purchase-page .purchase-mortgage__layout,
    .purchase-page .purchase-mortgage__content,
    .purchase-page .purchase-mortgage__side {
        min-width: 0;
    }

    .purchase-page .purchase-mortgage__stat {
        grid-template-columns: minmax(86px, max-content) minmax(0, 1fr);
    }

    .purchase-page .purchase-mortgage__stat--limit strong {
        font-size: clamp(24px, 6.6vw, 30px);
        text-wrap: normal;
    }

    .agents-page .agents-tools__copy h2 {
        max-width: 100%;
        font-size: clamp(30px, 8vw, 38px);
        line-height: 1.02;
        white-space: nowrap;
    }
}
.purchase-page .purchase-mortgage__content[data-reveal],
.purchase-page .purchase-mortgage__side[data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto;
}

.purchase-page .purchase-mortgage__stats {
    display: grid;
    gap: clamp(10px, 1.1vw, 14px);
    margin: 0 0 clamp(28px, 3vw, 42px);
    border-top: 0;
}

.purchase-page .purchase-mortgage__stat,
.purchase-page .purchase-mortgage__stat:last-child {
    display: grid;
    grid-template-columns: 1fr;
    align-content: start;
    gap: 8px;
    min-height: 112px;
    min-width: 0;
    border: 1px solid rgba(15, 93, 69, .18);
    border-radius: 8px;
    background: #fffaf3;
}

.purchase-page .purchase-mortgage__stats strong,
.purchase-page .purchase-mortgage__stat--limit strong {
    display: block;
    margin: 0;
    color: #022441;
    font-size: clamp(28px, 2.45vw, 39px);
    letter-spacing: 0;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}

.purchase-page .purchase-mortgage__stat--limit strong {
    font-size: clamp(27px, 2.2vw, 34px);
}

.purchase-page .purchase-mortgage__stats span {
    display: block;
    color: rgba(28, 32, 24, .58);
    font-size: 13px;
    line-height: 1.25;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}

@media (min-width: 981px) and (max-width: 1180px) {
    .purchase-page .purchase-mortgage__stat,
    .purchase-page .purchase-mortgage__stat:last-child {
        min-height: 102px;
        padding: 16px 14px;
    }

    .purchase-page .purchase-mortgage__stats strong,
    .purchase-page .purchase-mortgage__stat--limit strong {
        font-size: clamp(24px, 2.45vw, 31px);
    }

    .purchase-page .purchase-mortgage__stats span {
        font-size: 12px;
    }
}

@media (max-width: 980px) {
    .purchase-page .purchase-mortgage__stats {
        grid-template-columns: 1fr;
        gap: 10px;
        width: 100%;
        max-width: 560px;
    }

    .purchase-page .purchase-mortgage__stat,
    .purchase-page .purchase-mortgage__stat:last-child {
        grid-template-columns: minmax(112px, max-content) minmax(0, 1fr);
        align-items: center;
        min-height: 0;
        padding: 14px 16px;
    }

    .purchase-page .purchase-mortgage__stats strong,
    .purchase-page .purchase-mortgage__stat--limit strong {
        font-size: clamp(26px, 6.6vw, 32px);
    }

    .purchase-page .purchase-mortgage__stats span {
        max-width: none;
        font-size: 12px;
    }
}

@media (max-width: 380px) {
    .purchase-page .purchase-mortgage__stat,
    .purchase-page .purchase-mortgage__stat:last-child {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}
.purchase-page .purchase-mortgage__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    max-width: 700px;
}

.purchase-page .purchase-mortgage__stat,
.purchase-page .purchase-mortgage__stat:last-child {
    container-type: inline-size;
    overflow: hidden;
    padding: clamp(16px, 1.4vw, 22px) clamp(14px, 1.35vw, 20px);
}

.purchase-page .purchase-mortgage__stats strong,
.purchase-page .purchase-mortgage__stat--limit strong {
    max-width: 100%;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(28px, 2.4vw, 32px);
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    text-wrap: nowrap;
}

.purchase-page .purchase-mortgage__stats span {
    max-width: 100%;
}

@media (max-width: 1180px) and (min-width: 981px) {
    .purchase-page .purchase-mortgage__stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 540px;
    }

    .purchase-page .purchase-mortgage__stat--limit {
        grid-column: 1 / -1;
    }
}

@media (max-width: 980px) and (min-width: 761px) {
    .purchase-page .purchase-mortgage__stat,
    .purchase-page .purchase-mortgage__stat:last-child {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 6px;
    }

    .purchase-page .purchase-mortgage__stats span {
        width: 100%;
    }
}

@media (max-width: 760px) {
    .purchase-page .purchase-mortgage__stats {
        grid-template-columns: 1fr;
        max-width: 520px;
    }
}

.purchase-page .purchase-mortgage__content h2 {
    font-size: clamp(34px, 3.4vw, 47px);
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
}

@media (max-width: 760px) {
    .purchase-page .purchase-mortgage__content h2 {
        font-size: clamp(22px, 6.8vw, 34px);
    }
}

.purchase-page .purchase-calculator__note {
    margin: clamp(12px, 1.4vw, 16px) 0 0;
    color: rgba(255, 255, 255, .72);
    font-size: 13px;
    line-height: 1.45;
}

.purchase-page .purchase-calculator__note:empty {
    display: none;
}

/* Информационный режим траншевой ипотеки на странице «Способы покупки». */
.purchase-page .purchase-calculator__standard[hidden],
.purchase-page .purchase-calculator__info[hidden] {
    display: none !important;
}

.purchase-page .purchase-calculator__info {
    min-width: 0;
}

.purchase-page .purchase-calculator__standard > p {
    margin: 0 0 24px;
    color: rgba(255, 255, 255, .66);
    font-size: 13px;
}

.purchase-page .purchase-calculator__info h3 {
    max-width: 600px;
    margin: 0 0 clamp(22px, 2.2vw, 30px);
}

.purchase-page .purchase-calculator__info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(10px, 1.2vw, 16px);
    margin: 0;
}

.purchase-page .purchase-calculator__info-item {
    display: grid;
    align-content: space-between;
    gap: clamp(14px, 1.8vw, 22px);
    min-width: 0;
    min-height: clamp(122px, 10vw, 150px);
    padding: clamp(18px, 2vw, 28px);
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 8px;
}

.purchase-page .purchase-calculator__info-item--price {
    grid-column: 1 / -1;
    min-height: clamp(102px, 8vw, 124px);
}

.purchase-page .purchase-calculator__info-item dt,
.purchase-page .purchase-calculator__info-item dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.purchase-page .purchase-calculator__info-item dt {
    color: rgba(255, 255, 255, .66);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    line-height: 1.25;
    text-transform: uppercase;
}

.purchase-page .purchase-calculator__info-item dd {
    color: #fff;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: clamp(20px, 1.8vw, 28px);
    font-weight: 500;
    letter-spacing: normal;
    line-height: 1.05;
}

.purchase-page .purchase-calculator__info-item--monthly {
    grid-column: 1 / -1;
    min-height: clamp(102px, 8vw, 124px);
    background: #e0bf9a;
    border-color: #e0bf9a;
    box-shadow: 0 14px 30px rgba(2, 36, 65, .18);
}

.purchase-page .purchase-calculator__info-item--monthly dt {
    color: rgba(2, 36, 65, .68);
}

.purchase-page .purchase-calculator__info-item--monthly dd {
    color: #022441;
    font-size: clamp(23px, 2.1vw, 32px);
}

@media (max-width: 760px) {
    .purchase-page .purchase-calculator__standard > p {
        margin-bottom: 20px;
        line-height: 1.35;
    }

    .purchase-page .purchase-calculator__info h3 {
        margin-bottom: 20px;
    }

    .purchase-page .purchase-calculator__info-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .purchase-page .purchase-calculator__info-item,
    .purchase-page .purchase-calculator__info-item--price,
    .purchase-page .purchase-calculator__info-item--monthly {
        grid-column: auto;
        min-height: 112px;
        padding: 18px;
    }

    .purchase-page .purchase-calculator__info-item dd {
        font-size: clamp(21px, 6vw, 27px);
    }

    .purchase-page .purchase-calculator__info-item--monthly dd {
        font-size: clamp(25px, 7.2vw, 31px);
    }
}
body.vida-home .about__stats-shell .stat,
body.vida-home .about__stats-shell .stat strong,
body.vida-home .about__stats-shell .stat strong span,
body.vida-home .about__stats-shell .stat strong i,
body.vida-home .about__stats-shell .stat__label,
body.vida-home .about__stats-shell .stat small {
    color: #022441;
}
.site-header.is-scrolled,
body:not(.vida-home) .site-header {
    background: #022441;
}

@media (max-width: 1024px) {
    .site-header {
        background: #022441;
    }
}
body.vida-home .happy-life__map.happy-life__map--interactive {
    min-height: 0;
    padding: 0;
    background-color: #022441;
    background-image: none;
}

body.vida-home .happy-life__map-canvas {
    position: relative;
    inset: auto;
    width: 100%;
    height: clamp(330px, 30vw, 430px);
    margin: 0 auto;
    overflow: hidden;
    background: #e8efeb;
}

body.vida-home .happy-life__map-fallback,
body.vida-home .happy-life__map-instance {
    position: absolute;
    inset: 0;
}

body.vida-home .happy-life__map-canvas::before {
    display: none;
}

body.vida-home .happy-life__map-card {
    display: none;
}

body.vida-home .happy-life__map-instance [class*="ground-pane"] {
    filter: grayscale(.72) saturate(.42) sepia(.10) hue-rotate(116deg) brightness(1.08) contrast(.93);
}

body.vida-home .happy-life__map-instance [class*="controls-pane"],
body.vida-home .happy-life__map-instance [class*="zoom"],
body.vida-home .happy-life__map-instance [class*="fullscreen"] {
    display: none !important;
}

body.vida-home .vida-yandex-logo-pin {
    display: grid;
    width: 72px;
    height: 72px;
    min-width: 0;
    padding: 0;
    place-items: center;
    background: #022441;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 18px 36px rgba(2, 36, 65, .32);
    transform: translate(-50%, -50%);
}

body.vida-home .vida-yandex-logo-pin::after,
body.vida-home .vida-yandex-logo-pin > span {
    display: none;
}

body.vida-home .vida-yandex-logo-pin__logo {
    width: 56px;
    height: 42px;
}

body.vida-home .vida-yandex-logo-pin img {
    width: 56px;
    max-height: 42px;
}

body.vida-home .vida-yandex-poi-pin,
body.vida-home .vida-yandex-poi-pin--school,
body.vida-home .vida-yandex-poi-pin--kindergarten,
body.vida-home .vida-yandex-poi-pin--medical {
    display: inline-flex;
    width: 31px;
    height: 31px;
    padding: 0;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: #022441;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 6px 14px rgba(2, 36, 65, .24);
    transform: translate(calc(-50% + var(--pin-offset-x)), calc(-50% + var(--pin-offset-y))) scale(1);
}

body.vida-home .vida-yandex-poi-pin::after {
    display: none;
}

body.vida-home .vida-yandex-poi-pin:hover {
    filter: none;
    box-shadow: 0 10px 20px rgba(2, 36, 65, .32);
    transform: translate(calc(-50% + var(--pin-offset-x)), calc(-50% + var(--pin-offset-y))) scale(1.08);
}

body.vida-home .vida-yandex-poi-pin--status-construction {
    background: #075d46;
    box-shadow:
        0 0 0 2px #f6cf9d,
        0 7px 16px rgba(2, 36, 65, .28);
}

body.vida-home .vida-yandex-poi-pin--status-construction:hover {
    box-shadow:
        0 0 0 2px #f6cf9d,
        0 11px 22px rgba(2, 36, 65, .34);
}

body.vida-home .vida-yandex-poi-pin__icon {
    position: relative;
    z-index: 1;
    display: block;
    width: 17px;
    height: 17px;
    background: #fff;
    -webkit-mask: var(--poi-icon) center / contain no-repeat;
    mask: var(--poi-icon) center / contain no-repeat;
}

body.vida-home .vida-yandex-poi-pin__icon--shopping {
    --poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 8h10l-1.1 10H8.1L7 8Zm2.6-3h2v3h-2V5Zm4.8 0h2v3h-2V5ZM9.2 10l.7 6h4.2l.7-6H9.2Z'/%3E%3C/svg%3E");
}

body.vida-home .vida-yandex-poi-pin__icon--school,
body.vida-home .vida-yandex-poi-pin__icon--kindergarten {
    --poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4 2 9l10 5 8-4v5h2V9L12 4Zm-6 8.2V16c2.1 2.2 9.9 2.2 12 0v-3.8l-6 3-6-3Z'/%3E%3C/svg%3E");
}

body.vida-home .vida-yandex-poi-pin__icon--medical {
    --poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 3h6v6h6v6h-6v6H9v-6H3V9h6V3Z'/%3E%3C/svg%3E");
}

body.vida-home .vida-yandex-poi-pin__icon--transport {
    --poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 3h12c1.1 0 2 .9 2 2v9.5c0 .8-.7 1.5-1.5 1.5H18l1.5 2H17l-1.5-2h-7L7 18H4.5L6 16h-.5c-.8 0-1.5-.7-1.5-1.5V5c0-1.1.9-2 2-2Zm1 3v5h10V6H7Zm.5 7.1a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Zm9 0a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z'/%3E%3C/svg%3E");
}

body.vida-home .vida-yandex-poi-pin__icon--place {
    --poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E");
}

body.vida-home .vida-yandex-poi-pin__abbr {
    display: none;
}

@media (max-width: 760px) {
    body.vida-home .happy-life__map.happy-life__map--interactive {
        padding: 0;
    }

    body.vida-home .happy-life__map-canvas {
        height: 420px;
    }

    body.vida-home .vida-yandex-logo-pin {
        width: 62px;
        height: 62px;
    }

    body.vida-home .vida-yandex-logo-pin__logo,
    body.vida-home .vida-yandex-logo-pin img {
        width: 50px;
        max-height: 36px;
    }

    body.vida-home .vida-yandex-poi-pin {
        width: 29px;
        height: 29px;
    }

    body.vida-home .vida-yandex-poi-pin__icon {
        width: 16px;
        height: 16px;
    }
}
body.vida-home .stats-transition > .home-location {
    position: relative;
    z-index: 4;
}

body.vida-home .home-location {
    margin: 0;
    padding: 0 !important;
    overflow: hidden;
    color: #fff;
    background: #022441;
}

body.vida-home .home-location .happy-life__after-scene {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    min-height: clamp(230px, 21vw, 320px) !important;
    align-items: center !important;
    padding: clamp(64px, 6.2vw, 112px) max(22px, calc((100vw - 1240px) / 2)) clamp(54px, 5.4vw, 92px) !important;
    margin: 0 !important;
    background: #022441 !important;
}

body.vida-home .home-location .happy-life__location-row {
    display: grid !important;
    width: min(100%, 1240px) !important;
    max-width: 1240px !important;
    grid-template-columns: minmax(0, .94fr) minmax(360px, .86fr) !important;
    column-gap: clamp(48px, 8vw, 122px) !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
}

body.vida-home .home-location .happy-life__location-row h3 {
    max-width: 640px !important;
    margin: 0 !important;
    color: #fff !important;
    font-stretch: 100% !important;
    font-size: clamp(42px, 3.8vw, 64px) !important;
    font-weight: 400 !important;
    line-height: 1.02 !important;
    letter-spacing: 0 !important;
}

body.vida-home .home-location .happy-life__location-row p {
    justify-self: end !important;
    max-width: 520px !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(19px, 1.3vw, 24px) !important;
    font-weight: 400 !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
    text-align: right !important;
}

body.vida-home .home-location .happy-life__map.happy-life__map--interactive {
    min-height: 0;
    margin: 0;
    padding: 0;
    background: #022441;
}

@media (max-width: 900px) {
    body.vida-home .home-location .happy-life__after-scene {
        display: block !important;
        min-height: 0 !important;
        padding: clamp(44px, 8vw, 68px) clamp(24px, 5vw, 36px) clamp(34px, 7vw, 56px) !important;
    }

    body.vida-home .home-location .happy-life__location-row {
        display: block !important;
        width: 100% !important;
        max-width: 680px !important;
    }

    body.vida-home .home-location .happy-life__location-row h3 {
        max-width: 540px !important;
        font-size: clamp(36px, 7vw, 54px) !important;
        line-height: 1.02 !important;
    }

    body.vida-home .home-location .happy-life__location-row p {
        max-width: 460px !important;
        margin-top: 22px !important;
        font-size: clamp(17px, 3vw, 22px) !important;
        line-height: 1.14 !important;
        text-align: left !important;
    }

}

@media (max-width: 520px) {
    body.vida-home .home-location .happy-life__after-scene {
        padding: 36px 22px 30px !important;
    }

    body.vida-home .home-location .happy-life__location-row h3 {
        width: 100% !important;
        font-size: clamp(28px, 7.4vw, 32px) !important;
    }

    body.vida-home .home-location .happy-life__location-row p {
        max-width: 340px !important;
        margin-top: 18px !important;
        font-size: clamp(15px, 4.3vw, 18px) !important;
    }
}
@media (min-width: 901px) {
    body.vida-home .happy-life--no-location .happy-life__sticky {
        grid-template-rows: minmax(0, 1fr) !important;
        min-height: calc(100svh - var(--header-height, 88px)) !important;
    }

    body.vida-home .happy-life--no-location .happy-life__main,
    body.vida-home .happy-life--no-location .happy-life__content {
        grid-row: 1 / -1 !important;
        height: 100% !important;
    }

    body.vida-home .happy-life--no-location .happy-life__main {
        min-height: calc(100svh - var(--header-height, 88px)) !important;
    }

    body.vida-home .happy-life--no-location .happy-life__frame {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        padding-top: clamp(44px, 5vw, 76px) !important;
        padding-bottom: clamp(44px, 5vw, 76px) !important;
    }
}
body.vida-home .stats-transition > .render-stories {
    position: relative;
    z-index: 4;
}

body.vida-home .render-story-card h3 {
    font-size: clamp(21px, 1.72vw, 30px) !important;
}

body.vida-home .render-story-card p {
    font-size: clamp(13px, .9vw, 15px) !important;
}

body.vida-home .render-story-card:not(.render-story-card--wide) h3 {
    font-size: clamp(17px, 1.18vw, 23px) !important;
}

body.vida-home .render-story-card:not(.render-story-card--wide) p {
    font-size: clamp(12px, .78vw, 13px) !important;
}

@media (max-width: 900px) {
    body.vida-home .render-stories__grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: none !important;
        grid-template-areas: none !important;
        height: auto !important;
    }

    body.vida-home .render-story-card,
    body.vida-home .render-story-card--wide,
    body.vida-home .render-story-card:nth-child(2),
    body.vida-home .render-story-card:nth-child(3),
    body.vida-home .render-story-card:nth-child(4) {
        grid-area: auto !important;
        grid-column: 1 / -1 !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    body.vida-home .render-story-card:not(.render-story-card--wide) p {
        display: block;
        overflow: visible;
        -webkit-box-orient: initial;
        -webkit-line-clamp: initial;
    }
}
body.vida-home .stats-transition > .layouts {
    position: relative;
    z-index: 4;
    color: #fff;
    background-color: #022441 !important;
    background-image: url("../images/happy-life-pattern.webp") !important;
    background-repeat: repeat-y !important;
    background-position: center top !important;
    background-size: 100% auto !important;
    isolation: isolate;
}

body.vida-home .stats-transition > .layouts .layouts-scene__sticky {
    background-color: transparent !important;
    background-image: none !important;
}
body.vida-home .stats-transition > .offers,
body.vida-home .stats-transition > .offers .offer-card {
    border-radius: 0 !important;
}

body.vida-home .stats-transition > .offers .offer-card {
    background: #f0dfcb !important;
}

body.vida-home .stats-transition > .offers .offer-card::before {
    opacity: .1;
}

body.vida-home .home-plan-purchase {
    background-color: #022441;
    background-image: url("../images/happy-life-pattern.webp");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

body.vida-home .home-plan-purchase > .plan-picker,
body.vida-home .home-plan-purchase > .purchase-story {
    background-color: transparent !important;
    background-image: none !important;
}

/* Agent page: keep key headings editorial but compact on wide screens. */
@media (min-width: 981px) {
    .agents-page .agents-hero h1 {
        max-width: none;
        font-size: clamp(42px, 4.2vw, 60px);
        line-height: .96;
        white-space: nowrap;
    }
}

.agents-page .agents-flow__grid h2 {
    max-width: none;
    font-size: clamp(38px, 3.3vw, 50px);
    line-height: 1;
    white-space: nowrap;
}

.agents-page .agents-form-section {
    scroll-margin-top: calc(var(--header-height, 88px) + 24px);
}

.site-footer__agent-login {
    color: var(--vida-white);
    text-decoration: none;
    border-bottom: 1px solid rgba(255, 255, 255, .42);
    transition: color .2s ease, border-color .2s ease;
}

.site-footer__agent-login:hover,
.site-footer__agent-login:focus-visible {
    color: var(--vida-white);
    border-bottom-color: var(--vida-white);
}

@media (max-width: 640px) {
    .agents-page .agents-flow__grid h2 {
        font-size: clamp(32px, 9vw, 38px);
        white-space: normal;
    }
}

/* Project common areas: one lead image with three supporting details. */
.planning-common-areas {
    position: relative;
    padding: clamp(68px, 7vw, 108px) 0 clamp(76px, 8vw, 124px);
    overflow: hidden;
    color: #022441;
    background-color: #fff8ee;
    background-image:
        linear-gradient(rgba(255, 248, 238, .9), rgba(255, 248, 238, .96)),
        url("../images/planning-pattern-figma.png");
    background-repeat: no-repeat, repeat;
    background-position: center, center top;
    background-size: cover, 720px auto;
}

.planning-common-areas__head {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    align-items: start;
    margin-bottom: clamp(30px, 4vw, 54px);
}

.planning-common-areas__head .eyebrow {
    margin: 0 0 14px;
    color: #0f5d45;
}

.planning-common-areas__head h2 {
    max-width: none;
    margin: 0;
    font-size: clamp(32px, 3.8vw, 52px);
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
}

.planning-common-areas__head > p {
    max-width: 720px;
    margin: 0;
    color: rgba(2, 36, 65, .72);
    font-size: clamp(16px, 1.25vw, 19px);
    line-height: 1.45;
}

.planning-common-areas__grid {
    display: grid;
    grid-template-columns: repeat(13, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 260px));
    gap: 12px;
}

.planning-common-areas__card {
    position: relative;
    min-height: 0;
    margin: 0;
    overflow: hidden;
    background: #d8cec2;
    border-radius: 8px;
    box-shadow: 0 20px 48px rgba(2, 36, 65, .1);
}

.planning-common-areas__card--main {
    grid-column: 1 / 8;
    grid-row: 1 / 3;
}

.planning-common-areas__card--lounge {
    grid-column: 8 / 14;
    grid-row: 1;
}

.planning-common-areas__card--elevators {
    grid-column: 8 / 11;
    grid-row: 2;
}

.planning-common-areas__card--bike {
    grid-column: 11 / 14;
    grid-row: 2;
}

.planning-common-areas__card img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}

.planning-common-areas__card--elevators img {
    object-position: 58% center;
}

.planning-common-areas__card--bike img {
    object-position: 24% center;
}

.planning-common-areas__card::after {
    position: absolute;
    inset: auto 0 0;
    height: 42%;
    content: "";
    background: linear-gradient(180deg, rgba(2, 36, 65, 0), rgba(2, 36, 65, .76));
    pointer-events: none;
}

.planning-common-areas__card figcaption {
    position: absolute;
    right: 20px;
    bottom: 18px;
    left: 20px;
    z-index: 1;
    color: #fff;
    font-size: clamp(15px, 1.2vw, 19px);
    font-weight: 600;
    line-height: 1.15;
}

@media (hover: hover) {
    .planning-common-areas__card:hover img {
        transform: scale(1.025);
    }
}

@media (max-width: 980px) {
    .planning-common-areas__head {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .planning-common-areas__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: 440px 280px 260px;
    }

    .planning-common-areas__card--main {
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .planning-common-areas__card--lounge {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .planning-common-areas__card--elevators {
        grid-column: 1;
        grid-row: 3;
    }

    .planning-common-areas__card--bike {
        grid-column: 2;
        grid-row: 3;
    }
}

@media (max-width: 640px) {
    .planning-common-areas {
        padding: 52px 0 64px;
        background-size: cover, 520px auto;
    }

    .planning-common-areas__head h2 {
        font-size: clamp(32px, 9.5vw, 42px);
        line-height: .98;
        white-space: normal;
    }

    .planning-common-areas__head > p {
        font-size: 15px;
    }

    .planning-common-areas__grid {
        grid-template-columns: 1fr;
        grid-template-rows: 280px repeat(3, 230px);
        gap: 10px;
    }

    .planning-common-areas__card--main,
    .planning-common-areas__card--lounge,
    .planning-common-areas__card--elevators,
    .planning-common-areas__card--bike {
        grid-column: 1;
    }

    .planning-common-areas__card--main { grid-row: 1; }
    .planning-common-areas__card--lounge { grid-row: 2; }
    .planning-common-areas__card--elevators { grid-row: 3; }
    .planning-common-areas__card--bike { grid-row: 4; }

    .planning-common-areas__card figcaption {
        right: 16px;
        bottom: 14px;
        left: 16px;
        font-size: 15px;
    }
}

/* Keep the home offer heading compact and align card copy across each row. */
body.vida-home .stats-transition > .offers .section-heading h2 {
    width: max-content;
    max-width: 100% !important;
    white-space: nowrap;
}

body.vida-home .stats-transition > .apartments .section-heading h2 {
    max-width: none !important;
    white-space: nowrap;
}

body.vida-home .stats-transition > .offers .offer-card h3 {
    min-height: 3.18em;
}

body.vida-home .stats-transition > .offers .offer-card p {
    min-height: 2.9em;
}

@media (max-width: 760px) {
    body.vida-home .stats-transition > .offers .section-heading h2 {
        width: auto;
        white-space: normal;
    }

    body.vida-home .stats-transition > .apartments .section-heading h2 {
        max-width: 100% !important;
        white-space: normal;
    }

    body.vida-home .stats-transition > .offers .offer-card h3,
    body.vida-home .stats-transition > .offers .offer-card p {
        min-height: 0;
    }
}

.plan-picker .genplan-card__media img,
.plan-picker .genplan-card__media:hover img {
    filter: none !important;
}
.planning-story .plan-picker {
    z-index: 3 !important;
}
.plan-picker .genplan-card__media {
    cursor: default;
}

.plan-picker .genplan-card__media:hover img {
    transform: none !important;
}

.plan-picker .genplan-card__zones {
    position: absolute;
    inset: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.plan-picker .genplan-card__zone {
    pointer-events: all;
}

.plan-picker .genplan-card__zone-hit {
    fill: rgba(255, 255, 255, .01);
    stroke: transparent;
    pointer-events: all;
    transition: fill .18s ease;
}

.plan-picker .genplan-card__zone:hover .genplan-card__zone-hit,
.plan-picker .genplan-card__zone:focus-visible .genplan-card__zone-hit {
    fill: rgba(255, 255, 255, .07);
}

.plan-picker .genplan-card__zone-shape {
    fill: none;
    stroke: rgba(255, 255, 255, .98);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: 0;
    pointer-events: none;
    vector-effect: non-scaling-stroke;
    shape-rendering: geometricPrecision;
    transition: opacity .16s ease, filter .16s ease;
    filter: drop-shadow(0 1px 0 rgba(2, 36, 65, .5)) drop-shadow(0 3px 6px rgba(2, 36, 65, .24));
}

.plan-picker .genplan-card__zone:hover .genplan-card__zone-shape,
.plan-picker .genplan-card__zone:focus-visible .genplan-card__zone-shape {
    opacity: 1;
}

.plan-picker .genplan-card__zone-marker {
    pointer-events: none;
    transition: filter .18s ease;
}

.plan-picker .genplan-card__zone:hover .genplan-card__zone-marker,
.plan-picker .genplan-card__zone:focus-visible .genplan-card__zone-marker {
    filter: drop-shadow(0 10px 18px rgba(2, 36, 65, .42));
}

.plan-picker .genplan-card__zone-marker circle {
    fill: #022441;
    stroke: rgba(255, 255, 255, .92);
    stroke-width: 2;
}

.plan-picker .genplan-card__zone-marker text {
    fill: #ffffff;
    font-family: var(--font-body);
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0;
    text-anchor: middle;
    dominant-baseline: middle;
}

@media (max-width: 760px) {
    .plan-picker .genplan-card__zone-shape {
        stroke-width: 2.4;
    }

    .plan-picker .genplan-card__zone-marker text {
        font-size: 15px;
    }
}
@media (min-width: 901px) {
    body.vida-home .happy-life--no-location .happy-life__sticky {
        grid-template-columns: minmax(0, 50vw) minmax(0, 50vw) !important;
    }

    body.vida-home .happy-life--no-location .happy-life__content {
        overflow: hidden !important;
    }

    body.vida-home .happy-life--no-location .happy-life__frame {
        right: 0 !important;
        left: 0 !important;
        width: min(620px, calc(50vw - 22px)) !important;
        max-width: none !important;
        margin-right: auto !important;
        margin-left: auto !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
}

@media (max-width: 900px) {
    body.vida-home .happy-life--no-location .happy-life__frame {
        padding-bottom: clamp(28px, 7vw, 42px) !important;
    }
}

@media (max-width: 760px) {
    body.vida-home .stats-transition > .layouts {
        background-size: auto 760px !important;
        background-position: center top !important;
    }
}
.planning-page #planning-project-title,
.planning-page #planning-gallery-title {
    scroll-margin-top: calc(var(--header-height, 78px) + 32px);
}

/* Keep the first project screen below the fixed site header. */
.planning-page > .planning-project:first-child {
    padding-top: var(--header-height, 78px);
}

.planning-page .planning-catalog {
    padding-bottom: clamp(44px, 4.5vw, 64px) !important;
}

@media (max-width: 640px) {
    .planning-page .planning-catalog {
        padding-bottom: 44px !important;
    }
}
.planning-page .planning-project__render {
    width: min(100%, 620px) !important;
    aspect-ratio: 1542 / 1020;
    margin-inline: auto;
    overflow: hidden;
    background: transparent !important;
    box-shadow: 0 22px 44px rgba(0, 0, 0, .22);
}

.planning-page .planning-project__render > img {
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    object-fit: cover !important;
    background: transparent !important;
}
.planning-page .planning-gallery-match__grid {
    isolation: isolate;
}

.reveal-ready .planning-page .planning-gallery-match__grid [data-reveal],
.planning-page .planning-gallery-match__grid figure {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto;
    z-index: 4;
    isolation: isolate;
    background: #022441;
}

.planning-page .planning-gallery-match__grid figure::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: #022441;
}

.planning-page .planning-gallery-match__grid img {
    position: relative;
    z-index: 1;
    opacity: 1 !important;
    filter: none !important;
    mix-blend-mode: normal !important;
    background: #022441;
}

.planning-page .planning-gallery-match__grid figcaption {
    z-index: 2;
}
.planning-page .planning-story::before {
    z-index: 0 !important;
}

.planning-page .planning-story .planning-gallery--match,
.planning-page .planning-story .plan-picker,
.planning-page .planning-story .planning-story-picker {
    z-index: 1 !important;
}

.planning-page .planning-story .planning-gallery--match {
    background-color: #fff8ee !important;
    background-image:
        url("../images/planning-pattern-figma.png"),
        radial-gradient(58% 36% at 50% 14%, rgba(224, 191, 154, .46) 0%, rgba(224, 191, 154, .18) 44%, rgba(224, 191, 154, 0) 76%),
        linear-gradient(
            180deg,
            #fff8ee 0%,
            #fff8ee 27%,
            #f6e6d1 41%,
            rgba(195, 181, 163, .92) 54%,
            rgba(95, 106, 119, .94) 66%,
            #0f3656 82%,
            #022441 100%
        ) !important;
    background-repeat: repeat-y, no-repeat, no-repeat !important;
    background-position: center top, center top, center top !important;
    background-size: 100% auto, 100% 100%, 100% 100% !important;
}

@media (max-width: 760px) {
    .planning-page .planning-project__render {
        width: min(100%, 360px) !important;
    }
}
.contacts__copy h2 {
    max-width: 760px !important;
    text-wrap: balance;
}

@media (min-width: 1180px) {
    .contacts__copy h2 {
        font-size: clamp(42px, 3.45vw, 48px) !important;
        line-height: 1 !important;
        white-space: normal;
    }
}

@media (min-width: 1600px) {
    .contacts__copy h2 {
        font-size: 54px !important;
    }
}

@media (max-width: 640px) {
    .contacts__copy h2 {
        max-width: 360px !important;
        font-size: clamp(30px, 9.1vw, 34px) !important;
        line-height: .98 !important;
    }
}

/* Commercial property catalog. */
.commerce-page {
    color: #022441;
    background: #f5f6f5;
    overflow: clip;
}

.commerce-page [hidden] {
    display: none !important;
}

.commerce-page .contacts [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto;
}

.commerce-hero {
    min-height: clamp(390px, 42vw, 560px);
    color: #fff;
    background-color: #315a78;
    background-image:
        linear-gradient(180deg, rgba(255, 248, 235, .96) 0%, rgba(244, 232, 213, .78) 28%, rgba(60, 96, 122, .72) 68%, rgba(2, 36, 65, .92) 100%),
        url("../images/pattern-cream.webp");
    background-repeat: no-repeat, repeat;
    background-position: center, center top;
    background-size: cover, 760px auto;
}

.commerce-hero__inner {
    display: flex;
    flex-direction: column;
    min-height: inherit;
    padding-top: clamp(32px, 4vw, 54px);
    padding-bottom: clamp(44px, 5vw, 72px);
}

.commerce-hero__breadcrumbs {
    color: rgba(2, 36, 65, .72);
}

.commerce-hero__breadcrumbs a {
    color: inherit;
}

.commerce-hero__copy {
    width: min(100%, 820px);
    margin-top: auto;
}

.commerce-hero h1 {
    margin: 0 0 clamp(16px, 2vw, 24px);
    color: #fff;
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(58px, 6.2vw, 94px);
    font-weight: 500;
    line-height: .94;
    letter-spacing: 0;
}

.commerce-hero__title-line {
    display: block;
    white-space: nowrap;
}

.commerce-hero__copy p {
    max-width: 700px;
    margin: 0;
    color: rgba(255, 255, 255, .92);
    font-size: clamp(17px, 1.55vw, 23px);
    line-height: 1.32;
}

.commerce-catalog {
    padding: clamp(58px, 6.4vw, 96px) 0 clamp(68px, 7vw, 110px);
    background: #f5f6f5;
}

.commerce-catalog__inner > h2 {
    margin: 0 0 clamp(30px, 3vw, 44px);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-size: clamp(38px, 3.6vw, 58px);
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
}

.commerce-projects {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: min(100%, 760px);
    margin-bottom: 22px;
    border: 1px solid #0b6047;
    border-radius: 7px;
    overflow: hidden;
}

.commerce-projects__button {
    min-height: 48px;
    padding: 10px 18px;
    border: 0;
    border-right: 1px solid #0b6047;
    color: #022441;
    background: transparent;
    font: inherit;
    font-size: 14px;
    cursor: pointer;
    transition: color .2s ease, background-color .2s ease;
}

.commerce-projects__button:last-child {
    border-right: 0;
}

.commerce-projects__button:hover,
.commerce-projects__button:focus-visible,
.commerce-projects__button.is-active {
    color: #fff;
    background: #0b6047;
}

.commerce-filter {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    margin-top: 14px;
    color: rgba(2, 36, 65, .78);
    font-size: 14px;
}

.commerce-filter > span {
    flex: 0 0 116px;
    padding-top: 7px;
}

.commerce-filter__options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.commerce-filter__options button {
    min-height: 34px;
    padding: 6px 14px;
    border: 1px solid rgba(2, 36, 65, .12);
    border-radius: 6px;
    color: #022441;
    background: #fff;
    font: inherit;
    cursor: pointer;
}

.commerce-filter__options button:hover,
.commerce-filter__options button:focus-visible,
.commerce-filter__options button.is-active {
    border-color: #0b6047;
    color: #fff;
    background: #0b6047;
}

.commerce-groups {
    margin-top: clamp(36px, 4vw, 54px);
}

.commerce-group + .commerce-group {
    margin-top: 48px;
}

.commerce-group > h3 {
    margin: 0 0 18px;
    font-size: clamp(24px, 2.1vw, 32px);
    line-height: 1.1;
    letter-spacing: 0;
}

.commerce-group[data-commercial-group="commercial"] > h3 {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.commerce-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(18px, 2vw, 28px);
}

.commerce-card {
    display: grid;
    grid-template-rows: minmax(250px, 1fr) auto;
    min-width: 0;
    min-height: 520px;
    overflow: hidden;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(2, 36, 65, .06);
}

.commerce-card__image {
    display: grid;
    place-items: center;
    min-height: 250px;
    padding: clamp(20px, 2.8vw, 38px);
    background: #fff;
}

.commerce-card__image img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: 290px;
    object-fit: contain;
}

.commerce-card__body {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 0 clamp(20px, 2.2vw, 30px) clamp(20px, 2.2vw, 28px);
}

.commerce-card h4 {
    margin: 0 0 9px;
    font-size: clamp(19px, 1.55vw, 24px);
    line-height: 1.12;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

.commerce-card p {
    margin: 0;
}

.commerce-card__area {
    color: #022441;
    font-size: 15px;
    font-weight: 600;
}

.commerce-card__project {
    margin-top: 9px !important;
    color: #4f9d61;
    font-size: 14px;
    font-weight: 600;
}

.commerce-card__price {
    margin-top: 10px !important;
    color: #022441;
    font-size: clamp(18px, 1.5vw, 23px);
    font-weight: 700;
}

.commerce-card__button {
    width: 100%;
    min-height: 46px;
    margin-top: 22px;
    border: 0;
    border-radius: 999px;
    color: #fff;
    background: #0b6047;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

.commerce-card__button:hover,
.commerce-card__button:focus-visible {
    color: #022441;
    background: #e8bf8b;
}

.commerce-empty {
    max-width: 720px;
    margin: 36px 0 0;
    padding: 22px;
    border-left: 3px solid #e8bf8b;
    background: #fff;
    font-size: 17px;
    line-height: 1.45;
}

.commerce-gallery-shell .planning-gallery--match {
    padding-top: clamp(58px, 6vw, 90px);
}

.commerce-viewing {
    padding: clamp(42px, 5vw, 70px) 0;
    color: #fff;
    background-color: #022441;
    background-image:
        linear-gradient(rgba(2, 36, 65, .88), rgba(2, 36, 65, .94)),
        url("../images/pattern-blue.webp");
    background-repeat: no-repeat, repeat;
    background-position: center, center top;
    background-size: cover, 720px auto;
}

.commerce-viewing__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 34px;
    align-items: center;
}

.commerce-viewing h2 {
    margin: 0 0 10px;
    color: #fff;
    font-size: clamp(32px, 3.2vw, 50px);
    line-height: 1;
    letter-spacing: 0;
}

.commerce-viewing p {
    max-width: 720px;
    margin: 0;
    color: rgba(255, 255, 255, .76);
    font-size: 17px;
    line-height: 1.45;
}

.commerce-viewing .button {
    min-width: 230px;
}

@media (max-width: 980px) {
    .commerce-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .commerce-viewing__inner {
        grid-template-columns: 1fr;
    }

    .commerce-viewing .button {
        width: min(100%, 340px);
    }
}

@media (max-width: 760px) {
    .commerce-hero {
        min-height: 420px;
    }

    .commerce-hero__inner {
        padding-top: 18px;
        padding-bottom: 38px;
    }

    .commerce-hero h1 {
        font-size: clamp(28px, 8.45vw, 44px);
        line-height: 1;
    }

    .commerce-hero__copy p {
        max-width: 330px;
        font-size: 16px;
        line-height: 1.34;
    }

    .commerce-catalog {
        padding: 42px 0 60px;
    }

    .commerce-catalog__inner > h2 {
        margin-bottom: 24px;
        font-size: 34px;
    }

    .commerce-projects {
        margin-bottom: 20px;
    }

    .commerce-projects__button {
        min-height: 44px;
        padding: 8px 6px;
        font-size: 12px;
    }

    .commerce-filter {
        display: block;
    }

    .commerce-filter > span {
        display: block;
        margin-bottom: 8px;
        padding: 0;
    }

    .commerce-groups {
        margin-top: 30px;
    }

    .commerce-group + .commerce-group {
        margin-top: 34px;
    }

    .commerce-group > h3,
    .commerce-group[data-commercial-group="commercial"] > h3 {
        position: static;
        width: auto;
        height: auto;
        margin: 0 0 15px;
        padding: 0;
        overflow: visible;
        clip: auto;
        white-space: normal;
        font-size: 23px;
    }

    .commerce-grid {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: minmax(260px, 84vw);
        gap: 12px;
        width: 100%;
        padding: 2px 2px 16px;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: inline mandatory;
        scrollbar-width: thin;
        scrollbar-color: #0b6047 transparent;
    }

    .commerce-card {
        grid-template-rows: 230px auto;
        min-height: 455px;
        scroll-snap-align: start;
    }

    .commerce-card__image {
        min-height: 230px;
        padding: 18px;
    }

    .commerce-card__body {
        padding: 0 18px 18px;
    }

    .commerce-card h4 {
        font-size: 19px;
    }

    .commerce-card__button {
        min-height: 44px;
        margin-top: 18px;
    }

    .commerce-gallery-shell .planning-gallery--match {
        padding-top: 48px;
    }

    .commerce-gallery-shell .planning-gallery-match__grid {
        grid-template-columns: none;
        grid-auto-columns: min(82vw, 340px);
        grid-auto-flow: column;
        gap: 12px;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0 0 14px;
        scroll-snap-type: x mandatory;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .commerce-gallery-shell .planning-gallery-match__grid::-webkit-scrollbar {
        display: none;
    }

    .commerce-gallery-shell .planning-gallery-match__grid figure,
    .commerce-gallery-shell .planning-gallery-match__wide {
        grid-column: auto;
        grid-row: auto;
        width: 100%;
        min-height: 0;
        aspect-ratio: 1;
        scroll-snap-align: start;
        scroll-snap-stop: normal;
    }

    .commerce-viewing {
        padding: 44px 0;
    }

    .commerce-viewing h2 {
        max-width: 320px;
        font-size: 34px;
    }

    .commerce-viewing p {
        font-size: 15px;
    }

    .commerce-viewing .button {
        min-width: 0;
        min-height: 48px;
    }
}

@media (max-width: 380px) {
    .commerce-grid {
        grid-auto-columns: minmax(250px, 88vw);
    }
}

/* Flat detail: live Domoplaner media tabs and highlighted floor plan. */
.flat-hero__visual[data-flat-media] .flat-tabs {
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
}

.flat-media-panels {
    display: flex;
    width: 100%;
    min-width: 0;
    align-items: center;
    justify-content: center;
}

.flat-media-panel {
    width: 100%;
    min-width: 0;
}

.flat-media-panel.is-active {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flat-plan-viewer__figure {
    display: flex;
    width: min(68%, 500px);
    min-width: 0;
    align-items: center;
    justify-content: center;
}

.flat-plan-viewer__figure--floor {
    width: min(86%, 540px);
    background: transparent;
}

.flat-floor-plan {
    position: relative;
    width: auto;
    max-width: 100%;
    height: clamp(280px, 29vw, 380px);
    overflow: hidden;
    background: #fff;
    line-height: 0;
}

.flat-floor-plan img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: contain;
}

.flat-floor-plan svg {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.flat-floor-plan polygon {
    fill: rgba(238, 70, 47, .4);
    stroke: #ee462f;
    stroke-width: 3;
    vector-effect: non-scaling-stroke;
}

.flat-floor-plan__legend {
    position: absolute;
    right: 10px;
    bottom: 10px;
    z-index: 2;
    display: inline-flex;
    min-height: 30px;
    padding: 6px 10px;
    align-items: center;
    border-radius: 6px;
    color: var(--vida-blue);
    background: rgba(255, 242, 224, .94);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 4px 14px rgba(2, 36, 65, .12);
}

.flat-plan-viewer__arrow {
    z-index: 3;
}

.flat-plan-viewer__arrow[hidden],
.flat-media-panel[hidden],
.flat-plan-viewer__figure[hidden] {
    display: none !important;
}

@media (max-width: 760px) {
    body:not(.menu-open) .site-nav,
    body:not(.menu-open) .site-nav * {
        pointer-events: none !important;
    }

    body.menu-open .site-nav {
        pointer-events: auto;
    }

    .flat-hero__visual[data-flat-media] .flat-tabs {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    }

    .flat-hero__visual[data-flat-media] .flat-tabs button {
        min-width: 0;
        min-height: 42px;
        padding: 8px 10px;
        white-space: normal;
    }

    .flat-plan-viewer__figure {
        width: min(84%, 300px);
    }

    .flat-plan-viewer__figure--floor {
        width: min(90%, 340px);
    }

    .flat-floor-plan {
        height: min(218px, 58vw);
    }

    .flat-floor-plan__legend {
        right: 7px;
        bottom: 7px;
        min-height: 26px;
        padding: 5px 8px;
        font-size: 10px;
    }
}

/* DELOM wordmark: one source asset, recolored precisely for light backgrounds. */
.delom-wordmark {
    display: inline-block;
    width: 174px;
    max-width: 100%;
    aspect-ratio: 174 / 25;
    flex: 0 0 auto;
    color: var(--vida-blue);
    background-color: currentColor;
    -webkit-mask: url("../images/logo-delom-white.svg") center / contain no-repeat;
    mask: url("../images/logo-delom-white.svg") center / contain no-repeat;
}

.delom-wordmark--light {
    color: #fff;
}

.delom-wordmark--blue {
    color: var(--vida-blue);
}

.delom-wordmark--inline {
    width: 5.35em;
    max-width: none;
    margin-inline: .08em;
    vertical-align: -.08em;
}

.delom-wordmark--eyebrow {
    width: clamp(84px, 7.2vw, 104px);
}

.contacts-map__brand {
    display: grid;
    gap: 8px;
    justify-items: start;
}

.contacts-map__brand-logo {
    width: clamp(108px, 11vw, 132px);
}

.site-footer__developer-logo {
    width: 88px;
    max-width: 88px;
    opacity: .68;
}

.agents-hero__partner-mark {
    display: inline-flex;
    align-items: center;
    gap: .55em;
    flex-wrap: wrap;
}

.company-page .company-hero h1 .company-hero__company-line {
    display: inline-flex;
    align-items: baseline;
    gap: clamp(10px, 1vw, 16px);
    vertical-align: baseline;
}

.company-page .company-hero h1 .company-hero__company-line > span {
    margin-left: 0;
}

.company-hero__brand-logo {
    width: clamp(245px, 20vw, 288px);
}

.company-about__brand-logo {
    width: clamp(140px, 14vw, 220px);
    max-width: none;
    margin-left: .08em;
    vertical-align: -.02em;
}

@media (max-width: 760px) {
    .company-page .company-hero h1 .company-hero__company-line {
        margin-left: 0;
        gap: 9px;
        flex-wrap: nowrap;
    }

    .company-hero__brand-logo {
        width: clamp(130px, 42vw, 165px);
    }

    .company-about__brand-logo {
        width: clamp(130px, 42vw, 160px);
    }

    .site-footer__developer-logo {
        width: 82px;
        max-width: 82px;
    }
}

/* Home hero: keep the subtitle deliberate instead of letting the CTA force
   an accidental short second line on tablets and compact notebooks. */
@media (min-width: 761px) {
    .vida-home .hero__copy {
        flex: 1 1 auto;
        min-width: 0;
        max-width: 960px;
    }

    .vida-home .hero__copy h1 {
        white-space: nowrap;
    }

    .vida-home .hero__copy p {
        max-width: 960px;
        font-size: clamp(19px, 1.6vw, 24px);
        line-height: 1.2;
        white-space: nowrap;
    }
}

@media (min-width: 761px) and (max-width: 1100px) {
    .vida-home .hero__content {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    .vida-home .hero__copy {
        width: 100%;
        max-width: none;
    }

    .vida-home .hero__copy p {
        max-width: 100%;
    }

    .vida-home .hero__button {
        width: auto;
        min-width: 220px;
        margin-top: 20px;
    }
}

/*
 * Full catalog uses the text specification of the interface rather than the
 * stretched display treatment intended for large page headings. This keeps
 * labels, prices and apartment names visually consistent at every width.
 */
.full-catalog__filters,
.full-catalog__filters input,
.full-catalog__filters select,
.full-catalog__filters button,
.full-catalog__filters label,
.full-catalog__filters .custom-select__trigger,
.full-catalog__filters .custom-select__option,
.full-catalog__facets,
.full-catalog__facets span,
.full-catalog .full-catalog__reset,
.full-catalog .full-catalog__pagination-link,
.full-catalog .full-catalog__pagination-ellipsis,
.full-catalog .full-catalog-card__meta,
.full-catalog .full-catalog__grid .apartment-card__button {
    font-family: var(--font-body);
    font-stretch: 100%;
    font-variation-settings: normal;
}

.full-catalog .full-catalog__grid .apartment-card__old-price,
.full-catalog .full-catalog__grid .apartment-card__price,
.full-catalog .full-catalog__grid .apartment-card__body h3 {
    font-family: var(--font-heading);
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
}

/* Safari enlarges a page after focusing a text control below 16px.
   Keep the actual editable controls at the native mobile reading size. */
@media (max-width: 760px) {
    body :is(
        input:not([type="button"]):not([type="checkbox"]):not([type="color"]):not([type="file"]):not([type="hidden"]):not([type="image"]):not([type="radio"]):not([type="range"]):not([type="reset"]):not([type="submit"]),
        select,
        textarea
    ) {
        font-size: 16px;
    }
}

/* Compact mortgage result on an apartment page: no calculator controls or overpayment. */
.flat-mortgage-summary {
    padding: 0 0 clamp(28px, 3.2vw, 48px);
    background: #f4f0e9;
}

.flat-mortgage-summary__card {
    width: min(100%, 620px);
    padding: clamp(16px, 2vw, 22px);
    border: 1px solid rgba(95, 162, 79, .24);
    border-radius: 10px;
    background: rgba(111, 166, 83, .13);
}

.flat-mortgage-summary__card dl {
    display: grid;
    grid-template-columns: minmax(max-content, 1.35fr) minmax(max-content, 1.2fr) max-content;
    gap: 16px;
    margin: 0;
}

.flat-mortgage-summary__card div {
    min-width: 0;
}

.flat-mortgage-summary__card dt {
    margin: 0 0 5px;
    color: rgba(28, 32, 24, .68);
    font-size: 13px;
    line-height: 1.2;
}

.flat-mortgage-summary__card dd {
    margin: 0;
    color: var(--vida-blue);
    font-family: "Roboto Flex", Arial, sans-serif;
    font-size: clamp(16px, 1.45vw, 20px);
    font-stretch: 100%;
    font-variation-settings: "GRAD" 30;
    font-weight: 700;
    line-height: 1.1;
}

.flat-mortgage-summary__card div:last-child dd {
    white-space: nowrap;
}

.flat-mortgage-summary__note {
    margin: 14px 0 0;
    padding-top: 12px;
    border-top: 1px solid rgba(95, 162, 79, .2);
    color: rgba(28, 32, 24, .72);
    font-size: 13px;
    line-height: 1.4;
}

.flat-mortgage-summary__note strong {
    color: var(--vida-blue);
    font-family: var(--font-body);
    font-weight: 700;
}

@media (max-width: 760px) {
    .flat-hero__info .flat-mortgage-summary {
        width: calc(100% + 32px);
        margin: 0 -16px 24px;
        padding: 0 16px;
        order: 3;
    }

    .flat-mortgage-summary__card {
        width: 100%;
        padding: 16px;
    }

    .flat-mortgage-summary__card dl {
        grid-template-columns: minmax(0, 1fr) max-content;
        gap: 12px;
    }

    .flat-mortgage-summary__card div:first-child {
        grid-column: 1 / -1;
        padding-bottom: 12px;
        border-bottom: 1px solid rgba(95, 162, 79, .2);
    }

    .flat-mortgage-summary__card dd {
        font-size: 18px;
    }
}

@media (max-width: 360px) {
    .flat-mortgage-summary__card dd {
        font-size: 16px;
    }
}

/* Visual selection is a view of the existing apartment catalog. */
.full-catalog__content {
    display: grid;
    gap: clamp(16px, 1.8vw, 24px);
}

.full-catalog__view-switch {
    display: flex;
    justify-content: flex-end;
}

.full-catalog__view-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid rgba(7, 50, 82, .18);
    border-radius: 9px;
    background: rgba(255, 255, 255, .72);
    color: rgba(2, 36, 65, .86);
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0;
    text-transform: none;
    transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.full-catalog__view-toggle svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.full-catalog__view-toggle:hover,
.full-catalog__view-toggle:focus-visible {
    border-color: rgba(10, 103, 75, .45);
    background: rgba(10, 103, 75, .06);
    color: var(--vida-green);
}

.full-catalog__view-toggle:active {
    background: rgba(10, 103, 75, .1);
}

.full-catalog__view-toggle[aria-pressed="true"] {
    border-color: var(--vida-green);
    background: var(--vida-green);
    color: #fff;
}

.full-catalog__visual-picker {
    min-width: 0;
}

.full-catalog__visual-picker .vida-masterplan {
    margin: 0;
}

.full-catalog__visual-picker .vida-masterplan__catalog {
    display: none;
}

/* Социальные программы на странице «Способы покупки». */
.purchase-page .purchase-method-card--capital {
    min-height: 218px;
    padding-bottom: clamp(42px, 3.4vw, 52px);
}

.purchase-page .purchase-method-card--capital h2 {
    max-width: 250px;
}

.purchase-page .purchase-method-card--capital p {
    max-width: none;
    padding-right: 0;
    font-size: clamp(12px, .9vw, 14px);
    line-height: 1.38;
}

.purchase-page .purchase-maternity__programs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(12px, 1.8vw, 24px);
}

.purchase-page .purchase-maternity__program {
    position: relative;
    display: grid;
    align-content: start;
    min-height: clamp(256px, 23vw, 328px);
    padding: clamp(28px, 3.2vw, 46px);
    overflow: hidden;
    border: 1px solid rgba(224, 191, 154, .55);
    border-radius: 10px;
}

.purchase-page .purchase-maternity__program--certificates {
    background: #fffdf9;
    box-shadow: 0 22px 52px rgba(2, 36, 65, .06);
}

.purchase-page .purchase-maternity__program--cooperation {
    background: #022441;
    box-shadow: 0 22px 52px rgba(2, 36, 65, .14);
}

.purchase-page .purchase-maternity__program-index {
    margin-bottom: clamp(30px, 4vw, 52px);
    color: #e0bf9a;
    font-family: var(--font-body);
    font-size: clamp(26px, 2.8vw, 42px);
    font-weight: 500;
    line-height: 1;
}

.purchase-page .purchase-maternity__program h3 {
    max-width: 480px;
    margin: 0 0 16px;
    color: #022441;
    font-size: clamp(23px, 2.1vw, 32px);
    line-height: 1.06;
    letter-spacing: normal;
}

.purchase-page .purchase-maternity__program p {
    max-width: 520px;
    margin: 0;
    color: rgba(28, 32, 24, .74);
    font-size: clamp(15px, 1.08vw, 17px);
    line-height: 1.5;
}

.purchase-page .purchase-maternity__program--cooperation h3 {
    color: #fffdf9;
}

.purchase-page .purchase-maternity__program--cooperation p {
    color: rgba(255, 253, 249, .78);
}

@media (max-width: 760px) {
    .purchase-page .purchase-method-card--capital {
        min-height: 0;
        padding-bottom: 52px;
    }

    .purchase-page .purchase-maternity__programs {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .purchase-page .purchase-maternity__program {
        min-height: 0;
        padding: 26px 22px 28px;
        border-radius: 8px;
    }

    .purchase-page .purchase-maternity__program-index {
        margin-bottom: 28px;
        font-size: 30px;
    }

    .purchase-page .purchase-maternity__program h3 {
        margin-bottom: 14px;
        font-size: 24px;
    }

    .purchase-page .purchase-maternity__program p {
        font-size: 14px;
        line-height: 1.45;
    }
}

/* Полная оплата на странице «Способы покупки». */
.purchase-page .purchase-methods__grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.purchase-page .purchase-method-card--full-payment {
    min-height: 218px;
    padding-bottom: clamp(42px, 3.4vw, 52px);
}

.purchase-page .purchase-method-card--full-payment h2 {
    max-width: 180px;
}

.purchase-page .purchase-method-card--full-payment p {
    max-width: none;
    padding-right: 0;
    overflow-wrap: anywhere;
    font-size: clamp(11.5px, .82vw, 13px);
    line-height: 1.38;
}

.purchase-page #purchase-full-payment {
    scroll-margin-top: 96px;
}

.purchase-page .purchase-full-payment {
    padding: clamp(68px, 7vw, 104px) 0 clamp(72px, 7.4vw, 108px);
    background: #fffaf3;
}

.purchase-page .purchase-full-payment__grid {
    display: grid;
    grid-template-columns: minmax(0, .82fr) minmax(440px, 1fr);
    gap: clamp(38px, 5vw, 82px);
    align-items: center;
}

.purchase-page .purchase-full-payment__copy h2 {
    max-width: 620px;
    margin: 0 0 24px;
    color: #022441;
    font-size: clamp(42px, 4.6vw, 70px);
    line-height: .98;
    letter-spacing: 0;
    text-wrap: balance;
}

.purchase-page .purchase-full-payment__copy p {
    max-width: 590px;
    margin: 0;
    color: rgba(28, 32, 24, .78);
    font-size: clamp(16px, 1.15vw, 18px);
    line-height: 1.5;
}

.purchase-page .purchase-full-payment__steps {
    padding: clamp(28px, 3.2vw, 46px);
    overflow: hidden;
    color: #fffdf9;
    background: #022441;
    border: 1px solid rgba(224, 191, 154, .46);
    border-radius: 10px;
    box-shadow: 0 22px 52px rgba(2, 36, 65, .14);
}

.purchase-page .purchase-full-payment__steps h3 {
    max-width: 560px;
    margin: 0 0 clamp(26px, 3vw, 38px);
    color: #fffdf9;
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1.07;
    letter-spacing: normal;
}

.purchase-page .purchase-full-payment__steps ol {
    display: grid;
    padding: 0;
    margin: 0;
    list-style: none;
}

.purchase-page .purchase-full-payment__steps li {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: clamp(16px, 2vw, 28px);
    padding: clamp(20px, 2.15vw, 28px) 0;
    border-top: 1px solid rgba(224, 191, 154, .34);
}

.purchase-page .purchase-full-payment__steps li:first-child {
    padding-top: 0;
    border-top: 0;
}

.purchase-page .purchase-full-payment__steps li:last-child {
    padding-bottom: 0;
}

.purchase-page .purchase-full-payment__steps li > span {
    color: #e0bf9a;
    font-family: var(--font-body);
    font-size: clamp(25px, 2.4vw, 36px);
    font-weight: 500;
    line-height: 1;
}

.purchase-page .purchase-full-payment__steps li p {
    margin: 0;
    color: rgba(255, 253, 249, .84);
    font-size: clamp(15px, 1.08vw, 17px);
    line-height: 1.48;
}

@media (min-width: 761px) {
    .purchase-page .purchase-full-payment > .container {
        width: min(100% - 44px, 1240px) !important;
        max-width: 1240px !important;
    }
}

@media (min-width: 901px) and (max-width: 1180px) {
    .purchase-page .purchase-methods__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }

    .purchase-page .purchase-method-card,
    .purchase-page .purchase-method-card:first-child,
    .purchase-page .purchase-method-card:last-child {
        min-height: 178px;
        border: 1px solid rgba(224, 191, 154, .72);
        border-top-width: 2px;
        border-radius: 9px;
    }

    .purchase-page .purchase-method-card--full-payment {
        grid-column: span 2;
    }
}

@media (min-width: 761px) and (max-width: 900px) {
    .purchase-page .purchase-method-card--full-payment {
        grid-column: 1 / -1;
    }
}

@media (max-width: 1040px) {
    .purchase-page .purchase-full-payment__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 991px) {
    .purchase-page #purchase-full-payment {
        scroll-margin-top: 84px;
    }
}

@media (max-width: 760px) {
    .purchase-page .purchase-methods__grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .purchase-page .purchase-method-card--full-payment {
        min-height: 0;
        padding-bottom: 52px;
    }

    .purchase-page .purchase-method-card--full-payment h2,
    .purchase-page .purchase-method-card--full-payment p {
        max-width: none;
    }

    .purchase-page .purchase-method-card--full-payment p {
        font-size: 13px;
        line-height: 1.42;
    }

    .purchase-page .purchase-full-payment {
        padding: 56px 0 62px;
    }

    .purchase-page .purchase-full-payment__copy h2 {
        font-size: clamp(32px, 10vw, 45px);
    }

    .purchase-page .purchase-full-payment__copy p,
    .purchase-page .purchase-full-payment__steps li p {
        font-size: 13px;
    }

    .purchase-page .purchase-full-payment__steps {
        padding: 26px 22px 28px;
        border-radius: 8px;
    }

    .purchase-page .purchase-full-payment__steps h3 {
        margin-bottom: 28px;
        font-size: 24px;
    }

    .purchase-page .purchase-full-payment__steps li {
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 16px;
        padding: 22px 0;
    }

    .purchase-page .purchase-full-payment__steps li > span {
        font-size: 24px;
    }
}

/* Catalog navigation: parent link remains a direct route, disclosure is separate. */
.site-nav__item-main {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 3px;
}

.site-nav__submenu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: inherit;
    background: transparent;
    border: 0;
    cursor: pointer;
}

.site-nav__item--apartments .site-nav__submenu {
    min-width: 266px;
}

@media (min-width: 761px) {
    body:not(.nav-enhanced) .site-nav__item--has-children:hover > .site-nav__submenu,
    body:not(.nav-enhanced) .site-nav__item--has-children:focus-within > .site-nav__submenu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, 0);
        transition-delay: 0s;
    }

    body:not(.nav-enhanced) .site-nav__item--has-children:hover .site-nav__more-icon,
    body:not(.nav-enhanced) .site-nav__item--has-children:focus-within .site-nav__more-icon {
        transform: rotate(180deg);
    }
}

@media (min-width: 761px) and (max-width: 1024px) {
    .site-header__inner {
        grid-template-columns: 130px minmax(0, 1fr) auto;
        gap: 14px;
    }

    .site-nav__list {
        gap: clamp(9px, 1.45vw, 14px);
    }

    .site-nav__link,
    .site-nav a,
    .site-nav__more-toggle {
        font-size: 13px;
    }

    .site-header__actions {
        gap: 12px;
    }
}

@media (max-width: 760px) {
    .site-nav__list {
        align-items: stretch;
        gap: 18px;
    }

    .site-nav__item,
    .site-nav__item--has-children {
        width: 100%;
    }

    .site-nav__item-main {
        display: flex;
        width: 100%;
        align-items: center;
    }

    .site-nav__item--apartments .site-nav__link {
        flex: 1 1 auto;
        justify-content: flex-start;
        min-width: 0;
        text-align: left;
    }

    .site-nav__more-toggle {
        width: auto;
        min-height: 46px;
        margin: 0 auto;
        font-size: clamp(24px, 7vw, 30px);
    }

    .site-nav__submenu,
    .site-nav__item--has-children:hover .site-nav__submenu,
    .site-nav__item--has-children:focus-within .site-nav__submenu {
        position: static;
        display: none;
        width: 100%;
        min-width: 0;
        flex-direction: column;
        gap: 0;
        padding: 8px 0 0;
        margin: 0;
        color: var(--vida-white);
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
        transition: none;
        backdrop-filter: none;
    }

    .site-nav__submenu::before {
        display: none;
    }

    .site-nav__item--has-children.is-open .site-nav__submenu {
        display: flex;
    }

    .site-nav__item--apartments .site-nav__submenu,
    .site-nav__item--apartments:hover .site-nav__submenu,
    .site-nav__item--apartments:focus-within .site-nav__submenu {
        display: flex;
    }

    .site-nav__submenu-link {
        display: flex;
        width: 100%;
        justify-content: flex-start;
        min-height: 42px;
        padding: 10px 16px;
        color: var(--vida-white);
        font-size: clamp(18px, 5.6vw, 23px);
        font-weight: 500;
        line-height: 1.2;
        text-align: left;
        white-space: normal;
        border-left: 1px solid rgba(224, 191, 154, .7);
        border-radius: 0;
    }
}

/* Planning gallery: square image edges, without the navy loading/background halo. */
.planning-page .planning-gallery-match__grid figure,
.planning-page .planning-gallery-match__grid figure::before,
.planning-page .planning-gallery-match__grid img {
    background: transparent !important;
    border-radius: 0 !important;
}

/* Page «О проекте»: independent story layout and media sliders. */
.planning-page {
    background: #fff;
    color: #062d47;
    overflow: clip;
}

.planning-page .planning-hero,
.planning-page .planning-masterplan,
.planning-page .planning-quarter,
.planning-page .planning-facts,
.planning-page .planning-showcase,
.planning-page .planning-infrastructure,
.planning-page .planning-media {
    position: relative;
    isolation: isolate;
}

.planning-page .planning-hero {
    overflow: hidden;
    background: linear-gradient(135deg, #082e4a 0%, #0d526d 100%);
    color: #fff;
}

.planning-page .planning-hero::after {
    position: absolute;
    inset: auto -12% -48% 47%;
    width: 56vw;
    height: 56vw;
    min-width: 560px;
    min-height: 560px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 50%;
    content: '';
    pointer-events: none;
}

.planning-page .planning-hero__inner {
    position: relative;
    z-index: 1;
    padding-top: 22px;
    padding-bottom: clamp(54px, 7vw, 108px);
}

.planning-page .planning-hero .breadcrumbs {
    margin: 0 0 clamp(42px, 6vw, 82px);
    color: rgba(255, 255, 255, .72);
}

.planning-page .planning-hero .breadcrumbs a {
    color: inherit;
}

.planning-page .planning-hero__grid,
.planning-page .planning-quarter__grid {
    display: grid;
    grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
    gap: clamp(28px, 5vw, 82px);
    align-items: center;
}

.planning-page .planning-hero__copy {
    max-width: 660px;
}

.planning-page .planning-hero__eyebrow,
.planning-page .planning-section-kicker,
.planning-page .planning-masterplan__eyebrow {
    margin: 0 0 14px;
    color: #c8a676;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .13em;
    line-height: 1.2;
    text-transform: uppercase;
}

.planning-page .planning-hero h1 {
    max-width: 800px;
    margin: 0;
    color: #fff;
    font-size: clamp(42px, 5.3vw, 82px);
    font-weight: 500;
    letter-spacing: normal;
    line-height: .94;
}

.planning-page .planning-hero h1 span {
    display: block;
}

.planning-page .planning-hero h1 em {
    color: #f0c98e;
    font-style: normal;
}

.planning-page .planning-hero__copy > p:not(.planning-hero__eyebrow) {
    max-width: 520px;
    margin: 28px 0 34px;
    color: rgba(255, 255, 255, .82);
    font-size: clamp(16px, 1.5vw, 20px);
    line-height: 1.48;
}

.planning-page .planning-hero__visual {
    position: relative;
    min-width: 0;
    margin: 0;
}

.planning-page .planning-hero__visual img {
    display: block;
    width: 100%;
    aspect-ratio: 1.35;
    object-fit: cover;
    border-radius: 18px 18px 0 18px;
    box-shadow: 0 26px 52px rgba(0, 0, 0, .24);
}

.planning-page .planning-hero__numbers {
    display: flex;
    gap: 1px;
    width: min(78%, 480px);
    margin: -1px 0 0 auto;
    background: rgba(255, 255, 255, .32);
}

.planning-page .planning-hero__numbers span {
    flex: 1 1 0;
    padding: 16px 20px 18px;
    background: #f7f1e8;
    color: #163e55;
    font-size: 13px;
    line-height: 1.15;
}

.planning-page .planning-hero__numbers b {
    display: block;
    margin-bottom: 4px;
    color: #a57535;
    font-size: clamp(26px, 3vw, 40px);
    font-weight: 500;
    letter-spacing: normal;
}

.planning-page .planning-masterplan {
    padding: clamp(70px, 9vw, 132px) 0 clamp(58px, 8vw, 112px);
    background: #fbf8f3;
}

.planning-page .planning-masterplan__intro {
    margin-bottom: clamp(28px, 4vw, 56px);
}

.planning-page .planning-masterplan h2,
.planning-page .planning-section-head h2,
.planning-page .planning-quarter h2,
.planning-page .planning-infrastructure h2 {
    max-width: 940px;
    margin: 0;
    color: #052e4a;
    font-size: clamp(36px, 4.8vw, 70px);
    font-weight: 500;
    letter-spacing: normal;
    line-height: .98;
}

.planning-page .planning-quarter {
    padding: clamp(72px, 9vw, 136px) 0;
    background: #fff;
}

.planning-page .planning-quarter__copy {
    max-width: 610px;
}

.planning-page .planning-quarter__copy > p:not(.planning-section-kicker) {
    max-width: 560px;
    margin: 28px 0 0;
    color: #304e60;
    font-size: clamp(17px, 1.8vw, 23px);
    line-height: 1.42;
}

.planning-page .planning-quarter__visual {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    border-radius: 4px 80px 4px 4px;
    background: #edf1f0;
}

.planning-page .planning-quarter__visual img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1.045;
    object-fit: cover;
}

.planning-page .planning-facts {
    padding: clamp(68px, 8vw, 116px) 0;
    background: #0a3451;
    color: #fff;
}

.planning-page .planning-facts .planning-section-kicker,
.planning-page .planning-showcase--technical .planning-section-kicker {
    color: #e9bd78;
}

.planning-page .planning-facts .planning-section-head h2,
.planning-page .planning-showcase--technical .planning-section-head h2 {
    color: #fff;
}

.planning-page .planning-section-head {
    margin-bottom: clamp(30px, 4vw, 54px);
}

.planning-page .planning-section-head--row {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 28px;
}

.planning-page .planning-slider {
    min-width: 0;
    outline: none;
}

.planning-page .planning-slider:focus-visible {
    outline: 2px solid #d7a75f;
    outline-offset: 8px;
}

.planning-page .planning-slider__viewport {
    overflow: hidden;
}

.planning-page .planning-slider__track {
    display: flex;
    align-items: stretch;
    transition: transform .48s cubic-bezier(.22, .61, .36, 1);
    will-change: transform;
}

.planning-page .planning-slider__slide {
    flex: 0 0 100%;
    min-width: 0;
    margin: 0;
}

.planning-page .planning-facts__slide {
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(280px, .82fr);
    min-height: clamp(360px, 37vw, 510px);
    background: #f7f1e8;
    color: #062e49;
}

.planning-page .planning-facts__slide figure {
    min-height: 0;
    margin: 0;
    overflow: hidden;
}

.planning-page .planning-facts__slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.planning-page .planning-facts__content {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: clamp(32px, 5vw, 76px);
}

.planning-page .planning-facts__content strong {
    color: #b17a34;
    font-size: clamp(50px, 6vw, 94px);
    font-weight: 500;
    letter-spacing: normal;
    line-height: .85;
}

.planning-page .planning-facts__content p {
    max-width: 320px;
    margin: 18px 0 0;
    color: #123d57;
    font-size: clamp(17px, 1.8vw, 23px);
    line-height: 1.27;
}

.planning-page .planning-slider__controls {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 20px;
}

.planning-page .planning-slider__button {
    display: grid;
    width: 50px;
    height: 44px;
    padding: 0;
    place-items: center;
    background: transparent;
    color: currentColor;
    font-size: 26px;
    line-height: 1;
    border: 1px solid currentColor;
    border-radius: 0;
    cursor: pointer;
    transition: color .18s ease, background-color .18s ease;
}

.planning-page .planning-slider__button:hover,
.planning-page .planning-slider__button:focus-visible {
    background: #d9a65c;
    color: #062e49;
    outline: none;
}

.planning-page .planning-slider__count {
    min-width: 52px;
    color: inherit;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
    text-align: center;
}

.planning-page .planning-showcase {
    padding: clamp(72px, 9vw, 132px) 0;
    background: #fff;
}

.planning-page .planning-showcase--technical {
    background: #0c3957;
    color: #fff;
}

.planning-page .planning-showcase__slide {
    position: relative;
    min-height: clamp(350px, 35vw, 470px);
    padding: clamp(34px, 5vw, 70px);
    overflow: hidden;
    background: #f8f7f3;
    border: 1px solid #b8c8d1;
}

.planning-page .planning-showcase--technical .planning-showcase__slide {
    background: #fff;
    color: #062e49;
    border-color: transparent;
}

.planning-page .planning-showcase__slide::after {
    position: absolute;
    right: -58px;
    bottom: -58px;
    width: 180px;
    height: 180px;
    border: 1px solid #d9a65c;
    border-radius: 50%;
    content: '';
    opacity: .65;
}

.planning-page .planning-showcase__index {
    display: block;
    margin-bottom: clamp(26px, 4vw, 64px);
    color: #b17a34;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .13em;
}

.planning-page .planning-showcase h3 {
    position: relative;
    z-index: 1;
    max-width: 830px;
    margin: 0;
    color: #07334e;
    font-size: clamp(30px, 4vw, 56px);
    font-weight: 500;
    letter-spacing: normal;
    line-height: 1.01;
}

.planning-page .planning-showcase p {
    position: relative;
    z-index: 1;
    max-width: 710px;
    margin: 26px 0 0;
    color: #263f4d;
    font-size: clamp(16px, 1.5vw, 19px);
    line-height: 1.46;
    white-space: normal;
}

.planning-page .planning-showcase--technical .planning-slider__controls {
    color: #fff;
}

.planning-page .planning-infrastructure {
    padding: clamp(72px, 9vw, 130px) 0 0;
    background: #f5f0e8;
}

.planning-page .planning-infrastructure__head {
    margin-bottom: clamp(32px, 5vw, 64px);
}

.planning-page .planning-infrastructure__head > p:not(.planning-section-kicker) {
    max-width: 650px;
    margin: 22px 0 0;
    color: #36505d;
    font-size: clamp(16px, 1.7vw, 21px);
    line-height: 1.45;
}

.planning-page .planning-infrastructure .home-location {
    padding: 0;
    background: transparent;
}

.planning-page .planning-infrastructure .home-location__intro {
    display: none;
}

.planning-page .planning-infrastructure .happy-life__map {
    margin: 0;
}

.planning-page .planning-media {
    padding: clamp(72px, 9vw, 132px) 0;
    background: #fff;
}

.planning-page .planning-media__tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    border: 1px solid #0a654f;
    border-radius: 0;
}

.planning-page .planning-media__tab {
    min-height: 48px;
    padding: 12px clamp(14px, 2vw, 26px);
    background: #fff;
    color: #0a4d42;
    font: inherit;
    font-size: 14px;
    border: 0;
    border-right: 1px solid #0a654f;
    cursor: pointer;
}

.planning-page .planning-media__tab:last-child {
    border-right: 0;
}

.planning-page .planning-media__tab.is-active,
.planning-page .planning-media__tab:hover,
.planning-page .planning-media__tab:focus-visible {
    background: #0a654f;
    color: #fff;
    outline: none;
}

.planning-page .planning-media__slide {
    height: min(68vw, 700px);
    min-height: 360px;
    overflow: hidden;
    background: #e8ece9;
}

.planning-page .planning-media__slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.planning-page .planning-media .planning-slider__controls {
    color: #062e49;
}

@media (max-width: 900px) {
    .planning-page .planning-hero__grid,
    .planning-page .planning-quarter__grid {
        grid-template-columns: 1fr;
    }

    .planning-page .planning-hero__visual {
        max-width: 760px;
    }

    .planning-page .planning-hero__visual img {
        aspect-ratio: 1.42;
    }

    .planning-page .planning-quarter__visual {
        max-width: 720px;
    }

    .planning-page .planning-facts__slide {
        grid-template-columns: minmax(0, 1fr) minmax(260px, .8fr);
    }

    .planning-page .planning-showcase__slide {
        min-height: 410px;
    }
}

@media (max-width: 640px) {
    .planning-page .planning-hero__inner {
        padding-top: 14px;
    }

    .planning-page .planning-hero .breadcrumbs {
        margin-bottom: 36px;
    }

    .planning-page .planning-hero h1 {
        font-size: clamp(42px, 12.5vw, 58px);
        letter-spacing: normal;
    }

    .planning-page .planning-hero__copy > p:not(.planning-hero__eyebrow) {
        margin: 22px 0 28px;
        font-size: 16px;
    }

    .planning-page .planning-hero__visual img {
        aspect-ratio: 1.08;
        border-radius: 12px 12px 0 12px;
    }

    .planning-page .planning-hero__numbers {
        width: 100%;
    }

    .planning-page .planning-hero__numbers span {
        padding: 13px 14px 15px;
    }

    .planning-page .planning-hero__numbers b {
        font-size: 29px;
    }

    .planning-page .planning-masterplan h2,
    .planning-page .planning-section-head h2,
    .planning-page .planning-quarter h2,
    .planning-page .planning-infrastructure h2 {
        font-size: clamp(36px, 10.4vw, 48px);
    }

    .planning-page .planning-quarter__copy > p:not(.planning-section-kicker) {
        font-size: 17px;
    }

    .planning-page .planning-quarter__visual {
        border-radius: 3px 46px 3px 3px;
    }

    .planning-page .planning-facts__slide {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .planning-page .planning-facts__slide figure {
        height: 270px;
    }

    .planning-page .planning-facts__content {
        min-height: 235px;
        padding: 30px 24px;
    }

    .planning-page .planning-facts__content strong {
        font-size: clamp(47px, 15vw, 68px);
    }

    .planning-page .planning-section-head--row {
        align-items: flex-start;
        flex-direction: column;
    }

    .planning-page .planning-showcase__slide {
        min-height: 440px;
        padding: 30px 24px 48px;
    }

    .planning-page .planning-showcase h3 {
        font-size: clamp(30px, 9.4vw, 43px);
    }

    .planning-page .planning-showcase p {
        margin-top: 20px;
        font-size: 16px;
    }

    .planning-page .planning-slider__button {
        width: 46px;
        height: 42px;
    }

    .planning-page .planning-media__tabs {
        width: 100%;
    }

    .planning-page .planning-media__tab {
        flex: 1 1 auto;
        padding-inline: 10px;
        font-size: 12px;
    }

    .planning-page .planning-media__slide {
        height: 72vw;
        min-height: 250px;
    }
}

/* Keep the «Квартал для жизни» fact slider within one desktop viewport. */
@media (min-width: 901px) {
    .planning-page .planning-facts {
        min-height: 0;
        padding: clamp(34px, 4.2vw, 58px) 0 clamp(30px, 3.5vw, 46px);
    }

    .planning-page .planning-facts .planning-section-head {
        margin-bottom: clamp(18px, 2.2vw, 30px);
    }

    .planning-page .planning-facts .planning-section-head h2 {
        font-size: clamp(44px, 4.05vw, 62px);
        line-height: .94;
    }

    .planning-page .planning-facts__slide {
        height: clamp(340px, 28vw, 408px);
        min-height: 0;
        grid-template-rows: minmax(0, 1fr);
    }

    .planning-page .planning-facts__slide figure,
    .planning-page .planning-facts__content {
        min-height: 0;
    }

    .planning-page .planning-facts__content {
        padding: clamp(28px, 3.6vw, 52px);
    }

    .planning-page .planning-facts__content strong {
        font-size: clamp(58px, 5.1vw, 78px);
    }

    .planning-page .planning-facts__content p {
        margin-top: 14px;
        font-size: clamp(16px, 1.5vw, 20px);
    }

    .planning-page .planning-facts .planning-slider__controls {
        margin-top: 14px;
    }
}

/* Infrastructure uses only the compact custom map treatment from the home page. */
.planning-page .planning-infrastructure {
    padding: clamp(64px, 7vw, 96px) 0 0;
    background: #fff;
}

.planning-page .planning-infrastructure__head {
    margin-bottom: clamp(26px, 3vw, 42px);
}

.planning-page .planning-infrastructure .home-location {
    padding: 0 !important;
    overflow: hidden;
    background: #022441;
}

.planning-page .planning-infrastructure .home-location__intro,
.planning-page .planning-infrastructure .happy-life__map-card {
    display: none !important;
}

.planning-page .planning-infrastructure .happy-life__map.happy-life__map--interactive {
    min-height: 0 !important;
    padding: 0;
    background: #022441;
}

.planning-page .planning-infrastructure .happy-life__map-canvas {
    position: relative;
    inset: auto;
    width: 100%;
    height: clamp(330px, 30vw, 430px);
    margin: 0 auto;
    overflow: hidden;
    background: #e8efeb;
}

.planning-page .planning-infrastructure .happy-life__map-fallback,
.planning-page .planning-infrastructure .happy-life__map-instance {
    position: absolute;
    inset: 0;
}

.planning-page .planning-infrastructure .happy-life__map-canvas::before {
    display: none;
}

.planning-page .planning-infrastructure .happy-life__map-instance [class*="ground-pane"] {
    filter: grayscale(.72) saturate(.42) sepia(.10) hue-rotate(116deg) brightness(1.08) contrast(.93);
}

.planning-page .planning-infrastructure .happy-life__map-instance [class*="controls-pane"],
.planning-page .planning-infrastructure .happy-life__map-instance [class*="zoom"],
.planning-page .planning-infrastructure .happy-life__map-instance [class*="fullscreen"] {
    display: none !important;
}

.planning-page .planning-infrastructure .vida-yandex-logo-pin {
    display: grid;
    width: 72px;
    height: 72px;
    min-width: 0;
    padding: 0;
    place-items: center;
    background: #022441;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 18px 36px rgba(2, 36, 65, .32);
    transform: translate(-50%, -50%);
}

.planning-page .planning-infrastructure .vida-yandex-logo-pin::after,
.planning-page .planning-infrastructure .vida-yandex-logo-pin > span,
.planning-page .planning-infrastructure .vida-yandex-poi-pin::after,
.planning-page .planning-infrastructure .vida-yandex-poi-pin__title {
    display: none;
}

.planning-page .planning-infrastructure .vida-yandex-logo-pin__logo {
    width: 56px;
    height: 42px;
}

.planning-page .planning-infrastructure .vida-yandex-logo-pin img {
    width: 56px;
    max-height: 42px;
}

.planning-page .planning-infrastructure .vida-yandex-poi-pin,
.planning-page .planning-infrastructure .vida-yandex-poi-pin--school,
.planning-page .planning-infrastructure .vida-yandex-poi-pin--kindergarten,
.planning-page .planning-infrastructure .vida-yandex-poi-pin--medical {
    display: inline-flex;
    width: 31px;
    height: 31px;
    padding: 0;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: #022441;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 6px 14px rgba(2, 36, 65, .24);
    transform: translate(calc(-50% + var(--pin-offset-x)), calc(-50% + var(--pin-offset-y))) scale(1);
}

.planning-page .planning-infrastructure .vida-yandex-poi-pin:hover {
    box-shadow: 0 10px 20px rgba(2, 36, 65, .32);
    transform: translate(calc(-50% + var(--pin-offset-x)), calc(-50% + var(--pin-offset-y))) scale(1.08);
}

.planning-page .planning-infrastructure .vida-yandex-poi-pin--status-construction {
    background: #075d46;
    box-shadow: 0 0 0 2px #f6cf9d, 0 7px 16px rgba(2, 36, 65, .28);
}

.planning-page .planning-infrastructure .vida-yandex-poi-pin__icon {
    position: relative;
    z-index: 1;
    display: block;
    width: 17px;
    height: 17px;
    background: #fff;
    -webkit-mask: var(--poi-icon) center / contain no-repeat;
    mask: var(--poi-icon) center / contain no-repeat;
}

.planning-page .planning-infrastructure .vida-yandex-poi-pin__icon--shopping {
    --poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 8h10l-1.1 10H8.1L7 8Zm2.6-3h2v3h-2V5Zm4.8 0h2v3h-2V5ZM9.2 10l.7 6h4.2l.7-6H9.2Z'/%3E%3C/svg%3E");
}

.planning-page .planning-infrastructure .vida-yandex-poi-pin__icon--school,
.planning-page .planning-infrastructure .vida-yandex-poi-pin__icon--kindergarten {
    --poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4 2 9l10 5 8-4v5h2V9L12 4Zm-6 8.2V16c2.1 2.2 9.9 2.2 12 0v-3.8l-6 3-6-3Z'/%3E%3C/svg%3E");
}

.planning-page .planning-infrastructure .vida-yandex-poi-pin__icon--medical {
    --poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 3h6v6h6v6h-6v6H9v-6H3V9h6V3Z'/%3E%3C/svg%3E");
}

.planning-page .planning-infrastructure .vida-yandex-poi-pin__icon--transport {
    --poi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 3h12c1.1 0 2 .9 2 2v9.5c0 .8-.7 1.5-1.5 1.5H18l1.5 2H17l-1.5-2h-7L7 18H4.5L6 16h-.5c-.8 0-1.5-.7-1.5-1.5V5c0-1.1.9-2 2-2Zm1 3v5h10V6H7Zm.5 7.1a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Zm9 0a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z'/%3E%3C/svg%3E");
}

.planning-page .planning-infrastructure .vida-yandex-poi-pin__abbr {
    display: none;
}

/* Natural character spacing for the fact slider heading and figures. */
.planning-page .planning-facts .planning-section-head h2,
.planning-page .planning-facts__content strong {
    letter-spacing: 0;
}

@media (max-width: 760px) {
    .planning-page .planning-infrastructure {
        padding-top: 58px;
    }

    .planning-page .planning-infrastructure .happy-life__map-canvas {
        height: 420px;
    }

    .planning-page .planning-infrastructure .vida-yandex-logo-pin {
        width: 62px;
        height: 62px;
    }

    .planning-page .planning-infrastructure .vida-yandex-logo-pin__logo,
    .planning-page .planning-infrastructure .vida-yandex-logo-pin img {
        width: 48px;
        max-height: 36px;
    }

    .planning-page .planning-infrastructure .vida-yandex-poi-pin {
        width: 29px;
        height: 29px;
    }

    .planning-page .planning-infrastructure .vida-yandex-poi-pin__icon {
        width: 16px;
        height: 16px;
    }
}

/* Editorial cards instead of presentation-like blank slides. */
.planning-page .planning-quarter h2,
.planning-page .planning-section-head h2,
.planning-page .planning-infrastructure h2,
.planning-page .planning-showcase h3,
.planning-page .planning-showcase p,
.planning-page .planning-showcase__index {
    letter-spacing: normal;
}

.planning-page .planning-showcase__slide {
    display: grid;
    min-height: 0;
    padding: clamp(34px, 3.6vw, 54px) clamp(28px, 4.2vw, 64px) clamp(38px, 4vw, 58px);
    grid-template-columns: 72px minmax(0, 1fr);
    column-gap: clamp(20px, 3.4vw, 52px);
    align-items: start;
    background: #f7f4ee;
    border: 0;
    border-left: 3px solid #d2a35e;
}

.planning-page .planning-showcase--technical .planning-showcase__slide {
    background: #faf8f4;
    border-left-color: #e3b970;
}

.planning-page .planning-showcase__slide::after {
    display: none;
}

.planning-page .planning-showcase__index {
    grid-row: 1 / span 2;
    margin: 7px 0 0;
    color: #ab7734;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
}

.planning-page .planning-showcase h3 {
    grid-column: 2;
    max-width: 850px;
    margin: 0;
    font-size: clamp(30px, 3.45vw, 52px);
    line-height: 1.04;
}

.planning-page .planning-showcase p {
    grid-column: 2;
    max-width: 820px;
    margin: 20px 0 0;
    font-size: clamp(16px, 1.35vw, 19px);
    line-height: 1.48;
}

.planning-page .planning-showcase .planning-slider__controls {
    margin-top: 18px;
}

@media (max-width: 640px) {
    .planning-page .planning-showcase__slide {
        display: block;
        padding: 30px 24px 34px;
    }

    .planning-page .planning-showcase__index {
        margin: 0 0 22px;
    }

    .planning-page .planning-showcase h3,
    .planning-page .planning-showcase p {
        max-width: none;
    }

    .planning-page .planning-showcase h3 {
        font-size: clamp(30px, 9vw, 42px);
    }
}

/* Apartment card: isolated solar-side mode. */
.flat-page .flat-hero__visual[data-flat-media] {
    display: flex !important;
    flex-direction: column;
    min-height: clamp(590px, 44vw, 720px);
    overflow: hidden;
}

.flat-page .flat-hero__standard {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    flex-direction: column;
}

.flat-page .flat-hero__standard[hidden],
.flat-page .flat-sunlight[hidden] {
    display: none !important;
}

.flat-page .flat-hero__standard .flat-plan-viewer {
    flex: 1 1 auto;
    min-height: 0;
}

.flat-page .flat-hero__sunlight-launch {
    display: flex;
    justify-content: center;
    padding: 0 28px 24px;
    background: #022441;
}

.flat-page .flat-sunlight-toggle,
.flat-page .flat-sunlight__return,
.flat-page .flat-sunlight__controls button {
    appearance: none;
    font: inherit;
    font-weight: 700;
    letter-spacing: 0;
    cursor: pointer;
}

.flat-page .flat-sunlight-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 42px;
    padding: 9px 18px;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .74);
    border-radius: 999px;
    background: transparent;
    transition: color .18s ease, background-color .18s ease, border-color .18s ease;
}

.flat-page .flat-sunlight-toggle:hover,
.flat-page .flat-sunlight-toggle:focus-visible {
    color: #022441;
    border-color: #f4c36c;
    background: #f4c36c;
    outline: 0;
}

.flat-page .flat-sunlight-toggle svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
}

.flat-page .flat-sunlight {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto minmax(0, 1fr);
    flex: 1 1 auto;
    min-height: 0;
    padding: clamp(24px, 3vw, 42px) clamp(24px, 4vw, 58px) clamp(22px, 3vw, 38px);
    color: #022441;
    background: #edf5f6;
}

.flat-page .flat-sunlight__header {
    display: contents;
}

.flat-page .flat-sunlight__header > div {
    align-self: start;
}

.flat-page .flat-sunlight__header p {
    margin: 0 0 7px;
    color: #a86d1f;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .12em;
    line-height: 1.2;
    text-transform: uppercase;
}

.flat-page .flat-sunlight__header strong {
    display: block;
    font-size: clamp(17px, 1.4vw, 20px);
    font-weight: 500;
    line-height: 1.25;
}

.flat-page .flat-sunlight__header strong span {
    color: #007060;
    font-weight: 800;
}

.flat-page .flat-sunlight__return {
    align-self: start;
    min-height: 40px;
    padding: 8px 16px;
    color: #006c66;
    border: 1px solid rgba(0, 108, 102, .45);
    border-radius: 999px;
    background: transparent;
    transition: color .18s ease, background-color .18s ease;
}

.flat-page .flat-sunlight__return:hover,
.flat-page .flat-sunlight__return:focus-visible {
    color: #fff;
    background: #007b73;
    outline: 0;
}

.flat-page .flat-sunlight__controls {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-self: start;
    margin-top: 24px;
}

.flat-page .flat-sunlight__controls button {
    min-width: 70px;
    min-height: 40px;
    padding: 7px 15px;
    color: #022441;
    border: 1px solid rgba(2, 80, 91, .28);
    border-radius: 999px;
    background: rgba(255, 255, 255, .56);
    transition: color .18s ease, border-color .18s ease, background-color .18s ease;
}

.flat-page .flat-sunlight__controls button.is-active,
.flat-page .flat-sunlight__controls button[aria-pressed="true"] {
    color: #fff;
    border-color: #007b73;
    background: #007b73;
}

.flat-page .flat-sunlight__controls button:disabled {
    color: rgba(2, 36, 65, .33);
    border-color: rgba(2, 80, 91, .13);
    background: rgba(255, 255, 255, .22);
    cursor: default;
}

.flat-page .flat-sunlight__stage {
    position: relative;
    grid-column: 1 / -1;
    align-self: stretch;
    min-height: 0;
    margin-top: 6px;
    isolation: isolate;
}

.flat-page .flat-sunlight__orbit {
    position: absolute;
    z-index: 1;
    inset: 3% 5% 2%;
    width: 90%;
    height: 94%;
    overflow: visible;
    fill: none;
    stroke: #e7a633;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-dasharray: 7 10;
}

.flat-page .flat-sunlight__plan {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    display: grid;
    width: min(51%, 440px);
    height: min(62%, 405px);
    min-width: 210px;
    min-height: 180px;
    place-items: center;
    transform: translate(-50%, -47%);
}

.flat-page .flat-sunlight__plan img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    background: transparent !important;
    filter: none;
}

.flat-page .flat-sunlight__sun {
    position: absolute;
    z-index: 3;
    width: clamp(36px, 3.1vw, 48px);
    height: clamp(36px, 3.1vw, 48px);
    fill: none;
    stroke: #f29b00;
    stroke-width: 2.2;
    stroke-linecap: round;
    transition: top .3s ease, right .3s ease, bottom .3s ease, left .3s ease, transform .3s ease;
}

.flat-page .flat-sunlight__label {
    position: absolute;
    z-index: 3;
    padding: 6px 13px;
    color: #9a6117;
    border: 1px solid rgba(190, 132, 42, .3);
    border-radius: 999px;
    background: rgba(255, 255, 255, .76);
    font-size: 13px;
    line-height: 1;
}

.flat-page .flat-sunlight__label--sunrise {
    right: 7%;
    bottom: 12%;
}

.flat-page .flat-sunlight__label--sunset {
    bottom: 12%;
    left: 7%;
}

.flat-page .flat-sunlight[data-sun-time="morning"] .flat-sunlight__sun,
.flat-page .flat-sunlight__stage[data-sun-time="morning"] .flat-sunlight__sun {
    top: 44%;
    right: 8.5%;
    transform: translate(50%, -50%);
}

.flat-page .flat-sunlight[data-sun-time="day"] .flat-sunlight__sun,
.flat-page .flat-sunlight__stage[data-sun-time="day"] .flat-sunlight__sun {
    top: 8%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.flat-page .flat-sunlight[data-sun-time="evening"] .flat-sunlight__sun,
.flat-page .flat-sunlight__stage[data-sun-time="evening"] .flat-sunlight__sun {
    top: 44%;
    left: 8.5%;
    transform: translate(-50%, -50%);
}

@media (max-width: 1180px) {
    .flat-page .flat-hero__visual[data-flat-media] {
        min-height: 610px;
    }
}

@media (max-width: 640px) {
    .flat-page .flat-hero__visual[data-flat-media] {
        min-height: 0;
    }

    .flat-page .flat-hero__sunlight-launch {
        padding: 0 16px 18px;
    }

    .flat-page .flat-sunlight {
        display: flex;
        min-height: 560px;
        padding: 22px 18px 18px;
        flex-direction: column;
    }

    .flat-page .flat-sunlight__header {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
    }

    .flat-page .flat-sunlight__header p {
        font-size: 10px;
    }

    .flat-page .flat-sunlight__header strong {
        font-size: 16px;
    }

    .flat-page .flat-sunlight__return {
        min-height: 36px;
        padding: 6px 12px;
        font-size: 13px;
        white-space: nowrap;
    }

    .flat-page .flat-sunlight__controls {
        margin-top: 18px;
    }

    .flat-page .flat-sunlight__controls button {
        min-width: 0;
        min-height: 36px;
        padding: 6px 13px;
        font-size: 14px;
    }

    .flat-page .flat-sunlight__stage {
        flex: 1 1 auto;
        min-height: 390px;
        margin-top: 8px;
    }

    .flat-page .flat-sunlight__orbit {
        inset: 5% 0 3%;
        width: 100%;
        height: 92%;
    }

    .flat-page .flat-sunlight__plan {
        width: min(66%, 310px);
        height: min(58%, 285px);
        min-width: 170px;
        min-height: 145px;
        transform: translate(-50%, -45%);
    }

    .flat-page .flat-sunlight__label {
        padding: 5px 10px;
        font-size: 11px;
    }

    .flat-page .flat-sunlight__label--sunrise {
        right: 0;
    }

    .flat-page .flat-sunlight__label--sunset {
        left: 0;
    }
}
/* Keep solar controls in their own row; the scene must occupy the remaining panel height. */
.flat-page .flat-sunlight {
    grid-template-rows: auto auto minmax(0, 1fr);
}

.flat-page .flat-sunlight__controls {
    grid-row: 2;
}

.flat-page .flat-sunlight__stage {
    grid-row: 3;
    min-height: 0;
}
/* Sun widget: reserve a compact, predictable scene and never defer the visible SVG plan. */
.flat-page .flat-sunlight__stage {
    min-height: clamp(390px, 42vw, 560px);
}

.flat-page .flat-sunlight__plan {
    width: min(54%, 420px);
    height: min(58%, 385px);
    transform: translate(-50%, -50%);
}

@media (max-width: 1180px) {
    .flat-page .flat-sunlight__plan {
        transform: translate(-50%, -50%);
    }
}

/* Solar diagram: one stable, wide U trajectory independent from the hero height. */
.flat-page .flat-sunlight__stage {
    display: grid;
    place-items: center;
    min-height: 0;
    margin-top: 0;
}

.flat-page .flat-sunlight__diagram {
    position: relative;
    width: min(100%, 690px);
    aspect-ratio: 1 / 1;
    max-height: 100%;
}

.flat-page .flat-sunlight__orbit {
    inset: 0;
    width: 100%;
    height: 100%;
    stroke-width: 1.7;
    stroke-dasharray: 6 9;
}

.flat-page .flat-sunlight__plan {
    width: min(42%, 300px);
    height: auto;
    min-width: 0;
    min-height: 0;
    aspect-ratio: 1483 / 1227;
    top: 47%;
    transform: translate(-50%, -50%);
}

.flat-page .flat-sunlight__plan img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.flat-page .flat-sunlight__label--sunset {
    top: 13%;
    bottom: auto;
    left: 14%;
}

.flat-page .flat-sunlight__label--sunrise {
    top: 13%;
    right: 14%;
    bottom: auto;
}

.flat-page .flat-sunlight[data-sun-time="morning"] .flat-sunlight__sun,
.flat-page .flat-sunlight__stage[data-sun-time="morning"] .flat-sunlight__sun {
    top: 42%;
    right: 10%;
    left: auto;
    bottom: auto;
    transform: translate(50%, -50%);
}

.flat-page .flat-sunlight[data-sun-time="day"] .flat-sunlight__sun,
.flat-page .flat-sunlight__stage[data-sun-time="day"] .flat-sunlight__sun {
    top: 76%;
    left: 50%;
    right: auto;
    bottom: auto;
    transform: translate(-50%, -50%);
}

.flat-page .flat-sunlight[data-sun-time="evening"] .flat-sunlight__sun,
.flat-page .flat-sunlight__stage[data-sun-time="evening"] .flat-sunlight__sun {
    top: 42%;
    left: 10%;
    right: auto;
    bottom: auto;
    transform: translate(-50%, -50%);
}

@media (max-width: 640px) {
    .flat-page .flat-sunlight__diagram {
        width: 100%;
        aspect-ratio: 1.08 / 1;
    }

    .flat-page .flat-sunlight__plan {
        width: min(57%, 270px);
        min-width: 0;
        min-height: 0;
        top: 47%;
        transform: translate(-50%, -50%);
    }

    .flat-page .flat-sunlight__label--sunset {
        top: 12%;
        left: 3%;
    }

    .flat-page .flat-sunlight__label--sunrise {
        top: 12%;
        right: 3%;
    }
}

/* Compact, reference-proportioned daylight diagram. */
.flat-page .flat-sunlight__diagram {
    width: min(100%, 760px);
    aspect-ratio: 1.4 / 1;
}

.flat-page .flat-sunlight__plan {
    width: min(47%, 340px);
    top: 47%;
}

.flat-page .flat-sunlight__label--sunset {
    top: 10%;
    left: 12%;
}

.flat-page .flat-sunlight__label--sunrise {
    top: 10%;
    right: 12%;
}

.flat-page .flat-sunlight[data-sun-time="day"] .flat-sunlight__sun,
.flat-page .flat-sunlight__stage[data-sun-time="day"] .flat-sunlight__sun {
    top: 86%;
}

@media (max-width: 640px) {
    .flat-page .flat-sunlight__diagram {
        width: 100%;
        aspect-ratio: 1.15 / 1;
    }

    .flat-page .flat-sunlight__plan {
        width: min(62%, 280px);
        top: 47%;
    }

    .flat-page .flat-sunlight__label--sunset {
        top: 9%;
        left: 2%;
    }

    .flat-page .flat-sunlight__label--sunrise {
        top: 9%;
        right: 2%;
    }

    .flat-page .flat-sunlight[data-sun-time="day"] .flat-sunlight__sun,
    .flat-page .flat-sunlight__stage[data-sun-time="day"] .flat-sunlight__sun {
        top: 84%;
    }
}

/* The marker is placed from the orbit path coordinates, so it stays centred on the dashed line. */
.flat-page .flat-sunlight__sun[data-positioned-on-orbit="true"] {
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    transition: none;
    will-change: left, top;
}
/* WebKit-safe dimensions: keep the entire solar scene inside its own panel at every width. */
.flat-page .flat-sunlight__stage {
    min-width: 0;
}

.flat-page .flat-sunlight__diagram {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 760px;
}

.flat-page .flat-sunlight__plan {
    width: 47%;
    max-width: 340px;
    min-width: 0;
    min-height: 0;
}

@media (max-width: 640px) {
    .flat-page .flat-sunlight__diagram {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .flat-page .flat-sunlight__plan {
        width: 62%;
        max-width: 280px;
        min-width: 0;
        min-height: 0;
    }
}
/* mobile-orbit-clearance-20260813: preserve an intentional gap between plan and orbit. */
@media (max-width: 640px) {
    .flat-page .flat-sunlight {
        min-height: 0;
        padding: 22px 18px 20px;
    }

    .flat-page .flat-sunlight__stage {
        display: block;
        flex: 0 0 auto;
        width: 100%;
        min-height: 0;
        height: auto;
        margin-top: 18px;
    }

    .flat-page .flat-sunlight__diagram {
        width: 100%;
        max-width: none;
        height: auto;
        max-height: none;
        aspect-ratio: 10 / 7;
        margin: 0;
    }

    .flat-page .flat-sunlight__plan {
        width: min(50%, 250px);
        max-width: 250px;
        min-width: 0;
        min-height: 0;
        top: 42%;
    }
}
/* adaptive-svg-plan-fit-20260813: let every imported SVG keep its own proportions. */
.flat-page .flat-sunlight__plan {
    overflow: hidden;
}

.flat-page .flat-sunlight__plan img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    object-fit: contain !important;
}

.flat-page .flat-sunlight[data-plan-mode="portrait"] .flat-sunlight__diagram {
    aspect-ratio: 1.1 / 1;
}

@media (max-width: 640px) {
    .flat-page .flat-sunlight[data-plan-mode="portrait"] .flat-sunlight__diagram {
        aspect-ratio: 1 / 1;
    }
}
/* Apartment card: locally cached map for the «Вид из окна» tab. */
.flat-page .flat-plan-viewer__figure--window-map {
    width: min(86%, 640px);
    max-width: 640px;
    background: transparent;
}

.flat-page .flat-window-map {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: 16px;
    background: #eaf3f5;
    box-shadow: 0 14px 34px rgba(2, 36, 65, .12);
}

.flat-page .flat-window-map > img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover;
}

.flat-page .flat-window-map__marker {
    position: absolute;
    z-index: 1;
    left: var(--flat-window-map-left);
    top: var(--flat-window-map-top);
    width: 30px;
    height: 30px;
    overflow: visible;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.flat-page .flat-window-map__marker-dot {
    position: absolute;
    z-index: 2;
    inset: 7px;
    display: block;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #ff9700;
    box-shadow: 0 2px 8px rgba(2, 36, 65, .28);
}

.flat-page .flat-window-map__marker-beam {
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    width: 88px;
    height: 96px;
    overflow: visible;
    transform-box: view-box;
    transform: translate(-50%, -94%) rotate(var(--flat-window-map-degree));
    transform-origin: 50% 94%;
    pointer-events: none;
}

.flat-page .flat-window-map__marker-beam-soft {
    fill: #fff;
    opacity: .78;
}

.flat-page .flat-window-map__marker-beam-core {
    fill: #fff;
    opacity: .32;
}

@media (max-width: 640px) {
    .flat-page .flat-plan-viewer__figure--window-map {
        width: min(94%, 440px);
    }

    .flat-page .flat-window-map {
        border-radius: 12px;
    }

    .flat-page .flat-window-map__marker {
        width: 24px;
        height: 24px;
    }

    .flat-page .flat-window-map__marker-dot {
        inset: 6px;
        border-width: 2px;
    }

    .flat-page .flat-window-map__marker-beam {
        width: 70px;
        height: 76px;
    }
}

/* Apartment detail: keep the decision block compact on desktop screens.
   Mobile remains intentionally sequential and is not affected. */
@media (min-width: 1181px) and (max-height: 980px) {
    .flat-page .flat-hero__info {
        padding-top: 32px;
        padding-bottom: 24px;
    }

    .flat-page .flat-hero__info > .breadcrumbs {
        margin-bottom: 18px;
    }

    .flat-page .flat-hero__title-row {
        gap: 10px 16px;
        margin-bottom: 16px;
    }

    .flat-page .flat-hero h1 {
        font-size: clamp(38px, 3.25vw, 50px);
    }

    .flat-page .flat-hero__reserve,
    .flat-page .flat-hero__favorite {
        min-height: 42px;
        padding: 10px 21px;
    }

    .flat-page .flat-price-row {
        gap: 18px;
        margin-bottom: 12px;
    }

    .flat-page .flat-price-row strong {
        font-size: clamp(30px, 2.45vw, 39px);
    }

    .flat-page .flat-price-row__mortgage strong {
        font-size: clamp(21px, 1.8vw, 28px);
    }

    .flat-page .flat-mortgage-summary {
        padding-bottom: 18px;
    }

    .flat-page .flat-mortgage-summary__card {
        padding: 16px;
    }

    .flat-page .flat-mortgage-summary__card dl {
        gap: 14px;
    }

    .flat-page .flat-mortgage-summary__note {
        margin-top: 10px;
        padding-top: 8px;
        font-size: 12px;
        line-height: 1.34;
    }

    .flat-page .flat-specs {
        margin-bottom: 0;
    }

    .flat-page .flat-specs div {
        min-height: 68px;
        padding: 12px 16px;
    }

    .flat-page .flat-specs dt {
        margin-bottom: 4px;
        font-size: 12px;
    }

    .flat-page .flat-specs dd {
        font-size: clamp(21px, 1.75vw, 27px);
    }

    .flat-page .flat-plan-viewer {
        padding-top: clamp(34px, 3.4vw, 48px);
        padding-bottom: 16px;
    }

    .flat-page .flat-hero__sunlight-launch {
        padding: 0 24px 16px;
    }
}

/* Apartment detail: use the high desktop panel's spare height between content groups. */
@media (min-width: 1400px) and (min-height: 840px) and (max-height: 980px) {
    .flat-page .flat-hero__info > .breadcrumbs {
        margin-bottom: 22px;
    }

    .flat-page .flat-hero__title-row {
        margin-bottom: 20px;
    }

    .flat-page .flat-price-row {
        margin-bottom: 18px;
    }

    .flat-page .flat-mortgage-summary {
        padding-bottom: 26px;
    }
}

/* Apartment detail: keep the view-from-window direction ray compact and anchored to its map point. */
.flat-page .flat-window-map__marker-beam {
    width: 64px;
    height: 70px;
}

@media (max-width: 640px) {
    .flat-page .flat-window-map__marker-beam {
        width: 52px;
        height: 57px;
    }
}

/* Apartment detail: optional standard renovation and bathroom presentation. */
.flat-page .flat-repair {
    margin-top: clamp(20px, 2.2vw, 30px);
    border: 1px solid rgba(239, 109, 35, 0.62);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.48);
    overflow: hidden;
}

.flat-page .flat-repair__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 16px;
    align-items: center;
    padding: clamp(18px, 2vw, 24px);
}

.flat-page .flat-repair__heading,
.flat-page .flat-repair__standard,
.flat-page .flat-repair__bathrooms,
.flat-page .flat-repair__bathroom-panel {
    min-width: 0;
}

.flat-page .flat-repair__heading h2,
.flat-page .flat-repair__standard h3,
.flat-page .flat-repair__bathrooms > h3,
.flat-page .flat-repair__bathroom-panel h4 {
    margin: 0;
    color: var(--color-blue, #082e4f);
    font-family: var(--font-heading, inherit);
    font-weight: 700;
}

.flat-page .flat-repair__heading h2 {
    font-size: clamp(20px, 1.7vw, 26px);
    line-height: 1.1;
}

.flat-page .flat-repair__description {
    margin-top: 8px;
    color: rgba(8, 46, 79, 0.76);
    font-size: 14px;
    line-height: 1.45;
}

.flat-page .flat-repair__description p {
    margin: 0;
}

.flat-page .flat-repair__description p + p {
    margin-top: 8px;
}

.flat-page .flat-repair__price {
    min-width: max-content;
    display: grid;
    gap: 3px;
    color: rgba(8, 46, 79, 0.68);
    font-size: 12px;
    line-height: 1.2;
}

.flat-page .flat-repair__price strong {
    color: var(--color-blue, #082e4f);
    font-size: clamp(17px, 1.45vw, 22px);
    line-height: 1.1;
}

.flat-page .flat-repair__switch {
    position: relative;
    display: block;
    width: 50px;
    height: 30px;
    flex: 0 0 auto;
    cursor: pointer;
}

.flat-page .flat-repair__switch input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    opacity: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
}

.flat-page .flat-repair__switch > span {
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background: #8795a2;
    box-shadow: inset 0 0 0 1px rgba(8, 46, 79, 0.1);
    transition: background-color 180ms ease;
}

.flat-page .flat-repair__switch > span::after {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 4px rgba(8, 46, 79, 0.22);
    content: '';
    transition: transform 180ms ease;
}

.flat-page .flat-repair__switch input:checked + span {
    background: #1d9568;
}

.flat-page .flat-repair__switch input:checked + span::after {
    transform: translateX(20px);
}

.flat-page .flat-repair__switch input:focus-visible + span,
.flat-page .flat-repair__choice:focus-visible,
.flat-page .flat-repair__bathroom-preview:focus-visible,
.flat-page .flat-repair-gallery__thumb:focus-visible {
    outline: 3px solid rgba(239, 109, 35, 0.78);
    outline-offset: 3px;
}

.flat-page .flat-repair__content {
    display: grid;
    gap: 22px;
    padding: clamp(18px, 2vw, 24px);
    border-top: 1px solid rgba(239, 109, 35, 0.24);
    background: rgba(255, 255, 255, 0.7);
}

.flat-page .flat-repair__content[hidden],
.flat-page .flat-repair__bathroom-panel[hidden] {
    display: none;
}

.flat-page .flat-repair__standard h3,
.flat-page .flat-repair__bathrooms > h3 {
    margin-bottom: 12px;
    font-size: 17px;
    line-height: 1.2;
}

.flat-page .flat-repair-gallery {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.flat-page .flat-repair-gallery__thumbs {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(112px, 152px);
    gap: 8px;
    justify-content: start;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    padding-bottom: 2px;
    scroll-snap-type: x proximity;
}

.flat-page .flat-repair-gallery__thumb {
    display: block;
    min-width: 0;
    aspect-ratio: 4 / 3;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(8, 46, 79, 0.14);
    border-radius: 9px;
    background: #e7e9e8;
    scroll-snap-align: start;
}

.flat-page .flat-repair-gallery__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.flat-page .flat-repair-gallery__empty {
    margin: 0;
    padding: 14px;
    border: 1px dashed rgba(8, 46, 79, 0.28);
    border-radius: 10px;
    color: rgba(8, 46, 79, 0.7);
    font-size: 14px;
    line-height: 1.4;
}

.flat-page .flat-repair__choices {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.flat-page .flat-repair__choice {
    min-width: 0;
    min-height: 42px;
    padding: 9px 10px;
    border: 1px solid rgba(8, 46, 79, 0.2);
    border-radius: 8px;
    background: #fff;
    color: var(--color-blue, #082e4f);
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
}

.flat-page .flat-repair__choice.is-active {
    border-color: var(--color-blue, #082e4f);
    background: var(--color-blue, #082e4f);
    color: #fff;
}

.flat-page .flat-repair__bathroom-panels {
    margin-top: 0;
}

.flat-page .flat-repair__bathroom-previews {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
}

.flat-page .flat-repair__bathroom-preview {
    position: relative;
    min-width: 0;
    aspect-ratio: 1.6 / 1;
    padding: 0;
    overflow: hidden;
    border: 2px solid transparent;
    border-radius: 9px;
    background: #e7e9e8;
    color: #fff;
    cursor: pointer;
}

.flat-page .flat-repair__bathroom-preview.is-active {
    border-color: var(--color-orange, #ef6d23);
}

.flat-page .flat-repair__bathroom-preview img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.flat-page .flat-repair__bathroom-preview-label {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 18px 8px 7px;
    background: linear-gradient(transparent, rgba(8, 46, 79, 0.78));
    color: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    text-align: left;
}

.flat-page .flat-repair__bathroom-preview-check {
    position: absolute;
    top: 7px;
    right: 7px;
    display: grid;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    place-items: center;
    background: #fff;
    color: var(--color-blue, #082e4f);
    font-size: 13px;
    font-weight: 700;
    opacity: 0;
    transform: scale(0.85);
    transition: opacity 160ms ease, transform 160ms ease;
}

.flat-page .flat-repair__bathroom-preview.is-active .flat-repair__bathroom-preview-check {
    opacity: 1;
    transform: scale(1);
}

.flat-page .flat-repair__bathroom-panel .flat-repair__description {
    margin-top: 12px;
}

.flat-page .flat-repair__action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-top: 14px;
    border-top: 1px solid rgba(239, 109, 35, 0.24);
}

.flat-page .flat-repair__action p {
    margin: 0;
    color: rgba(8, 46, 79, 0.76);
    font-size: 14px;
    line-height: 1.4;
}

.flat-page .flat-repair__submit {
    min-width: min(100%, 320px);
    min-height: 52px;
    border-radius: 9px;
    background: var(--color-blue, #082e4f);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    text-transform: none;
}

.flat-page .flat-repair__submit:focus-visible {
    outline: 3px solid rgba(239, 109, 35, 0.78);
    outline-offset: 3px;
}

@media (min-width: 1181px) {
    .flat-page .flat-hero {
        align-items: start;
    }

    .flat-page .flat-hero__visual[data-flat-media] {
        position: sticky;
        top: var(--header-height);
        align-self: start;
        height: calc(100vh - var(--header-height));
        height: calc(100svh - var(--header-height));
        min-height: 0;
    }

    body.admin-bar .flat-page .flat-hero__visual[data-flat-media] {
        top: calc(var(--header-height) + var(--wp-admin--admin-bar--height, 32px));
        height: calc(100vh - var(--header-height) - var(--wp-admin--admin-bar--height, 32px));
        height: calc(100svh - var(--header-height) - var(--wp-admin--admin-bar--height, 32px));
    }
}

@media (max-width: 640px) {
    .flat-page .flat-repair__head {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 14px;
    }

    .flat-page .flat-repair__price {
        grid-column: 1 / 2;
        grid-row: 2;
    }

    .flat-page .flat-repair__switch {
        grid-column: 2;
        grid-row: 1 / span 2;
    }

    .flat-page .flat-repair__choices {
        gap: 6px;
    }

    .flat-page .flat-repair__choice {
        min-height: 40px;
        padding-right: 6px;
        padding-left: 6px;
        font-size: 13px;
    }

    .flat-page .flat-repair__action {
        align-items: stretch;
        flex-direction: column;
    }

    .flat-page .flat-repair__submit {
        width: 100%;
    }
}

/* Mobile apartment card: show the plan before the decision details. */
.flat-page .flat-hero__mobile-reserve {
    display: none;
}

@media (max-width: 640px) {
    .flat-page .flat-hero {
        display: flex;
        flex-direction: column;
        min-height: 0;
    }

    .flat-page .flat-hero__visual[data-flat-media] {
        order: -1;
        min-height: 0;
    }

    .flat-page .flat-hero__info {
        display: flex;
        flex-direction: column;
        padding-top: 28px;
    }

    .flat-page .flat-hero__info > .breadcrumbs,
    .flat-page .flat-hero__reserve--desktop {
        display: none;
    }

    .flat-page .flat-hero__title-row {
        margin-bottom: 18px;
    }

    .flat-page .flat-price-row {
        order: 1;
    }

    .flat-page .flat-mortgage-summary {
        order: 2;
    }

    .flat-page .flat-specs {
        order: 3;
    }

    .flat-page .flat-hero__mobile-reserve {
        display: block;
        order: 4;
        margin-bottom: 22px;
    }

    .flat-page .flat-hero__reserve--mobile {
        width: 100%;
    }

    .flat-page .flat-repair {
        order: 5;
    }
}
/* Mobile apartment card: keep booking and favorite in one clear action row. */
.flat-page .flat-hero__favorite--mobile {
    display: none;
}

@media (max-width: 640px) {
    .flat-page .flat-hero h1 {
        order: 0;
        font-size: clamp(35px, 9.5vw, 38px);
    }

    .flat-page .flat-hero__favorite--desktop {
        display: none;
    }

    .flat-page .flat-hero__mobile-reserve {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 54px;
        gap: 10px;
        align-items: stretch;
    }

    .flat-page .flat-hero__reserve--mobile {
        grid-column: 1;
        grid-row: 1;
        order: 0;
        width: 100%;
        min-width: 0;
        margin: 0;
    }

    .flat-page .flat-hero__favorite--mobile {
        grid-column: 2;
        grid-row: 1;
        order: 0;
        display: inline-flex;
        width: 54px;
        min-width: 54px;
        min-height: 54px;
        padding: 0;
        justify-self: stretch;
    }

    .flat-page .flat-repair {
        order: 5;
    }
}
/* Keep booking and favorite together on compact tablets as well. */
@media (min-width: 641px) and (max-width: 760px) {
    .flat-page .flat-hero__reserve--desktop,
    .flat-page .flat-hero__favorite--desktop {
        display: none;
    }

    .flat-page .flat-hero__mobile-reserve {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 54px;
        gap: 10px;
        align-items: stretch;
        order: 6;
        margin-bottom: 22px;
    }

    .flat-page .flat-hero__reserve--mobile {
        grid-column: 1;
        grid-row: 1;
        order: 0;
        width: 100%;
        min-width: 0;
        margin: 0;
    }

    .flat-page .flat-hero__favorite--mobile {
        grid-column: 2;
        grid-row: 1;
        order: 0;
        display: inline-flex;
        width: 54px;
        min-width: 54px;
        min-height: 54px;
        padding: 0;
        justify-self: stretch;
    }

    .flat-page .flat-hero__favorite--mobile .favorite-toggle__label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }

    .flat-page .flat-repair {
        order: 7;
    }
}

/* Apartment media: compact tab control for phones. */
.flat-tabs__icon,
.flat-tabs__label--short {
    display: none;
}

@media (max-width: 640px) {
    .flat-page .flat-hero__visual[data-flat-media] .flat-tabs {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: calc(100% - 24px);
        min-height: 0;
        margin: 12px auto 0;
        padding: 0;
        overflow: hidden;
        background: transparent;
        border: 1px solid rgba(255, 255, 255, .56);
        border-radius: 999px;
    }

    .flat-page .flat-hero__visual[data-flat-media] .flat-tabs button {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        min-width: 0;
        min-height: 46px;
        padding: 8px 5px;
        color: rgba(255, 255, 255, .68);
        background: transparent;
        border: 0;
        border-right: 1px solid rgba(255, 255, 255, .42);
        font-size: 13px;
        font-weight: 700;
        line-height: 1;
        white-space: nowrap;
    }

    .flat-page .flat-hero__visual[data-flat-media] .flat-tabs button:last-child {
        border-right: 0;
    }

    .flat-page .flat-hero__visual[data-flat-media] .flat-tabs button.is-active {
        color: var(--vida-blue);
        background: #ffd8aa;
    }

    .flat-page .flat-tabs__icon {
        display: block;
        width: 19px;
        height: 19px;
        flex: 0 0 19px;
    }

    .flat-page .flat-tabs__icon svg {
        display: block;
        width: 100%;
        height: 100%;
        fill: none;
        stroke: currentColor;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-width: 2;
    }

    .flat-page .flat-tabs__label--full {
        display: none;
    }

    .flat-page .flat-tabs__label--short {
        display: inline;
    }
}
/* Keep the mobile apartment card visibly clear of the fixed site header. */
@media (max-width: 760px) {
    .flat-page .flat-hero {
        padding-top: calc(max(var(--header-height), 70px) + 14px);
    }
}


/* The compact mobile media control must always keep all three tabs in view. */
@media (max-width: 640px) {
    .flat-page .flat-hero__visual[data-flat-media] .flat-tabs {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        width: calc(100% - 24px);
        max-width: calc(100% - 24px);
        box-sizing: border-box;
    }

    .flat-page .flat-hero__visual[data-flat-media] .flat-tabs button {
        min-width: 0 !important;
        width: 100%;
        max-width: 100%;
        flex: 0 1 auto !important;
    }
}

/* Android/Opera: do not keep the closed mobile navigation as a composited
   full-screen backdrop-filter layer; some WebViews render its blur visibly. */
@media (max-width: 760px) {
    .site-nav {
        display: none !important;
    }

    .menu-open .site-nav {
        display: flex !important;
    }
}

/* Keep apartment-category shortcuts on desktop only: the mobile menu retains
   the main “Квартиры” link without expanding the four category pages. */
@media (max-width: 760px) {
    .site-nav__item--apartments .site-nav__submenu,
    .site-nav__item--apartments.is-open .site-nav__submenu,
    .site-nav__item--apartments:hover .site-nav__submenu,
    .site-nav__item--apartments:focus-within .site-nav__submenu {
        display: none !important;
    }
}


/* Commercial catalog: deal tabs and rent-rate disclosure. */
.commerce-deal-tabs {
    display: inline-grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: min(100%, 420px);
    margin: 0 0 22px;
    overflow: hidden;
    border: 1px solid #0b6047;
    border-radius: 7px;
}

.commerce-deal-tabs__button {
    min-height: 48px;
    padding: 10px 18px;
    border: 0;
    border-right: 1px solid #0b6047;
    color: #022441;
    background: #fff;
    font: inherit;
    font-size: 14px;
    cursor: pointer;
    transition: color .2s ease, background-color .2s ease;
}

.commerce-deal-tabs__button:last-child {
    border-right: 0;
}

.commerce-deal-tabs__button:hover,
.commerce-deal-tabs__button:focus-visible,
.commerce-deal-tabs__button.is-active {
    color: #fff;
    background: #0b6047;
}

.commerce-card__rent-rate {
    margin-top: 12px !important;
    color: #0b6047;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
}

@media (max-width: 760px) {
    .commerce-deal-tabs {
        width: 100%;
        margin-bottom: 18px;
    }

    .commerce-deal-tabs__button {
        min-height: 44px;
        padding: 8px 12px;
        font-size: 13px;
    }
}

/* Commercial advantages — page-kommerciya.php */
.commerce-benefits {
    position: relative;
    overflow: hidden;
    padding: clamp(74px, 8vw, 128px) 0;
    color: #fff;
    background:
        radial-gradient(circle at 10% 14%, rgba(244, 198, 143, 0.18), transparent 28rem),
        radial-gradient(circle at 96% 84%, rgba(50, 131, 120, 0.22), transparent 28rem),
        #062f4d;
}

.commerce-benefits::before {
    position: absolute;
    inset: 0;
    content: '';
    opacity: 0.35;
    background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px);
    background-size: 52px 52px;
    pointer-events: none;
}

.commerce-benefits__inner {
    position: relative;
}

.commerce-benefits__heading {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.7fr);
    gap: clamp(24px, 5vw, 88px);
    align-items: end;
    margin-bottom: clamp(30px, 4vw, 54px);
}

.commerce-benefits__eyebrow,
.commerce-benefits__card-eyebrow {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.commerce-benefits__eyebrow {
    margin-bottom: 14px;
    color: #f7ca95;
}

.commerce-benefits__heading h2 {
    max-width: 10ch;
    margin: 0;
    color: #fff;
    font-size: clamp(44px, 5vw, 78px);
    line-height: 0.92;
    letter-spacing: normal;
}

.commerce-benefits__lead {
    max-width: 33ch;
    margin: 0;
    color: rgba(239, 246, 250, 0.82);
    font-size: clamp(17px, 1.5vw, 22px);
    line-height: 1.45;
}

.commerce-benefits__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.17fr) minmax(0, 0.83fr);
    grid-template-rows: repeat(2, clamp(185px, 17vw, 250px));
    gap: clamp(12px, 1.5vw, 22px);
}

.commerce-benefits__lower {
    display: grid;
    grid-column: 2;
    grid-row: 2;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(12px, 1.5vw, 22px);
}

.commerce-benefits__card {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 22px;
    background: #0b3a59;
    box-shadow: 0 18px 36px rgba(0, 17, 34, 0.26);
}

.commerce-benefits__card--frontline {
    grid-row: 1 / span 2;
}

.commerce-benefits__card::after {
    position: absolute;
    inset: 0;
    content: '';
    background: linear-gradient(180deg, rgba(3, 21, 35, 0.02) 25%, rgba(3, 20, 33, 0.9) 100%);
    pointer-events: none;
}

.commerce-benefits__card img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 500ms cubic-bezier(0.22, 1, 0.36, 1);
}

.commerce-benefits__card--frontline img {
    object-position: 52% 50%;
}

.commerce-benefits__card--district img {
    object-position: 50% 55%;
}

.commerce-benefits__card-content {
    position: absolute;
    z-index: 1;
    right: 0;
    bottom: 0;
    left: 0;
    padding: clamp(18px, 2.2vw, 34px);
}

.commerce-benefits__card-eyebrow {
    margin-bottom: 9px;
    color: #f7ca95;
}

.commerce-benefits__card h3 {
    margin: 0;
    color: #fff;
    font-size: clamp(21px, 2vw, 31px);
    line-height: 0.98;
    letter-spacing: normal;
}

.commerce-benefits__card h3 span {
    display: block;
}

.commerce-benefits__card--frontline h3 {
    max-width: 10ch;
    font-size: clamp(33px, 3.1vw, 52px);
}

.commerce-benefits__card--residents h3 span {
    color: #f7ca95;
    font-size: 1.16em;
}

@media (hover: hover) and (pointer: fine) {
    .commerce-benefits__card:hover img {
        transform: scale(1.045);
    }
}

@media (max-width: 960px) {
    .commerce-benefits__heading {
        display: block;
    }

    .commerce-benefits__lead {
        margin-top: 20px;
    }

    .commerce-benefits__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
    }

    .commerce-benefits__lower {
        display: contents;
    }

    .commerce-benefits__card,
    .commerce-benefits__card--frontline {
        grid-column: auto;
        grid-row: auto;
        aspect-ratio: 1.45;
    }
}

@media (max-width: 760px) {
    .commerce-benefits {
        padding: 58px 0 62px;
    }

    .commerce-benefits__heading {
        margin-bottom: 28px;
    }

    .commerce-benefits__heading h2 {
        max-width: 9ch;
        font-size: clamp(40px, 11vw, 52px);
    }

    .commerce-benefits__lead {
        margin-top: 18px;
        font-size: 17px;
    }

    .commerce-benefits__grid {
        display: flex;
        gap: 12px;
        margin-right: -16px;
        padding: 0 16px 10px 0;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .commerce-benefits__grid::-webkit-scrollbar {
        display: none;
    }

    .commerce-benefits__card,
    .commerce-benefits__card--frontline {
        flex: 0 0 min(84vw, 340px);
        aspect-ratio: 1.3;
        border-radius: 17px;
        scroll-snap-align: start;
    }

    .commerce-benefits__card-content {
        padding: 19px;
    }

    .commerce-benefits__card--frontline h3 {
        font-size: 32px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .commerce-benefits__card img {
        transition: none;
    }
}

/*
 * Shared typography contract.
 * Roboto Flex is reserved for headings and large display values; all interface
 * copy uses the single approved Mulish Medium face. Tracking is proportional
 * so it remains visually consistent when responsive type sizes change.
 */
h1,
h2,
.hero__word,
.manifest__title,
.plan-picker__title,
.happy-life__frame-title,
.article-detail__hero-title,
.article-content__heading,
.news-archive-card__title {
    font-family: var(--font-heading);
    font-variation-settings: "GRAD" 30;
    line-height: var(--type-leading-display) !important;
    letter-spacing: var(--type-tracking-display) !important;
}

h3,
h4,
h5,
h6 {
    font-family: var(--font-heading);
    font-variation-settings: "GRAD" 30;
    line-height: var(--type-leading-heading) !important;
    letter-spacing: var(--type-tracking-heading) !important;
}

.stat strong,
.about__stats-shell .stat strong,
.plan-picker__steps b,
.apartment-card__price,
.layouts-benefits__index,
.flat-price-row strong,
.flat-hero__stats b,
.company-about__stats b,
.company-project-row__params b,
.purchase-mortgage__stats strong,
.purchase-mortgage__stat--limit strong,
.purchase-calculator__result-main dd,
.purchase-calculator__info-item dd,
.purchase-maternity__stats strong,
.commerce-card__price,
.commerce-unit-detail__price strong,
.flat-mortgage-summary__card dd,
.planning-open__progress strong,
.planning-hero__numbers b,
.planning-facts__content strong,
.planning-showcase__index {
    font-family: var(--font-heading);
    font-variation-settings: "GRAD" 30;
}

p,
figcaption {
    line-height: var(--type-leading-body) !important;
    letter-spacing: 0 !important;
}

li,
dt,
dd {
    letter-spacing: 0 !important;
}

button,
input,
select,
textarea,
label {
    font-family: var(--font-body);
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
}

small,
th,
td {
    line-height: 1.35;
    letter-spacing: 0 !important;
}