/* =========================================================================
   HILTE v8 «ДНК» — общие компоненты в стиле HILTE Real Estate:
   шапка, меню направлений, мобильное меню, панель «Связаться», подвал.
   Подключается после style.css (functions.php → hilte-dna).
   ========================================================================= */

@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/montserrat-cyrillic-wght.woff2') format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('../fonts/montserrat-latin-wght.woff2') format('woff2');
    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 {
    --hx-wine: #3E1214;
    --hx-wine-soft: #6B0E1C;
    --hx-cream: #F7F4F1;
    --hx-paper: #FFFEFA;
    --hx-ink: #301E20;
    --hx-line: #DFD8D1;
    --hx-muted: #776E69;
    --hx-rose: #E1CECA;
    --hx-font: 'Montserrat', Arial, sans-serif;
    --hx-h: 96px;
    --hx-pad: 48px;
    --font-heading: 'Montserrat', Arial, sans-serif;
    --font-body: 'Montserrat', Arial, sans-serif;
}

/* Заголовки прежних блоков — светлые, как в HILTE Real Estate */
h1, h2, h3 {
    font-weight: 300;
    letter-spacing: -.03em;
}

.hx-symbols {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
}

.hx svg,
.hx-menu svg,
.hx-sheet svg,
.hx-panel svg,
.hx-builder svg,
.hx-hero svg,
.hx-dock svg,
.hx-engine svg,
.hx-err svg,
.hxf svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ---------- Логотип (маска SVG — цвет берётся из currentColor) ---------- */
.hx-brand {
    display: flex;
    align-items: center;
    width: 152px;
    flex-shrink: 0;
    color: inherit;
}

.hx-mark {
    display: block;
    width: 100%;
    height: 30px;
    background: currentColor;
    -webkit-mask: url('../images/hilte-logo.svg') center / 100% auto no-repeat;
    mask: url('../images/hilte-logo.svg') center / 100% auto no-repeat;
}

/* ---------- Шапка ---------- */
.hx {
    position: fixed;
    inset: 0 0 auto;
    z-index: 1000;
    height: var(--hx-h);
    padding: 0 var(--hx-pad);
    display: flex;
    align-items: center;
    gap: 30px;
    font-family: var(--hx-font);
    background: var(--hx-paper);
    color: var(--hx-wine);
    border-bottom: 1px solid var(--hx-line);
    transform: translate3d(0, 0, 0);
    transition: transform .25s ease, background-color .3s ease, color .3s ease, border-color .3s ease;
}

.hx a,
.hx button {
    color: inherit;
    font: inherit;
    background: none;
    border: 0;
    cursor: pointer;
    text-decoration: none;
}

.hx.is-hidden {
    transform: translate3d(0, -100%, 0);
}

.hx:focus-within {
    transform: translate3d(0, 0, 0);
}

/* Над фото первого экрана — прозрачная, белый текст */
body:has(.fs-hero-wrapper, .service-editorial-hero, .b2b-hero, .inner-hero, .hx-hero, .hx-err) .hx:not(.is-solid):not(.is-open) {
    background: transparent;
    color: #FFFFFF;
    border-bottom-color: rgba(255, 255, 255, .22);
}

body:has(.fs-hero-wrapper, .service-editorial-hero, .b2b-hero, .inner-hero, .hx-hero, .hx-err) .hx:not(.is-solid):not(.is-open)::before {
    content: '';
    position: absolute;
    inset: 0 0 -60% 0;
    z-index: -1;
    background: linear-gradient(180deg, rgba(20, 8, 9, .45), rgba(20, 8, 9, 0));
    pointer-events: none;
}

.hx-nav {
    display: flex;
    align-items: center;
    gap: 30px;
    flex: 1;
    margin-left: 45px;
    font-size: 13px;
    font-weight: 400;
    white-space: nowrap;
}

.hx-nav > a,
.hx-nav__btn {
    position: relative;
    padding: 12px 0;
}

.hx-nav > a::after,
.hx-nav__btn::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 6px;
    width: 0;
    height: 1px;
    background: currentColor;
    transition: width .2s ease;
}

.hx-nav > a:hover::after,
.hx-nav > a:focus-visible::after,
.hx-nav__btn:hover::after,
.hx-nav__btn[aria-expanded="true"]::after {
    width: 100%;
}

.hx-chev {
    display: inline-block;
    font-size: 11px;
    transform: translateY(-2px);
    transition: transform .2s ease;
}

.hx-nav__btn[aria-expanded="true"] .hx-chev {
    transform: translateY(-2px) rotate(180deg);
}

.hx-actions {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-left: auto;
    white-space: nowrap;
    font-size: 12px;
}

.hx-lang {
    display: flex;
    gap: 12px;
    font-size: 11px;
    letter-spacing: .12em;
}

.hx-lang .lang-item {
    opacity: .55;
    color: inherit !important;
    transition: opacity .2s ease;
}

.hx-lang .lang-item.active,
.hx-lang .lang-item:hover {
    opacity: 1;
}

.hx-contact {
    display: flex;
    align-items: center;
    gap: 24px;
    min-height: 44px;
    padding: 12px 17px !important;
    border: 1px solid currentColor !important;
    border-color: color-mix(in srgb, currentColor 45%, transparent) !important;
    font-size: 12px !important;
    letter-spacing: .02em;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.hx-contact svg {
    width: 15px;
    height: 15px;
}

.hx-contact:hover,
.hx-contact:focus-visible {
    background: var(--hx-wine) !important;
    border-color: var(--hx-wine) !important;
    color: #FFFFFF;
}

body:has(.fs-hero-wrapper, .service-editorial-hero, .b2b-hero, .inner-hero, .hx-hero, .hx-err) .hx:not(.is-solid):not(.is-open) .hx-contact:hover {
    background: #FFFFFF !important;
    border-color: #FFFFFF !important;
    color: var(--hx-wine);
}

.hx-burger {
    display: none;
    padding: 10px 0 10px 4px !important;
}

.hx-burger svg {
    width: 24px;
    height: 24px;
}

/* ---------- Панель «Услуги» (десктоп) ---------- */
.hx-panel {
    position: fixed;
    top: var(--hx-h);
    left: 0;
    right: 0;
    z-index: 999;
    background: var(--hx-wine);
    color: var(--hx-cream);
    font-family: var(--hx-font);
    box-shadow: 0 30px 40px rgba(38, 9, 12, .19);
    animation: hx-drop .22s ease both;
}

.hx-panel[hidden] {
    display: none;
}

@keyframes hx-drop {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: none; }
}

.hx-panel__inner {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 7vw;
    padding: 46px 7vw 52px;
}

.hx-eyebrow {
    margin: 0;
    font-family: var(--hx-font);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .18em;
    text-transform: uppercase;
    opacity: .75;
}

.hx-panel__lead {
    margin: 22px 0 0;
    max-width: 340px;
    font-size: 28px;
    font-weight: 300;
    line-height: 1.25;
    letter-spacing: -.03em;
}

.hx-panel__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 48px;
}

.hx-panel__list a {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 18px 0;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
    color: var(--hx-cream);
    text-decoration: none;
    transition: color .2s ease, padding-left .2s ease;
}

.hx-panel__name {
    font-size: 17px;
    font-weight: 400;
    letter-spacing: -.01em;
}

.hx-panel__list small {
    font-size: 11px;
    color: #C9AFA9;
}

.hx-panel__list a:hover,
.hx-panel__list a:focus-visible {
    color: #FFFFFF;
    padding-left: 8px;
}

/* ---------- Мобильное меню (полноэкранное) ---------- */
.hx-menu,
.hx-sheet {
    border: 0;
    padding: 0;
    font-family: var(--hx-font);
}

.hx-menu {
    width: 100%;
    max-width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    margin: 0;
    background: var(--hx-wine);
    color: var(--hx-cream);
    overflow-y: auto;
}

.hx-menu::backdrop,
.hx-sheet::backdrop {
    background: rgba(28, 10, 12, .55);
}

.hx-menu[open] {
    display: flex;
    flex-direction: column;
    animation: hx-fade .25s ease both;
}

@keyframes hx-fade {
    from { opacity: 0; }
    to { opacity: 1; }
}

.hx-menu__head,
.hx-sheet__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 24px;
    border-bottom: 1px solid rgba(255, 255, 255, .15);
}

.hx-menu__head {
    min-height: 72px;
    padding: 0 18px;
}

.hx-menu .hx-brand {
    width: 110px;
}

.hx-menu .hx-mark {
    height: 23px;
}

.hx-icon {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .3);
    background: none;
    color: inherit;
    cursor: pointer;
}

.hx-icon svg {
    width: 18px;
    height: 18px;
}

.hx-menu__nav {
    display: flex;
    flex-direction: column;
    padding: 14px 18px 10px;
}

.hx-menu__nav .hx-eyebrow {
    margin: 22px 0 4px;
    color: #C9AFA9;
    opacity: 1;
}

.hx-menu__nav > a,
.hx-menu__nav > button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 15px 0;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    background: none;
    color: var(--hx-cream);
    font: inherit;
    font-size: 23px;
    font-weight: 300;
    letter-spacing: -.03em;
    line-height: 1.2;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.hx-menu__nav svg {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    color: #BC9B94;
}

.hx-menu__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: auto;
    padding: 26px 18px calc(26px + env(safe-area-inset-bottom));
    font-size: 13px;
    color: var(--hx-rose);
}

.hx-menu__foot a {
    color: inherit;
    text-decoration: none;
}

/* ---------- Панель «Связаться» ---------- */
.hx-sheet {
    width: min(480px, 100%);
    max-width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    margin: 0 0 0 auto;
    background: var(--hx-paper);
    color: var(--hx-ink);
    overflow-y: auto;
}

.hx-sheet[open] {
    animation: hx-slide .28s cubic-bezier(.2, .8, .2, 1) both;
}

@keyframes hx-slide {
    from { transform: translateX(40px); opacity: 0; }
    to { transform: none; opacity: 1; }
}

.hx-sheet__head {
    align-items: flex-start;
    padding: 34px 32px 28px;
    border-bottom-color: var(--hx-line);
}

.hx-sheet__head .hx-eyebrow {
    color: var(--hx-wine-soft);
    opacity: 1;
}

.hx-sheet__head h2 {
    margin: 18px 0 0;
    font-family: var(--hx-font);
    font-size: 34px;
    font-weight: 300;
    line-height: 1.15;
    letter-spacing: -.04em;
    color: var(--hx-wine);
}

.hx-sheet .hx-icon {
    border-color: var(--hx-line);
    color: var(--hx-wine);
}

.hx-sheet__body {
    padding: 26px 32px 36px;
}

.hx-sheet__lead {
    margin: 0 0 26px;
    font-size: 14px;
    line-height: 1.8;
    color: var(--hx-muted);
}

.hx-sheet__channels {
    display: grid;
    gap: 10px;
}

.hx-channel {
    display: grid;
    grid-template-columns: 22px 1fr auto;
    align-items: center;
    gap: 16px;
    min-height: 64px;
    padding: 0 20px;
    border: 1px solid var(--hx-line);
    color: var(--hx-ink);
    text-decoration: none;
    font-size: 14px;
    transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.hx-channel svg {
    width: 20px;
    height: 20px;
}

.hx-channel small {
    font-size: 12px;
    color: var(--hx-muted);
}

.hx-channel:hover,
.hx-channel:focus-visible {
    border-color: var(--hx-wine);
}

.hx-channel--primary {
    background: var(--hx-wine);
    border-color: var(--hx-wine);
    color: #FFFFFF;
}

.hx-channel--primary small {
    color: var(--hx-rose);
}

.hx-channel--primary:hover,
.hx-channel--primary:focus-visible {
    background: transparent;
    color: var(--hx-wine);
}

.hx-channel--primary:hover small {
    color: var(--hx-muted);
}

.hx-sheet__legal {
    margin: 26px 0 0;
    font-size: 11px;
    line-height: 1.75;
    color: var(--hx-muted);
}

.hx-sheet__legal a {
    color: var(--hx-wine);
    text-decoration: underline;
    text-underline-offset: 3px;
}

body.hx-locked {
    overflow: hidden !important;
}

/* ---------- Адаптив шапки ---------- */
@media (max-width: 1200px) {
    :root { --hx-pad: 32px; }
    .hx { gap: 22px; }
    .hx-nav { margin-left: 10px; gap: 22px; }
    .hx-actions { gap: 18px; }
}

@media (max-width: 1024px) {
    :root { --hx-h: 84px; --hx-pad: 24px; }
    .hx-nav { display: none; }
    .hx-burger { display: block; }
    .hx-contact { gap: 15px; }
    .hx-panel { display: none !important; }
}

@media (max-width: 600px) {
    :root { --hx-h: 72px; --hx-pad: 18px; }
    .hx { gap: 12px; }
    .hx-brand { width: 110px; }
    .hx-mark { height: 23px; }
    .hx-actions { gap: 14px; }
    .hx-actions > .hx-lang { display: none; }
    .hx-contact {
        min-height: 36px;
        padding: 9px 11px !important;
        gap: 9px;
        font-size: 11px !important;
    }
    .hx-contact svg { width: 12px; height: 12px; }
    .hx-burger svg { width: 22px; height: 22px; }
    .hx-sheet {
        width: 100%;
        height: auto;
        max-height: 92dvh;
        margin: auto 0 0;
    }
    .hx-sheet[open] { animation-name: hx-rise; }
    .hx-sheet__head { padding: 26px 22px 22px; }
    .hx-sheet__head h2 { font-size: 29px; }
    .hx-sheet__body { padding: 22px 22px calc(28px + env(safe-area-inset-bottom)); }
    .hx-channel { min-height: 58px; padding: 0 16px; }
}

@keyframes hx-rise {
    from { transform: translateY(40px); opacity: 0; }
    to { transform: none; opacity: 1; }
}

@media (max-width: 350px) {
    :root { --hx-pad: 14px; }
    .hx-brand { width: 96px; }
    .hx-mark { height: 20px; }
    .hx-contact svg { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .hx, .hx-panel, .hx-menu[open], .hx-sheet[open] { transition: none; animation: none; }
}

/* Старые элементы шапки v7 больше не выводятся; страхуемся от остаточных отступов */
.site-header { display: none !important; }

/* ---------- Подвал ---------- */
.hxf {
    background: var(--hx-wine);
    color: var(--hx-paper);
    font-family: var(--hx-font);
    padding: 90px 0 42px;
}

.hxf a,
.hxf button {
    color: inherit;
    font: inherit;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    text-decoration: none;
    transition: color .2s ease, border-color .2s ease;
}

.hxf a:hover,
.hxf button:hover {
    color: #FFFFFF;
}

.hxf__wrap {
    width: calc(100% - 2 * var(--hx-pad));
    max-width: 1440px;
    margin: 0 auto;
}

.hxf__layout {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 12%;
    padding-bottom: 74px;
}

.hxf__brand {
    width: min(370px, 90%);
    margin-bottom: 48px;
}

.hxf__brand .hx-mark {
    height: 70px;
}

.hxf__geo h3 {
    margin: 0 0 12px;
    font-family: var(--hx-font);
    font-size: 14px;
    font-weight: 500;
    color: inherit;
}

.hxf__geo p {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.8;
}

.hxf__contact {
    display: inline-flex !important;
    align-items: center;
    gap: 20px;
    padding-bottom: 6px !important;
    border-bottom: 1px solid rgba(255, 255, 255, .33) !important;
    font-size: 13px !important;
}

.hxf__contact svg {
    width: 16px;
    height: 16px;
}

.hxf__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 15px 25px;
    margin-top: 38px;
    font-size: 11px;
    color: var(--hx-rose);
}

.hxf__non-offer {
    margin: 28px 0 12px;
    max-width: 620px;
    font-size: 12px;
    line-height: 1.8;
    color: var(--hx-paper);
}

.hxf__disclaimer {
    margin: 0;
    max-width: 630px;
    font-size: 10px;
    line-height: 1.85;
    color: var(--hx-rose);
}

.hxf__requisites {
    margin: 20px 0 0;
    font-size: 10px;
    line-height: 1.9;
    color: var(--hx-rose);
}

.hxf__offer {
    padding-top: 7px;
}

.hxf__offer .hx-eyebrow {
    font-size: 11px;
    letter-spacing: .15em;
    color: #DFC9C4;
    opacity: 1;
}

.hxf__offer h2 {
    margin: 22px 0 25px;
    font-family: var(--hx-font);
    font-size: clamp(32px, 3.1vw, 48px);
    font-weight: 300;
    line-height: 1.2;
    letter-spacing: -.04em;
    color: var(--hx-paper);
}

.hxf__offer > p:not(.hx-eyebrow):not(.hxf__note) {
    margin: 0;
    max-width: 450px;
    font-size: 13px;
    line-height: 1.85;
    color: var(--hx-rose);
}

.hxf__cta {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 16px 0 20px;
    padding: 24px 0 16px !important;
    border-bottom: 1px solid rgba(255, 255, 255, .5) !important;
    font-size: 14px !important;
}

.hxf__cta svg {
    width: 16px;
    height: 16px;
}

.hxf__cta:hover {
    border-bottom-color: #FFFFFF !important;
}

.hxf__note {
    margin: 0;
    font-size: 10px;
    line-height: 1.8;
    color: var(--hx-rose);
}

.hxf__more {
    margin-top: 24px;
    font-size: 12px !important;
}

.hxf__legal {
    display: flex;
    flex-wrap: wrap;
    gap: 13px 22px;
    margin-top: 35px;
    padding-top: 23px;
    border-top: 1px solid rgba(255, 255, 255, .2);
    font-size: 10px;
    line-height: 1.8;
    color: var(--hx-rose);
}

.hxf__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 23px;
    padding-top: 30px;
    border-top: 1px solid rgba(255, 255, 255, .2);
    font-size: 9px;
    color: var(--hx-rose);
}

.hxf__bottom > span {
    letter-spacing: .2em;
}

.hxf__bottom > div {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
}

@media (max-width: 1024px) {
    .hxf__layout { gap: 8%; }
    .hxf__brand { width: 260px; }
    .hxf__brand .hx-mark { height: 52px; }
    .hxf__offer h2 { font-size: 34px; }
}

@media (max-width: 760px) {
    .hxf { padding: 60px 0 28px; }
    .hxf__layout { grid-template-columns: 1fr; gap: 46px; padding-bottom: 42px; }
    .hxf__brand { width: 230px; margin-bottom: 35px; }
    .hxf__brand .hx-mark { height: 46px; }
    .hxf__geo h3, .hxf__geo p { font-size: 13px; }
    .hxf__nav { gap: 15px 22px; margin-top: 30px; }
    .hxf__disclaimer { font-size: 9px; }
    .hxf__offer { border-top: 1px solid rgba(255, 255, 255, .2); padding-top: 35px; }
    .hxf__offer h2 { font-size: 36px; margin-top: 20px; }
    .hxf__offer .hx-eyebrow { font-size: 9px; }
    .hxf__bottom { flex-direction: column; align-items: flex-start; gap: 22px; padding-top: 25px; }
    .hxf__bottom > div { gap: 18px; }
}

/* Нижняя мобильная плашка главной не должна перекрывать подвал */
@media (max-width: 768px) {
    .hxf { padding-bottom: calc(28px + 76px + env(safe-area-inset-bottom)); }
}

.hx-sheet__head h2 > span,
.hxf__offer h2 > span {
    display: block;
}

.hxf h2,
.hxf h3,
.hx-sheet h2 {
    text-align: left;
    text-transform: none;
}

/* =========================================================================
   Общие примитивы v8
   ========================================================================= */
.hx-wrap {
    width: calc(100% - 2 * var(--hx-pad));
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}

.hx-eyebrow--light {
    color: #FFFFFF;
    opacity: .82;
}

.hx-btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    min-height: 52px;
    padding: 0 24px;
    border: 1px solid var(--hx-wine);
    background: var(--hx-wine);
    color: #FFFFFF;
    font-family: var(--hx-font);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .04em;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease;
}

.hx-btn svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.4;
}

.hx-btn:hover,
.hx-btn:focus-visible {
    background: transparent;
    color: var(--hx-wine);
}

.hx-textlink {
    padding: 0 0 4px;
    border: 0;
    border-bottom: 1px solid currentColor;
    background: none;
    color: var(--hx-wine);
    font-family: var(--hx-font);
    font-size: 12px;
    cursor: pointer;
}

/* =========================================================================
   Главная v8: первый экран
   ========================================================================= */
.hx-hero {
    position: relative;
    height: max(720px, 100svh);
    overflow: hidden;
    background: #1D0C0D;
    color: #FFFFFF;
    font-family: var(--hx-font);
}

.hx-hero__media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    object-position: 50% 50%;
    animation: hx-hero-in 1.8s cubic-bezier(.2, .7, .2, 1) both;
}

@keyframes hx-hero-in {
    from { transform: scale(1.06); }
    to { transform: none; }
}

.hx-hero__shade {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(25, 9, 10, .62) 0%, rgba(25, 9, 10, .18) 62%, rgba(25, 9, 10, .08) 100%),
        linear-gradient(0deg, rgba(25, 9, 10, .72) 0%, rgba(25, 9, 10, 0) 48%);
}

.hx-hero__content {
    position: relative;
    z-index: 2;
    padding-top: calc(var(--hx-h) + 13vh);
}

.hx-hero__title {
    margin: 30px 0 28px;
    font-family: var(--hx-font);
    font-size: clamp(48px, 6.6vw, 104px);
    font-weight: 300;
    line-height: 1.02;
    letter-spacing: -.05em;
    color: #FFFFFF;
    text-align: left;
    text-transform: none;
}

.hx-hero__title > span {
    display: block;
}

.hx-hero__text {
    max-width: 520px;
    margin: 0;
    font-size: 16px;
    line-height: 1.7;
    color: rgba(255, 255, 255, .88);
}

.hx-hero__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px 44px;
    margin-top: 38px;
}

.hx-hero__link {
    display: inline-flex;
    align-items: center;
    gap: 44px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, .7);
    color: #FFFFFF;
    font-size: 14px;
    text-decoration: none;
    transition: gap .25s ease, border-color .2s ease;
}

.hx-hero__link svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.4;
}

.hx-hero__link:hover {
    gap: 56px;
    border-bottom-color: #FFFFFF;
}

.hx-hero__phone {
    color: rgba(255, 255, 255, .78);
    font-size: 13px;
    letter-spacing: .02em;
    text-decoration: none;
}

.hx-hero__phone:hover {
    color: #FFFFFF;
}

.hx-hero__caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 150px;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    font-size: 10px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .72);
}

/* =========================================================================
   Плашка направлений
   ========================================================================= */
.hx-dock {
    position: relative;
    z-index: 5;
    margin-top: -112px;
    font-family: var(--hx-font);
}

.hx-dock__box {
    background: var(--hx-paper);
    color: var(--hx-ink);
    padding: 0 40px 36px;
    box-shadow: 0 30px 60px rgba(48, 30, 32, .10);
}

.hx-dock__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border-bottom: 1px solid var(--hx-line);
}

.hx-dock__tabs {
    display: flex;
    gap: 34px;
    overflow-x: auto;
    scrollbar-width: none;
}

.hx-dock__tabs::-webkit-scrollbar {
    display: none;
}

.hx-dock__tabs button {
    position: relative;
    flex-shrink: 0;
    padding: 26px 0 22px;
    border: 0;
    background: none;
    color: var(--hx-muted);
    font: inherit;
    font-size: 13px;
    cursor: pointer;
    transition: color .2s ease;
}

.hx-dock__tabs button::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: var(--hx-wine);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .25s ease;
}

.hx-dock__tabs button[aria-selected="true"] {
    color: var(--hx-ink);
}

.hx-dock__tabs button[aria-selected="true"]::after {
    transform: scaleX(1);
}

.hx-dock__tabs button:hover {
    color: var(--hx-ink);
}

.hx-dock__estate {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 12px;
    padding: 9px 14px;
    background: var(--hx-cream);
    color: var(--hx-wine);
    font-size: 12px;
    text-decoration: none;
}

.hx-dock__estate svg {
    width: 13px;
    height: 13px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.4;
}

.hx-dock__pane {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) auto;
    align-items: end;
    gap: 40px;
    padding-top: 30px;
    animation: hx-fade .3s ease both;
}

.hx-dock__pane[hidden] {
    display: none;
}

.hx-dock__copy h2 {
    margin: 0 0 12px;
    font-family: var(--hx-font);
    font-size: 26px;
    font-weight: 300;
    line-height: 1.2;
    letter-spacing: -.03em;
    color: var(--hx-wine);
    text-align: left;
    text-transform: none;
}

.hx-dock__copy p {
    margin: 0;
    max-width: 560px;
    font-size: 13px;
    line-height: 1.8;
    color: var(--hx-muted);
}

.hx-dock__facts {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
    font-size: 12px;
    color: var(--hx-ink);
}

.hx-dock__facts li {
    position: relative;
    padding-left: 22px;
}

.hx-dock__facts li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    width: 12px;
    height: 1px;
    background: var(--hx-wine);
}

.hx-dock__actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
}

@media (max-width: 1024px) {
    .hx-dock__box { padding: 0 24px 26px; }
    .hx-dock__pane { grid-template-columns: 1fr 1fr; }
    .hx-dock__actions { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 26px; }
}

@media (max-width: 600px) {
    .hx-hero { height: max(640px, 100svh); }
    .hx-hero__media img { object-position: 50% 50%; }
    .hx-hero__shade {
        background:
            linear-gradient(180deg, rgba(25, 9, 10, .35) 0%, rgba(25, 9, 10, 0) 30%),
            linear-gradient(0deg, rgba(25, 9, 10, .86) 0%, rgba(25, 9, 10, .25) 62%, rgba(25, 9, 10, .1) 100%);
    }
    .hx-hero__content {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 150px;
        padding-top: 0;
    }
    .hx-eyebrow--light { font-size: 9px; letter-spacing: .13em; }
    .hx-hero__title { font-size: 43px; line-height: 1.06; letter-spacing: -.045em; margin: 18px 0 18px; }
    .hx-hero__text { font-size: 13px; line-height: 1.65; }
    .hx-hero__actions { margin-top: 24px; gap: 16px 28px; }
    .hx-hero__link { gap: 30px; font-size: 13px; }
    .hx-hero__phone { font-size: 12px; }
    .hx-hero__caption { display: none; }
    .hx-dock { margin-top: -96px; }
    .hx-dock__box { padding: 0 16px 20px; }
    .hx-dock__top { flex-direction: column; align-items: stretch; gap: 0; }
    .hx-dock__tabs { gap: 22px; margin: 0 -16px; padding: 0 16px; }
    .hx-dock__tabs button { font-size: 12px; padding: 18px 0 14px; }
    .hx-dock__estate { display: none; }
    .hx-dock__pane { grid-template-columns: 1fr; gap: 20px; padding-top: 22px; }
    .hx-dock__copy h2 { font-size: 23px; }
    .hx-dock__actions { flex-direction: column; align-items: stretch; gap: 16px; }
    .hx-dock__actions .hx-btn { justify-content: space-between; }
    .hx-dock__actions .hx-textlink { align-self: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
    .hx-hero__media img, .hx-dock__pane { animation: none; }
}

/* =========================================================================
   404
   ========================================================================= */
.hx-err {
    position: relative;
    min-height: max(720px, 100svh);
    overflow: hidden;
    background: #1D0C0D;
    color: #FFFFFF;
    font-family: var(--hx-font);
}

.hx-err__media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100% !important;
    object-fit: cover;
}

.hx-err__shade {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(25, 9, 10, .78) 0%, rgba(25, 9, 10, .35) 60%, rgba(25, 9, 10, .55) 100%),
        linear-gradient(0deg, rgba(25, 9, 10, .6), rgba(25, 9, 10, 0) 50%);
}

.hx-err__inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    align-items: end;
    gap: 8%;
    min-height: max(720px, 100svh);
    padding: calc(var(--hx-h) + 60px) 0 90px;
}

.hx-err__copy h1 {
    margin: 26px 0 26px;
    font-family: var(--hx-font);
    font-size: clamp(46px, 6vw, 92px);
    font-weight: 300;
    line-height: 1.03;
    letter-spacing: -.05em;
    color: #FFFFFF;
    text-align: left;
    text-transform: none;
}

.hx-err__copy h1 > span {
    display: block;
}

.hx-err__copy > p:not(.hx-eyebrow) {
    max-width: 480px;
    margin: 0;
    font-size: 15px;
    line-height: 1.75;
    color: rgba(255, 255, 255, .86);
}

.hx-err__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px 40px;
    margin-top: 36px;
}

.hx-err__contact {
    padding: 0 0 4px;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .45);
    background: none;
    color: rgba(255, 255, 255, .85);
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}

.hx-err__contact:hover {
    color: #FFFFFF;
    border-bottom-color: #FFFFFF;
}

.hx-err__nav {
    display: flex;
    flex-direction: column;
}

.hx-err__nav .hx-eyebrow {
    margin-bottom: 10px;
}

.hx-err__nav a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 15px 0;
    border-bottom: 1px solid rgba(255, 255, 255, .2);
    color: #FFFFFF;
    font-size: 19px;
    font-weight: 300;
    letter-spacing: -.02em;
    text-decoration: none;
    transition: padding-left .2s ease;
}

.hx-err__nav a:hover {
    padding-left: 8px;
}

.hx-err__nav svg {
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.4;
    opacity: .7;
}

@media (max-width: 900px) {
    .hx-err__inner { grid-template-columns: 1fr; gap: 48px; align-items: start; padding-top: calc(var(--hx-h) + 70px); }
}

@media (max-width: 600px) {
    .hx-err__copy h1 { font-size: 42px; }
    .hx-err__copy > p:not(.hx-eyebrow) { font-size: 13px; }
    .hx-err__nav a { font-size: 17px; padding: 13px 0; }
    .hx-err__inner { padding-bottom: 60px; }
}

/* =========================================================================
   «Движок» услуг: первый экран страницы направления и панель направлений
   ========================================================================= */
@view-transition {
    navigation: auto;
}

::view-transition-old(root),
::view-transition-new(root) {
    animation-duration: .35s;
}

.hx { view-transition-name: hx-header; }
.hx-engine { view-transition-name: hx-engine; }

.hx-hero--svc {
    height: max(680px, 92svh);
}

.hx-hero--svc .hx-hero__content {
    padding-top: calc(var(--hx-h) + 9vh);
}

.hx-crumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 26px;
    font-size: 11px;
    color: rgba(255, 255, 255, .7);
}

.hx-crumbs a {
    color: inherit;
    text-decoration: none;
}

.hx-crumbs a:hover {
    color: #FFFFFF;
}

.hx-hero__title--svc {
    max-width: 900px;
    font-size: clamp(42px, 5.2vw, 82px);
}

button.hx-hero__link {
    padding: 0 0 12px;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .7);
    background: none;
    font-family: inherit;
    cursor: pointer;
}

.hx-hero__facts {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 34px;
    margin: 46px 0 0;
    padding: 0;
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .78);
}

.hx-engine {
    position: sticky;
    top: 0;
    z-index: 900;
    background: var(--hx-paper);
    border-bottom: 1px solid var(--hx-line);
    font-family: var(--hx-font);
    transition: top .25s ease;
}

/* Когда шапка видна — панель направлений встаёт под ней */
body:has(.hx.is-solid:not(.is-hidden)) .hx-engine {
    top: var(--hx-h);
}

.hx-engine__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.hx-engine__tabs {
    display: flex;
    gap: 34px;
    overflow-x: auto;
    scrollbar-width: none;
}

.hx-engine__tabs::-webkit-scrollbar {
    display: none;
}

.hx-engine__tabs a {
    position: relative;
    flex-shrink: 0;
    padding: 22px 0 19px;
    color: var(--hx-muted);
    font-size: 13px;
    text-decoration: none;
    transition: color .2s ease;
}

.hx-engine__tabs a::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: var(--hx-wine);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .25s ease;
}

.hx-engine__tabs a:hover {
    color: var(--hx-ink);
}

.hx-engine__tabs a[aria-current="page"] {
    color: var(--hx-ink);
}

.hx-engine__tabs a[aria-current="page"]::after {
    transform: scaleX(1);
}

.hx-engine__build {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 14px;
    padding: 10px 16px;
    border: 1px solid var(--hx-wine);
    background: var(--hx-wine);
    color: #FFFFFF;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease;
}

.hx-engine__build svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.4;
}

.hx-engine__build:hover {
    background: transparent;
    color: var(--hx-wine);
}

@media (max-width: 600px) {
    .hx-hero--svc { height: max(620px, 92svh); }
    .hx-hero--svc .hx-hero__content { bottom: 64px; }
    .hx-hero__title--svc { font-size: 38px; }
    .hx-crumbs { margin-bottom: 18px; font-size: 10px; }
    .hx-hero__facts { margin-top: 28px; gap: 8px 18px; font-size: 9px; }
    .hx-engine__inner { width: 100%; gap: 0; }
    .hx-engine__tabs { gap: 22px; padding: 0 var(--hx-pad); }
    .hx-engine__tabs a { font-size: 12px; padding: 17px 0 14px; }
    .hx-engine__build { display: none; }
}

/* Старые первые экраны страниц услуг заменены «движком» */
.hx-engine ~ .service-proof-strip { display: none; }

/* =========================================================================
   Конструктор визита
   ========================================================================= */
.hx-builder {
    width: min(760px, 100%);
    max-width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    margin: 0 0 0 auto;
    padding: 0;
    border: 0;
    background: var(--hx-paper);
    color: var(--hx-ink);
    font-family: var(--hx-font);
}

.hx-builder::backdrop {
    background: rgba(28, 10, 12, .55);
}

.hx-builder[open] {
    animation: hx-slide .3s cubic-bezier(.2, .8, .2, 1) both;
}

.hx-builder__form {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.hx-builder__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 34px 40px 26px;
    border-bottom: 1px solid var(--hx-line);
}

.hx-builder__head .hx-eyebrow {
    color: var(--hx-wine-soft);
    opacity: 1;
}

.hx-builder__head h2 {
    margin: 16px 0 0;
    font-family: var(--hx-font);
    font-size: 30px;
    font-weight: 300;
    line-height: 1.18;
    letter-spacing: -.035em;
    color: var(--hx-wine);
    text-align: left;
    text-transform: none;
}

.hx-builder__head h2 > span {
    display: block;
}

.hx-builder .hx-icon {
    flex-shrink: 0;
    border-color: var(--hx-line);
    color: var(--hx-wine);
}

.hx-builder__body {
    flex: 1;
    overflow-y: auto;
    padding: 8px 40px 20px;
}

.hx-builder__step {
    margin: 0;
    padding: 24px 0;
    border: 0;
    border-bottom: 1px solid var(--hx-line);
}

.hx-builder__step[hidden] {
    display: none;
}

.hx-builder__step legend {
    float: left;
    width: 100%;
    display: flex;
    align-items: baseline;
    gap: 14px;
    margin-bottom: 16px;
    padding: 0;
    font-size: 15px;
    font-weight: 500;
    color: var(--hx-ink);
}

.hx-builder__num {
    font-size: 10px;
    letter-spacing: .14em;
    color: var(--hx-wine-soft);
}

.hx-chips {
    clear: both;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.hx-chips + .hx-chips {
    margin-top: 12px;
}

.hx-chip {
    position: relative;
    cursor: pointer;
}

.hx-chip input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.hx-chip span {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 16px;
    border: 1px solid var(--hx-line);
    background: #FFFFFF;
    font-size: 13px;
    color: var(--hx-ink);
    transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}

.hx-chips--soft .hx-chip span {
    min-height: 34px;
    font-size: 12px;
    background: var(--hx-cream);
    border-color: transparent;
}

.hx-chip:hover span {
    border-color: var(--hx-wine);
}

.hx-chip input:checked + span {
    border-color: var(--hx-wine);
    background: var(--hx-wine);
    color: #FFFFFF;
}

.hx-chip input:focus-visible + span {
    outline: 2px solid var(--hx-wine);
    outline-offset: 2px;
}

.hx-builder__hint {
    margin: 18px 0 10px;
    font-size: 11px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--hx-muted);
}

.hx-builder__note {
    display: grid;
    gap: 8px;
    margin-top: 20px;
    font-size: 12px;
    color: var(--hx-muted);
}

.hx-builder__note textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--hx-line);
    background: #FFFFFF;
    color: var(--hx-ink);
    font: inherit;
    font-size: 16px;
    resize: vertical;
}

.hx-builder__note textarea:focus {
    outline: none;
    border-color: var(--hx-wine);
}

.hx-builder__foot {
    padding: 20px 40px calc(24px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--hx-line);
    background: var(--hx-cream);
}

.hx-builder__summary .hx-eyebrow {
    color: var(--hx-wine-soft);
    opacity: 1;
}

.hx-builder__summary p:not(.hx-eyebrow) {
    margin: 8px 0 16px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--hx-ink);
}

.hx-builder__send {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 26px;
}

.hx-builder__legal {
    margin: 14px 0 0;
    font-size: 11px;
    line-height: 1.7;
    color: var(--hx-muted);
}

@media (max-width: 600px) {
    .hx-builder { width: 100%; }
    .hx-builder[open] { animation-name: hx-rise; }
    .hx-builder__head { padding: 22px 18px 18px; }
    .hx-builder__head h2 { font-size: 23px; }
    .hx-builder__body { padding: 0 18px 12px; }
    .hx-builder__step { padding: 20px 0; }
    .hx-chip span { min-height: 38px; padding: 0 13px; font-size: 12px; }
    .hx-builder__foot { padding: 16px 18px calc(18px + env(safe-area-inset-bottom)); }
    .hx-builder__summary p:not(.hx-eyebrow) { font-size: 13px; margin-bottom: 12px; }
    .hx-builder__send .hx-btn { width: 100%; }
    .hx-builder__summary .hx-eyebrow { display: none; }
    .hx-builder__summary p:not(.hx-eyebrow) { margin-top: 0; }
    .hx-builder__send { gap: 10px 20px; }
    .hx-builder__legal { font-size: 10px; line-height: 1.55; margin-top: 10px; }
}

/* Коммерческая: свой подраздел-навигатор прячем, его роль выполняет панель направлений */
.hx-engine ~ .b2b-subnav { display: none; }

/* Страницы услуг: старые правила .service-editorial h1/p сильнее — перебиваем точечно */
body .hx-hero h1.hx-hero__title {
    font-family: var(--hx-font);
    font-weight: 300;
    letter-spacing: -.05em;
    text-transform: none;
    color: #FFFFFF;
}

body .hx-hero p.hx-hero__text {
    font-family: var(--hx-font);
    font-size: 16px;
    letter-spacing: 0;
    text-transform: none;
    color: rgba(255, 255, 255, .9);
}

body .hx-hero .hx-eyebrow {
    font-family: var(--hx-font);
    font-size: 10px;
    letter-spacing: .18em;
}

.hx-hero--svc .hx-hero__shade {
    background:
        linear-gradient(90deg, rgba(25, 9, 10, .78) 0%, rgba(25, 9, 10, .45) 48%, rgba(25, 9, 10, .1) 100%),
        linear-gradient(0deg, rgba(25, 9, 10, .7) 0%, rgba(25, 9, 10, 0) 45%);
}

@media (max-width: 600px) {
    body .hx-hero p.hx-hero__text { font-size: 13px; }
    body .hx-hero .hx-eyebrow { font-size: 9px; }
    .hx-hero--svc .hx-hero__shade {
        background: linear-gradient(0deg, rgba(25, 9, 10, .9) 0%, rgba(25, 9, 10, .45) 60%, rgba(25, 9, 10, .2) 100%);
    }
}

/* =========================================================================
   Типографика секций v8
   ========================================================================= */
.hx-eyebrow--wine {
    color: var(--hx-wine-soft);
    opacity: 1;
}

body .hx-h2 {
    margin: 22px 0 0;
    font-family: var(--hx-font);
    font-size: clamp(34px, 3.8vw, 58px);
    font-weight: 300;
    line-height: 1.1;
    letter-spacing: -.045em;
    color: var(--hx-wine);
    text-align: left;
    text-transform: none;
}

body .hx-h2 > span {
    display: block;
}

body .hx-h2--light {
    color: #FFFFFF;
}

.hx-lead {
    max-width: 560px;
    margin: 24px 0 0;
    font-family: var(--hx-font);
    font-size: 15px;
    line-height: 1.85;
    color: var(--hx-muted);
}

.hx-lead--light {
    color: rgba(255, 255, 255, .78);
}

/* =========================================================================
   «Почему компания, а не домашний персонал»
   ========================================================================= */
.hx-value {
    padding: 130px 0 120px;
    background: var(--hx-paper);
    color: var(--hx-ink);
    font-family: var(--hx-font);
}

.hx-value__head {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    gap: 24px 8%;
    align-items: end;
}

.hx-value__head .hx-eyebrow {
    grid-column: 1 / -1;
}

.hx-value__head .hx-h2 {
    margin: 0;
}

.hx-value__head .hx-lead {
    margin: 0;
}

.hx-compare {
    margin-top: 70px;
    border-top: 1px solid var(--hx-wine);
}

.hx-compare__row {
    display: grid;
    grid-template-columns: 1.1fr 1fr 1fr 1.15fr;
    gap: 24px;
    padding: 20px 0;
    border-bottom: 1px solid var(--hx-line);
    font-size: 13px;
    line-height: 1.6;
    color: var(--hx-muted);
}

.hx-compare__row > span:first-child {
    color: var(--hx-ink);
    font-weight: 500;
}

.hx-compare__row--head {
    padding: 16px 0;
    font-size: 10px;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.hx-compare__row .is-hilte {
    color: var(--hx-wine);
    font-weight: 500;
}

.hx-compare__row--head .is-hilte {
    letter-spacing: .3em;
}

.hx-principles {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 48px;
    margin: 90px 0 0;
    padding: 0;
}

.hx-principles li {
    padding: 30px 0 34px;
    border-top: 1px solid var(--hx-line);
}

.hx-principles__num {
    font-size: 11px;
    letter-spacing: .14em;
    color: var(--hx-wine-soft);
}

body .hx-principles h3 {
    margin: 18px 0 12px;
    font-family: var(--hx-font);
    font-size: 21px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: -.02em;
    color: var(--hx-ink);
    text-align: left;
    text-transform: none;
}

.hx-principles p {
    margin: 0;
    font-size: 13px;
    line-height: 1.8;
    color: var(--hx-muted);
}

.hx-partners {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px 40px;
    margin-top: 60px;
    padding: 28px 32px;
    background: var(--hx-cream);
}

.hx-partners p {
    margin: 0;
    max-width: 440px;
    font-size: 13px;
    line-height: 1.7;
    color: var(--hx-ink);
}

.hx-partners div {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 34px;
}

.hx-partners span {
    font-size: 13px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--hx-wine);
}

@media (max-width: 900px) {
    .hx-value { padding: 90px 0 80px; }
    .hx-value__head { grid-template-columns: 1fr; }
    .hx-compare__row--head { display: none; }
    .hx-compare__row { grid-template-columns: 1fr; gap: 6px; padding: 22px 0; }
    .hx-compare__row > span[role="cell"]::before {
        content: attr(data-label) ' — ';
        color: var(--hx-ink);
        opacity: .55;
    }
    .hx-compare__row > span.is-hilte::before { color: var(--hx-wine); opacity: 1; }
    .hx-principles { grid-template-columns: 1fr 1fr; gap: 0 28px; margin-top: 60px; }
}

@media (max-width: 600px) {
    .hx-value { padding: 70px 0 64px; }
    body .hx-h2 { font-size: 32px; }
    .hx-lead { font-size: 13px; }
    .hx-compare { margin-top: 44px; }
    .hx-compare__row { font-size: 12px; }
    .hx-principles { grid-template-columns: 1fr; margin-top: 44px; }
    body .hx-principles h3 { font-size: 19px; }
    .hx-partners { padding: 22px 18px; margin-top: 40px; }
    .hx-partners span { font-size: 11px; }
}

/* =========================================================================
   Паспорт резиденции
   ========================================================================= */
.hx-passport {
    padding: 130px 0;
    background: var(--hx-wine);
    color: #FFFFFF;
    font-family: var(--hx-font);
}

.hx-passport__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8%;
    align-items: center;
}

.hx-passport__points {
    list-style: none;
    display: grid;
    gap: 12px;
    margin: 34px 0 40px;
    padding: 0;
    font-size: 13px;
    color: rgba(255, 255, 255, .88);
}

.hx-passport__points li {
    position: relative;
    padding-left: 24px;
}

.hx-passport__points li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 9px;
    width: 12px;
    height: 1px;
    background: #D8B6AE;
}

.hx-pass {
    padding: 30px 30px 24px;
    background: var(--hx-paper);
    color: var(--hx-ink);
    box-shadow: 0 40px 80px rgba(10, 2, 3, .35);
    transform: rotate(-1.2deg);
    transition: transform .4s ease;
}

.hx-pass:hover {
    transform: rotate(0);
}

.hx-pass__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--hx-wine);
}

.hx-pass__top .hx-mark {
    width: 92px;
    height: 18px;
}

.hx-pass__tag {
    padding: 5px 10px;
    background: var(--hx-cream);
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--hx-wine-soft);
}

.hx-pass__title {
    margin: 22px 0 18px;
    font-size: 20px;
    font-weight: 300;
    letter-spacing: -.02em;
    color: var(--hx-wine);
}

.hx-pass__tabs {
    display: flex;
    gap: 26px;
    border-bottom: 1px solid var(--hx-line);
}

.hx-pass__tabs button {
    position: relative;
    padding: 12px 0 11px;
    border: 0;
    background: none;
    color: var(--hx-muted);
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

.hx-pass__tabs button[aria-selected="true"] {
    color: var(--hx-ink);
}

.hx-pass__tabs button[aria-selected="true"]::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: var(--hx-wine);
}

.hx-pass__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.hx-pass__list li {
    display: grid;
    gap: 4px;
    padding: 15px 0;
    border-bottom: 1px solid var(--hx-line);
    animation: hx-fade .3s ease both;
}

.hx-pass__list strong {
    font-size: 13px;
    font-weight: 500;
    color: var(--hx-ink);
}

.hx-pass__list span {
    font-size: 12px;
    line-height: 1.6;
    color: var(--hx-muted);
}

.hx-pass__list em {
    font-style: normal;
    font-size: 10px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--hx-wine-soft);
}

.hx-pass__foot {
    margin: 16px 0 0;
    font-size: 11px;
    color: var(--hx-muted);
}

@media (max-width: 900px) {
    .hx-passport { padding: 90px 0; }
    .hx-passport__layout { grid-template-columns: 1fr; gap: 56px; }
    .hx-pass { transform: none; }
}

@media (max-width: 600px) {
    .hx-passport { padding: 70px 0; }
    .hx-pass { padding: 22px 18px 18px; }
    .hx-pass__title { font-size: 17px; }
}

/* =========================================================================
   HILTE Real Estate на главной
   ========================================================================= */
.hx-estate {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    min-height: 760px;
    background: var(--hx-cream);
    font-family: var(--hx-font);
}

.hx-estate__media {
    position: relative;
    overflow: hidden;
}

.hx-estate__media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100% !important;
    object-fit: cover;
}

.hx-estate__credit {
    position: absolute;
    left: 16px;
    bottom: 12px;
    font-size: 9px;
    color: rgba(255, 255, 255, .8);
    text-shadow: 0 1px 2px rgba(0, 0, 0, .5);
}

.hx-estate__credit a {
    color: inherit;
}

.hx-estate__panel {
    padding: 110px 8% 100px;
}

.hx-estate__form {
    margin-top: 40px;
}

.hx-estate__group + .hx-estate__group {
    margin-top: 20px;
}

.hx-estate__label {
    margin: 0 0 10px;
    font-size: 10px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--hx-muted);
}

.hx-estate__fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 28px;
}

.hx-field {
    display: grid;
    gap: 8px;
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--hx-muted);
}

.hx-field input {
    min-height: 46px;
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--hx-line);
    background: transparent;
    color: var(--hx-ink);
    font: inherit;
    font-size: 16px;
    letter-spacing: 0;
    text-transform: none;
}

.hx-field input:focus {
    outline: none;
    border-bottom-color: var(--hx-wine);
}

.hx-field input::placeholder {
    color: #B4A9A3;
}

.hx-estate__send {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 26px;
    margin-top: 34px;
}

.hx-estate__legal {
    margin: 16px 0 0;
    max-width: 480px;
    font-size: 11px;
    line-height: 1.7;
    color: var(--hx-muted);
}

@media (max-width: 900px) {
    .hx-estate { grid-template-columns: 1fr; min-height: 0; }
    .hx-estate__media { height: 380px; }
    .hx-estate__panel { padding: 64px var(--hx-pad) 70px; }
}

@media (max-width: 600px) {
    .hx-estate__media { height: 300px; }
    .hx-estate__fields { grid-template-columns: 1fr; }
    .hx-estate__send .hx-btn { width: 100%; }
}


/* Единая типографика: прежние правила темы с Prata/Golos Text (style.css) переводим на Montserrat —
   те же селекторы, подключены позже, поэтому побеждают без !important */
.about-service-scope__grid h3,
.about-service-scope__heading h2,
.b2b-brief__copy h2,
.b2b-brief__direct a,
.b2b-control__copy h2,
.b2b-faq summary,
.b2b-hero__copy h1,
.b2b-image-statement figcaption strong,
.b2b-industry__grid h3,
.b2b-material-story__copy h3,
.b2b-outcome-card > span,
.b2b-outcome-card h3,
.b2b-section-heading h2,
.b2b-sector-grid article > span,
.b2b-sector-grid h3,
.b2b-service-grid h3,
.b2b-timeline h3,
.b2b-timeline strong,
.b2b-trust__intro h2,
.b2b-trust__list strong,
.b2b-visual-story__copy h3,
.faq-commercial-divider h2,
.hf__tagline,
.home-business-bridge__copy h2,
.home-value-system__grid h3,
.home-value-system__heading h2,
.home2-choice-card h3,
.home2-contact-rail__copy h2,
.home2-intro__grid h3,
.home2-intro__heading h2,
.home2-materials__content h2,
.home2-path__heading h2,
.home2-path__step h3,
.home2-proof__grid strong,
.home2-proof__heading h2,
.home2-retainer h2,
.home2-retainer__lead.v7-stanza,
.home2-section-heading h2,
.home2-system__content h2,
.service-editorial .service-bridge h2,
.service-editorial h1,
.service-editorial h2,
.service-editorial h3,
body.home .home-commercial-entry h2 {
    font-family: var(--hx-font);
}

/* Заголовки прежних блоков — светлое начертание, как в HILTE Real Estate */
.about-service-scope__grid h3,
.about-service-scope__heading h2,
.b2b-brief__copy h2,
.b2b-control__copy h2,
.b2b-faq summary,
.b2b-hero__copy h1,
.b2b-industry__grid h3,
.b2b-material-story__copy h3,
.b2b-outcome-card h3,
.b2b-section-heading h2,
.b2b-sector-grid h3,
.b2b-service-grid h3,
.b2b-timeline h3,
.b2b-trust__intro h2,
.b2b-visual-story__copy h3,
.faq-commercial-divider h2,
.home-business-bridge__copy h2,
.home-value-system__grid h3,
.home-value-system__heading h2,
.home2-choice-card h3,
.home2-contact-rail__copy h2,
.home2-intro__grid h3,
.home2-intro__heading h2,
.home2-materials__content h2,
.home2-path__heading h2,
.home2-path__step h3,
.home2-proof__heading h2,
.home2-retainer h2,
.home2-retainer__lead.v7-stanza,
.home2-section-heading h2,
.home2-system__content h2,
.service-editorial .service-bridge h2,
.service-editorial h1,
.service-editorial h2,
.service-editorial h3,
body.home .home-commercial-entry h2 {
    font-weight: 300;
}

/* =========================================================================
   Стоимость: уровни сервиса и классы резиденций
   ========================================================================= */
.hx-prices {
    padding: 130px 0 120px;
    background: var(--hx-cream);
    color: var(--hx-ink);
    font-family: var(--hx-font);
    scroll-margin-top: var(--hx-h);
}

.hx-prices__head {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    gap: 24px 8%;
    align-items: end;
}

.hx-prices__head .hx-eyebrow {
    grid-column: 1 / -1;
}

.hx-prices__head .hx-h2,
.hx-prices__head .hx-lead {
    margin: 0;
}

.hx-levels {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 64px;
}

.hx-level {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 34px 30px 30px;
    background: var(--hx-paper);
    border: 1px solid var(--hx-line);
}

.hx-level.is-featured {
    background: var(--hx-wine);
    border-color: var(--hx-wine);
    color: #FFFFFF;
}

.hx-level__badge {
    position: absolute;
    top: -12px;
    left: 30px;
    margin: 0;
    padding: 5px 10px;
    background: var(--hx-paper);
    border: 1px solid var(--hx-wine);
    color: var(--hx-wine);
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
}

body .hx-level h3 {
    margin: 0;
    font-family: var(--hx-font);
    font-size: 28px;
    font-weight: 300;
    letter-spacing: -.03em;
    color: inherit;
    text-align: left;
    text-transform: none;
}

.hx-level__tag {
    margin: 6px 0 0;
    font-size: 11px;
    letter-spacing: .14em;
    text-transform: uppercase;
    opacity: .7;
}

.hx-level__price {
    margin: 26px 0 0;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: -.02em;
}

.hx-level__lead {
    margin: 12px 0 0;
    font-size: 13px;
    line-height: 1.75;
    opacity: .8;
}

.hx-level ul {
    list-style: none;
    margin: 22px 0 26px;
    padding: 0;
    display: grid;
    gap: 10px;
    font-size: 13px;
    line-height: 1.55;
}

.hx-level li {
    position: relative;
    padding-left: 22px;
}

.hx-level li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 9px;
    width: 12px;
    height: 1px;
    background: currentColor;
    opacity: .6;
}

.hx-level .hx-textlink {
    margin-top: auto;
    align-self: flex-start;
}

.hx-level.is-featured .hx-textlink {
    color: #FFFFFF;
}

.hx-grid {
    margin-top: 70px;
}

.hx-grid__tabs {
    display: flex;
    gap: 34px;
    border-bottom: 1px solid var(--hx-line);
    overflow-x: auto;
    scrollbar-width: none;
}

.hx-grid__tabs button {
    position: relative;
    flex-shrink: 0;
    padding: 16px 0 14px;
    border: 0;
    background: none;
    color: var(--hx-muted);
    font: inherit;
    font-size: 14px;
    cursor: pointer;
}

.hx-grid__tabs button[aria-selected="true"] {
    color: var(--hx-ink);
}

.hx-grid__tabs button[aria-selected="true"]::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: var(--hx-wine);
}

.hx-grid__pane[hidden] {
    display: none;
}

.hx-grid table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.hx-grid th,
.hx-grid td {
    padding: 16px 12px 16px 0;
    border-bottom: 1px solid var(--hx-line);
    text-align: left;
    vertical-align: top;
    font-weight: 400;
}

.hx-grid thead th {
    padding-top: 22px;
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--hx-muted);
}

.hx-grid tbody th {
    font-weight: 500;
    color: var(--hx-wine);
}

.hx-grid__price {
    color: var(--hx-ink);
    font-weight: 500 !important;
}

.hx-prices__notes {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 40px;
    margin: 34px 0 0;
    padding: 0;
    font-size: 12px;
    line-height: 1.7;
    color: var(--hx-muted);
}

.hx-builder__estimate {
    margin: -6px 0 16px;
    font-size: 13px;
    font-weight: 500;
    color: var(--hx-wine);
}

@media (max-width: 900px) {
    .hx-prices { padding: 90px 0 80px; }
    .hx-prices__head { grid-template-columns: 1fr; }
    .hx-levels { grid-template-columns: 1fr; gap: 28px; margin-top: 50px; }
    .hx-prices__notes { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .hx-grid table, .hx-grid tbody, .hx-grid tr, .hx-grid td, .hx-grid tbody th { display: block; width: 100%; }
    .hx-grid thead { display: none; }
    .hx-grid tr { padding: 16px 0; border-bottom: 1px solid var(--hx-line); }
    .hx-grid tbody th, .hx-grid td { padding: 3px 0; border: 0; }
    .hx-grid tbody th { font-size: 15px; margin-bottom: 4px; }
    .hx-grid td::before { content: attr(data-label) ' — '; color: var(--hx-muted); }
}

@media (max-width: 600px) {
    .hx-prices { padding: 70px 0 64px; }
    .hx-level { padding: 30px 22px 24px; }
}

/* На страницах услуг старые правила .service-editorial p растягивают значок на всю ширину */
body .hx-level p.hx-level__badge {
    display: inline-block;
    width: auto;
    max-width: calc(100% - 60px);
    font-size: 10px;
    line-height: 1.4;
}