#MessageViewForm .block-confirmation_text {
    line-height: 100%;
}
a.icon-circle.fa-youtube:hover {
    color: #fff;
    background: #FF0000;
}
a.icon-circle.fa-vk:hover {
    color: #fff;
    background: #4C74A5;
}
a.icon-circle.fa-odnoklassniki:hover {
    color: #fff;
    background: #ED8223;
}
a.icon-circle.fa-instagram:hover {
    color: #fff;
    background: #E81978;
}
a.icon-circle.fa-telegram:hover {
    color: #fff;
    background: #0088cc;
}


#MessageViewForm .confirmation-wrapper > .form-group {
    display: flex;
    justify-content: center;
}
#MessageViewForm .confirmation-wrapper input[type="checkbox"] {
    margin: 2px 0 0;
}

/* /agency/realty/add — чекбоксы согласия: чекбокс и текст на одном уровне.
   Текст блока приходит из CMS-региона как <div class="block"><p>…</p></div>
   (блочный элемент с собственными margin), из-за чего inline-checkbox по baseline
   уезжал выше текста. Чекбокс делаем float-left, текст обтекает его сверху. */
#AdvertisementAddForm .form-group > input.confirmation-checkbox {
    float: left;
    margin: 3px 8px 0 0;
}
#AdvertisementAddForm .form-group > input.confirmation-checkbox + label {
    display: block;
    margin: 0;
    overflow: hidden;
    font-weight: 400;
    cursor: pointer;
}
#AdvertisementAddForm .confirmation-checkbox + label .block,
#AdvertisementAddForm .confirmation-checkbox + label .block-body,
#AdvertisementAddForm .confirmation-checkbox + label p {
    margin: 0;
    line-height: 1.4;
}

/* /agency/realty/add — выравнивание капчи по левому краю.
   Внутренний бокс капчи (div width:304px) центрировался `margin: 0 auto`;
   прижимаем влево через margin-right:auto (text-align на block-бокс не влияет).

   `padding-top: 20px` убран: он был нужен, пока капча висела под карточкой
   категорий. Теперь она стоит в своей колонке строки согласий и должна
   начинаться на одной линии с чекбоксами — отступ уводил её на 20px вниз.
   Селектор по id перебивал любое классовое правило sellprop_form.css. */
#AdvertisementAddForm #form_recaptcha > div {
    margin-left: 0;
    margin-right: auto;
}

/* /agency/realty/add — отступ сверху у первого параметра категории ("Apartment type").
   Таргет — .control-group, содержащий select первого параметра (index 0); НЕ первый
   ряд каждого .param-row (их 12), а именно блок Apartment type. */
#AdvertisementAddForm .control-group:has(#CategoryParamValue0DataInt) {
    padding-top: 15px;
}

.review-block {
    width: 350px;
    float: left;
}
.reviews-list {
    display: inline-block;
    padding: 50px;
}
.reviews-list .pagination {
    margin-top: 80px;
}
.review-date {
    font-size: 12px;
}
.section-66 {
    background: white;
}
.not-displayed {
    display: none;
}
.mortgage-calculator .mortgage-form .mortgage-form-input {
    width: 350px;
    padding: 5px;
    margin: 10px;
}
.objects-content .link-object-title {
    word-break: break-word;
}
.favorite-action {
    position: relative;
    display: inline-block;
}
.favorite-action:before {
    content: url("../img/ico_favorite.png");
    position: absolute;
    left: 0;
    top: -4px;
}
.favorite-action.go:before {
    content: url("../img/ico_favorite_active.png");
}
.block-paint-map {
    width: 100%;
    height: 460px;
    display: none;
}
#paint-map {
    height: 400px;
}
.block-paint-map .paint-map-wrapper {
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.43);
    position: relative;
    width: 100%;
    height: 400px;
}
.block-paint-map .paint-map-info {
    float: left;
    max-width: 400px;
    color: green;
}
.block-paint-map .paint-map-buttons {
    margin-bottom: 10px;
    text-align: right;
}
.block-paint-map .paint-map-buttons a {
    margin-left: 5px;
}
.block-paint-map canvas {
    display: inline-block;
    position: absolute;
    z-index: 99999;
    float: unset;
    margin: 0;
    left: 0;
}
.rd-navbar-wrap .rd-navbar-panel .rd-navbar-brand {
    margin-right: 10px;
}
.rd-navbar-wrap .rd-navbar-panel .rd-navbar-title {
    text-shadow: none;
    margin: 0px;
    color: #fff;
    background-color: #ffa200;
    border-color: #ff7e00;
    display: inline-block;
    position: relative;
    padding: 9px 16px;
    font-size: 14px;
    line-height: 28px;
    border-radius: 3px;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: .06em;
    border-width: 2px;
    transition: .3s;
    backface-visibility: hidden;
}
.rd-navbar-wrap .rd-navbar-panel .rd-navbar-slogan {
    font-size: 12px;
    margin-top: 5px;
}
.reviews-list .unit-body {
    max-width: 225px;
}
.news-view-block {
    word-break: break-word;
}
.currency-price-item-all i{
    padding: 0 7px;
}
div.user-image > img {
    display: block;
    width: 100%;
	max-width: 300px;
    height: auto;
    margin: 0 auto;
}
div.content.reviews-list {
    display: flex;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    /*outline: 1px solid red;*/
    padding: 0;
}
div.content.reviews-list > div.review-block.reviews-container {
    display: flex;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    /*max-width: calc(50% - 40px);*/
    margin: 30px 20px;
    /*outline: 1px solid yellowgreen;*/
    border-bottom: 1px solid grey;
}
div.content.reviews-list > div.review-block.reviews-container:last-child {
    border-bottom: none;
}
div.content.reviews-list > div.review-block.reviews-container > p {
    display: block;
    width: 100%;
    text-align: center;
    padding: 0 20px;
    font-family: "Montserrat",sans-serif;
    font-weight: 400;
}
p.review-pub-date,
p.review-pub-author,
p.user-review-content {
    display: block;
    width: 100%;
    text-align: center;
    padding: 0 20px;
    font-family: "Montserrat",sans-serif;
    font-weight: 400;
}
div.user-card,
div.user-objects,
div.reviews-list {
    padding-bottom: 50px;
    border-bottom: 1px solid #aaaaaa;
}
div.reviews-list > h3 {
    display: block;
    width: 100%;
    text-align: center;
}
div.users-reviews-add div.control-group,
div.users-reviews-add div.input.file {
    display: flex;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 20px;
}
div.users-reviews-add label {
    display: block;
    width: 100%;
    margin-bottom: 0;
}
div.users-reviews-add input,
div.users-reviews-add textarea {
    display: block;
    width: 100%;
}
div.users-reviews-add div.input.file > label {
    margin-bottom: 10px;
}
div.users-reviews-add div.input.file > input {
    width: auto;
    margin: 0 auto;
}
div.users-reviews-add input.btn {
    display: block;
    max-width: 400px;
    margin: 50px auto;
}
#form_button > .row {
    box-sizing: border-box;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}
.object-location-header {
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 16px;
}
.contact-with-us-block {
    height: 100px;
    background: #1c62e2d4;
    color: #fff;
    padding: 25px;
}
.contact-with-us-block .contact-with-us-title {
    font-size: 21px;
    text-transform: uppercase;
    letter-spacing: 4px;
}
.contact-with-us-block .contact-with-us-title-btn {
    margin-left: 50px;
    font-size: 16px;
    font-weight: 100;
    text-transform: uppercase;
    border: 1px solid;
    padding: 14px;
}
.member-view-block .btn-rieltor-list {
    width: 100%;
    margin-bottom: 10px;
}
.bg-icon-like {
    background-image: url(../img/like.png);
    height: 24px;
    width: 24px;
    background-size: 24px 24px;
    display: inline-block;
    margin-right: 20px;
}
.bg-icon-dislike {
    background-image: url(../img/dislike.png);
    height: 24px;
    width: 24px;
    background-size: 24px 24px;
    display: inline-block;
    margin-right: 20px;
}
.favorite-link {
    display: inline-block;
    float: left;
    width: 25px;
    height: 50px;
}
.advertisement-row-collate-actions {
    float: left;
    display: inline-block;
    margin-left: 10px;
    margin-top: 12px;
}
.reviews .owl-carousel-classic .owl-prev:after, .reviews .owl-carousel-classic .owl-next:after {
    content: normal;
}
.view-favorites .favorite-link {
    float: none;
    display: inline-flex;
    height: 30px;
}
.reviews_container {
    position: relative;
}
.reviews_container_nav {
    width: 80%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.users .reviews_container_nav {
    width: 100%;
}
.reviews_container_nav .data-owl-prev,
.reviews_container_nav .data-owl-next,
.reviews_btn.data-owl-prev,
.reviews_btn.data-owl-next {
    background-repeat: no-repeat;
    box-shadow: none;
    border: none;
    background-size: contain;
    outline: none;
    height: 44px;
    width: 67px;
}
.reviews_container_nav .data-owl-prev:hover,
.reviews_container_nav .data-owl-next:hover,
.reviews_btn.data-owl-prev:hover,
.reviews_btn.data-owl-next:hover {
    opacity: 0.4;
}
.reviews_container_nav .data-owl-prev,.reviews_btn.data-owl-prev {
    background-color: transparent;
    background-image: url("../images/red-arrow_left.png");
}
.reviews_container_nav .data-owl-next,.reviews_btn.data-owl-next {
    background-color: transparent;
    background-image: url("../images/red-arrow_right.png");
}
.iti {
    width: 100%;
}
.user-card {
    display: flex;
    gap: 20px;
    text-align: left;
}
.user-role {
    padding-bottom: 20px;
    border-bottom: 1px solid #d8d8d8;
}
.btn-call {
    background-color: #fff;
    color: #ffa200;
}
.button-connection {
    display: flex;
    gap: 10px;
    margin-top: 30px;
}
.user-btn {
    padding: 10px 30px;
}
.user-description {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.reviews-add {
    margin-bottom: 40px !important;
}
[data-theme="TM58887"] #app .filter {
    display: flex;
    justify-content: center;
}
[data-theme="TM58887"] #AdvertisementAdminIndexForm {
    max-width: 1200px;
    display: grid;
    column-gap: 10px;
    row-gap: 10px;
    margin: 0 auto;
}
[data-theme="TM58887"] #AdvertisementAdminIndexForm .first-column {
    grid-area: first-column;
}
[data-theme="TM58887"] #AdvertisementAdminIndexForm .second-column {
    grid-area: second-column;
}
[data-theme="TM58887"] #AdvertisementAdminIndexForm .third-column {
    grid-area: third-column;
}
[data-theme="TM58887"] #AdvertisementAdminIndexForm .clearfix {
    grid-area: space;
}
[data-theme="TM58887"] #AdvertisementAdminIndexForm .last-column {
    grid-area: last-column;
}
[data-theme="TM58887"] .inline-checkbox-filter-wrapper {
    justify-content: space-between;
}
[data-theme="TM58887"] .metro_time-wrapper > #method_movement_time {
    max-width: 50px;
}
[data-theme="TM58887"] .inline-checkbox-filter-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}
[data-theme="TM58887"] .metro_time-wrapper {
    width: 100% !important;
    flex-wrap: nowrap;
    gap: 10px;
}
[data-theme="TM58887"] .metro_time-wrapper {
    width: 100% !important;
    flex-wrap: nowrap;
}
[data-theme="TM58887"] #AdvertisementAdminIndexForm .checkbox {
    padding-left: 0 !important;
    gap: 10px;
}
[data-theme="TM58887"] #AdvertisementAdminIndexForm input[type="checkbox"] {
    margin: 0 !important;
}
[data-theme="TM58887"] .filter-block input[type="text"] {
    min-height: 48px;
}
[data-theme="TM58887"] .filter-block {
    width: 100%;
}
[data-theme="TM58887"] .filter-block label {
    max-width: 100%;
}
[data-theme="TM58887"] .filter-block .range {
    margin: 10px 0;
}
[data-theme="TM58887"] #AdvertisementAdminIndexForm .wide-range .range-wrapper {
    justify-content: flex-start !important;
}
[data-theme="TM58887"] .table th, .table td {
    padding: 8px;
    line-height: 20px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid #ddd;
}

.rd-navbar-wrap.header-auth-wrap  .rd-navbar-static.rd-navbar-top-panel .rd-navbar-top-links>li+li {
    margin-left: 20px;
}

.rd-navbar-wrap.header-auth-wrap  .rd-navbar-static.rd-navbar-top-panel .contact-info>span+span {
    margin-left: 5px;
}

.rd-navbar-wrap.header-auth-wrap.header-auth-wrap-is-auth .rd-navbar-static.rd-navbar-top-panel .contact-info .icon {
    margin-right: 5px;
}
.parser-filter-form .JS-show-on-map.btn-secondary{
    background: #0a83b6;
    color: #fff;
}

@media (max-width: 1750px) and (min-width: 1410px) {
    .section-34 .shell-fluid .range .thumbnail-terry {
        width: 350px !important;
        margin-left: 20px;
    }

    .section-34 .shell-fluid .range .thumbnail-terry img{
        width: 350px !important;
        height: 100%;
    }
}

@media (max-width: 1410px) and (min-width: 1180px) {
    .section-34 .shell-fluid .range .thumbnail-terry {
        width: 300px !important;
        margin-left: 20px;
    }

    .section-34 .shell-fluid .range .thumbnail-terry img{
        width: 300px !important;
        height: 100%;
    }
}

@media (min-width: 1200px) {
    [data-theme="TM58887"] #AdvertisementAdminIndexForm {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-areas:
            "first-column second-column third-column"
            "space space last-column";
    }
}

@media (max-width: 1280px){
    [action="/admin/rltbase_connector/rltbase_parsed"] .range-wrapper-item-separator {
        display: none;
    }
    [action="/admin/rltbase_connector/rltbase_parsed"] .range-wrapper {
        gap: 8px;
    }
    [data-theme="TM58887"] #AdvertisementAdminIndexForm {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
        "first-column second-column"
        "third-column third-column"
        "space last-column";
    }
}

@media (max-width: 1199px) {
    .rd-navbar-brand>a>img {
        height: 36px;
    }
}

@media (min-width: 992px) {
    .table th:nth-child(n+2), .table td:nth-child(n+2) {
        padding-left: 0;
    }
}

@media (min-width: 950px) {
    div.content.reviews-list > div.review-block.reviews-container {
        max-width: calc(50% - 40px);
    }
}


@media (max-width: 768px) {
    .user-card {
        flex-direction: column;
    }
    .button-connection {
        justify-content: center;
    }
}

@media (max-width: 600px) {
    .rd-navbar-wrap .rd-navbar-panel .rd-navbar-title{
        display: none;
    }
}


@media (max-width: 480px) {
    .reviews_container_nav {
        width: 100%;
    }
    [data-theme="TM58887"] #AdvertisementAdminIndexForm {
        display: flex;
    }
}

@media (max-width: 430px) {
    .active-menu-bar.fixed-menu .rd-navbar-panel {
        margin-left: 0;
    }

    .active-menu-bar.rd-navbar-brand img {
        height: 36px;
    }
}

@media (min-width: 401px) {
    .phone-portrait-displayed-only {
        display: none !important;
    }
}

@media (max-width: 400px) {
    .phone-portrait-not-displayed {
        display: none !important;
    }
}

@media (max-width: 375px) {
    .the-new-container {
        padding: 10px;
    }

    .the-new-container img {
        max-height: 250px;
        max-width: 300px;
    }

    .news-view-block img {
        max-height: 335px;
        max-width: 350px;
    }

    .grecaptcha-badge {
        display: none !important;
    }
}

@media (min-width: 320px) and (max-width: 1280px) {
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block .wide-range .range-wrapper {
        margin-left: 0;
    }
}


@media only screen and (min-width: 320px) {
    [data-theme="TM58887"] .filter-block .range input {
        padding: 9px 16px;
    }
    [data-theme="TM58887"] .filter-block .input > label {
        width: 100%;
    }
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block label ~ .chosen-container,
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block label ~ .select2-container,
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block label ~ .input-prepend,
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block .range .range-wrapper,
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block .text input {
        width: 100% !important;
    }
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block label ~ .chosen-container:not([type=checkbox]),
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block label ~ .select2-container:not([type=checkbox]),
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block label ~ .input-prepend:not([type=checkbox]),
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block .input > select:not([type=checkbox]),
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block .input.text > input:not([type=checkbox]),
    [data-theme="TM58887"] #AdvertisementAdminIndexForm .filter-block .range .range-wrapper:not([type=checkbox]) {
        width: 100% !important;
    }
    [data-theme="TM58887"] .filter-block .input > label {
        text-align: left;
        width: 100% !important;
    }
}


/* Map page (/agency/realty/map) only: place the "Filter" heading on its own
   line above the filter form, left-aligned. Overrides the global
   `.sidebar { display: flex; justify-content: center }` from active_menu.css
   which otherwise lays the <h2> and #side-filter-block side by side and centers
   them. Scoped via the .realty-map-page class on #content in
   Agency/View/Realty/map.ctp so other pages using the filter widget are
   unaffected. */
.realty-map-page .sidebar {
    display: block;
    text-align: left;
}
.realty-map-page .sidebar h2 {
    padding-top: 20px;
}

/* Property detail gallery (TM58887 / lightSlider `#property-gallery-js`):
   the <a> is the fixed-ratio slot (845/529 = desktop 529px, responsive below)
   so slides don't jump in height; the <img> shrinks to the photo itself (no
   `cover` cropping, no `contain` inside a full-width box) — that way the
   thumbnail radius `--r-sm` rounds the photo's real corners and the letterbox
   bands stay transparent (client request 2026-09-15).
   Scoped to the `#property-gallery-js` id so the thumbnail pager
   (`.lSPager.lSGallery`) and any other slider on the page are unaffected. */
#property-gallery-js .image-preview {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    aspect-ratio: 845 / 529;
}
#property-gallery-js .image-preview img,
#property-gallery-js .image-preview img.img-fluid {
    display: block;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100%;
    border-radius: var(--r-sm);
}

/* PhotoSwipe lightbox icons: the theme ships only images/photoswipe-controls.png, but
   style.css swaps the sprite to a photoswipe-controls.svg that does not exist (404) above
   1.1dppx — on scaled/retina screens every lightbox button rendered blank and unclickable-looking. */
@media (-webkit-min-device-pixel-ratio: 1.1), (min-resolution: 105dpi), (min-resolution: 1.1dppx) {
    .pswp--svg .pswp__button,
    .pswp--svg .pswp__button--arrow--left:before,
    .pswp--svg .pswp__button--arrow--right:before {
        background-image: url(../images/photoswipe-controls.png);
    }
}

/* fix google-maps position (Asana 1216066945295622):
   карта в публичной форме «Add advertisement» (Sell Your Property, /agency/realty/add) —
   на всю ширину колонки и по центру. Переопределяет inline width:91% из
   AdEditHelper::renderMap() ТОЛЬКО на этой странице (helper шарится с админкой — глобально
   не трогаем). Обёртка карты — .sell-map-holder (без .range), поэтому нет gutter-margin -15px
   и карта не вылазит за левый отступ колонки. */
.sell-map-holder #map-wrapper {
    width: 100% !important;
}

/* Выдача с 1-2 объявлениями: .listing-view — flex-ребёнок .range без заданной ширины,
   сжимается по max-content единственной карточки (карточка 184px, заголовок и кнопки
   наезжают друг на друга). flex-grow добирает свободное место строки; width:100% не годится —
   не учитывает отрицательные -15px маржины card-deck и сужает многокарточную сетку на 30px. */
.listing-view {
    flex-grow: 1;
}


/* ==========================================================================
   Home sections redesign (Quick Links, block id=32 + Real Estate Agents, block id=33).
   Порт мокапа .planning/mockups/home-sections-2026-07-31.html.
   Глобальные ресеты мокапа (*, html, body, img, a) СОЗНАТЕЛЬНО не перенесены —
   в боевой теме они переопределили бы вёрстку всего сайта; нужные правила
   продублированы внутри классов .ea- и .agent-.
   ========================================================================== */

:root{
  --brand-red:#BE151B;
  --brand-orange:#F26921;
  --brand-yellow:#F7921E;
  --ink:#1E1E1E;
  --ink-60:rgba(30,30,30,.62);
  --ink-40:rgba(30,30,30,.42);
  --surface:#FFFFFF;
  --page:#F4F5F7;
  --page-2:#EDEEF1;
  --hair:rgba(30,30,30,.08);

  --r-lg:22px;
  --r-md:16px;
  --r-sm:12px;
  --r-pill:999px;

  --shadow-1:0 1px 2px rgba(30,30,30,.05), 0 6px 18px -8px rgba(30,30,30,.14);
  --shadow-2:0 2px 6px rgba(30,30,30,.07), 0 18px 40px -18px rgba(30,30,30,.28);

  --ease:cubic-bezier(.22,.61,.36,1);

  --gap:20px;
  --pad:20px;

  /* Вертикальный ритм секций: воспринимаемый зазор между соседними секциями =
     2 × --sec-y (padding-bottom верхней + padding-top нижней). Одна шкала на все
     секции главной — до неё сосуществовали три (40/56/64 общего ритма,
     48/56/72/88 у .ea-section, 34/66/98/110 у утилит темы section-*). */
  --sec-y:36px;
}

/* Скоуп .ea-home обязателен: префикс .ea-* занят ещё и панелью фильтра карты
   (map_filter.css, /agency/realty/map) — там свои .ea-section/.ea-head/.ea-title/.ea-sub.
   custom.css грузится ПОСЛЕ map_filter.css и без скоупа перебивал их: секции панели
   получали padding-block:88px вместо 13px, заголовок — clamp(26px,5.2vw,42px). */
.ea-quick *,.ea-quick *::before,.ea-quick *::after,
.ea-home .ea-section *,.ea-home .ea-section *::before,.ea-home .ea-section *::after,
.agent-card *,.agent-card *::before,.agent-card *::after{box-sizing:border-box}

.ea-shell{width:100%;max-width:1200px;margin:0 auto;padding-inline:16px}
/* База типографики секций. Тема отдаёт body 15px/300/25px и цвет #434345 — без этой
   нормализации всё внутри «плывёт» относительно макета (замер: h5 карточки 210px против 238px). */
/* .agent-card в списке отдельно: на /users/users/ карточка живёт вне .ea-section
   (раскладка темы .range), а тело той страницы — Lato, и без этой строки вся
   типографика карточки уезжала от макета (замер: .agent-name Lato вместо Montserrat). */
.ea-home .ea-section,.ea-quick,.agent-card{
  /* Montserrat — бренд-шрифт проекта, уже подключён темой (TmSiteHelper::$_css:54).
     Тема отдаёт секциям Roboto/Lato, из-за чего вся метрика текста расходилась с макетом
     (замер: h5 карточки 210px против 238px, кнопка 166px против 182px). */
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  font-size:16px;font-weight:400;line-height:1.5;color:var(--ink);
}
.ea-quick{color:#fff}
/* padding-block секций задаёт общий ритм ниже (.ea-home > section[class]) — здесь его нет,
   иначе .ea-section жил бы по своей шкале, как было до 14.08 (48/56/72/88 против 40/56/64). */

/* ---------- shared grid: equal-height cards, no per-index offsets ---------- */
.ea-grid{
  display:grid;
  grid-template-columns:1fr;
  align-items:stretch;          /* HARD: равная высота ряда */
  gap:var(--gap);
}
/* ячейка-обёртка элемента Users.realtor: на главной класс пустой, на /users/users/
   сюда приходят cell-* темы — карточка обязана тянуться на всю высоту ячейки */
.agent-cell{display:flex;min-width:0}
/* min-width:0 + max-width:100% обязательны: без них flex-элемент не сжимается ниже
   min-content своего содержимого (фото с aspect-ratio) и карточка выезжает за ячейку */
.agent-cell > .agent-card{flex:1 1 auto;min-width:0;max-width:100%}

/* ---------- section head ---------- */
/* margin-bottom здесь не задаётся: он был мёртвым (34px перебивались правилом ритма
   .ea-home .ea-head{margin:0 0 30px} ниже по файлу — фактически всегда 30px). */
.ea-home .ea-head{text-align:center}
.ea-eyebrow{
  /* та же ловушка, что у .ea-title: без явного стека шрифт приходит от контейнера секции */
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  display:inline-block;font-size:11px;line-height:1.5;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--brand-red);
}
/* text-transform:none — тема ставит заголовкам секций capitalize */
.ea-home .ea-title{
  /* НЕ inherit: тема (style.css?v=2.2) даёт h1-h6 Roboto, и заголовок наследовал его от
     контейнера секции — три из пяти шапок главной уезжали с Montserrat на Roboto */
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  font-size:clamp(26px,5.2vw,42px);line-height:1.14;font-weight:800;text-transform:none;
  letter-spacing:-.02em;margin:8px 0 0;color:var(--ink);
}
.ea-divider{
  width:64px;height:4px;border:0;margin:16px auto 0;border-radius:var(--r-pill);
  background:linear-gradient(90deg,var(--brand-red),var(--brand-orange) 55%,var(--brand-yellow));
}

/* ---------- buttons ---------- */
.ea-btn{
  --btn-bg:var(--brand-red);
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:46px;padding:0 22px;border-radius:var(--r-pill);border:0;
  /* line-height задан явно: тема наследует 25px и кнопка становится выше макета */
  font-family:inherit;font-weight:700;font-size:13px;line-height:1.5;letter-spacing:.06em;text-transform:uppercase;
  color:#fff;background:var(--btn-bg);text-decoration:none;
  box-shadow:0 1px 1px rgba(255,255,255,.35) inset, 0 8px 18px -10px rgba(190,21,27,.7);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background-color .25s var(--ease);
  cursor:pointer;
}
.ea-btn:hover,.ea-btn:focus{color:#fff;text-decoration:none}
.ea-btn:hover{background:#A51217;transform:translateY(-1px);
  box-shadow:0 1px 1px rgba(255,255,255,.35) inset, 0 14px 26px -12px rgba(190,21,27,.75)}
.ea-btn:active{transform:translateY(0) scale(.985)}
.ea-btn:focus-visible{outline:3px solid rgba(242,105,33,.55);outline-offset:3px}
.ea-btn--ghost{
  background:var(--surface);color:var(--brand-orange);
  /* контур и тень — брендовый оранжевый #F26921 */
  box-shadow:inset 0 0 0 2px var(--brand-orange), 0 8px 20px -8px rgba(242,105,33,.55);
}
.ea-btn--ghost:focus{color:var(--brand-orange)}
.ea-btn--ghost:hover{
  background:var(--brand-orange);color:#fff;transform:translateY(-1px);
  box-shadow:inset 0 0 0 2px var(--brand-orange), 0 14px 28px -10px rgba(242,105,33,.7);
}
.ea-btn--ghost:focus-visible{outline-color:rgba(242,105,33,.75)}

/* ================= SECTION 1 — QUICK LINKS (dark, bg image) ================= */
.ea-quick{
  position:relative;
  isolation:isolate;
  /* min-height НЕТ: с ним (340/420/470px) + align-content:center секция сама себе
     назначала внутренние отступы — при контенте 195px это 138px сверху и снизу,
     то есть зазоры 279/266px вокруг quick, вдвое больше ритма страницы (замер 14.08).
     Высоту задаёт контент + ритм; фоновое фото при этом остаётся cover. */
  /* padding-block см. рядом с общим правилом ритма (двойной шаг): здесь его ставить
     нельзя — .ea-quick (0,1,0) проиграет правилу ритма (0,3,1) ниже по файлу. */
  /* grid, а не flex: у flex-item .container ширина считалась по контенту (287px вместо 375
     на мобиле), а принудительный width:100% ломал его фиксированные 750/970/1250 на десктопе.
     В гриде ячейка тянется на всю ширину, а .container сам решает, какой ему быть. */
  display:grid;align-content:center;
  color:#fff;
  /* clip, а не hidden: hidden сделал бы секцию scroll-контейнером и заморозил view()-таймлайн фона */
  overflow:clip;
}
/* Фон вынесен в отдельный слой — иначе параллакс двигать нечего.
   ЗАПАС по 42% сверху и снизу: слой заведомо выше секции, поэтому при сдвиге
   край картинки не выезжает и белый фон страницы не «моргает» на границах. */
.ea-quick__bg{
  position:absolute;left:0;right:0;top:-42%;bottom:-42%;z-index:-2;
  background-size:cover;
  /* Скролл-параллакс двигает СЛОЙ через transform, поэтому сдвиг за мышью идёт по другому
     каналу — background-position: два transform на одном элементе перетирали бы друг друга.
     --mx/--my пишет скрипт home_cards.js. */
  background-position:calc(50% + var(--mx,0px)) calc(50% + var(--my,0px));
  background-repeat:no-repeat;
  transition:background-position .35s var(--ease);
  will-change:transform,background-position;
}
.ea-quick::before{                    /* оверлей: читаемость белого текста поверх фото */
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(20,20,22,.72) 0%,rgba(20,20,22,.58) 45%,rgba(20,20,22,.78) 100%);
}
/* Параллакс включается с 992px — как штатный rd-parallax темы.
   На телефонах и планшетах фон статичен: там параллакс дёргается и жрёт батарею. */
@media (min-width:992px){
  @supports (animation-timeline:view()){
    .ea-quick__bg{
      animation:ea-quick-parallax linear both;
      animation-timeline:view();
      animation-range:entry 0% exit 100%;
    }
  }
}
/* ВНИМАНИЕ на базы процентов: translateY(%) считается от высоты САМОГО слоя (секция × 1.84),
   а top/bottom(%) — от высоты СЕКЦИИ. Поэтому запас 42% ≈ 197px, а сдвиг 18% ≈ 156px — с зазором. */
@keyframes ea-quick-parallax{
  from{transform:translateY(-18%)}
  to  {transform:translateY(18%)}
}
/* Плитки quick-раздела лежат в ЕДИНОЙ сетке `.row.ea-row` (патч 2026-08-07-02) — своей
   grid-раскладки у них больше нет, иначе их колонка не совпадала бы по ширине и по
   вертикалям с карточками объектов и агентов.
   Своей ширины ряду здесь НЕ задавать: `width:100%` считает 100% от content-box контейнера,
   а отрицательные margin ряда (-15/-15) после этого только сдвигают его влево — правый край
   недобирает ровно 30px, и ряд плиток оказывается короче рядов карточек и агентов на каждом
   вьюпорте (замер 07.08: 1220 против 1250 на 1440, колонка уже на 30/n px). При `width:auto`
   ряд заполняет доступное сам и совпадает с остальными до 0.0px. Схлопывание контейнера
   внутри grid-секции лечится ниже, на самом `.container`, а не на ряде. */
/* ===================== ЕДИНАЯ БРЕНД-ОБВОДКА (источник истины) =====================
   Рисующаяся обводка живёт ЗДЕСЬ и только здесь: custom.css грузится на всех
   страницах темы (TmSiteHelper::$_css), поэтому потребители из отдельных файлов
   (sellprop_form.css, property-card.css) подключаются к этому рецепту, а не копируют
   conic-gradient. Настройка — ТОЛЬКО ручками-переменными ниже.

   Ручки: --ea-sweep-w толщина · --ea-sweep-top отступ сверху (форма пропускает
   лейбл) · --ea-sweep-z слой · --ea-sweep-dur/-delay/-ease темп.
   Радиус кольца НЕ вынесен в переменную намеренно: `border-radius:var(--x)` со
   значением `inherit` невалиден на computed-value time и схлопывает углы в 0
   (замер: .agent-card::after отдавал 0px при 22px у носителя). Кольцо берёт
   радиус носителя через inherit — носителю радиус и задавать.
   Эталон значений — форма «sell your property»: 1.5px, 0.52s, задержка 0.1s, iOS-кривая.

   inherits:true принципиально — угол живёт на носителе (его матчат :hover /
   :focus-within), а рисует его ::after по наследству; при inherits:false ::after
   значение с родителя не получает и кольцо не зажигается вовсе. */
@property --ea-sweep{syntax:"<angle>";inherits:true;initial-value:0deg}

.ea-draw-border,
:is(#AdvertisementAddForm,#MessageViewForm,.ea-form) :is(.form-group,.control-group,.elementor-field-group),
.item-wrap,
.language__block--inline #showLanguageList{
  --ea-sweep:0deg;
  --ea-sweep-w:1.5px;
  --ea-sweep-top:0px;
  --ea-sweep-z:2;
  --ea-sweep-dur:.52s;
  --ea-sweep-delay:.1s;
  --ea-sweep-ease:cubic-bezier(.32,.72,0,1);
  transition:--ea-sweep var(--ea-sweep-dur) var(--ea-sweep-ease) var(--ea-sweep-delay);
}
.ea-draw-border::after,
:is(#AdvertisementAddForm,#MessageViewForm,.ea-form) :is(.form-group,.control-group,.elementor-field-group)::after,
.item-wrap::after,
.language__block--inline #showLanguageList::after{
  content:"";position:absolute;
  top:var(--ea-sweep-top);left:0;right:0;bottom:0;
  border-radius:inherit;
  padding:var(--ea-sweep-w);
  pointer-events:none;z-index:var(--ea-sweep-z);
  /* без фона по умолчанию: не отработает маска — оверлей обязан остаться невидимым,
     а не залить носитель поверх текста */
  background:none;
}
@supports (mask-composite:exclude) or (-webkit-mask-composite:xor){
  .ea-draw-border::after,
  :is(#AdvertisementAddForm,#MessageViewForm,.ea-form) :is(.form-group,.control-group,.elementor-field-group)::after,
  .item-wrap::after,
  .language__block--inline #showLanguageList::after{
    /* кольцо = двухслойный border-mask (заливка минус внутренняя область).
       Третий слой маски ломает вычитание — conic заливает носитель целиком. */
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;
    mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
    mask-composite:exclude;
    /* стопы едут за --ea-sweep: цвет на участке [0..sweep], дальше прозрачно.
       min() держит бренд-стопы внутри уже прорисованной дуги — иначе на малых углах
       цвет прыгает. Старт от -90deg = 12 часов, фронт по часовой.
       opacity намеренно не используется: fade гасил бы кольцо раньше, чем оно
       успеет раскрутиться обратно. */
    background:conic-gradient(from -90deg,
      var(--brand-yellow) 0deg,
      var(--brand-orange) min(90deg,var(--ea-sweep)),
      var(--brand-red)    min(200deg,var(--ea-sweep)),
      var(--brand-orange) min(300deg,var(--ea-sweep)),
      var(--brand-yellow) var(--ea-sweep),
      transparent var(--ea-sweep),
      transparent 360deg);
  }
}
/* Прорисовка — по наведению; при уходе курсора --ea-sweep едет 360→0 тем же transition.
   Свои триггеры потребителей (:focus-within у формы, :hover у карточки) — в их файлах. */
.ea-draw-border:hover,
.ea-draw-border:focus-visible{--ea-sweep:360deg}

.quick-item{
  position:relative;
  /* база типографики из макета: тема отдаёт body 15px/300/25px и текст в карточке «плывёт» */
  font-size:16px;font-weight:400;line-height:1.5;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  gap:14px;height:100%;
  padding:22px 16px;
  border-radius:var(--r-lg);
  background:rgba(255,255,255,.07);
  -webkit-backdrop-filter:saturate(150%) blur(8px);backdrop-filter:saturate(150%) blur(8px);
  color:#fff;text-align:center;text-decoration:none;
  --ea-sweep:0deg;
  /* 3D-наклон за курсором — та же механика, что у карточек агентов: углы пишет скрипт */
  --rx:0deg; --ry:0deg; --lift:0px;
  transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--lift));
  transform-style:preserve-3d;
  /* тень на тёмном фоне секции — направление задают --sx/--sy (см. .agent-card) */
  box-shadow:calc(var(--sx,0px) * .9) calc(18px + var(--sy,0px) * .9) 22px -4px rgba(0,0,0,.72);
  transition:transform .3s var(--ease), background-color .3s var(--ease), box-shadow .3s var(--ease),
             --ea-sweep var(--ea-sweep-dur) var(--ea-sweep-ease) var(--ea-sweep-delay);
}
.quick-item:hover,.quick-item:focus{color:#fff;text-decoration:none}
/* в режиме слежения тень идёт тем же темпом, что и поворот — иначе она заметно отстаёт */
.quick-item.is-tilting{transition:transform .12s linear, background-color .3s var(--ease),
             box-shadow .12s linear, --ea-sweep var(--ea-sweep-dur) var(--ea-sweep-ease) var(--ea-sweep-delay)}
/* фоновая рамка-подложка: обводка едет ПОВЕРХ неё */
.quick-item::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
}
.quick-item:hover{
  --lift:-4px;                       /* одинаково с карточками агентов */
  background:rgba(255,255,255,.12);
  box-shadow:calc(var(--sx,0px) * 1.3) calc(26px + var(--sy,0px) * 1.3) 28px -4px rgba(0,0,0,.85);
}
.quick-item:focus-visible{outline:3px solid rgba(242,105,33,.7);outline-offset:3px}
.quick-item img{
  display:block;
  width:70px;height:70px;aspect-ratio:1;object-fit:contain;   /* исходный размер иконок 70x70 */
  max-width:100%;
  transition:transform .35s var(--ease);
}
.quick-item:hover img{transform:scale(1.07)}
.quick-item h5{
  font-family:inherit;                                        /* тема задаёт h1-h6 Roboto напрямую */
  margin:0;margin-top:auto;                                   /* текст прижат к низу — ряд ровный */
  font-size:15px;line-height:1.35;font-weight:700;letter-spacing:.02em;
  text-transform:uppercase;color:#fff;
  white-space:normal;
}

/* ============================ SECTION 2 — AGENTS ============================ */
.agent-card{
  position:relative;                 /* носитель .ea-draw-border: ::after кроет её периметр */
  display:flex;flex-direction:column;height:100%;
  background:var(--surface);
  border-radius:var(--r-lg);
  color:var(--ink);
  text-align:left;
  /* Тень ходит за наклоном: --sx/--sy пишет тот же скрипт, что и углы. */
  box-shadow:
    0 2px 3px rgba(30,30,30,.16),
    calc(var(--sx,0px) * .4) calc(8px + var(--sy,0px) * .4) 10px -2px rgba(30,30,30,.34),
    var(--sx,0px) calc(22px + var(--sy,0px)) 26px -2px rgba(30,30,30,.55);
  /* clip, а не hidden: hidden делает карточку scroll-контейнером, и тогда view()-таймлайн
     значка считает его «всегда видимым» — появление отыгрывает мгновенно и незаметно */
  overflow:clip;
  /* 3D-наклон за курсором: угол пишет скрипт в --rx/--ry, CSS только применяет.
     perspective на самой карточке (не на гриде) — иначе у крайних карточек общая
     точка схода уводит наклон в сторону. */
  --rx:0deg; --ry:0deg; --lift:0px;
  transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--lift));
  transform-style:preserve-3d;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease),
             --ea-sweep var(--ea-sweep-dur) var(--ea-sweep-ease) var(--ea-sweep-delay);
}
/* при наклоне за курсором transform должен идти без сглаживания, а обводка — своим темпом */
.agent-card.is-tilting{transition:transform .12s linear, box-shadow .12s linear,
             --ea-sweep var(--ea-sweep-dur) var(--ea-sweep-ease) var(--ea-sweep-delay)}
.agent-card:hover{
  --lift:-4px;
  box-shadow:
    0 2px 3px rgba(30,30,30,.18),
    calc(var(--sx,0px) * .4) calc(10px + var(--sy,0px) * .4) 13px -2px rgba(30,30,30,.36),
    calc(var(--sx,0px) * 1.3) calc(30px + var(--sy,0px) * 1.3) 34px -4px rgba(30,30,30,.6);
}

.agent-media{position:relative;background:var(--page-2);overflow:clip}
/* Единый кадр 3:4 при превью 3:5 (user.ctp): 200px запаса по высоте, которым
   --ag-focal ставит макушку на общий уровень, а --ag-zoom равняет масштаб голов
   (фото сняты с разного расстояния — от портрета до полного роста).
   Дефолт 30%/1 — середина запаса, безопасен для агента без своей строки ниже. */
.agent-media img{
  display:block;
  width:100%;height:auto;max-width:100%;
  aspect-ratio:3/4;
  object-fit:cover;
  object-position:center var(--ag-focal,30%);
  transform:scale(var(--ag-zoom,1));
  transform-origin:center top;   /* верх кадра неподвижен, зум уходит вниз и в бока */
}
/* Кадр на агента. ImageCompress умеет только ЦЕНТРАЛЬНЫЙ кроп, поэтому макушка
   попадает в превью на своей высоте у каждого. Значения посчитаны Haar-детекцией по
   превью 600x1000 (цель — макушка на 9% высоты кадра, размер головы по медиане) и
   докручены глазами на контрольной раскладке. Ключ — id пользователя (`ag-<id>` на
   .agent-cell): src после ресайза становится хэшем и имени файла не несёт.
   Агент без строки здесь получает дефолт выше. */
.agent-cell.ag-5 {--ag-focal:66%;--ag-zoom:1.4}
.agent-cell.ag-14{--ag-focal:12%}
.agent-cell.ag-15{--ag-focal:71%}
.agent-cell.ag-23{--ag-focal:0%}
.agent-cell.ag-33{--ag-focal:0%}
.agent-cell.ag-37{--ag-focal:29%;--ag-zoom:1.33}
.agent-cell.ag-38{--ag-focal:0%}
.agent-cell.ag-42{--ag-focal:0%}
.agent-cell.ag-44{--ag-focal:0%;--ag-zoom:1.08}
.agent-cell.ag-45{--ag-focal:11%}
.agent-cell.ag-46{--ag-focal:25%;--ag-zoom:1.6}
/* Значок best_worker. Три слоя, чтобы анимации не конфликтовали за один transform:
     .agent-flag — появление (класс от home_cards.js)
     .ea-flag-in — реакция на наведение
     .ea-shine   — постоянный блик (маска неподвижна, движется градиент внутри) */
.agent-flag{
  position:absolute;top:14px;right:14px;   /* запас под пик scale(1.1) при наведении */
  width:110px;height:110px;
  /* ЗНАЧОК ВИДЕН ПО УМОЛЧАНИЮ. Прятать его имеет право ТОЛЬКО скрипт — и только после того,
     как убедился, что умеет показать обратно. Любой сбой = значок просто на месте. */
  opacity:1;
  /* z-index ОБЯЗАТЕЛЕН: у карточки есть transform (наклон), transform создаёт контекст
     наложения — фото идёт в разметке позже и без z-index перекрывало бы значок. */
  z-index:3;
}
/* .is-armed вешает скрипт — только он прячет значок до входа в кадр */
.agent-flag.is-armed{opacity:0}
/* .is-in — карточка вошла в кадр: играем появление */
.agent-flag.is-in{opacity:1;animation:ea-flag-pop .9s var(--ease)}
.ea-flag-in{
  position:absolute;inset:0;display:grid;place-items:center;
  transition:transform .45s var(--ease);
}
.agent-card:hover .ea-flag-in{transform:scale(1.1) rotate(-5deg)}
.agent-flag img{
  position:relative;z-index:1;display:block;
  width:100%;height:100%;aspect-ratio:1;object-fit:contain;
  filter:drop-shadow(0 4px 10px rgba(30,30,30,.35));
}
/* Окно блика — КРУГ (медаль круглая), обрезка через border-radius+overflow, БЕЗ mask-image.
   Окно стоит на месте, ездит только градиент внутри (::before). */
.ea-shine{
  position:absolute;inset:8%;z-index:2;pointer-events:none;
  border-radius:50%;overflow:hidden;
}
.ea-shine::before{
  content:"";position:absolute;top:-30%;bottom:-30%;left:-30%;right:-30%;
  background:linear-gradient(112deg,
    rgba(255,255,255,0)   28%,
    rgba(255,255,255,.35) 42%,
    rgba(255,255,255,1)   50%,
    rgba(255,255,255,.35) 58%,
    rgba(255,255,255,0)   72%);
  filter:blur(1px);
  transform:translateX(-170%);
  animation:ea-flag-shine 3.6s ease-in-out infinite;
}
/* Блик крутится бесконечно по слою с filter:blur — за кадром это чистая трата
   кадра. Класс ставит наблюдатель в home_cards.js; пауза, а не выключение —
   вернувшись в кадр, блик продолжится с той же фазы (как у огонька карточек,
   property-card.css:321). */
.agent-flag.is-offscreen .ea-shine::before{animation-play-state:paused}

/* Google Translate держит в DOM прелоадер-заглушку, которую сам же прячет на
   -1000,-1000 (обёртка ещё и opacity:0), но её спиннер крутится ВСЕГДА — две
   бесконечные анимации. На карточке объекта собственного rAF-цикла нет вовсе,
   и эти две в одиночку держали страницу на 60 fps: ~115 мс/с главного потока
   в покое (замер 12.08). Показать спиннер негде, поэтому останавливаем.
   Классы виджета обфусцированы: переименует их Google — правило перестанет
   применяться, и поведение вернётся к нынешнему, ничего не сломав. */
[class*="ZVi9od-aZ2wEe"]{animation-play-state:paused !important}

/* Покупная тема держит will-change:transform на КАЖДОЙ цитате слайдера отзывов
   (style.css, .quote-slider-4) — на главной это 15 постоянных композитных слоёв
   под элементами, которые сами не двигаются: слайдер возит контейнер, а не цитату.
   Правим здесь, а не в style.css: тот вендорский и перезаписывается обновлением темы. */
.quote-slider-4{will-change:auto}
@keyframes ea-flag-pop{
  0%  {transform:scale(.2) rotate(-35deg);opacity:0}
  70% {transform:scale(1.12) rotate(5deg);opacity:1}
  100%{transform:scale(1) rotate(0);opacity:1}
}
@keyframes ea-flag-shine{
  0%,50%  {transform:translateX(-170%)}
  85%,100%{transform:translateX(170%)}
}

.agent-body{display:flex;flex-direction:column;flex:1 1 auto;padding:var(--pad);gap:4px}
/* text-transform:none обязателен: тема ставит заголовкам carousel/секций capitalize */
.agent-name{font-family:inherit;margin:0;font-size:18px;font-weight:800;letter-spacing:-.01em;line-height:1.25;color:var(--ink);text-transform:none}
.agent-name a{color:inherit;text-decoration:none}
.agent-name a:hover,.agent-name a:focus{color:var(--brand-orange);text-decoration:none}
.agent-post{
  margin:0;font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--brand-orange);
  text-transform:uppercase;line-height:1.4;
}
.agent-contacts{
  margin-top:auto;padding-top:16px;margin-bottom:0;
  display:flex;flex-direction:column;gap:8px;
  border-top:1px solid var(--hair);
  font-style:normal;line-height:1.5;   /* тема даёт address 22.5px */
}
.agent-contacts a{
  display:flex;align-items:center;gap:10px;
  font-size:13px;color:var(--ink-60);font-weight:500;
  word-break:break-word;text-decoration:none;
  transition:color .2s var(--ease);
}
.agent-contacts a:hover,.agent-contacts a:focus{color:var(--brand-orange);text-decoration:none}
.agent-contacts .mdi{
  /* line-height:1 обязателен: иконочный шрифт темы наследует 24px и значок съезжает в кружке */
  font-size:16px;line-height:1;flex:0 0 30px;height:30px;width:30px;border-radius:var(--r-sm);
  display:grid;place-items:center;color:var(--brand-orange);   /* брендовый #F26921 */
  background:rgba(242,105,33,.10);
}
.agents-foot{margin-top:34px;text-align:center}

/* ---------- breakpoints (theme scale: xs480 / sm768 / md992 / lg1200) ---------- */
@media (min-width:768px){
  :root{--gap:24px;--pad:24px;--sec-y:44px}
  .agent-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:992px){
  :root{--sec-y:48px}
  .agent-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:1200px){
  :root{--gap:30px;--pad:28px}
  .quick-item{padding:30px 22px}
  .quick-item h5{font-size:16px}
}

@media (prefers-reduced-motion:reduce){
  .ea-quick *,.ea-quick__bg,.agent-card,.agent-card *,.ea-btn,.mkC-zoom{transition:none!important;animation:none!important}
  .agent-flag{opacity:1;transform:none}   /* без анимации значок обязан быть виден сразу */
  .ea-shine{display:none}
}

/* Страница всех агентов (/users/users/) осталась на flex-раскладке темы (.range):
   без align-items ячейки не тянутся и карточки в ряду получают разную высоту. */
.section-34 .range{align-items:stretch}

/* ---------- section head на тёмном фоне (секция «Get in touch», блок 36) ---------- */
/* Скоуп --dark обязателен: глобальные .ea-title/.ea-eyebrow рассчитаны на светлый фон блока 33. */
.ea-head--dark .ea-eyebrow{
  /* --brand-red на тёмном ≈2.3:1 — нечитаем; жёлтый бренда даёт ≈8.6:1 */
  color:var(--brand-yellow);
  /* .shell этой секции задаёт Roboto, а у .ea-eyebrow шрифт не объявлен */
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
}
.ea-head--dark .ea-title{
  /* .ea-title наследует шрифт, а контейнер .shell этой секции даёт Roboto —
     Montserrat задаём явно, иначе типографика расходится с блоком агентов */
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  color:#fff;
}
/* якорь <a name="get_in_touch"> внутри заголовка иначе красится ссылочным синим */
.ea-head--dark .ea-title a,
.ea-head--dark .ea-title a:hover,
.ea-head--dark .ea-title a:focus{color:inherit;text-decoration:none}
.ea-head--dark .ea-sub{
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  font-size:17px;line-height:1.55;color:rgba(255,255,255,.86);
  text-align:center;max-width:640px;margin:14px auto 0;
}

/* ==========================================================================
   HOME (.ea-home) — все секции на 12-колоночной сетке темы.
   Канон = тот же контейнер, что у шапки: .container (750 / 970 / 1170 / 1250px
   на 768/992/1200/1280 + 15px паддинги, uploads/files_css/style.css) и .row/.col-*.
   Собственных ширин здесь НЕТ — раньше их было три (.shell фиксировал 480px на
   мобиле, .shell-fluid тянулся во всю страницу, .ea-shell жил на 1200/16px),
   отчего колонка «гуляла» от секции к секции и не совпадала с шапкой.
   Разметка секций переведена на .container/.row/.col-* — здесь только ритм,
   шапки секций и равные высоты в рядах.
   Скоуп .ea-home обязателен: те же классы держат внутренние страницы.
   ========================================================================== */

/* Ряды 12-сетки — flex: иначе float-колонки дают разную высоту карточек в ряду.
   Скоуп .ea-home ОБЯЗАТЕЛЕН: те же классы держат внутренние страницы. Попытка снять
   его 07.08 положила каталог — там ряд листинга живёт внутри flex-колонки рядом с
   картой, и `container-type:inline-size` (правило ниже) схлопнул его по контенту:
   карточки ушли в 3px-столбец у левого края, середина страницы осталась пустой.
   Расширять сетку за пределы главной можно только вместе с проверкой каждой такой
   страницы, а не одним снятием скоупа. */
/* Зазор между рядами — row-gap самого ряда, а не margin-bottom колонок: с margin'ом
   последний ряд добавлял 30px ПОД собой, и низ каждой сеточной секции был на 30px
   больше её верха (замер 14.08: quick 138 сверху против 197 снизу). */
.ea-home .row.ea-row{display:flex;flex-wrap:wrap;align-items:stretch;row-gap:30px}
.ea-home .row.ea-row > [class*="col-"]{display:flex;min-width:0}
.ea-home .row.ea-row > [class*="col-"] > *{flex:1 1 auto;min-width:0;max-width:100%}

/* Вертикальный ритм — один на ВСЕ секции, без исключений по фону.
   [class] поднимает специфичность над section-34/66/98/110 темы без !important.
   Раньше .ea-quick, .context-dark и .bg-lighter (отзывы) были исключены и жили
   на утилитах темы: зазоры по странице шли 30 → 56 → 136 → 160 → 198 → 220 → 258px,
   то есть каждая граница своя. Фон секции — не повод для другого ритма. */
.ea-home > section[class]:not(.elementor-section),
.ea-home > .container[class]{padding-block:var(--sec-y)}
/* Секции темы несут утилиту section-* ещё и на ВНУТРЕННЕМ .container (блок 36,
   «Didn't find what you were looking for»): без обнуления к ритму секции добавлялись
   её же 98/110px изнутри. */
.ea-home > section[class] .container[class*="section-"]{padding-block:0}
/* Исключение — секция с параллакс-фоном («Get in touch», блок 36): фото рисует
   .rd-parallax ВНУТРИ секции, поэтому padding самой секции ложится белой полосой
   над и под картинкой, а заголовок прилипает к её верхнему краю. Ритм здесь несёт
   внутренний .container — тогда отступы попадают внутрь фона и живут вместе с ним.
   Специфичность обоих селекторов подобрана намеренно: без `[class]` и `:not()`
   правило ритма выше (0,3,1) перебивало исключение (0,2,1) — padding оставался на
   секции белой полосой, а контейнер обнулялся правилом над ним (0,4,1). */
/* Секция быстрых ссылок на фотофоне («All properties for sale / Top agents / for rent»):
   двойной шаг ритма (72/88/96 против 36/44/48). У неё ВИДИМАЯ граница фона, и поля
   в один шаг читались как куцая полоса вокруг плиток — воздуха внутри картинки должно
   быть столько же, сколько между секциями на белом. Специфичность 0,4,1 — иначе общее
   правило ритма (0,3,1) ниже по файлу перебило бы. */
.ea-home > section.ea-quick[class]:not(.elementor-section){padding-block:calc(var(--sec-y) * 2)}
.ea-home > section[class]:not(.elementor-section):has(> .rd-parallax){padding-block:0}
.ea-home > section[class]:has(> .rd-parallax) .container[class*="section-"]{padding-block:var(--sec-y)}
/* Фильтр (.elementor-section) исключён намеренно: у него margin-top:-60px — он ДОЛЖЕН
   налезать на слайдер, вертикальный padding убивал это наложение. Своего padding-bottom
   у секции фильтра нет, поэтому весь зазор до следующей секции несёт её padding-top —
   отсюда полный шаг ритма (2 × --sec-y), а не половина, как у остальных границ. */
.ea-home > section.elementor-section ~ .container{padding-top:calc(var(--sec-y) * 2)}
/* Секции-заглушки темы (services без записей) иначе дают двойной пустой ритм */
.ea-home > section:not(:has(img,h2,h3,p,a,form,iframe,.item-listing-wrap)){display:none}

/* Шапка секции: одинаковый зазор до контента, кратный gutter сетки (30px).
   Второй заголовок в общем контейнере (Recent offers) отбивается от сетки выше. */
.ea-home .ea-head{margin:0 0 30px}
/* Hot offers и Recent offers лежат в ОДНОМ контейнере (блок 48), поэтому граница между
   ними не набирается из двух padding'ов — задаём ей тот же полный шаг ритма. */
.ea-home .listing-view + .ea-head{margin-top:calc(var(--sec-y) * 2)}
/* Шапка → контент внутри секции: у отзывов разметка несла утилиту темы offset-top-66,
   из-за неё зазор был 66px против 30px во всех остальных секциях. */
.ea-home .ea-reviews .offset-top-66{margin-top:0}

/* Заголовки легаси-секций → вид .ea-head (эталон — «Real Estate Agents»).
   Страховка для CMS-блоков, размеченных старым h2.text-bold + hr.divider. */
.ea-home h2.text-bold{
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  font-size:clamp(26px,5.2vw,42px);line-height:1.14;font-weight:800;
  text-transform:none;letter-spacing:-.02em;margin:0;color:var(--ink);
  text-align:center;
}
.ea-home hr.divider{
  width:64px;height:4px;border:0;margin:16px auto 0;border-radius:var(--r-pill);
  background:linear-gradient(90deg,var(--brand-red),var(--brand-orange) 55%,var(--brand-yellow));
}

/* Значения ритма по брейкпоинтам живут в --sec-y (:root, 768/992) — дублирующих
   media-правил на сами селекторы больше нет. */

/* Ширины колонок 12-сетки. `/uploads/estateal/style.css?v=2.2` подключается ПОСЛЕ темы,
   несёт bootstrap-4 базу `.col*{width:100%}` и НИ ОДНОГО респонсив-правила — из-за этого
   `.col-sm-4`/`.col-md-4` темы обнулялись и колонки стакались на всю ширину. Специфичность
   `.row.ea-row > [class*="col-"]` (0,2,0) перебивает её независимо от порядка файлов.

   ЧИСЛО КОЛОНОК РЕШАЕТ ДОСТУПНАЯ ШИРИНА РЯДА, А НЕ ВЬЮПОРТ И НЕ КЛАСС КОЛОНКИ.
   Конкретные доли (`col-sm-6`, `col-md-4`, `col-lg-3`) больше НЕ разводят секции по
   разной ширине: колонка агента, плитка quick-раздела и карточка объекта в одной
   точке экрана обязаны быть ОДНОЙ ширины и лежать на общих вертикалях — иначе края
   секций «гуляют». Классы `col-*` в разметке остаются как семантика/фолбэк.

   Почему @container, а не @media: медиа-запрос меряет вьюпорт ВМЕСТЕ с полосой
   прокрутки и промахивается ровно на её ширину (замер: vw 810 -> контейнер 795 ->
   карточка 367.5 при минимуме 375). Контейнером объявлен сам ряд, поэтому порог
   считается от того, что реально доступно колонкам, и не зависит от ОС/браузера.

   Арифметика: ряд шире доступной ширины на свои отрицательные margin (30px), колонка
   уже на свой padding (30px), поэтому карточка = ряд/n - 30. Пороги (07.08):
     2 колонки от ряда 685  (доступно 655, карточка от 312.5)
     3 колонки от ряда 1170 (доступно 1140, карточка 360)
   Порог трёх занижен относительно «карточка >= 375» намеренно и привязан к ФАКТИЧЕСКОЙ
   ступени контейнера темы: `@media (min-width:1200px){.container{width:1170px}}` даёт ряд
   ровно 1170, следующая ступень (1250) начинается только с вьюпорта 1280. Порог 1195,
   стоявший здесь до замера 07.08, в диапазон 1200-1279 не попадал вовсе — десктоп на 1200
   показывал две колонки вместо трёх. Карточка при 1170 равна 360 — на 15px ниже минимума;
   осознанный размен ради того, чтобы ширина страницы и шапка (.container 750/970/1170/1250)
   остались нетронутыми.
   Четвёртой колонки нет: ей нужен ряд 1620, контейнер темы столько не даёт. */
.ea-home .row.ea-row{container-type:inline-size;container-name:earow}
.ea-home .row.ea-row > [class*="col-"]{flex:0 0 100%;max-width:100%;padding-inline:15px}
@container earow (min-width:685px){
  .ea-home .row.ea-row > [class*="col-"]{flex:0 0 50%;max-width:50%}
}
@container earow (min-width:1170px){
  .ea-home .row.ea-row > [class*="col-"]{flex:0 0 33.3333%;max-width:33.3333%}
}

/* Ряд карточек объектов ОСТАЁТСЯ с классами `.listing-view.grid-view.card-deck`: на них висит
   не только раскладка, но и внутреннее оформление самой карточки (`/uploads/estateal/style.css`):
   `.grid-view .item-wrap.item-wrap-no-frame{padding:0}` — иначе у карточки появляется рамка,
   `.card-deck .card{background:transparent;border:none}` — иначе проступают фон и бордер,
   `.grid-view .labels-wrap{position:absolute}` — иначе бейджи и иконка города съезжают.
   Снять обёртку целиком (первая версия правки 07.08) = снять это оформление вместе с сеткой.
   Поэтому классы сохраняются, а гасится ТОЛЬКО их раскладка — тремя правилами ниже.
   Специфичность 0,4,0 перебивает и property-card.css (`.listing-view.grid-view`, 0,2,0),
   и estateal (`.grid-view .item-listing-wrap`, 0,2,0) независимо от порядка файлов. */
.ea-home .row.ea-row.listing-view.grid-view{
  display:flex;                          /* вместо CSS Grid auto-fill из property-card.css */
  /* По горизонтали расстояние держат padding колонок, а не gap сетки. По вертикали —
     наоборот row-gap ряда (.ea-home .row.ea-row): вертикального padding у колонок нет,
     и общий `gap:0` склеивал ряды карточек вплотную. */
  column-gap:0;
  margin-left:-15px;margin-right:-15px;  /* property-card.css обнулял margin ряда под grid */
  padding-left:0;padding-right:0;        /* `.listing-view.card-deck` добавлял свои 15px */
}
/* доли легаси-сеток на самой карточке (`.grid-view .item-listing-wrap{width:50%}` и
   `.grid-view-3-cols` 1/3) — ширину теперь держит колонка, карточка занимает её целиком */
.ea-home .row.ea-row > [class*="col-"] > .item-listing-wrap{
  width:auto;max-width:none;flex-basis:auto;padding:0;margin:0;
}
/* Ниже 768px у .container нет заданной ширины (width:auto + auto-margins), поэтому внутри
   grid-секции .ea-quick он сжимался до fit-content (287px вместо 375). На ≥768 ширину задаёт
   сама тема (750/970/1250) — туда правило не пускаем. */
@media (max-width:767px){
  .ea-quick > .container{width:100%}
}

/* ==========================================================================
   Топ-строка шапки (кнопки / соцсети / e-mail / телефон)

   Разметку менять нельзя — она приходит блоком региона `site_header` из БД
   (`SiteRegionBlock->blocks('site_header')`), поэтому всё правится стилями.

   Строка УЖЕ flex (`/uploads/files_css/style.css`: `.rd-navbar-top-panel
   {display:flex;justify-content:space-between}`), но без `align-items` —
   кнопки 36px, иконки соцсетей 35px и текстовые контакты вставали по
   базовой линии flex-start и разъезжались по вертикали. Добавляем только
   центрирование и обнуляем разгоняющие его margin темы.

   Всё, что про раскладку — под `min-width:769px`: на ≤768px тот же файл
   разворачивает панель в `flex-direction:column`, и правило с более высокой
   специфичностью сломало бы мобильную адаптацию. Цвета и волна — общие.
   ========================================================================== */

.rd-navbar-top-panel{
  --ea-brand-red:#be151b;    /* brand/colors/palette.json */
  --ea-brand-orange:#f26921;
  --ea-brand-yellow:#f7921e;
  --ea-ease:cubic-bezier(0.32,0.72,0,1);
}

@media (min-width:769px){
  .rd-navbar-static.rd-navbar-top-panel .rd-navbar-top-panel{
    align-items:center;
    flex-wrap:wrap;
    gap:10px 24px;
  }
  /* Один шаг на всю строку: 24px между соседними объектами (кнопка↔кнопка,
     e-mail↔телефон, группа↔группа). Тема разводила кнопки на 36px —
     заметно шире остального ритма; правило гасим его же селектором. */
  .rd-navbar-static.rd-navbar-top-panel .rd-navbar-top-links{
    display:flex;align-items:center;margin-bottom:0;gap:24px;
  }
  .rd-navbar-static.rd-navbar-top-panel .rd-navbar-top-links>li+li{margin-left:0}
  .rd-navbar-static.rd-navbar-top-panel .contact-info{
    display:flex;align-items:center;flex-wrap:wrap;gap:8px 24px;
  }
  /* Обнуляем ВСЕ margin темы у контактов: `margin-left:70px` разводил их по
     горизонтали (расстояние теперь держит gap), а `p,.p,.list{margin-top:18px}`
     в новом flex-контексте роняло телефон на 18px ниже e-mail. */
  .rd-navbar-static.rd-navbar-top-panel .contact-info>span{
    display:inline-flex;align-items:center;margin:0;
  }
  /* отдельной строкой: у правила темы `>span+span{margin-left:70px}` вес выше,
     чем у шортката `margin:0` на `>span` — иначе разгон возвращается */
  .rd-navbar-static.rd-navbar-top-panel .contact-info>span+span{margin-left:0}
}

/* --- Бренд-цвет контактов + волна перекраски по ховеру ---------------------
   Тот же приём, что у лейблов формы «Sell your object»
   (`sellprop_form.css`, блок «Волна перекраски»): фронт волны — граница двух
   стопов градиента, заклипованного в текст, едет позицией фона. Стоп 51% =
   базовый красный, поэтому в покое ссылка ровного бренд-цвета.

   `@supports` обязателен: `-webkit-text-fill-color:transparent` без рабочего
   background-clip сделал бы контакты невидимыми. */
.rd-navbar-top-panel .contact-info a{
  color:var(--ea-brand-orange);
  font-weight:700;
  /* подчёркивание рисует полоска-::after ниже; нативное `a:hover` темы
     (0,1,1) гасится здесь — селектор (0,2,1) сильнее и в состоянии ховера */
  text-decoration:none;
  transition:color .2s var(--ea-ease);
}
/* класс схемы в селекторе обязателен: тема красит иконку правилом
   `.rd-navbar-top-panel.rd-navbar-light .contact-info .icon{color:#9b9b9b}`
   той же длины — без него наше правило проигрывает по специфичности */
.rd-navbar-top-panel:is(.rd-navbar-light,.rd-navbar-dark) .contact-info .icon{
  color:var(--ea-brand-orange);
  transition:color .18s var(--ea-ease);
}
.rd-navbar-top-panel .contact-info>span:hover .icon{color:var(--ea-brand-red)}

@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .rd-navbar-top-panel .contact-info a{
    background-image:linear-gradient(90deg,
      var(--ea-brand-red) 0%,
      var(--ea-brand-orange) 34%,
      var(--ea-brand-yellow) 49%,
      var(--ea-brand-orange) 51%);   /* стоп 51% = базовый цвет в покое */
    background-size:200% 100%;   /* полоса перехода ≈ уже буквы → идёт по буквам */
    background-repeat:no-repeat;
    background-position:100% 0;
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    transition:background-position .45s var(--ea-ease) .12s;
  }
  /* иконка живёт своим `color` — text-fill-color наследуется и обнулил бы её */
  .rd-navbar-top-panel .contact-info .icon{-webkit-text-fill-color:currentColor}

  .rd-navbar-top-panel .contact-info>span:hover a,
  .rd-navbar-top-panel .contact-info a:focus-visible{background-position:0 0}
}

/* --- Полоска под контактом по ховеру ---------------------------------------
   Ровно тот же элемент, что под пунктами меню (`style.css`:
   `.rd-navbar-top-panel.rd-navbar-static .rd-navbar-nav>li>a:after` —
   градиент #ffa200→#ff7e00, 2px, отступ 4px, раскрытие от центра за .3s).
   Значения скопированы как есть, чтобы полоски были одинаковыми. */
.rd-navbar-top-panel .contact-info a{position:relative;display:inline-block}
.rd-navbar-top-panel .contact-info a:after{
  content:'';
  position:absolute;
  top:100%;left:50%;
  width:0;height:2px;
  margin-top:4px;
  background:linear-gradient(90deg,#ffa200 0,#ff7e00 100%);
  transition:.3s all ease;
}
.rd-navbar-top-panel .contact-info>span:hover a:after,
.rd-navbar-top-panel .contact-info a:focus-visible:after{left:0;width:100%}

@media (prefers-reduced-motion:reduce){
  .rd-navbar-top-panel .contact-info a,
  .rd-navbar-top-panel .contact-info a:after,
  .rd-navbar-top-panel .contact-info .icon{transition:none}
}

/* --- Кнопки топ-строки по канону .ea-btn -----------------------------------
   Было: `.btn` темы (border-radius:3px, border:1px) + небрендовые заливки из
   `/uploads/files_css/style.css` — #ce5734 (нет в палитре) и #ff7e00 (оранжевый
   темы, не бренд #F26921). Приводим к тому же рецепту, что кнопки главной
   (`.ea-btn`, выше в этом файле): pill-радиус, БЕЗ бордера — объём даёт тень,
   та же типографика и та же реакция на ховер.

   Класс `.ea-btn` навесить нельзя — разметка приходит блоком `site_header` из
   БД, поэтому канон повторён значениями на существующих классах, а размеры и
   цвета взяты из токенов `:root` (строка 779).

   Специфичность (0,4,1) обязательна: `.btn-bid-add{background-color:#ce5734}`
   лежит в `/uploads/files_css/style.css`, который грузится ПОСЛЕ custom.css.

   Размеры — ровно канонные (46px / 0 22px / 13px): у `.btn` темы кнопка была
   примерно такой же (padding 9px 16px при line-height 28px ≈ 50px), и на
   компактных 38px строка читалась куцей. */
.rd-navbar-top-panel .rd-navbar-top-links>li>a.btn{
  --btn-bg:var(--brand-red);
  --btn-bg-hover:#A51217;
  --btn-glow:190,21,27;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:46px;padding:0 22px;
  border-radius:var(--r-pill);border:0;
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  font-weight:700;font-size:13px;line-height:1.5;letter-spacing:.06em;
  text-transform:uppercase;text-decoration:none;
  color:#fff;background:var(--btn-bg);
  box-shadow:0 1px 1px rgba(255,255,255,.35) inset,
             0 8px 18px -10px rgba(var(--btn-glow),.7);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease),
             background-color .25s var(--ease);
}
.rd-navbar-top-panel .rd-navbar-top-links>li>a.btn-realty-add{
  --btn-bg:var(--brand-orange);
  --btn-bg-hover:#D9551A;
  --btn-glow:242,105,33;
}
.rd-navbar-top-panel .rd-navbar-top-links>li>a.btn:hover,
.rd-navbar-top-panel .rd-navbar-top-links>li>a.btn:focus{
  color:#fff;text-decoration:none;background:var(--btn-bg-hover);
}
.rd-navbar-top-panel .rd-navbar-top-links>li>a.btn:hover{
  transform:translateY(-1px);
  box-shadow:0 1px 1px rgba(255,255,255,.35) inset,
             0 14px 26px -12px rgba(var(--btn-glow),.75);
}
.rd-navbar-top-panel .rd-navbar-top-links>li>a.btn:active{transform:translateY(0) scale(.985)}
.rd-navbar-top-panel .rd-navbar-top-links>li>a.btn:focus-visible{
  outline:3px solid rgba(242,105,33,.55);outline-offset:3px;
}
@media (prefers-reduced-motion:reduce){
  .rd-navbar-top-panel .rd-navbar-top-links>li>a.btn{transition:none}
}

/* ==========================================================================
   Переключатель языков в топ-строке (Google Translate).
   Разметка — db_patch 2026-08-12-03-header-lang-switcher-inline.sql: блок
   `.language__block` переехал из угла страницы внутрь `address.contact-info`,
   последним элементом после телефона, и получил класс `.language__block--inline`
   — он же guard патча, он же крючок этих правил.

   Именно внутрь `.contact-info`, а не четвёртым ребёнком строки: строка —
   flex с `justify-content:space-between` (uploads/style.css), свободное место
   режется поровну между её прямыми детьми, и `gap:24px` работает там лишь как
   минимум — замер браузером дал 92.64px от телефона вместо 24px. Внутри
   `.contact-info` (`gap:8px 24px`, выше в этом файле) шаг ровно тот же, что
   между e-mail и телефоном, и вертикальный центр общий.

   Все селекторы держат класс-маркер НЕ для красоты: базовые правила лежат в
   `/uploads/files_css/style.css` (`position:fixed`, `background-color:gray`,
   `#showLanguageList`), который грузится ПОСЛЕ custom.css. Специфичность (0,2,0)
   и (1,1,0) перебивает их независимо от порядка файлов.

   Оформление — тот же язык, что у кнопок строки и контактов выше: pill-радиус,
   бренд-оранжевый #F26921, тёплые тени rgba(120,72,40,..), та же кривая --ease.
   Кнопка — только флаг: индикатор-шеврон рядом с ним читался инородно в строке,
   где остальные элементы — текст и иконки контактов.
   ========================================================================== */
/* Оба класса в селекторе обязательны: `.language__block{position:fixed;right:10px;
   top:10px}` и медиазапросы `top:45px/75px` лежат в uploads-файле, который грузится
   ПОСЛЕ custom.css — одиночный `.language__block--inline` (0,1,0) им равен по весу
   и проигрывает по порядку. Тогда блок остаётся fixed и висит между полосой и меню. */
.language__block.language__block--inline{
  position:relative;              /* гасит position:fixed из uploads/style.css */
  right:auto;top:auto;left:auto;bottom:auto;
  /* поднимает открытый список над плашкой меню: `.active-menu-bar{position:relative}`
     идёт в DOM ПОСЛЕ полосы и при равном уровне перекрывала бы его.
     Обрезку списка снимает `overflow:visible` в active_menu.css:72. */
  z-index:1002;
  align-self:center;              /* по центру полосы, на одной линии с телефоном */
  flex:0 0 auto;
  line-height:0;                  /* строчный интерлиньяж не должен растить пилюлю */
}
.language__block--inline #showLanguageList{
  display:inline-flex;align-items:center;
  list-style:none;                  /* `summary` по умолчанию list-item с маркером */
  position:relative;                /* носитель кольца ::after бренд-обводки */
  min-height:38px;padding:4px 8px;
  border-radius:var(--r-pill);
  border:1px solid rgba(242,105,33,.35);
  background:#fff;
  cursor:pointer;
  box-shadow:0 6px 14px -10px rgba(120,72,40,.5);
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease),
             transform .25s var(--ease);
}
.language__block--inline #showLanguageList::-webkit-details-marker{display:none}
.language__block--inline #showLanguageList:hover{
  border-color:var(--brand-orange);
  transform:translateY(-1px);
  box-shadow:0 12px 22px -12px rgba(242,105,33,.55);
}
.language__block--inline #showLanguageList:active{transform:translateY(0) scale(.985)}
/* Фирменная рисующаяся обводка на ОТКРЫТОМ списке — рецепт `.ea-draw-border`
   (единый источник истины выше в этом файле), кнопка добавлена в его носители.
   Триггер по состоянию списка, а не по `:focus`: фокус остаётся на кнопке и после
   повторного клика, когда список уже закрыт, и кольцо горело бы вхолостую.
   Признак открытости — нативный атрибут `[open]` элемента `<details>` (разметка
   блока 25, патч 2026-08-30-01); прежде им служил инлайновый `display:block` от
   slideToggle. */
.language__block--inline[open] #showLanguageList{
  --ea-sweep:360deg;
  border-color:transparent;         /* статичная обводка не двоится с кольцом */
}
.language__block--inline #showLanguageList:focus-visible{
  outline:3px solid rgba(242,105,33,.55);outline-offset:3px;
}
.language__block--inline .language__img{
  width:26px;height:auto;display:block;
  border-radius:4px;
  /* без кольца-hairline: внутри пилюли оно читалось вторым бордером */
  box-shadow:none;
}

/* Список: карточка того же семейства, что дропдауны форм — белый фон,
   12px радиус, тёплая тень.
   `display` не задаём: содержимое закрытого `<details>` скрывает сам браузер,
   а `position:absolute` поднимает список над потоком, когда он раскрыт. */
.language__block--inline .language__list{
  position:absolute;
  top:calc(100% + 8px);
  left:50%;
  transform:translateX(-50%);
  z-index:1001;
  padding:6px;
  background:#fff;                /* гасит background-color:gray из uploads */
  border:1px solid var(--hair);
  border-radius:var(--r-sm);
  box-shadow:var(--shadow-2);
  width:max-content;              /* пять нативных названий шире прежних флагов */
}
/* Пять нативных названий шире прежних RU|ENG: на узком экране центрирование
   выносило список за правый край вьюпорта. */
@media (max-width: 767px){
  .language__block--inline .language__list{
    left:0;
    transform:none;
  }
}

/* `.rd-navbar-fixed` (mobile) collapses the whole top panel and the burger opens only
   the menu, so the sole language switcher vanished with it. opacity is reset on the
   ANCESTORS, never here: opacity:0 makes a group no descendant escapes, while the
   inherited visibility:hidden is overridable per element — panel and contacts stay hidden. */
.rd-navbar.rd-navbar-fixed .rd-navbar-top-panel,
.rd-navbar.rd-navbar-fixed .rd-navbar-top-panel .right-side{opacity:1}
.rd-navbar.rd-navbar-fixed .language__block.language__block--inline{
  visibility:visible;
  position:fixed;
  /* free right corner of the 56px bar: burger 4..28px, logo 137..253px at 390px */
  top:6px;right:12px;left:auto;bottom:auto;
  z-index:1002;
}
.rd-navbar.rd-navbar-fixed .language__block--inline #showLanguageList{
  min-height:44px;                /* finger, not cursor */
}
/* pill sits at the viewport edge, so `left:0` above would push the list past it */
.rd-navbar.rd-navbar-fixed .language__block--inline .language__list{
  left:auto;right:0;transform:none;
}

/* Текстовый вариант переключателя (D10): те же пилюля и карточка, но названия
   языков вместо флагов — `.language__img`-правила выше к ним не применяются. */
.language__block--text .language__current{
  font-size:13px;line-height:1.2;
  font-weight:600;
  color:var(--text-1, #2b2b2b);
  white-space:nowrap;
}
.language__block--text .language__list{
  list-style:none;
  margin:0;
  text-align:left;
  line-height:normal;             /* гасит line-height:0 носителя пилюли */
}
.language__block--text .language__item{margin:0;padding:0}
.language__block--text .language__link{
  display:block;
  padding:6px 12px;
  border-radius:var(--r-sm);
  font-size:13px;
  color:var(--text-1, #2b2b2b);
  text-decoration:none;
  white-space:nowrap;
  transition:background-color .2s var(--ease), color .2s var(--ease);
}
.language__block--text .language__link:hover,
.language__block--text .language__link:focus-visible{
  background:rgba(242,105,33,.10);
  color:var(--brand-orange);
}
.language__block--text .language__link--active{
  color:var(--brand-orange);
  font-weight:600;
}
.language__block--inline .language__list .language__img{
  width:30px;
  padding:0;margin:0;
  border-radius:5px;
  cursor:pointer;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.language__block--inline .language__list .language__img+.language__img{margin-top:6px}
/* flags are wrapped in locale links now, so the sibling gap moves to the link */
.language__block--inline .language__list .language__link{display:block;line-height:0}
.language__block--inline .language__list .language__link+.language__link{margin-top:6px}
.language__block--inline .language__list .language__img:hover{
  transform:scale(1.08);
  box-shadow:0 0 0 2px var(--brand-orange);
}

@media (prefers-reduced-motion:reduce){
  .language__block--inline #showLanguageList,
  .language__block--text .language__link,
  .language__block--inline .language__list .language__img{transition:none}
}

/* ==========================================================================
   Footer: карта офиса вместо формы обратной связи.
   Asana 1217311613993627, разметка — db_patch 2026-08-10-06-footer-map.sql
   (блок `site_footer_block`, третья колонка).

   Почему стили здесь, а не в /uploads/files_css/style.css, где живёт остальной
   футер: uploads — docker volume, вне git, такая правка не доедет на dev/prod.
   custom.css грузится темой на всех страницах (TmSiteHelper::$_css) и попадает в
   релиз коммитом.
   ========================================================================== */
.footer__map-frame{
  /* Вариант C: <992 (стек) высота от 16/10 с потолком 280px;
     ≥992 фрейм тянется на всю высоту ряда (блок ниже). */
  position:relative;width:100%;aspect-ratio:16/10;max-height:280px;
  border-radius:var(--r-md);overflow:hidden;
  background:#1f1f1f;                       /* фон-заглушка, пока iframe ленится */
  box-shadow:0 10px 28px -14px rgba(0,0,0,.85);
}
.footer__map-frame iframe{
  position:absolute;top:0;left:0;width:100%;height:100%;border:0;display:block;
  /* Карта светлая на тёмном футере — гасим контраст, при наведении отдаём как есть. */
  filter:saturate(.9) brightness(.92);transition:filter .3s var(--ease);
}
.footer__map-frame:hover iframe{filter:none}
/* Вариант C (db_patch 2026-08-11-03): заголовок и строка-адрес из колонки карты
   удалены (адрес переехал в поле Address колонки Contacts) — карта занимает всю
   высоту ряда: верх на строке заголовков соседних колонок, низ по низу самой
   высокой. Колонки ряда равновысоки (flex stretch), поэтому height:100% честный. */
@media (min-width:992px){
  .footer__map{height:100%;display:flex;flex-direction:column}
  .footer__map-frame{flex:1 1 auto;aspect-ratio:auto;height:auto;max-height:none;min-height:220px}
}
@media (prefers-reduced-motion:reduce){
  .footer__map-frame iframe{transition:none}
}

/* ==========================================================================
   Footer v3: типографическая система (Asana 1217311613993627, итерация 3).
   Разметка — db_patch 2026-08-11-02-footer-redesign.sql (маркер footer__field);
   заголовки/ссылки — наследие итерации 2 (db_patch 2026-08-11-01).

   Шкала (Montserrat везде, как на главной; вариант C = гибрид A+B, выбор
   пользователя по мокапу _mockup/footer-v3-C.html, db_patch 2026-08-11-03):
     h4 колонки 20/800/-.02em + divider 48×3
     подпись поля 12/700 CAPS .08em rgba(255,255,255,.55)
     значение поля 16/600 БЕЛОЕ; ссылки в покое белые, на hover — волна шапки
     адрес (некликабельный) — 15/400 #cecece, 1:1 как абзацы About
     body 15/1.6 #cecece · legal 13/1.6 rgba(255,255,255,.5) · bottom 13 #9a9a9a центр
   Композиция контакта: чип 30×30 (рецепт .agent-contacts .mdi, строка ~1199) +
   стек «подпись/значение».

   Почему стили здесь, а не в /uploads/files_css/style.css, где живёт остальной
   футер: uploads — docker volume вне git, такая правка не доедет на dev/prod.
   Тот же файл грузится ПОСЛЕ custom.css, поэтому каждое правило ниже обязано
   выигрывать по СПЕЦИФИЧНОСТИ, а не по порядку — вес указан у каждого случая.
   ========================================================================== */

.footer{
  /* easing шапки, не `--ease` из :root: требование — «те же анимации, что в
     шапке», а там кривая другая (`.rd-navbar-top-panel`, строка ~1408) */
  --ea-ease:cubic-bezier(0.32,0.72,0,1);
}

/* Весь футер — бренд-Montserrat: тема даёт `.footer` Roboto 15/1.43 (0,1,0) и
   грузится ПОЗЖЕ → нужен вес (0,1,1). line-height 1.6 — 1.43 тесен для 15px. */
footer.footer{
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  line-height:1.6;
}

/* Ритм зоны: 48 сверху / 32 снизу (8px-шкала; тема даёт 40/20, 0,1,0). */
/* Верх футера — тот же шаг ритма, что у секций: фиксированные 48px делали последний
   стык страницы 112px вместо 128 (замер 14.08). Низ (32px) — конец страницы, не стык. */
.footer .footer__middle{padding:var(--sec-y) 0 32px}

/* --- Заголовки колонок ------------------------------------------------------
   Язык `.ea-title` главной (Montserrat 800, трекинг -.02em, sentence-case),
   но масштаб 20px вместо clamp(26,42): колонка `col-md-3` при контейнере
   1170px — это ~262px, и 26px+ заголовок «Contacts» в весе 800 съедал бы
   строку целиком. 20px — минимум, на котором вес 800 и отрицательный трекинг
   читаются как дисплейная типографика, а не как «жирный подзаголовок»
   (было: 16px bold uppercase, `/uploads/files_css/style.css:209`).

   Специфичность (0,2,1) против (0,1,1) у темы. */
.footer .footer__box h4{
  /* тема даёт h1-h6 Roboto — Montserrat объявляем явно, как в `.ea-title` */
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  font-size:20px;line-height:1.2;font-weight:800;letter-spacing:-.02em;
  text-transform:none;color:#fff;margin:0 0 20px;   /* заголовок→контент 20 (8px-шкала) */
}
/* Подчёркивание = `.ea-divider` главной. Псевдоэлементом, а не отдельным <hr>:
   так канон приезжает на все три колонки без правки разметки в БД.
   Прижат влево (`.ea-divider` центрирован) — колонки футера левовыровненные,
   центрированная полоска повисла бы посреди пустоты. Ширина 48px вместо 64:
   пропорция к кеглю сохраняется, и на 48px градиент успевает показать все три
   стопа, а на пересчитанных «по формуле» ~30px читался бы одним пятном. */
.footer .footer__box h4::after{
  content:"";display:block;
  width:48px;height:3px;margin-top:12px;
  border-radius:var(--r-pill);
  background:linear-gradient(90deg,var(--brand-red),var(--brand-orange) 55%,var(--brand-yellow));
}

/* --- Ссылки: бренд-оранжевый + волна перекраски ------------------------------
   Рецепт скопирован у контактов шапки (`.rd-navbar-top-panel .contact-info a`,
   выше в этом файле) — те же стопы градиента, та же длительность и задержка.
   Отличие одно: волну запускает ховер САМОЙ ссылки, а не родителя — в футере
   нет обёртки-`<span>`, аналогичной шапке.

   Область: только текстовые ссылки — телефон и e-mail (они лежат в `<p>`) и
   пара ссылок в `<noindex>`. Соцсети и баннеры — `<a>` с `<img>`, им
   background-clip:text не нужен и сломал бы вид.

   Глобальный цвет ссылок задан в `/uploads/files_css/style.css:270` правилом
   `a,...{color:#F26921}` (0,0,1; до 28.08.2026 там был синий #458bca) — здесь
   (0,2,3) и (0,2,0), перебивается с запасом. Лист живёт в uploads и ВНЕ git:
   при расследовании «откуда цвет» grep по репозиторию его не найдёт. */
.footer__contact li p a,
.footer .analytics-contract-link{
  /* Вариант C: покой БЕЛЫЙ (интерактивное отделено от текста весом/цветом),
     бренд-градиент приходит волной только на hover. Вес ссылки контактов
     наследуется от .footer__field-value (600); legal-ссылкам — 700 ниже. */
  color:#fff;
  text-decoration:none;
  transition:color .2s var(--ea-ease);
}
.footer .analytics-contract-link{font-weight:700}
/* Fallback без background-clip: просто перекраска в оранжевый. */
.footer__contact li p a:hover,
.footer__contact li p a:focus-visible,
.footer .analytics-contract-link:hover,
.footer .analytics-contract-link:focus-visible{color:var(--brand-orange)}
/* Тема масштабирует ЛЮБУЮ ссылку контактов (`.footer__contact li a:hover`,
   0,2,2 — задумано для иконок соцсетей). На тексте это спорит с волной, гасим
   селектором (0,2,3); картинкам увеличение остаётся. */
.footer__contact li p a:hover{transform:none}

@supports ((-webkit-background-clip:text) or (background-clip:text)){
  /* `@supports` обязателен: `-webkit-text-fill-color:transparent` без рабочего
     background-clip сделает ссылки невидимыми. */
  .footer__contact li p a,
  .footer .analytics-contract-link{
    background-image:linear-gradient(90deg,
      var(--brand-red) 0%,
      var(--brand-orange) 34%,
      var(--brand-yellow) 49%,
      #fff 51%);   /* стоп 51% = БЕЛЫЙ покой (вариант C); волна и тайминги — как в шапке */
    background-size:200% 100%;
    background-repeat:no-repeat;
    background-position:100% 0;
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    transition:background-position .45s var(--ea-ease) .12s;
  }
  .footer__contact li p a:hover,
  .footer__contact li p a:focus-visible,
  .footer .analytics-contract-link:hover,
  .footer .analytics-contract-link:focus-visible{background-position:0 0}
}

/* --- Полоска-подчёркивание по ховеру ----------------------------------------
   Тот же элемент, что под пунктами меню и контактами шапки: градиент
   #ffa200→#ff7e00, 2px, отступ 4px, раскрытие от центра за .3s. */
.footer__contact li p a,
.footer .analytics-contract-link{position:relative;display:inline-block}
.footer__contact li p a::after,
.footer .analytics-contract-link::after{
  content:'';
  position:absolute;
  top:100%;left:50%;
  width:0;height:2px;
  margin-top:4px;
  background:linear-gradient(90deg,#ffa200 0,#ff7e00 100%);
  transition:.3s all ease;
}
.footer__contact li p a:hover::after,
.footer__contact li p a:focus-visible::after,
.footer .analytics-contract-link:hover::after,
.footer .analytics-contract-link:focus-visible::after{left:0;width:100%}

@media (prefers-reduced-motion:reduce){
  .footer__contact li p a,
  .footer__contact li p a::after,
  .footer .analytics-contract-link,
  .footer .analytics-contract-link::after{transition:none}
}

/* --- Колонка «Contacts»: содержимое в одну вертикаль с заголовком ------------
   Причина рассогласования — НЕ `text-align`. Замер computed-стилей на живой
   странице: у всей цепочки предков `text-align:left` (`.footer` его и ставит),
   а содержимое всё равно уезжало вправо от заголовка:
     h4          left 0
     <strong>    left 40   (UA-дефолт `ul{padding-inline-start:40px}`)
     <p>         left 50   (те же 40 + `margin-left:10px` темы)
     .social-link left 40
   Тема гасит маркеры списка (`.footer ol,.footer ul,.footer li{list-style:none}`),
   но паддинг браузера не обнуляет, а её `.footer__contact{padding:0!important}`
   висит на ОБЁРТКЕ-div, не на `ul`. Короткий текст в колонке 387px при отступе
   40-50px и читается как центрированный.

   `.footer .footer__contact li p` — (0,2,2): у темы `.footer__contact li p`
   ровно (0,1,2) и грузится ПОСЛЕ, ничьей допускать нельзя. */
.footer__contact ul{padding-left:0;margin:0}
.footer .footer__contact li p{margin-left:0}

/* --- Колонка About: ритм абзацев и карточка лого банка -----------------------
   Абзацы темы шли с margin 18px сверху и снизу — двойные зазоры; 0 0 12px даёт
   ровный ритм. <br> перед лого гасим — отступ задаёт .footer__bank. */
.footer .footer__about p{margin:0 0 12px}
.footer__about br{display:none}
.footer__bank{
  display:inline-block;background:#fff;padding:10px 14px;margin-top:12px;
  border-radius:var(--r-sm);line-height:0;
}
.footer__bank img{display:block}

/* --- Поля контактов: чип-иконка + стек «подпись/значение» --------------------
   Рецепт чипа = .agent-contacts .mdi (карточки агентов, ~1199) — единый
   компонент проекта. Подпись и значение разведены на 2+ ступени шкалы
   (12/700 CAPS приглушённая vs 16/700 контрастная) — раньше оба были 15/700
   и различались только цветом. */
/* Вариант C: чип вертикально по центру пары «подпись/значение» (фидбек 11.08). */
.footer__field{display:flex;align-items:center;gap:12px}
.footer__field-icon{
  flex:0 0 30px;width:30px;height:30px;border-radius:var(--r-sm);
  display:grid;place-items:center;
  color:var(--brand-orange);background:rgba(242,105,33,.12);
}
.footer__field-icon .fa{font-size:14px;line-height:1}
.footer__field-body{min-width:0}
.footer .footer__field-label{
  display:block;margin:0 0 3px;
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:rgba(255,255,255,.55);
}
/* (0,3,0) — перебивает и `.footer__contact li p` темы (0,1,2), и наши же
   выравнивания выше. 16px, не 17: e-mail в колонке col-md-3 при контейнере
   1170px имеет 262px контента — 17/700 Montserrat выходит за край. */
.footer .footer__contact .footer__field-value{
  margin:0;font-size:16px;font-weight:600;line-height:1.4;
  color:#fff;overflow-wrap:anywhere;
}
/* Некликабельное значение (адрес, db_patch 2026-08-11-03): 15/400/1.6 как
   About-текст, но белый — решение пользователя 12.08 (был #cecece «как About»,
   от ссылок адрес по-прежнему отличает вес 400 против 600). */
.footer .footer__contact .footer__field-value--plain{
  color:#fff;font-size:15px;font-weight:400;line-height:1.6;
}

/* --- Legal-зона: realting-баннер + noindex-дисклеймер ------------------------
   Разметка — db_patch 2026-08-11-02 (обёртка .footer__legal). Hairline сверху
   отделяет юридический хвост от колонок; сам текст — 13px, приглушённый
   (rgba .5 на #2c2c2c ≈ 4.6:1 — AA для мелкого текста на грани, но текст
   вспомогательный и дублируется ссылками-акцентами). */
.footer .footer__legal{
  display:flex;align-items:center;gap:12px 24px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.10);
  margin-top:32px;padding-top:20px;
}
.footer .footer__legal noindex{
  display:block;flex:1 1 46ch;
  font-size:13px;line-height:1.6;color:rgba(255,255,255,.5);
}
.footer__legal a img{display:block}
/* <br>-хвост перед legal-зоной остался в теле блока (якорный вырез патча
   начинается с баннера) — гасим на уровне контейнера. */
.footer .footer__middle > .container > br{display:none}

/* --- Bottom bar --------------------------------------------------------------
   #727272 темы на составном фоне ≈#1f1f1f = 3.4:1 (ниже AA); #9a9a9a = 5.8:1.
   Вариант C: копирайт по центру (фидбек 11.08). */
.footer .footer__bottom{font-size:13px;color:#9a9a9a;padding:16px 0;text-align:center}
/* Мобильные тап-таргеты: строка ссылки 22px → padding 11px даёт ≥44px. */
@media (max-width:991px){
  .footer__contact li p a{padding:11px 0}
}

/* --- Сетка футера: классы col-md-N снова управляют шириной -------------------
   Диагноз (замер 2026-08-11): /uploads/estateal/style.css?v=2.2 грузится
   ПОСЛЕДНИМ и даёт ВСЕМ `.col-*` `width:100%` (0,1,0) — ширины
   `.col-md-4{33.33%}`/`.col-md-3{25%}` из files_css (та же специфичность, но
   раньше) обнуляются. Ряд при этом flex (BS4-база estateal) с
   `flex-wrap:nowrap` (@≥1000, files_css) → три item'а с basis 100% ужимаются
   flex-shrink ПОРОВНУ: col-md-4 и col-md-3 оба выходили 416.67px, а замена
   класса на col-md-2 не меняла НИЧЕГО.
   Фикс: явная карта долей N/12 на flex-basis с весом (0,3,0) — бьёт estateal
   (0,1,0) независимо от порядка файлов. flex-wrap:wrap возвращён с весом
   (0,4,0) поверх nowrap темы (0,3,0): сумма классов >12 переносится на новую
   строку, как в Bootstrap, а не сжимает соседей. float:left темы во flex
   игнорируется. Ниже 992px — стек (basis 100%), как и раньше. */
.footer .footer__middle .row[class]{display:flex;flex-wrap:wrap}
.footer .row > [class*="col-"]{flex:0 0 100%;max-width:100%;margin-bottom:36px}
.footer .row > [class*="col-"]:last-child{margin-bottom:0}
@media (min-width:992px){
  .footer .row > [class*="col-"]{margin-bottom:0}
  .footer .row > .col-md-1{flex-basis:8.3333%;max-width:8.3333%}
  .footer .row > .col-md-2{flex-basis:16.6667%;max-width:16.6667%}
  .footer .row > .col-md-3{flex-basis:25%;max-width:25%}
  .footer .row > .col-md-4{flex-basis:33.3333%;max-width:33.3333%}
  .footer .row > .col-md-5{flex-basis:41.6667%;max-width:41.6667%}
  .footer .row > .col-md-6{flex-basis:50%;max-width:50%}
  .footer .row > .col-md-7{flex-basis:58.3333%;max-width:58.3333%}
  .footer .row > .col-md-8{flex-basis:66.6667%;max-width:66.6667%}
  .footer .row > .col-md-9{flex-basis:75%;max-width:75%}
  .footer .row > .col-md-10{flex-basis:83.3333%;max-width:83.3333%}
  .footer .row > .col-md-11{flex-basis:91.6667%;max-width:91.6667%}
  .footer .row > .col-md-12{flex-basis:100%;max-width:100%}
}
/* ==========================================================================
   Home reviews — светлая лента (мокап .planning/mockups/reviews/variant-D-light-marquee.html).
   Шапка/кнопки/обводка/тени — канон .ea-* выше, свои аналоги не вводятся:
   .ea-head/.ea-eyebrow/.ea-title/.ea-divider (840-854), .ea-btn--ghost (873-883),
   @property --ea-sweep + .ea-draw-border (939-970), токены :root (779-803).
   ========================================================================== */
.ea-reviews{
  position:relative;isolation:isolate;overflow:clip;
  background:var(--page);
  --card-w:clamp(300px,27vw,380px);
  --card-gap:20px;
  --speed-a:64s;
  --speed-b:78s;
}
.rv-stream{
  position:relative;
  /* маска по альфе: карточки вплывают/растворяются, а не обрубаются краем */
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 9%,#000 91%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0,#000 9%,#000 91%,transparent 100%);
}
/* Ряд — обычный скролл-контейнер: уехавший отзыв возвращается колесом, тачпадом,
   свайпом и перетаскиванием (движение ведёт home_cards.js через scrollLeft).
   overflow-y:hidden обязателен рядом с auto-x, поэтому запас под тень задаётся padding'ом.
   Нижняя тень карточки уходит на offset+blur+spread = 22+26-12 = 36px, верхняя — на
   26-22-12 < 0, т.е. вверх не выходит: отсюда асимметрия 8px / 40px.
   Отрицательный margin снизу возвращает прежний просвет между рядами: было 14+14=28px,
   стало 40-20+8=28px — запас под тень вырос, раскладка не поехала. */
.rv-row{
  overflow-x:auto;overflow-y:hidden;
  overscroll-behavior-x:contain;   /* тяга за край ряда не листает страницу/историю */
  scrollbar-width:none;-ms-overflow-style:none;
  padding-block:8px 40px;margin-block-end:-20px;
  cursor:grab;
}
.rv-row::-webkit-scrollbar{width:0;height:0}
.rv-row.is-drag{cursor:grabbing;user-select:none}
/* Пока страница едет, ряд не hit-target: иначе карточки проезжают под неподвижным
   курсором, по очереди ловят `:hover`, лента встаёт и каждая подскакивает на 4px
   (home_cards.js, конец файла — там же замеры и снятые гипотезы). */
.rv-stream.is-scrolling .rv-row{pointer-events:none}
.rv-track{
  display:flex;width:max-content;will-change:transform;
  animation:rv-scroll var(--speed-a) linear infinite;
}
.rv-row--b .rv-track{animation-name:rv-scroll-rev;animation-duration:var(--speed-b)}
/* Ровно -50% возможно потому, что зазор задан margin-inline-end КАРТОЧКИ, а не gap
   контейнера: иначе половина трека содержала бы лишний зазор и стык «дёргал». */
@keyframes rv-scroll    {from{transform:translate3d(0,0,0)}    to{transform:translate3d(-50%,0,0)}}
@keyframes rv-scroll-rev{from{transform:translate3d(-50%,0,0)} to{transform:translate3d(0,0,0)}}
.rv-row:hover .rv-track,
.rv-row:focus-within .rv-track{animation-play-state:paused}
/* Скрипт взял ряд на себя — CSS-анимация трека выключается, иначе движение двоится.
   Без скрипта класса нет и лента едет по-старому. */
.rv-row.is-live .rv-track{animation:none}

.rv-card{
  position:relative;flex:0 0 auto;
  width:var(--card-w);margin-inline-end:var(--card-gap);
  padding:24px 24px 22px;border-radius:var(--r-lg);
  background:var(--surface);color:var(--ink);
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  display:flex;flex-direction:column;gap:14px;
  box-shadow:
    0 2px 3px rgba(30,30,30,.16),
    0 8px 10px -2px rgba(30,30,30,.18),
    0 22px 26px -12px rgba(30,30,30,.30);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), --ea-sweep .9s var(--ease) .1s;
}
/* нейтральное кольцо: на белом бренд-обводка стартует «из ничего» */
.rv-card::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 0 0 1px var(--hair);
}
.rv-card:hover{
  transform:translateY(-4px);
  box-shadow:
    0 2px 3px rgba(30,30,30,.18),
    0 10px 13px -2px rgba(30,30,30,.20),
    0 30px 34px -14px rgba(30,30,30,.34);
}
.rv-card:focus-visible{outline:3px solid rgba(242,105,33,.8);outline-offset:3px}

.rv-quote{
  position:relative;margin:0;padding-top:2px;
  font-size:15.5px;line-height:1.62;font-weight:400;color:var(--ink);
  /* поток читается только если карточки одной высоты (тексты в БД 150-828 символов) */
  display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;
  /* многоязычные отзывы (RU/PL/SQ/IT) — длинное слово не должно распирать карточку */
  overflow-wrap:anywhere;
}
.rv-quote::before{
  /* литеральный символ + пустой alt: декор не попадает в a11y-дерево карточки */
  content:"\201C" / "";
  /* Носитель — .rv-quote с overflow:hidden (line-clamp), поэтому глиф обязан
     целиком лежать ВНУТРИ её бокса: прежние right:-4px/top:-22px обрезались
     краем клемпа, от кавычки оставались только нижние хвостики. На /reviews
     тот же декор цел, потому что висит на карточке, а не на клемпнутом тексте. */
  position:absolute;right:0;top:0;z-index:-1;
  font-size:74px;line-height:1;font-weight:800;color:var(--brand-orange);opacity:.16;
  pointer-events:none;
}
.rv-who{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:4px}
img.rv-avatar{flex:0 0 auto;width:44px;height:44px;border-radius:var(--r-pill);object-fit:cover}
.rv-who__text{min-width:0}
.rv-name{margin:0;font-size:14px;font-weight:700;line-height:1.3;color:var(--ink)}
.rv-meta{margin:3px 0 0;font-size:12px;line-height:1.35;color:var(--ink-60)}

.rv-foot{
  display:flex;flex-wrap:wrap;justify-content:center;gap:16px;
  margin-top:clamp(28px,4vw,42px);
}
/* Канонная рамка --brand-orange остаётся, ТЕКСТ затемнён: #F26921 на белом = 3.08:1,
   а кегль кнопки 13px/700 — не large text, нужен AA 4.5:1. #C4470D даёт 4.94:1;
   заливка hover тем же тоном — белое по нему 4.94:1 (по #F26921 было бы 3.08:1). */
.rv-cta{color:#C4470D}
.rv-cta:focus{color:#C4470D}
.rv-cta:hover{background:#C4470D;color:#fff}

.rv-sr{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}

@media (max-width:767px){
  .ea-reviews{
    --card-w:clamp(248px,82vw,300px);
    --card-gap:14px;
    --speed-a:46s;               /* уже трек — та же линейная скорость требует меньшей длительности */
    --speed-b:56s;
  }
  .rv-card{padding:20px 18px 18px}
  .rv-quote{font-size:15px;-webkit-line-clamp:6}
  .rv-foot .ea-btn{width:100%}
  .rv-stream{
    -webkit-mask-image:linear-gradient(to right,transparent 0,#000 5%,#000 95%,transparent 100%);
    mask-image:linear-gradient(to right,transparent 0,#000 5%,#000 95%,transparent 100%);
  }
}

/* HARD: непрерывное движение — барьер доступности. Ленты останавливаются полностью,
   ряд превращается в обычный горизонтальный скролл со snap-точками. */
@media (prefers-reduced-motion: reduce){
  .rv-track{animation:none !important;transform:none !important}
  /* прокрутка ряда уже нативная — здесь только фиксация по карточкам */
  .rv-row{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .rv-card{scroll-snap-align:start}
  .rv-card,.rv-card::after,.rv-foot .ea-btn{transition:none !important}
}

/* ==========================================================================
   Бренд-скроллбар документа (весь публичный сайт).
   Таргет — именно `html`, а не `*`: у темы есть локальные скроллы со своими
   правилами (`.rv-row` скрыт, custom.css:2073; `.ea-body` и
   `.ea-obj-gallery-thumbs` тонкие, map_filter.css:81,294) — универсальный
   селектор перебил бы их.

   ДВЕ ВЕТКИ ДВИЖКОВ, и смешивать их нельзя: стандартный `scrollbar-color` на
   элементе ПОЛНОСТЬЮ подавляет `::-webkit-scrollbar*` в Blink. Поэтому
   `scrollbar-color`/`scrollbar-width` живут только внутри FF-ветки.

   Поведение нативное: индикатора прогресса нет (правка по возврату пользователя
   «чтоб не заливался оранжевым насколько прокручен»), `track-piece` правил не
   получает, ползунок ровно той высоты, что считает движок. Из геометрии задана
   только ширина — 9px против дефолтных 15px по просьбе «поуже»: контент шире на
   6px, fixed/sticky прижаты к краю вьюпорта и от толщины полосы не зависят. */

/* ЗАКРЫТО 15.08: переливать ползунок по глубине прокрутки в Blink НЕЛЬЗЯ. Проверено тремя
   зондами: (1) анимация двух `@property` типа `<color>` на `html` гоняет computed-значения
   верно (0% → 50% → 100% дают rgb(247,146,30)/(245,126,32)/(242,105,33)), а пиксели ползунка
   не меняются — max разница по каналу 1, отрисован `initial-value`; (2) инлайновые
   `--sb-top:#00FF00` на `html` при снятой анимации до ползунка тоже не доходят; (3) правило
   `background-image` с `!important`, внедрённое ПОСЛЕ загрузки, игнорируется даже после
   ресайза, но то же правило на document-start красит полосу (зелёно-синий градиент).
   Вывод: `::-webkit-scrollbar-thumb` разрешает стиль один раз и не инвалидируется ни
   анимацией, ни правкой переменных, ни новыми правилами. JS-фолбэк в rAF отпадает по (2).
   Цена неудачной попытки была не нулевой: `inherits:true` заставлял каждый кадр скролла
   инвалидировать унаследованное свойство на всём поддереве — median кадра 133 мс против 50 мс
   без анимации. Динамика полосы возможна только оверлеем поверх скрытого нативного скроллбара
   — это отдельное решение с потерей нативного поведения, в эту задачу не входит. */
@media (hover:hover) and (pointer:fine){
  /* Тач-устройства исключены: там нативный overlay-скроллбар, а любая
     webkit-стилизация превращает его в постоянно видимую полосу, отъедающую
     ширину экрана. */

  html::-webkit-scrollbar{width:9px}    /* уже дефолтных 15px; правило обязано существовать — без него Blink не применяет стилизацию thumb */
  html::-webkit-scrollbar-track{background:var(--page-2)}
  html::-webkit-scrollbar-thumb{
    border-radius:var(--r-pill);
    background-image:linear-gradient(180deg,var(--brand-yellow),var(--brand-orange),var(--brand-red));
  }
  html::-webkit-scrollbar-corner{background:var(--page-2)}

  /* Firefox-ветка. Гейт `-moz-appearance` замерен: Chrome 149 → false (webkit-блок
     выше остаётся живым), Firefox 128 ESR → true. Градиента в `scrollbar-color` в FF
     нет — деградация в сплошной бренд-красный, он же доминирует в webkit-градиенте.
     `thin` вместо `auto` — паритет с сузившимся webkit-жёлобом; произвольного px в
     FF нет, `thin` — единственная узкая ступень. */
  @supports (-moz-appearance:none){
    html{scrollbar-width:thin;scrollbar-color:var(--brand-red) var(--page-2)}
    /* `scrollbar-color` НАСЛЕДУЕТСЯ, и красный с html уезжал во все вложенные
       скроллеры без своего цвета (select2-выдача, список стран intl-tel-input,
       textarea писем, оверлей magnific-popup). Гасим наследование одной строкой:
       специфичность 0,0,1 — собственные правила тем (`.ea-body`, `.rv-row`,
       `.ea-obj-gallery-thumbs`) её перебивают и остаются целы. Поимённый список
       виджетов не заводим — он протухнет на следующем. */
    body *{scrollbar-color:auto}
  }
}

/* ==========================================================================
   Легенда значка «Agent of the month» — страница команды (/users/users/).
   Объясняет значок `.agent-flag` (флаг `users.best_worker`) с карточек выше,
   поэтому медаль здесь рендерится ТЕМИ ЖЕ правилами, что на карточке
   (`object-fit:contain` + тот же `drop-shadow`, ср. `.agent-flag img` выше):
   образец в легенде обязан выглядеть ровно как то, что читатель уже видел
   в сетке, иначе он его не опознает.

   Разметка живёт в CMS-блоке `blocks.id=76` (патч 2026-08-28-06), а не во
   вьюхе: `Plugin/Users/Users/index.ctp` при непустом регионе не исполняется.
   ========================================================================== */
.ea-badge-note{
  /* тело этой страницы — Lato; стек задаём явно, как у .agent-card выше */
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  /* .content страницы центрирует текст — абзац легенды от этого шёл по центру
     рваными строками, а медаль оставалась слева с провалом посередине */
  text-align:left;
  position:relative;overflow:hidden;
  display:flex;align-items:center;gap:clamp(16px,2.4vw,26px);
  /* панель уже сетки: это сноска к списку, а не ещё одна секция */
  max-width:720px;margin:40px auto 0;
  padding:clamp(20px,3vw,28px);
  padding-left:calc(clamp(20px,3vw,28px) + 4px);   /* запас под рейку ::before */
  background:var(--surface);border:1px solid var(--hair);
  border-radius:var(--r-lg);box-shadow:var(--shadow-1);
}
.ea-badge-note *,.ea-badge-note *::before,.ea-badge-note *::after{box-sizing:border-box}
/* единственный акцент секции — рейка тем же градиентом, что у .ea-divider.
   top/bottom отступ + скруглённый правый край обязательны: во всю высоту рейку
   срезали скруглённые углы панели (--r-lg), и остаток читался отдельной полоской
   СНАРУЖИ карточки, а не её краем. */
.ea-badge-note::before{
  content:"";position:absolute;left:0;top:14px;bottom:14px;width:4px;
  border-radius:0 var(--r-pill) var(--r-pill) 0;
  background:linear-gradient(180deg,var(--brand-red),var(--brand-orange) 55%,var(--brand-yellow));
}
.ea-badge-note__mark{flex:0 0 auto;display:block;width:88px;height:88px}
.ea-badge-note__mark img{display:block;width:100%;height:100%;object-fit:contain;
  filter:drop-shadow(0 4px 10px rgba(30,30,30,.35))}
.ea-badge-note__body{min-width:0}
/* Строка-подводка над заголовком. Своё правило, а НЕ канонный `.ea-eyebrow`:
   тот красный и uppercase, а красный в этой секции носит сам заголовок —
   два брендовых акцента подряд перебивали бы друг друга. Регистр предложения
   (не uppercase): фраза из четырёх слов с трекингом .18em растягивается почти
   во всю строку и начинает спорить с заголовком, ради которого её и убрали. */
.ea-badge-note__kicker{
  display:block;font-size:11px;line-height:1.5;font-weight:700;letter-spacing:.04em;
  color:var(--ink);
}
.ea-badge-note__title{
  font-family:inherit;margin:6px 0 0;
  font-size:clamp(19px,2.2vw,24px);line-height:1.2;font-weight:800;letter-spacing:-.01em;
  color:var(--brand-red);text-transform:none;   /* тема ставит заголовкам capitalize */
}
.ea-badge-note__text{
  margin:10px 0 0;max-width:56ch;
  font-size:15px;font-weight:400;line-height:1.6;color:var(--ink-60);
  text-wrap:pretty;   /* два предложения — без висячего слова в последней строке */
}
@media (max-width:575px){
  .ea-badge-note{flex-direction:column;align-items:flex-start;gap:16px}
  .ea-badge-note__mark{width:72px;height:72px}
}


/* ==========================================================================
   PAGE /page/for-investors (.ea-home.mkC) — медиа-насыщенный разбор страницы
   для инвесторов. Скоуп .mkC: префикс .ea- в теме занят дважды (custom.css и
   map_filter.css), поэтому собственные узлы страницы носят свой префикс, а
   общие примитивы (.ea-shell, .ea-head, .ea-eyebrow, .ea-draw-border,
   .quick-item, .agent-card) берутся из канона выше — они же дают брендовое
   кольцо и наклон за курсором.
   ========================================================================== */

/* Заголовок страницы («For investors», h1 темы) остаётся над плашками — шаг до
   первой из них берём тот же, что между блоками внутри секции (30px). */
/* Страница выводится БЕЗ обёртки темы (section-98 > .shell): иначе фон секций
   обрезался по 1200px, а section-bottom-66 оставлял белую полосу перед футером.
   Собственных отступов у обёртки НЕТ — вертикальный ритм держат сами секции
   (padding-block: --sec-y у каждой), поэтому крайние секции лежат фоном
   вплотную к шапке и к футеру, без белых полос. */
/* Заголовок страницы = первая eyebrow-строка (единственный h1). Тема даёт h1 45px —
   гасим, вид остаётся eyebrow-рубрикой. */
.mkC h1.ea-eyebrow{font-size:11px;line-height:1.5;font-weight:700;margin:0}

/* main.page-content темы центрирует текст (раньше это гасила обёртка
   `<section ... text-left>`, которую страница больше не использует). Мокап
   рисовался в голом body, то есть с левым равнением по умолчанию — возвращаем
   его; центр там, где макет ставит его явно: .ea-head, лиды, карточки. */
.ea-home.mkC{text-align:left}

/* Контейнер страницы = тот же, что у шапки и футера темы: .container
   (750/970/1170/1250 + 15px паддинги, style.css темы). Мокап жил на .ea-shell
   (1200/16px), и на живой странице это давало левый край 132px против 106px
   у логотипа и колонок футера — весь контент стоял на 26px правее шапки. */
.mkC .ea-shell{max-width:none;width:100%;padding-inline:15px}
@media (min-width:768px) {.mkC .ea-shell{width:750px}}
@media (min-width:992px) {.mkC .ea-shell{width:970px}}
@media (min-width:1200px){.mkC .ea-shell{width:1170px}}
@media (min-width:1280px){.mkC .ea-shell{width:1250px}}

/* ==========================================================================
   МОКАП C — MEDIA-RICH. Скоуп `.mkC` (префикс `.ea-` в теме занят дважды:
   custom.css и map_filter.css). Всё, что можно, взято классами из custom.css:
   .ea-shell .ea-head .ea-eyebrow .ea-title .ea-divider .ea-btn .ea-draw-border.
   Обёртка `.ea-home` обязательна: .ea-title/.ea-head/ритм секций живут под ней
   (custom.css:853,1344,1375).
   ========================================================================== */

/* Ритм фонов главной: белый <-> #F4F5F7 <-> фото со скримом. Белых панелей-обёрток
   вокруг секций на главной НЕТ — белое законно только у карточки в сетке на НЕ-белом фоне. */
.mkC-s--page{background:var(--page)}

/* Канон п.15: шрифт объявляем ЯВНО — тема отдаёт Roboto/Lato 15px/300 */
.mkC,
/* :not(.mdi) обязателен — без него `.mkC span` (0,1,1) перебивает `.mdi` (0,1,0)
   из style.css темы, и все иконки Material Design Icons рисуются квадратами-тофу */
.mkC :is(h2,h3,h4,p,li,a,div,span,strong,b):not(.mdi){
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
}
.mkC{font-size:16px;font-weight:400;line-height:1.5;color:var(--ink);}
.mkC *,.mkC *::before,.mkC *::after{box-sizing:border-box}
.mkC p{margin:0 0 14px}
.mkC p:last-child{margin-bottom:0}
.mkC h3,.mkC h4{text-transform:none;letter-spacing:-.01em;margin:0}
.mkC a{color:#C4470D}            /* канон п.13: оранжевый ТЕКСТ на белом = #C4470D (4.94:1) */
.mkC a:hover,.mkC a:focus{color:#A5390A}
.mkC ul{margin:0;padding:0;list-style:none}

/* Тёплые тени — канон п.2 (страница с фото) */
.mkC{--w-rest:0 1px 2px rgba(120,72,40,.06);
     --w-lift:0 18px 44px rgba(120,72,40,.18);
     --w-focus:0 0 0 4px rgba(242,105,33,.14);}

/* ---------- плоская плашка секции (канон п.11: белый фон + --r-lg, без обводки и тени) */
/* Плашки как поверхности больше нет — контент лежит на холсте секции.
   Класс остался только носителем container-type: @container опрашивает ПРЕДКА,
   self-query не работает (иначе ряд остаётся 1fr и owl-стейдж в 5612px распирает колонку). */
.mkC-plate{container-type:inline-size}

/* ---------- шапка секции: .ea-head/.ea-eyebrow/.ea-title/.ea-divider из темы */
.mkC .ea-title{max-width:26ch;margin-inline:auto;text-wrap:balance}
.mkC .ea-title--wide{max-width:32ch}
/* Длинный заголовок (about-us: 14 слов) при мере 26/32ch ломается на три строки
   и оставляет пустые поля по бокам — здесь мера снимается, строка идёт по контейнеру. */
.mkC .ea-title--full{max-width:none}
.mkC h2,.mkC h3,.mkC h4{text-wrap:balance}
.mkC p,.mkC li{text-wrap:pretty}
/* мера набора: длинная строка — главная причина «рваного» текста */
.mkC-city p,.mkC-city .mkC-bul li,.mkC-mini p{max-width:62ch}
.mkC .mkC-lead{max-width:62ch;margin:16px auto 0;text-align:center;color:var(--ink-60);font-size:17px}

/* ---------- носитель кольца .ea-draw-border ------------------------------
   Канон п.5+п.6: свой border-radius, position:relative, isolation:isolate,
   и `--ea-sweep` ПЕРВЫМ пунктом в transition (иначе дефект №3 — кольцо
   появляется мгновенно). Своей полоски сверху НЕТ. */
/* Носитель наклона за курсором: класс .agent-card ловит home_cards.js (eaTilt('.agent-card')),
   он же приносит --rx/--ry/--sx/--sy, transform и transition c --ea-sweep первым.
   Свой transform здесь НЕ задаём — он бы перебил углы скрипта. */
.mkC-card{isolation:isolate;border-radius:var(--r-lg)}
/* тени тонированы в тёплый, направление ведут те же --sx/--sy, что и у карточек агентов */
.mkC .mkC-card{box-shadow:
    0 1px 2px rgba(120,72,40,.10),
    calc(var(--sx,0px) * .4) calc(8px + var(--sy,0px) * .4) 12px -2px rgba(120,72,40,.16),
    var(--sx,0px) calc(20px + var(--sy,0px)) 30px -6px rgba(120,72,40,.22)}
.mkC .mkC-card:hover{--lift:-4px}
.mkC-card:has(:focus-visible){--ea-sweep:360deg;--lift:-4px}
.mkC-card :focus-visible{outline:3px solid rgba(242,105,33,.55);outline-offset:3px;border-radius:var(--r-sm)}

/* ---------- фото (канон п.8): все 4 угла, overflow:clip, aspect-ratio, cover */
.mkC-shot{display:block;position:relative;overflow:clip;border-radius:var(--r-lg);
  background:var(--page-2);aspect-ratio:16/10}
.mkC-shot figure{margin:0;position:absolute;inset:0}
.mkC-shot img{display:block;width:100%;height:100%;object-fit:cover}
.mkC-shot .mkC-zoom{
  position:absolute;right:12px;bottom:12px;z-index:2;
  display:grid;place-items:center;width:44px;height:44px;border-radius:var(--r-pill);
  background:rgba(20,20,22,.55);color:#fff;font-size:20px;
  opacity:0;transform:translateY(6px);transition:opacity .3s var(--ease),transform .3s var(--ease);
}
.mkC-shot:hover .mkC-zoom,.mkC-shot:focus-visible .mkC-zoom{opacity:1;transform:none}
.mkC-shot:focus-visible{outline:3px solid rgba(242,105,33,.55);outline-offset:3px}

/* ======================= 1. ПЕРВЫЙ ЭКРАН (дефект №1) =====================
   Выше по странице уже идёт слайдер темы, поэтому первый блок — БЕЗ фото:
   типографика + бренд-разделитель + счётчики. Фото начинаются со второй секции. */
.mkC-intro .mkC-plate{text-align:center}
.mkC-intro h2{font-size:clamp(28px,5.4vw,44px);line-height:1.1;font-weight:800;
  letter-spacing:-.022em;margin:8px 0 0;text-transform:none}
/* Проза добирает высоту правой колонки интервалом между абзацами, а не кеглем:
   размер и интерлиньяж остаются проектными, меняется только распределение. */
.mkC-intro .mkC-body{
  margin:0;text-align:left;
  display:flex;flex-direction:column;justify-content:space-between;gap:16px;
}
.mkC-intro .mkC-body > p{margin:0}
/* две колонки: слева проза, справа метрики. Колонки тянутся на равную высоту,
   абзацы и карточки распределяются по ней, поэтому низ обеих колонок совпадает.
   Ширины равные: правую держат четыре карточки-метрики 2×2.
   No max-width here: at full plate width a column is ~580px ~= 62ch (the same count
   that dropped the measure for .mkC-art); 1000px left a 193px card, too narrow for
   long-word locales ("12 миллионов" = 213px). */
.mkC-intro__cols{
  display:grid;gap:var(--gap);margin:30px auto 0;
  align-items:stretch;text-align:left;
}
@container (min-width:720px){
  .mkC-intro__cols{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:calc(var(--gap)*2)}
}
/* ---- Метрики первого экрана -------------------------------------------------
   ⚠️ Четыре карточки СОЗНАТЕЛЬНО повторяют фразы, живущие ниже по странице
   (секция «два моря» и карточка Tourism, абзац географии) — так первый экран
   выглядел в макапе, повтор согласован с пользователем 30.08. Правило «текст
   страницы 1:1 с исходником» для for-investors с этого момента допускает эти
   +30 слов; оригинальных слов патч не трогает. Разметка — патч -19. */
.mkC .mkC-metrics{
  display:grid;gap:12px;margin:0;text-align:left;align-content:space-between;
}
/* В двухколоночном интро метрики идут 2×2: четыре карточки подряд делали правую
   колонку заметно выше левой. */
@container (min-width:720px){
  .mkC-intro__cols .mkC-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* Карточка-метрика: три уровня по вертикали — уточнение, значение, подпись.
   Одной строкой («more than 15 million guests are expected in 2026») крупная
   цифра рвала фразу посередине. */
.mkC-metrics li{
  position:relative;display:grid;gap:2px;align-content:start;
  grid-template-columns:minmax(0,1fr);container-type:inline-size;
  padding:16px 18px;border-radius:var(--r-md);
  background:var(--page);box-shadow:inset 0 0 0 1px var(--hair);
  transition:--ea-sweep var(--ea-sweep-dur,.52s) var(--ea-sweep-ease,cubic-bezier(.32,.72,0,1)) var(--ea-sweep-delay,.1s),
             box-shadow .38s var(--ease), transform .38s var(--ease);
}
.mkC-metrics li:hover{
  transform:translateY(-3px);
  box-shadow:inset 0 0 0 1px transparent, 0 2px 3px rgba(120,72,40,.14), 0 14px 22px -10px rgba(120,72,40,.26);
}
/* Card-relative size: at 768 the 2x2 card is 126px wide and a single unbreakable
   word ("миллионов" = 177px at 30px) cannot wrap out of the overflow. */
.mkC-metrics b{font-variant-numeric:tabular-nums;font-weight:800;font-size:clamp(20px,15cqi,30px);
  line-height:1.1;letter-spacing:-.03em;color:#C4470D}
.mkC-metric__pre{font-size:13px;line-height:1.35;font-weight:600;color:var(--ink-40)}
.mkC-metric__lbl{font-size:15px;line-height:1.45;color:var(--ink-60)}
/* Первая буква карточки — прописная. Носители блокифицированы (дети grid-контейнера),
   поэтому ::first-letter к ним применяется. Второй селектор — для карточки, что
   открывается числом: там первым текстом идёт подпись под ним. Регистр правим
   показом, текст страницы остаётся дословным. */
.mkC-metrics li > :first-child::first-letter,
.mkC-metrics li > b:first-child + .mkC-metric__lbl::first-letter{text-transform:uppercase}
/* ======================= 2. ДВА МОРЯ (дефект №2) =========================
   Вместо «капелек» — полноценные фото-карточки с брендовой прорисовкой кольца. */
.mkC-row{display:grid;gap:var(--gap);grid-template-columns:minmax(0,1fr)}
/* Контейнер = content-box плашки: на 1440px это ~1088px, поэтому пороги ряда
   берём от ШИРИНЫ РЯДА (канон: @container, не @media), а не от ширины окна.
   Порядок правил важен: более широкое условие идёт ПОСЛЕДНИМ — при совпадении обоих выигрывает оно. */
@container (min-width:560px){.mkC-row--2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (min-width:560px){.mkC-row--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (min-width:860px){.mkC-row--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container (min-width:520px){.mkC-row--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (min-width:900px){.mkC-row--4{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* Фото сняты: по кадру нельзя доказать, какое из двух морей на нём — карточка
   держится на типографике. */
.mkC-sea{overflow:clip;display:flex;flex-direction:column;
  background:linear-gradient(135deg,rgba(190,21,27,.05),rgba(242,105,33,.09)),var(--surface)}
.mkC-sea__b{padding:calc(var(--pad) * 1.6) var(--pad);display:flex;align-items:center;
  justify-content:space-between;gap:14px}
.mkC-sea__n{font-size:clamp(24px,3.4cqi,30px);font-weight:800;letter-spacing:-.03em}
.mkC-sea__i{display:grid;place-items:center;width:52px;height:52px;border-radius:var(--r-pill);
  background:linear-gradient(135deg,var(--brand-red),var(--brand-orange));color:#fff;font-size:24px;flex:none}
.mkC .mkC-note{margin:30px auto 0;text-align:center;font-size:17px;color:var(--ink-60);max-width:62ch}

/* ======================= 3. ЭКОНОМИКА (дефект №3) ========================
   Кольцо ОТРИСОВЫВАЕТСЯ (--ea-sweep первым в transition), своей полоски сверху НЕТ. */
.mkC-ind{padding:var(--pad);display:flex;flex-direction:column;gap:14px}
.mkC-ind p{font-size:15px;color:var(--ink-60);margin:0}
/* Регистр правим показом, а не текстом: исходная формулировка страницы остаётся дословной. */
.mkC-ind p::first-letter{text-transform:uppercase}
/* Шапка карточки: иконка и заголовок на одной линии, описание — ниже во всю ширину.
   Высота иконки равна ДВУМ строкам заголовка (16px × 1.375 × 2 = 44px), поэтому
   «Medical tourism:» в две строки ровно совпадает с иконкой по высоте. */
.mkC-ind__hd{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:end}
.mkC-ind__t{margin:0;font-size:16px;line-height:1.375;font-weight:800;color:var(--ink);
  letter-spacing:-.01em;text-transform:none}
.mkC-ind__i{display:grid;place-items:center;width:44px;height:44px;border-radius:var(--r-sm);
  background:linear-gradient(135deg,rgba(190,21,27,.10),rgba(247,146,30,.16));color:#C4470D;font-size:22px}


/* ======================= 4. ЦЕНЫ (дефект №4) =============================
   Грид «подпись → значение», tabular-nums, разделение hairline (канон п.12,14). */
.mkC .mkC-pr{margin:0}
.mkC-pr li{display:grid;grid-template-columns:1fr auto;align-items:stretch;gap:4px 24px;
  border-top:1px solid var(--hair);padding-top:16px;margin-top:16px}
/* Ячейка подписи тянется на высоту строки (её задаёт цена), текст внутри по центру —
   верхняя и нижняя кромки колонок сходятся. Ячейку цены flex'ом НЕ трогаем: её `€`
   должно оставаться в одной строке с числом, а не становиться отдельным flex-элементом. */
.mkC-pr li > .k{display:flex;flex-direction:column;justify-content:center}
.mkC-pr li:first-child{border-top:0;padding-top:0;margin-top:0}
/* Две строки подписи (18 × 1.45 = 52px) равны высоте ячейки цены (значение 30px +
   единица 18px + отбивка 4px = 53px) — верхняя и нижняя кромки колонок сходятся.
   Правило общее на ОБА блока цен (эта секция и Тирана): они консистентны. */
.mkC-pr .k{font-weight:700;font-size:18px;line-height:1.45}
/* Регистр правим показом, а не текстом — формулировка страницы остаётся дословной.
   ::first-letter требует блочный контейнер, а .k — flex, поэтому носитель — .kt. */
.mkC-pr .k .kt::first-letter{text-transform:uppercase}
.mkC-pr .v{font-variant-numeric:tabular-nums;font-weight:700;font-size:clamp(22px,3.4vw,30px);
  line-height:1.02;letter-spacing:-.028em;color:var(--ink);white-space:nowrap;text-align:right}
.mkC-pr .v small{font-size:.46em;font-weight:600;opacity:.68;letter-spacing:0;white-space:nowrap}
/* Валюта держится за числом, хвост-единица уезжает строкой ниже: «450 €» / «per square meter». */
.mkC-pr .v .u{display:block;margin-top:4px;line-height:1.3}
@media (max-width:520px){.mkC-pr li{grid-template-columns:1fr}}
.mkC-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px;justify-content:center}
.mkC-chip{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 18px;
  border-radius:var(--r-pill);background:var(--surface);color:var(--ink);font-size:14px;font-weight:600;
  box-shadow:inset 0 0 0 1.5px rgba(242,105,33,.45)}
.mkC-chip .mdi{color:#C4470D;font-size:16px;width:1.15em;text-align:center}

/* ======================= 5. ГОРОДА — ГЛАВНАЯ СЕКЦИЯ (дефекты №5, №6) =====
   Слайдер Owl + PhotoSwipe и карта Google. Секция ПЛОСКАЯ: ни кольца, ни подъёма
   на полноширинных блоках (история e62d5e4c/6ed43dfc). */
.mkC-city{display:grid;gap:var(--gap);grid-template-columns:minmax(0,1fr);
  align-items:stretch;padding-top:30px;margin-top:30px;border-top:1px solid var(--hair)}
.mkC-city:first-of-type{border-top:0;padding-top:0;margin-top:0}
@container (min-width:860px){
  .mkC-city{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:calc(var(--gap) * 1.6)}
  .mkC-city--rev .mkC-city__m{order:2}
  .mkC-city--wide{grid-template-columns:minmax(0,1fr)}
  /* Текстовая колонка добирает высоту фото распределением, а не кеглем: заголовок по
     верхней кромке снимка, последний пункт списка — по нижней. Собственные margin
     детей обнуляем, иначе они складываются с распределением и зазоры разъезжаются. */
  .mkC-city:not(.mkC-city--wide) > :not(.mkC-city__m){
    display:flex;flex-direction:column;justify-content:space-between;gap:12px}
  .mkC-city:not(.mkC-city--wide) > :not(.mkC-city__m) > *{margin-block:0}
}
/* один регистр для ВСЕХ подзаголовков внутри секций */
.mkC-h3c{text-align:center}
/* .mkC-art .mkC-mapside h3 — тот же подзаголовок карточки, но тегом h3:
   на /page/about-us секции набраны h2, и h4 в карточке контактов дал бы
   пропуск уровня h2 -> h4. Селектор добавлен в этот же список, а не
   продублирован блоком: метрика подзаголовка одна на все карточки.
   Соседей не задевает — .mkC-mapside есть только у about-us (.mkC-art)
   и for-investors (без .mkC-art, под скоуп не попадает). */
.mkC-city__t,.mkC-schem h3,.mkC-mini h4,.mkC-art .mkC-mapside h3,.mkC-h3c{
  font-size:21px;font-weight:800;letter-spacing:-.02em;line-height:1.25;margin:0 0 12px}
.mkC-city ul.mkC-bul{margin-top:12px}
.mkC-bul li{position:relative;padding-left:20px;margin-top:10px;font-size:15px;color:var(--ink-60)}
.mkC-bul li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:8px;border-radius:50%;
  background:linear-gradient(135deg,var(--brand-red),var(--brand-orange))}
.mkC-bul li b{color:var(--ink)}
/* Пункты перечней в блоке ВНЖ/услуг открываются прописной (регистр правим показом,
   текст остаётся дословным). В остальных списках это перечисления-ярлыки. */
.mkC-misc .mkC-bul li::first-letter{text-transform:uppercase}

/* --- Owl: нав темы (.owl-carousel-classic) — белые треугольники, вылетающие
   за контейнер и невидимые на тач. Рисуем свою: круглые 44px, всегда видны. --- */
.mkC-slider{position:relative;border-radius:var(--r-lg);overflow:clip;min-width:0;width:100%}
.mkC-owl{border-radius:inherit;min-width:0}
.mkC-slider .owl-nav{position:absolute;inset:0;pointer-events:none}
.mkC-slider .owl-prev,.mkC-slider .owl-next{
  pointer-events:auto;position:absolute;top:50%;transform:translateY(-50%);
  display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:var(--r-pill);
  background:rgba(255,255,255,.92);color:var(--ink);font-size:26px;cursor:pointer;
  box-shadow:0 6px 18px rgba(120,72,40,.22);
  transition:background-color .25s var(--ease),color .25s var(--ease),transform .25s var(--ease);
}
.mkC-slider .owl-prev{left:12px}
.mkC-slider .owl-next{right:12px}
.mkC-slider .owl-prev:hover,.mkC-slider .owl-next:hover{background:var(--brand-orange);color:#fff}
.mkC-slider .owl-prev:focus-visible,.mkC-slider .owl-next:focus-visible{
  outline:3px solid rgba(242,105,33,.75);outline-offset:3px}
/* точки тонули на светлых кадрах — сажаем группу на тёмную таблетку (как лента отзывов) */
.mkC-slider .owl-dots{position:absolute;left:50%;transform:translateX(-50%);bottom:12px;
  display:flex;justify-content:center;gap:4px;padding:0 6px;height:26px;align-items:center;
  border-radius:var(--r-pill);background:rgba(20,20,22,.55);backdrop-filter:blur(6px)}
.mkC-slider .owl-dot{width:26px;height:26px;border:0;background:none;padding:0;cursor:pointer;
  display:grid;place-items:center}
.mkC-slider .owl-dot span{display:block;width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.6);transition:.25s var(--ease)}
.mkC-slider .owl-dot.active span{width:26px;border-radius:var(--r-pill);background:var(--brand-orange)}
.mkC-slider .mkC-shot{border-radius:0;aspect-ratio:16/10}
.mkC-slider--solo{aspect-ratio:16/10}
.mkC-slider--solo .mkC-shot{border-radius:var(--r-lg)}

/* --- Карта локаций --- */
.mkC-map{height:clamp(320px,40vw,440px);border-radius:var(--r-lg);overflow:clip;background:var(--page-2)}
.mkC-mapwrap{display:grid;gap:var(--gap);grid-template-columns:minmax(0,1fr);
  margin-top:30px;padding-top:30px;border-top:1px solid var(--hair)}
@container (min-width:860px){.mkC-mapwrap{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}}
/* Карточки регионов держат верхнюю и нижнюю кромку карты: на ПК колонка равна её
   высоте, обе карточки одной высоты (1fr), содержимое внутри распределено. */
.mkC-mapside{display:grid;gap:var(--gap);align-content:stretch;grid-auto-rows:1fr}
.mkC-mapside .mkC-mini{display:flex;flex-direction:column;justify-content:space-between;gap:12px}
.mkC-mapside .mkC-mini > *{margin-block:0}
@container (max-width:859px){
  .mkC-mapside{align-content:start;grid-auto-rows:auto}
  .mkC-mapside .mkC-mini{justify-content:flex-start}
}
.mkC-mini{padding:var(--pad)}
.mkC-mini .mkC-shot{border-radius:var(--r-lg) var(--r-lg) 0 0;aspect-ratio:16/9;margin:calc(var(--pad) * -1) calc(var(--pad) * -1) var(--pad)}

.mkC-mini p{font-size:15px;color:var(--ink-60)}
/* Имя проекта и его пояснение — две строки: тире-разделитель заменил перенос.
   Пояснение набирается легче заголовка, но крупнее описания под ним. */
.mkC-mini__sub{margin:-8px 0 0;font-size:16px;font-weight:600;color:var(--ink-40);line-height:1.35}
.mkC-mini__sub::first-letter{text-transform:uppercase}

/* ======= 6. ЕДИНСТВЕННАЯ тёмная секция: ФОТО ПОД ГРАДИЕНТОМ (как .ea-quick) */
/* Секция на фото своего padding НЕ имеет — иначе вокруг картинки белая полоса.
   Для .rd-parallax это делает сама тема (custom.css:1363), отступ несёт внутренний контейнер. */
.mkC-px-inner{padding-block:calc(var(--sec-y) * 2)}
.mkC .ea-quick,.mkC .context-dark{color:#fff}
/* Оверлей НЕ дублируем: .ea-quick::before темы (custom.css:934) уже кладёт градиент,
   второй слой сверху только глушит фото. Добираем читаемость обводкой самого текста. */
.mkC .ea-quick .ea-title,.mkC .ea-quick .ea-eyebrow,.mkC .ea-quick p,.mkC .ea-quick h5{
  -webkit-text-stroke:.5px rgba(24,12,5,.42);paint-order:stroke fill;
  text-shadow:0 1px 2px rgba(0,0,0,.45), 0 2px 12px rgba(0,0,0,.35)}
.mkC .ea-quick p,.mkC .context-dark p,
.mkC .ea-quick .mkC-note,.mkC .context-dark .mkC-note{color:rgba(255,255,255,.88)}
.mkC .context-dark p,.mkC .ea-quick p{font-size:17px;line-height:1.6}
.mkC .ea-quick .mkC-lead{color:rgba(255,255,255,.86)}
.mkC .quick-item h5{font-family:"Montserrat",Helvetica,Arial,sans-serif}
.mkC .quick-item .mdi{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;
  background:linear-gradient(135deg,var(--brand-red),var(--brand-orange));color:#fff;font-size:30px;
  box-shadow:0 12px 26px -10px rgba(190,21,27,.75)}

/* ======================= 7. КОНТАКТЫ (дефект №7) =========================
   Без фонового изображения: светлая плашка + плитки с брендовой прорисовкой. */
.mkC-ct{padding:var(--pad);display:flex;gap:14px;align-items:flex-start;text-decoration:none;color:inherit}
.mkC-ct:hover,.mkC-ct:focus{text-decoration:none;color:inherit}
.mkC-ct__i{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:var(--r-sm);
  background:linear-gradient(135deg,rgba(190,21,27,.10),rgba(242,105,33,.16));color:#C4470D;font-size:22px}
.mkC-ct__k{display:block;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-40)}
.mkC-ct__v{display:block;font-size:16px;font-weight:700;margin-top:3px;overflow-wrap:break-word}
.mkC-ct__x{display:block;font-size:12px;font-weight:600;color:var(--ink-40);margin-top:4px}

/* ---------- видео: facade (постер вместо плеера) -------------------------
   При загрузке страницы уходит ОДИН ленивый запрос за превью; плеер YouTube
   (~1.5 МБ скриптов и куки) подключается только после клика.
   Скрим на ::before — ::after занят кольцом .ea-draw-border. */
.mkC-video{margin:var(--sec-y) 0 0}
.mkC-video__frame{position:relative;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;
  background:#1E1E1E;transition:box-shadow .38s var(--ease),transform .38s var(--ease)}
.mkC-video__frame:hover{transform:translateY(-3px);
  box-shadow:0 2px 3px rgba(120,72,40,.14),0 18px 30px -12px rgba(120,72,40,.34)}
.mkC-video__frame > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.mkC-video__frame::before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(30,30,30,.10) 38%,rgba(30,30,30,.52))}
.mkC-video__btn{position:absolute;inset:0;z-index:2;width:100%;border:0;background:none;padding:0;
  display:grid;place-items:center;align-content:center;gap:14px;cursor:pointer}
.mkC-video__play{display:grid;place-items:center;width:74px;height:74px;border-radius:50%;
  background:linear-gradient(135deg,var(--brand-red),var(--brand-orange));color:#fff;font-size:38px;
  box-shadow:0 12px 26px -10px rgba(190,21,27,.75);transition:transform .38s var(--ease)}
.mkC-video__btn:hover .mkC-video__play,
.mkC-video__btn:focus-visible .mkC-video__play{transform:scale(1.08)}
.mkC-video__cap{color:#fff;font-size:16px;font-weight:700;letter-spacing:-.01em;
  text-shadow:0 1px 14px rgba(0,0,0,.55)}
.mkC-video__frame > iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:3}

/* ---------- схематичные секции (обозначены, не сверстаны целиком) -------- */
.mkC-schem{display:grid;gap:calc(var(--gap) * 1.4);grid-template-columns:minmax(0,1fr)}
@container (min-width:685px){
  .mkC-schem--2{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* Колонки географии добирают высоту друг друга распределением: заголовок по верхней
     кромке, замыкающий абзац — по нижней. Только здесь: в .mkC-misc внутри колонки два
     подраздела, и обнуление margin слило бы их в один. */
  .mkC-geo .mkC-schem--2 > *{display:flex;flex-direction:column;justify-content:space-between;gap:14px}
  .mkC-geo .mkC-schem--2 > * > *{margin-block:0}
}

.mkC-schem p{font-size:15px;color:var(--ink-60)}
.mkC-schem .mkC-bul li{color:var(--ink-60)}

/* ---------- /page/about-us: карточка-цифра и девиз основателя -------------
   Оба узла живут в тех же рядах .mkC-row, что и остальные карточки страницы. */
.mkC-stat{display:grid;gap:6px;align-content:center;justify-items:center;text-align:center;padding:28px 24px}
.mkC-stat b{font-variant-numeric:tabular-nums;font-weight:800;font-size:34px;line-height:1.1;
  letter-spacing:-.03em;color:#C4470D;white-space:nowrap}
.mkC-stat span{font-size:16px;line-height:1.4;color:var(--ink-60)}
/* Девиз на фото-секции: цвета там задаёт .ea-head--dark, поэтому здесь только ритм и кегль. */
.mkC-quote{margin:30px auto 0;max-width:62ch;text-align:center}
.mkC-quote__k{margin:0 0 12px;font-size:11px;line-height:1.5;letter-spacing:.18em;text-transform:uppercase;
  color:var(--brand-yellow)}
.mkC-quote blockquote{margin:0;padding:0;border:0;font-size:22px;line-height:1.45;font-weight:600}
.mkC-quote__a{margin:12px 0 0;font-size:15px;opacity:.85}
/* Колонка рядом с картой тянет карточки в высоту карты и разносит их содержимое
   (space-between) — это нужно там, где текста много (инвесторы). Где карточка
   короткая (адрес и телефоны на about-us), контент держим сверху. */
.mkC-mapside--top .mkC-mini{justify-content:flex-start}
/* Миссия на about-us: портрет основателя стоит в колонке рядом с текстом, поэтому
   шапка блока живёт в самой колонке и прижата влево (по центру она читалась бы
   как шапка всей секции, а половина ряда занята фото). */
/* Белый заголовок на фото-секции раньше давал только .ea-head--dark; здесь шапка
   живёт в колонке ряда, без .ea-head, поэтому цвет задаём самой тёмной секции. */
.mkC .ea-quick .ea-title{color:#fff}
/* Текстовая колонка лежит на фото: к общему верх-низ оверлею добавляем боковой,
   чтобы левая половина кадра была темнее, а портрет справа оставался светлым. */
.mkC .ea-quick.mkC-mission::before{
  background:linear-gradient(180deg,rgba(20,20,22,.72) 0%,rgba(20,20,22,.58) 45%,rgba(20,20,22,.78) 100%),
             linear-gradient(90deg,rgba(20,20,22,.5) 0 46%,rgba(20,20,22,0) 78%);
}
.mkC-mission .ea-title{max-width:none;margin-inline:0;text-align:left}
.mkC-mission .ea-divider{margin-inline:0}
.mkC-quote--left{margin:0;max-width:none;text-align:left}
/* Телефоны в карточке контактов: подписи «Phone 1/2» заменены иконками, поэтому
   маркеры списка не нужны — их роль играет сама иконка. */
.mkC-tel{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.mkC-tel li{display:flex;align-items:center;gap:10px}
.mkC-tel__i{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:var(--r-sm);
  background:linear-gradient(135deg,rgba(190,21,27,.10),rgba(242,105,33,.16));color:#C4470D;font-size:18px}
/* Снимок без PhotoSwipe: ни курсора-указателя, ни подсказки зума. */
.mkC-shot--static{cursor:default}

/* ---------- вертикальный ритм страниц .mkC (about-us, for-investors) -------
   Один шаг на ВСЕ секции, включая фото-секции .ea-quick, которым канон главной
   даёт двойной. На длинной текстовой странице разнобой 48/96 читался как «часть
   секций сжата»; здесь ритм один и не зависит от брейкпоинта — величина живёт
   в --mkc-sec-y, менять её в одном месте. */
.ea-home.mkC{--mkc-sec-y:75px}
.ea-home.mkC > section[class]:not(.elementor-section),
.ea-home.mkC > section.ea-quick[class]:not(.elementor-section){padding-block:var(--mkc-sec-y) !important}

/* ---------- иконка направления в карточке города --------------------------
   Vlora & Saranda / Tirana / Durres: пиктограмма и название — одной строкой,
   описание уходит на свою строку (grid-column: 1/-1). Брендовый оранжевый (#F26921 —
   3.06:1 к белому, порог для графики 3:1). Скоуп через :has — правило берёт
   ровно карточки с иконкой, остальные .mkC-mini (контакты у карты) не трогает. */
.mkC-mini:has(> .mkC-mini__i){display:grid;grid-template-columns:auto 1fr;align-items:center;
  column-gap:12px;row-gap:12px}
.mkC-mini:has(> .mkC-mini__i) > h4,
.mkC-mini:has(> .mkC-mini__i) > p{margin:0}
.mkC-mini:has(> .mkC-mini__i) > p{grid-column:1 / -1}
.mkC-mini__i{font-size:32px;line-height:1;color:var(--brand-orange)}

/* ---------- кнопка канона внутри страниц .mkC ------------------------------
   Общее правило ссылок страницы (.mkC a, 0-2-0) перебивало .ea-btn (0-1-0):
   на красной плашке текст выходил оранжевым, кнопка читалась «оранжевым по
   оранжевому». Селектор ниже (0-2-1) возвращает белый, как в теме. */
.mkC a.ea-btn,.mkC a.ea-btn:hover,.mkC a.ea-btn:focus{color:#fff}

/* ---------- карточка направления: иконка слева, описание справа -----------
   Высота плитки = ДВЕ строки описания (15px × 1.6 × 2 = 48px), поэтому короткий
   пункт в две строки совпадает с иконкой по высоте. Базовая .mkC-ind ставит
   иконку НАД текстом — здесь ряд. */
.mkC-ind.mkC-ind--row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px}
.mkC-ind--row .mkC-ind__hd{display:block}
.mkC-ind--row .mkC-ind__i{width:48px;height:48px;font-size:24px}

/* ---------- карточка направления: длинный текст — иконка СВЕРХУ по центру ---
   Парный случай к .mkC-ind--row. Ряд работает, пока описание умещается в 2-3
   строки: иконка и текст читаются одной строкой. На описании в 4-7 строк
   (about-us, ряд направлений) иконка слева повисает у первой строки, а под ней
   остаётся пустая колонка в 48px на всю высоту абзаца — поэтому там иконка
   остаётся НАД текстом. Но базовая .mkC-ind прижимает её к левому краю, и рядом
   с --row-соседями по странице это читается как разнобой; здесь иконка идёт по
   центру, а вместе с ней центрируется и текст (центрованная иконка над текстом
   по левому краю — вид ошибки вёрстки, а не решения).
   Размер плитки — следующая ступень той же шкалы канона: 44 (база) → 48 (--row)
   → 52, и 52×52 уже есть в каноне у .mkC-sea__i; глиф держит то же отношение
   плитка/глиф = 2:1, что у обеих предыдущих ступеней (44/22, 48/24 → 52/26). */
.mkC-ind.mkC-ind--stack{text-align:center}
.mkC-ind--stack .mkC-ind__hd{display:flex;justify-content:center}
.mkC-ind--stack .mkC-ind__i{width:52px;height:52px;font-size:26px}

/* ---------- блок с постером: колонка кадра уже ----------------------------
   .mkC-city рассчитан на длинный текст истории основателя; с квадратным
   постером и двумя короткими абзацами кадр вырастал до 600px, а текст занимал
   треть соседней колонки — остальное пустота. */
@container (min-width:860px){
  .mkC-city--poster{grid-template-columns:minmax(0,.42fr) minmax(0,1fr)}
}

/* Вторая фраза заголовка, начинающая новое предложение: заглавная — ПОКАЗОМ,
   текст остаётся дословным (тот же приём, что .mkC-ind p::first-letter).
   ::first-letter работает только на блочном контейнере, поэтому носитель —
   <span style="display:block"> внутри самого заголовка: так обе фразы идут
   ОДНИМ кеглем .ea-title, а не «заголовок + мелкий подзаголовок». */
.mkC-cap{display:block}
.mkC-cap::first-letter{text-transform:uppercase}

/* ---------- страница /page/franchise: ширины заголовков и текста -----------
   Скоуп .mkC-fr — только эта страница; остальные .mkC-страницы (about-us,
   for-investors, job_vacancies) остаются на канонической мере 62ch.

   1) text-wrap:balance ровняет строки заголовка по длине: на коротком h1
      первого экрана это давало 541/731px против 1077/911px у соседних секций —
      один и тот же класс .ea-title--full, а ширина разная. pretty заполняет
      строку по контейнеру, и все заголовки страницы читаются одной шириной.
   2) Мера центрированных абзацев поднята с 62ch (698px при контейнере 1220)
      до 80ch: рядом с заголовками во всю ширину узкая колонка выглядела
      случайной, особенно в нижней секции с заявкой. */
.mkC-fr .ea-title--full{text-wrap:pretty}
.mkC-fr .mkC-lead,.mkC-fr .mkC-note{max-width:80ch}

/* Ссылки внутри фото-секций: .mkC a{color:#C4470D} рассчитан на белый фон и на
   тёмном скриме почти сливается (телефон в заявке франшизы). На тёмном берём
   брендовый жёлтый — тот же, что у кикера .mkC-quote__k. Кнопка исключена: у неё
   собственный фон. */
.mkC .ea-quick a:not(.ea-btn),.mkC .context-dark a:not(.ea-btn){color:var(--brand-yellow)}
.mkC .ea-quick a:not(.ea-btn):hover,.mkC .ea-quick a:not(.ea-btn):focus{color:#fff}

/* Перенос строки внутри заголовка узлом, а не <br>: обе части остаются одним
   кеглем .ea-title и получают собственную строку (у .mkC-cap то же самое плюс
   заглавная первой буквы). */
.mkC-ln{display:block}

/* ---------- .mkC-art: длинная аналитическая статья --------------------------
   Скоуп страниц-статей: /services/podbor, /services/rentinalbania,
   /services/residence_permits_support. Имя было .mkC-pd (одна страница podbor)
   и переименовано 04.09: правила ниже настраивают не «страницу подбора», а
   ПОВЕДЕНИЕ канонных узлов под длинную статью, и второй с третьей странице
   нужны те же. Копия блока под свой скоуп на каждую страницу дала бы три
   расходящиеся редакции одних правил.
   Своих СТИЛЕЙ у этих страниц нет: секционные имена (.mkC-sel, .mkC-law,
   .mkC-geo и прочие) — имена-якоря без единого правила, как в
   investors/franchise. Что настраивается:

   1) МЕРА НАБОРА для левого текста — ДВУМЯ КОЛОНКАМИ, а не одной узкой.
      v1 держал прозу правилом .mkC-pd .mkC-body{max-width:62ch;margin-inline:auto}
      (тогда скоуп ещё звался .mkC-pd):
      мера соблюдалась, но колонка 657px стояла одна посреди .ea-shell 1250px,
      и почти половина ширины уходила в воздух (замер: у /page/for-investors
      10 секций из 11 двухколоночные, у podbor было 6 из 14). Правило СНЯТО —
      и заодно оно било по .mkC-intro .mkC-body (custom.css:2442): та же
      специфичность, но идёт ниже, поэтому margin-inline:auto перебивал
      margin:0 первого экрана. Носитель меры теперь КОЛОНКА: .mkC-intro__cols
      (проза без фото) и .mkC-city (проза рядом с кадром — там мера уже задана
      каноном, .mkC-city p{max-width:62ch}). На полной ширине шелла колонка даёт
      ~580px ≈ те же 62ch; поэтому меры max-width нет ни здесь, ни у инвесторов.
   2) ОДИН ШАГ РИТМА между блоками секции. У .ea-head, .mkC-note, .mkC-chips,
      .mkC-quote свои отбивки по 30px, а у .mkC-row и .mkC-body их нет: ряд
      карточек прилипал к предыдущему абзацу. Соседние margin схлопываются,
      поэтому правило не удваивает уже существующие 30px. */
.mkC-art .mkC-intro__cols{max-width:none}
/* Порог схлопывания — один со .mkC-city (860cq), а не базовые 720cq: на 768px
   плита 720px давала две колонки прозы по 344px (~42 знака в строке), рядом с
   уже одноколоночными фото-рядами это читалось как разнобой. */
@container (max-width:859px){
  .mkC-art .mkC-intro__cols{grid-template-columns:minmax(0,1fr)}
}
/* Колонка прозы — flex-столбец с канонным шагом 16px. justify-content здесь НЕ
   задаём: распределение по высоте (space-between) рассчитано на 11-23 строки,
   как у .mkC-intro .mkC-body первого экрана; при 2-7 строках оно и давало те
   самые «пустоты внутри колонок». Итоговое значение — flex-start, ниже. */
.mkC-art .mkC-intro__cols > .mkC-body{
  display:flex;flex-direction:column;gap:16px}
.mkC-art .mkC-intro__cols > .mkC-body > *{margin-block:0}
/* Чипы внутри колонки идут по левому краю: базовые .mkC-chips центрируются по
   секции, а в колонке центровка читается как случайный отступ. */
.mkC-art .mkC-intro__cols .mkC-chips,
.mkC-art .mkC-city .mkC-chips{justify-content:flex-start;margin-top:0}
/* Широкая полоса кадра (.mkC-city--wide): пропорция задаётся И слайдеру, И кадру.
   .mkC-slider--solo несёт собственные 16/10, поэтому inline-ratio на одном .mkC-shot
   давал 419px картинки внутри контейнера 763px — 344px пустоты под снимком.
   На узких экранах 32/11 вырождается в полоску 129px, поэтому родная пропорция
   файла (1600x550) включается только на десктопной раскладке. */
.mkC-art .mkC-city--wide .mkC-slider,
.mkC-art .mkC-city--wide .mkC-shot{aspect-ratio:16/9}
@container (min-width:860px){
  .mkC-art .mkC-city--wide .mkC-slider,
  .mkC-art .mkC-city--wide .mkC-shot{aspect-ratio:32/11}
}
.mkC-art .mkC-plate > * + *{margin-top:30px}
/* Тот же дефект, что чинил .mkC-fr: text-wrap:balance на коротком h1 первого
   экрана давал ширину 541px против 1077px у заголовков соседних секций. */
.mkC-art .ea-title--full{text-wrap:pretty}
/* Тап-таргет телефона: строка .mkC-tel набрана кеглем 16px и даёт 24px высоты,
   минимум для касания — 44px (замер на 375px: две ссылки tel: по 24px). */
.mkC-art .mkC-tel a{display:flex;align-items:center;min-height:44px;flex:1}

/* ---- v3: ПЛОТНОСТЬ КОЛОНОК /services/podbor -------------------------------
   Возврат пользователя: «очень много пустот между текстами внутри колонок…
   1, 2, 3 строки на колонку, они растягиваются по высоте изображения».
   Замер 1440px (ink = СУММА высот детей колонки / высота колонки; размах
   «верх первого → низ последнего» тут врёт: при space-between он всегда 100%):
   9 колонок из 16 ниже 70%, шесть ниже 50%, худшая 13%. Эталон
   /page/for-investors тем же скриптом — 62–91%. Причины ДВЕ, лечатся раздельно.

   A. РАСПРЕДЕЛЕНИЕ ПО ВЫСОТЕ НА КОРОТКОЙ КОЛОНКЕ. justify-content:space-between
      (канон 2575 у .mkC-city, 2442 у .mkC-intro .mkC-body, парное правило v2
      выше) рассчитан на колонку в 11–23 строки — там он ровняет низ. На колонке
      в 2–4 строки тот же приём разгоняет межабзацный зазор до 128px.
   B. МАТЕРИАЛА НА РЯД МАЛО: ряды карточек и фразы-подписи лежали ПОД рядом во
      всю ширину, пока рядом с кадром стояли два абзаца. Это правит разметка
      (патч 2026-09-03-05), CSS ниже обслуживает перенос. */

/* B1. Ряд карточек, внесённый В текстовую колонку, обязан мерить свои
   @container-пороги (560/860 у --3, 520/900 у --4) по КОЛОНКЕ. container-type
   в проекте объявлен только на .mkC-plate (2389) — без этой строки .mkC-row--4
   в колонке 572px остаётся четырёхколоночным и распирает её. Контекст ставим на
   колонку, а не на сам ряд: self-query у ряда уже ловили — он остаётся 1fr,
   и owl-стейдж в 5612px распирает колонку (комментарий у 2389). */
.mkC-art .mkC-city > :not(.mkC-city__m){container-type:inline-size}
/* Нечётная последняя карточка двухколоночной сетки внутри колонки занимает обе
   колонки: пять карточек назначения иначе дают 2+2+дыру. */
.mkC-art .mkC-city > :not(.mkC-city__m) .mkC-row > :last-child:nth-child(odd){grid-column:1/-1}
/* Подпись .mkC-note, внесённая в колонку, теряет центровку и внешние отбивки:
   ритм внутри колонки задаёт её собственный gap (12px), а не margin ребёнка. */
.mkC-art .mkC-city > :not(.mkC-city__m) .mkC-note{margin:0;text-align:left;max-width:none}

/* A1. Проза БЕЗ кадра выравнивается по верхней кромке: ряд .mkC-intro__cols не
   обязан сводить низ колонок — фотографии, под высоту которой это делалось,
   в нём нет. Замер до/после: 128 → 16px (штатный шаг колонки). */
.mkC-art .mkC-intro__cols{align-items:start}
.mkC-art .mkC-intro__cols > .mkC-body{justify-content:flex-start}

/* A2. КАДР ПОД СОДЕРЖАНИЕ, а не содержание под кадр. Пока высоту ряда задавала
   пропорция 16/10 (375px при тексте в 171px), короткая колонка растягивалась под
   неё, и space-between разгонял межабзацный зазор до 38–49px при штатных 12px.
   Пропорция кадра остаётся, но становится НИЖНИМ ПРЕДЕЛОМ: 5/2 — самая широкая
   полоса, которую страница уже применяет к парному кадру (у .mkC-city--wide
   стоит 32/11). Высоту ряда задаёт текст, кадр её добирает; проценты высоты
   не участвуют в расчёте внутренней высоты ряда, поэтому предел работает:
   ряд = max(текст, 5/2), а height:100% растягивает снимок ровно до этого max.
   Замер после правки: пропорции кадров разошлись на 1.34–2.16 (было у всех
   1.60), зазоры в колонках вернулись к 12–19px, дыр под снимками нет. */
@container (min-width:860px){
  .mkC-art .mkC-city:not(.mkC-city--wide) .mkC-slider--solo{aspect-ratio:5/2;height:100%}
  /* Снимку пропорцию НЕ отдаём: у него height:100%, и при живом aspect-ratio
     ширина считается ОТ высоты (349px → 873px в контейнере 572px). Полоса
     уезжала за правый край и обрезалась `overflow:clip` слайдера — кадр
     оказывался прижат влево вместо центра. Ратио снимаем, размер берём
     от контейнера. */
  .mkC-art .mkC-city:not(.mkC-city--wide) .mkC-slider--solo .mkC-shot{aspect-ratio:auto;height:100%;width:100%}
  /* Карта в медиа-колонке слайдером не является, и правило A2 её не ловит: она
     осталась бы при своей канонной clamp-высоте и оставила дыру под собой в
     высокой колонке. Механика та же — высоту задаёт текст, clamp становится
     нижним пределом. */
  .mkC-art .mkC-city:not(.mkC-city--wide) .mkC-map{height:100%;min-height:clamp(320px,40vw,440px)}
}

/* A3. Opt-in: the shot keeps its natural ratio at every width, nothing is cropped.
   A2 above deliberately crops the other shots of the page, so this is a modifier,
   not a change of A2; it sits after A2 and outside the 860cq query to win both. */
.mkC-art .mkC-city .mkC-slider--solo.mkC-slider--fit{aspect-ratio:auto;height:auto}
.mkC-art .mkC-city .mkC-slider--solo.mkC-slider--fit .mkC-shot{aspect-ratio:auto;height:auto;width:100%}
/* The canon shot puts figure in position:absolute — height then comes from the box,
   not from the image; static figure + height:auto img gives the row the real ratio. */
.mkC-art .mkC-city .mkC-slider--solo.mkC-slider--fit .mkC-shot figure{position:static}
.mkC-art .mkC-city .mkC-slider--solo.mkC-slider--fit .mkC-shot img{height:auto;object-fit:contain}

/* Чипс города, ставший переключателем точки на карте. Отдельного «активного»
   канона в проекте нет — берём собственное кольцо чипса и доводим его до полной
   насыщенности, новых цветов и классов не заводим. Состояние читается по
   aria-pressed, который ставит скрипт: одно состояние на разметку и на глаз. */
.mkC-art .mkC-chip[data-region]{cursor:pointer;transition:box-shadow .2s,color .2s}
.mkC-art .mkC-chip[data-region]:hover,
.mkC-art .mkC-chip[data-region]:focus-visible,
.mkC-art .mkC-chip[data-region][data-hl]{box-shadow:inset 0 0 0 1.5px var(--brand-orange)}
.mkC-art .mkC-chip[data-region][data-hl]{color:#C4470D}
/* Связь двусторонняя: подсветка приходит и от самого носителя, и от маркера карты.
   Вид задаёт ОДИН атрибут data-hl (его ставит mkCRender), и он попадает в те же
   объявления, что и :hover, — «подсвечено с карты» и «наведено мышью» выглядят
   одинаково по построению, а не по совпадению. Карточки регионов на for-investors
   отражают то же состояние своим канонным приёмом: кольцо .ea-draw-border и подъём. */
.mkC [data-region][data-hl]{--ea-sweep:360deg;--lift:-4px}
@media (prefers-reduced-motion:reduce){
  .mkC-art .mkC-chip[data-region]{transition:none}
}

/* ИЕРАРХИЯ — вторая половина возврата («разметкой поиграться, выделять всякие
   элементы текста размерами»). Статья читалась одним кеглем 16px без точек
   входа. Три уровня, ни одного НОВОГО кегля — только ступени канонной шкалы
   42/22/17/16/15/14:
   1) фраза, вводящая перечень (стоит вплотную перед чипами / рядом карточек /
      списком), — это ЛЕЙБЛ набора: вес 700 и полный --ink вместо --ink-60;
   2) лейбл прижимается к своему набору (14px против шага секции 30px) — пара
      «подпись → набор» читается одним блоком, а 30px разделяют разные блоки;
   3) первый абзац колонки у кадра идёт ступенью 17px — тем же кеглем, каким
      канон открывает секцию (.mkC-lead).
   :has() — уже принятая в проекте идиома (канон п.7, фокус на потомке). */
/* .mkC-lead исключён: правило рассчитано на КОРОТКУЮ фразу-подпись перед
   набором, а подводка секции — свой уровень канона (17px, --ink-60). Когда
   первый экран получил сетку карточек, ложное срабатывание набрало его
   подводку жирным чёрным — на живой странице это читалось вторым заголовком. */
.mkC-art p:not(.mkC-lead):has(+ .mkC-chips),
.mkC-art p:not(.mkC-lead):has(+ .mkC-row),
.mkC-art p:not(.mkC-lead):has(+ .mkC-bul){font-weight:700;color:var(--ink)}
.mkC-art .mkC-plate > p:has(+ .mkC-row) + .mkC-row{margin-top:14px}
.mkC-art .mkC-city > :not(.mkC-city__m) > p:first-child{font-size:17px;line-height:1.5}
/* Снимок добирает высоту ряда: проценты высоты не участвуют в расчёте
   внутренней высоты ряда, поэтому ряд = max(текст, нижний предел кадра),
   а height:100% (задан там же, где ratio) растягивает снимок ровно до этого max —
   ни дыры под фото, ни растянутой колонки текста. */
/* Плотность карточки ВНУТРИ колонки — на ступень выше, чем во всю ширину: берём
   базовое значение токена --pad (20px) вместо шага ≥768 (24px) и канонный размер
   .mkC-ind__i (44px) вместо увеличенного у --row (48px). Оба значения — свои же
   токены канона, новых чисел нет. Без этого ряд карточек в колонке тянул кадр
   до 529px при ширине 572 (панорама 5602×2784 обрезалась почти в квадрат). */
.mkC-art .mkC-city > :not(.mkC-city__m) .mkC-ind{--pad:20px}
.mkC-art .mkC-city > :not(.mkC-city__m) .mkC-ind--row .mkC-ind__i{width:44px;height:44px;font-size:22px}

/* КОНТАКТЫ /services/podbor: четыре карточки ряда читались двумя разными
   раскладками. Телефоны — строками «иконка + номер» (текст с 28px от верха
   карточки), а e-mail / сайт / адрес — «иконка сверху, текст снизу» (текст
   с 86px), причём значение e-mail уходило ещё на 21px ниже из-за кикера
   «e-mail:». Отсюда и разнобой по высоте, который видно глазом. Причина —
   коллизия канона, не этой правки: у .mkC-ct стоит display:flex;gap:14px в
   расчёте на строку, но .mkC-card перебивает направление на column. Приводим
   все четыре к раскладке телефонов: ряд «иконка + текст», содержимое по
   центру карточки — тексты соседних карточек встают на одну высоту при любой
   длине. Ниже 560cq ряд всё равно схлопывается в одну колонку. */
.mkC-art .mkC-contact .mkC-ct{display:grid;grid-template-columns:auto minmax(0,1fr);
  align-items:start;align-content:start}
/* Текстовая ячейка получает ту же полосу 44px, что и плашка иконки: одна
   строка встаёт по центру полосы (оптически вровень с глифом), несколько —
   начинаются с её верхней кромки и растут вниз. Без этого центрирование пары
   уводило иконку вниз ровно настолько, насколько длиннее текст: 28px у сайта
   против 54px у адреса — разнобой, который и видно глазом. */
.mkC-art .mkC-contact .mkC-ct > :not(.mkC-ct__i){min-height:44px;display:flex;
  flex-direction:column;justify-content:center}
.mkC-art .mkC-contact .mkC-mini{justify-content:flex-start}
/* Единая колонка иконок на все четыре карточки: у телефонов плашка 34px и
   отбивка 10px, у остальных 44px и 14px — из-за этого текст начинался на
   72px в одной карточке и на 86px в трёх соседних. Выравниваем по канонному
   размеру .mkC-ct__i. */
.mkC-art .mkC-contact .mkC-tel__i{width:44px;height:44px;font-size:22px}
.mkC-art .mkC-contact .mkC-tel li{gap:14px}

/* ССЫЛКА-ЗАГОЛОВОК КАРТОЧКИ АДРЕСА КАК ТАП-ТАРГЕТ (/page/about-us). В карточке
   контактов заголовок «EstateAll Office» — внешняя ссылка на Google Maps, а не
   ярлык: набранная кеглем подзаголовка карточки (21px) она даёт 25px высоты при минимуме
   касания 44px (замер на 1440 и на 375). Канон лечит это ровно так же в двух
   местах — ссылка телефона (.mkC-art .mkC-tel a, выше) и чип-ссылка
   (.mkC-rp a.mkC-chip, ниже); третьей редакции приёма не заводим, берём ту же
   пару свойств. inline-flex, а не flex: клик остаётся по тексту заголовка,
   растёт только высота полосы. */
.mkC-art .mkC-mapside h3 a{display:inline-flex;align-items:center;min-height:44px}

/* ПЕРВЫЙ ЭКРАН /services/podbor — по возврату пользователя: «сухой текст
   встречает на странице, а все красивое внизу», и следом, по первой попытке:
   «просто картинка, которая ничего не продаёт и никому не нужна». Второй
   возврат снял с повестки полосу кадра: оформлять надо САМ контент, а не
   ставить перед ним обои.
   Пять абзацев прозы переведены в карточки .mkC-ind--row — ровно тем приёмом,
   которым уже набраны секции 6/9/11/12/13 этой же страницы и второй столбец
   первого экрана эталонного /page/for-investors. Здесь остаётся единственное,
   чего нет в базовых правилах ряда: пятая карточка одна в двухколоночной
   сетке и без растяжения оставляет дыру. Правило-близнец уже действует внутри
   колонок .mkC-city (см. блок B1 выше) — тот же приём в скоупе первого
   экрана.
   Скоуп сужен до .mkC-row--2 (04.09): в ТРЁХколоночном ряду третья карточка —
   тоже nth-child(odd), и правило растягивало её на всю ширину, ломая ровный
   ряд 3×1 (первый экран /services/rentinalbania). У podbor ряд первого экрана
   — .mkC-row--2 (5 карточек), его поведение не меняется. */
.mkC-art .mkC-intro .mkC-row--2 > :last-child:nth-child(odd){grid-column:1/-1}

/* ---- v4: СМЫСЛОВЫЕ РАЗРЫВЫ СЕКЦИЙ (патч 2026-09-03-10) -------------------
   Возврат пользователя: «are used to the format of full-service resort
   complexes. находится в одной секции а вот Such projects include: уже
   сделали заголовком другой секции, что лишает смысла тексты».
   Причина — колонка .mkC-intro__cols разрезала тройку «связка -> её набор ->
   хвост фразы»; патч -10 снял колонки в секциях 3 и 7, и страница вернулась к
   линейному порядку оригинала. CSS ниже обслуживает этот перенос — двумя
   правилами, оба продолжают уже принятые на странице приёмы. */

/* 1. МЕРА СПИСКА НА УРОВНЕ ПЛИТЫ. Вне колонки <ul class="mkC-bul"> не имеет
   собственной меры и растягивался на все 1220px плиты, начинаясь с её левого
   края (x=106) против x=367 у соседней прозы — рассинхрон в 261px. 62ch
   считаем от кегля .mkC-note (17px), а не от 15px самого пункта: так мера
   списка совпадает с мерой прозы вокруг ровно, без магических чисел. */
.mkC-art .mkC-plate > .mkC-bul{max-width:62ch;font-size:17px;margin-inline:auto}

/* 2. ТРОЙКА «СВЯЗКА -> НАБОР -> ХВОСТ ФРАЗЫ» — ОДИН БЛОК. Шаг секции 30px
   между её элементами разносил части одной мысли на три самостоятельных
   блока: связка читалась заголовком, а хвост, который список разрывает
   («are used to the format…», «today the state…»), — началом новой мысли.
   Патч -05 уже прижимал так ряд карточек (p:has(+ .mkC-row) + .mkC-row,
   14px); линейный порядок вывел на уровень плиты ещё чипсы, маркированный
   список и сам хвост. 30px остаются РАЗДЕЛИТЕЛЕМ блоков, 14px — связью
   внутри блока. */
.mkC-art .mkC-plate > p:has(+ .mkC-chips) + .mkC-chips,
.mkC-art .mkC-plate > p:has(+ .mkC-bul) + .mkC-bul,
.mkC-art .mkC-plate > .mkC-chips + p,
.mkC-art .mkC-plate > .mkC-bul + p{margin-top:14px}

/* ---- v5: /services/rentinalbania (патч 2026-09-04-03) ---------------------
   Два правила, оба продолжают уже принятые на .mkC-art приёмы. */

/* 1. ФРАЗА-ЛЕЙБЛ ПЕРЕД НАБОРОМ НА ФОТО-СЕКЦИИ. Правило иерархии выше (3070-)
   задаёт такой подписи color:var(--ink) и по специфичности (0,3,1) бьёт
   .mkC .ea-quick p (0,2,1) — тёмный текст ложился на кадр («Our partners
   AlbaniAll Travel provide tenant support:» перед чипсами). Вес лейбла
   сохраняем, цвет возвращаем канонный белый тёмной секции.
   Селекторы ЗЕРКАЛЯТ правило иерархии узел-в-узел, а не красят все абзацы
   секции: иначе светлая плита на .ea-quick в будущем получит белым по белому.
   Литерал rgba(255,255,255,.88) — не хардкод «из головы», а дословный канон
   тёмной секции (custom.css:2656); белого токена в проекте нет. */
.mkC-art .ea-quick p:not(.mkC-lead):has(+ .mkC-chips),
.mkC-art .ea-quick p:not(.mkC-lead):has(+ .mkC-row),
.mkC-art .ea-quick p:not(.mkC-lead):has(+ .mkC-bul){color:rgba(255,255,255,.88)}

/* 2. ПАРА «СВЯЗКА -> НАБОР» ВНУТРИ КОЛОНКИ .mkC-city. На уровне плиты она уже
   прижата 14px (правило выше), а в колонке расходилась на 38px: 14px нижней
   отбивки абзаца + 12px gap колонки + 12px верхней отбивки списка. Обнуление
   .mkC-city:not(.mkC-city--wide) > :not(.mkC-city__m) > *{margin-block:0}
   (custom.css:2577) до них НЕ доходит: оно лежит в @container (min-width:860px),
   а контейнером для потомков колонки служит САМА колонка — ей container-type
   выдан правилом 2915, и её ширина (572px на 1440) порог 860cq не берёт.
   Обнуляем отбивки самой пары: ритм внутри колонки держит её gap (12px),
   а 26px до предыдущего абзаца остаются разделителем блоков. */
.mkC-art .mkC-city > :not(.mkC-city__m) > p:has(+ .mkC-bul),
.mkC-art .mkC-city > :not(.mkC-city__m) > p:has(+ .mkC-bul) + .mkC-bul{margin-block:0}

/* ---- v6: /services/residence_permits_support (патч 2026-09-04-05) ----------
   Два правила в скоупе .mkC-rp. Третьего (белая связка на .ea-quick) НЕ здесь:
   его уже закрывает правило v5-1 выше — тот же дефект на той же фото-секции,
   и второй селектор с иным литералом белого дал бы две расходящиеся редакции
   одного правила. */

/* 1. НЕЧЁТНАЯ ПОСЛЕДНЯЯ КАРТОЧКА РЯДА — во всю ширину плиты. Пять карточек
   «Our specialists will help you understand:» в .mkC-row--2 давали 2+2+дыру
   (замер: последняя 595px при ряде 1220px). Тот же приём канон уже применяет
   дважды — в колонках .mkC-city (custom.css:2918) и на первом экране .mkC-intro
   (custom.css:3044); здесь он в скоупе плиты. Ряды с чётным числом карточек
   (по 4) правило не задевает. */
.mkC-rp .mkC-plate > .mkC-row--2 > :last-child:nth-child(odd){grid-column:1/-1}

/* 2. ЧИП-ССЫЛКА КАК ТАП-ТАРГЕТ. Канонный .mkC-chip (custom.css:2557) —
   min-height:40px, плашка рассчитана на неинтерактивный ярлык. В контактном
   блоке чипами набраны две внешние ссылки (Instagram / Facebook), 40px не
   добирают минимума касания 44px. Канон уже лечит так же ссылку телефона:
   .mkC-art .mkC-tel a{min-height:44px} (custom.css:2891). */
.mkC-rp a.mkC-chip{min-height:44px}

/* 3. КЕГЛЬ ЗАГОЛОВКОВ НА УЗКИХ ВЬЮПОРТАХ. Канонный `.ea-home .ea-title`
   (custom.css:837-842) держит clamp(26px,5.2vw,42px) — он рассчитан на КОРОТКИЕ
   шапки секций главной. Здесь два тематических заголовка длинные (145 и 95
   символов; текст исходный и сокращению не подлежит), и на 768 они уходили в 5
   строк, на 375 — в 7 (замер height/line-height на живой странице).
   Сжимаем только наклон и пол clamp: при ширине ≥913px значение упирается в те
   же 42px, что и канон, поэтому десктоп не двигается вовсе (замер на 1440 до и
   после — идентичен). Итог: 768 — 5→4 строки, 375 — 7→6.
   ПОЧЕМУ НЕ МЕНЬШЕ 24px. Свип по факту: 4 строки на 375 достигаются только на
   18px, а это ниже .mkC-h3c/.mkC-city__t (21px) при том же весе 800 — H2 стал
   бы МЕНЬШЕ H3. На 22px разница с H3 в 1px, «заметно крупнее» не выполняется.
   24px — последний кегль, где иерархия читается (24 / 21 / 17 / 16), поэтому
   шестая строка на 375 принята сознательно: она дешевле инверсии уровней.
   letter-spacing до -.04em и text-wrap:pretty проверены — строк не убавляют.
   Позиция важна: специфичность (0,2,0) равна канонному `.ea-home .ea-title`,
   спор решает порядок — правило обязано стоять НИЖЕ строки 837. */
.mkC-rp .ea-title{font-size:clamp(24px,4.6vw,42px)}

/* ---------- карточки НА ФОТО-СЕКЦИИ («Exclusive first-line properties») ------
   Возврат пользователя: «лучше сделать просто три карточки и снизу красиво
   оформленную подпись вместо нескольких строк, потому что этот блок выглядит
   тоже не очень классно». Канонная карточка — белая плита (.agent-card,
   background:var(--surface)); три таких плиты закрыли бы собой кадр, ради
   которого секция и сделана фото-секцией, и превратили бы её в обычную светлую.
   Поэтому в тёмном контексте карточка меняет ТОЛЬКО поверхность: цвет плиты —
   тот же rgba(20,20,22,…), которым секция уже кроет кадр своим оверлеем
   (.ea-quick::before, custom.css:910), новых цветов не заведено. Белый текст
   приходит сам: .mkC .ea-quick p (2656) специфичнее .mkC-ind p (2519).
   Тень канона (тёплая, под светлую плиту) заменена на тёмную + внутренний
   хайрлайн — на кадре белая тень не читается вовсе. */
.mkC-art .ea-quick .mkC-card{
  background:rgba(20,20,22,.55);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),
             0 18px 34px -12px rgba(0,0,0,.55)}
/* Плашка иконки канона — светлый градиент под тёмным глифом (#C4470D); на
   тёмной плите он пропадает. Берём канонный цвет ссылок этой же тёмной секции
   (.mkC .ea-quick a, 2820) — var(--brand-yellow), своего цвета не вводим. */
.mkC-art .ea-quick .mkC-ind__i{background:rgba(255,255,255,.10);color:var(--brand-yellow)}
/* Стекло — украшение, читаемость от него зависеть не должна: где прозрачность
   отключена системно, плита становится почти непрозрачной. */
@media (prefers-reduced-transparency:reduce){
  .mkC-art .ea-quick .mkC-card{background:rgba(20,20,22,.88);
    -webkit-backdrop-filter:none;backdrop-filter:none}
}

/* ==================== Карточка каталога — единый компонент =================
   Одна раскладка на три раздела: /services (блок services_index),
   /news/news (news_index) и Life in Albania (tm58887_nodes_index_life_in_alb).
   Разметку все трое берут из общего партиала
   View/Themed/TM58887/Elements/Cards/ea_card.twig — правится он, не блоки.
   Токены, .ea-btn и рецепт бренд-обводки .ea-draw-border берутся выше по файлу
   и здесь НЕ повторяются. Скоуп .ea-card* обязателен: тема отдаёт секции
   Roboto/Lato 15px/300 и h2 uppercase-capitalize — без явных значений метрика
   карточки уезжает.
   ========================================================================== */
/* Обёртка CMS-блока приходит с `.block{position:relative;overflow:hidden}`
   (style_formating.css:47476) — общее правило для всех блоков Croogo. Её нижняя
   граница совпадает с низом грида, поэтому тень карточки (18px смещения + 40px
   размытия, при наведении 26+52) срезалась ровно по краю, а при наклоне обрез
   ездил за курсором. Запас снизу есть — у секции 66px padding-bottom; нужно лишь
   не клипать. Снимаем ТОЛЬКО у блоков с карточками: остальным блокам
   overflow:hidden служит обрезкой их собственного контента. */
.block-services_index,
.block-news_index,
.block-tm58887_nodes_index_life_in_alb{overflow:visible}

.ea-cards,.ea-cards *,.ea-cards *::before,.ea-cards *::after{box-sizing:border-box}
.ea-cards{
  /* HARD (требование пользователя): на десктопе РОВНО 3 в ряд.
     auto-fit minmax() здесь запрещён — на широком шелле он ставит 4-ю колонку. */
  display:grid;
  grid-template-columns:repeat(3,1fr);
  align-items:stretch;
  gap:var(--gap);
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  font-size:16px;font-weight:400;line-height:1.5;color:var(--ink);
  text-align:left;
}
/* записей в разделе может остаться 1 или 2: колонка 1fr растянула бы карточку на
   треть/половину шелла и она перестала бы читаться карточкой. Ширина трека
   фиксируется, ряд центрируется. */
.ea-cards:has(> :last-child:nth-child(1)){grid-template-columns:minmax(300px,420px);justify-content:center}
.ea-cards:has(> :last-child:nth-child(2)){grid-template-columns:repeat(2,minmax(300px,420px));justify-content:center}

.ea-card{
  position:relative;
  display:flex;flex-direction:column;height:100%;
  background:var(--surface);
  border-radius:var(--r-lg);
  overflow:clip;
  /* Тень ходит за наклоном: --sx/--sy пишет home_cards.js (eaTilt('.ea-card')). */
  box-shadow:
    0 2px 6px rgba(30,30,30,.07),
    calc(var(--sx,0px) * .4) calc(8px + var(--sy,0px) * .4) 14px -6px rgba(30,30,30,.18),
    var(--sx,0px) calc(18px + var(--sy,0px)) 40px -18px rgba(30,30,30,.28);
  --rx:0deg; --ry:0deg; --lift:0px;
  transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--lift));
  transform-style:preserve-3d;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease),
             --ea-sweep var(--ea-sweep-dur) var(--ea-sweep-ease) var(--ea-sweep-delay);
}
/* в режиме слежения transform идёт без сглаживания, обводка — своим темпом */
.ea-card.is-tilting{transition:transform .12s linear, box-shadow .12s linear,
             --ea-sweep var(--ea-sweep-dur) var(--ea-sweep-ease) var(--ea-sweep-delay)}
.ea-card:hover{
  --lift:-4px;
  box-shadow:
    0 2px 6px rgba(30,30,30,.09),
    calc(var(--sx,0px) * .4) calc(10px + var(--sy,0px) * .4) 18px -6px rgba(30,30,30,.2),
    calc(var(--sx,0px) * 1.3) calc(26px + var(--sy,0px) * 1.3) 52px -18px rgba(30,30,30,.34);
}

/* Кадр 16:10 держит САМ .ea-card-media, а не картинка: поле picture не валидируется
   ни в Service, ни в News, ни в Node, и при пустом значении высоту задавать нечему.
   Плашка-вордмарк (.ea-card-ph) лежит слоем ниже — она видна и когда <img> нет в
   разметке, и когда он выпал по onerror (файл 404). Один механизм на оба случая. */
.ea-card-media{position:relative;aspect-ratio:16/10;background:var(--page-2);overflow:clip}
.ea-card-media img{
  position:absolute;inset:0;z-index:1;
  display:block;width:100%;height:100%;max-width:none;
  object-fit:cover;object-position:center;
  transition:transform .5s var(--ease);
}
/* onerror ставит [hidden], но UA-правило [hidden]{display:none} слабее селектора
   .ea-card-media img — без этой строки битая картинка остаётся видна alt-текстом поверх плашки. */
.ea-card-media img[hidden]{display:none}
.ea-card:hover .ea-card-media img{transform:scale(1.04)}

.ea-card-ph{
  position:absolute;inset:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;
  background:
    repeating-linear-gradient(135deg,rgba(30,30,30,.028) 0 2px,transparent 2px 10px),
    linear-gradient(135deg,
      rgba(190,21,27,.13) 0%,
      rgba(242,105,33,.15) 52%,
      rgba(247,146,30,.17) 100%),
    var(--page-2);
}
/* вордмарк бренда: пустой кадр остаётся брендовым, а не битым */
.ea-card-ph__word{
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  font-size:26px;font-weight:800;line-height:1;letter-spacing:-.03em;text-transform:uppercase;
  color:var(--ink-40);
}
.ea-card-ph__word b{color:rgba(190,21,27,.55);font-weight:800}
.ea-card-ph__rule{
  width:44px;height:3px;border-radius:var(--r-pill);opacity:.5;
  background:linear-gradient(90deg,var(--brand-red),var(--brand-orange) 55%,var(--brand-yellow));
}

.ea-card-body{
  display:flex;flex-direction:column;flex:1 1 auto;
  padding:var(--pad);gap:10px;
  /* без текста-лида тело схлопывается в две строки и ряд едет: пол по высоте */
  min-height:196px;
}
.ea-card-title{
  /* НЕ inherit: style.css темы даёт h1-h6 Roboto, и заголовок пришёл бы от неё, а не от .ea-cards */
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  margin:0;font-size:19px;line-height:1.3;font-weight:800;letter-spacing:.015em;
  text-transform:none;color:var(--ink);text-wrap:pretty;
}
.ea-card-title .ea-card-link{color:var(--ink);text-decoration:none}
.ea-card-title .ea-card-link:hover,.ea-card-title .ea-card-link:focus{color:var(--ink);text-decoration:none}
/* лид приходит из разных полей (Service.annotation / News.annotation / Node.excerpt),
   длина в БД ничем не ограничена. Обрез по 4 строкам держит ряд ровным, полный
   текст — на странице записи. */
.ea-card-lead{
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  margin:0;font-size:15px;line-height:1.6;color:var(--ink-60);
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;
  overflow:hidden;
}
/* Вспомогательная строка (дата новости) — над лидом, мельче и тише заголовка */
.ea-card-meta{
  font-family:"Montserrat",Helvetica,Arial,sans-serif;
  margin:0;font-size:13px;line-height:1.3;font-weight:600;letter-spacing:.02em;
  color:var(--ink-40);
}
/* CTA прижат к низу — ряд кнопок ровный при разной длине текста */
.ea-card-cta{margin-top:auto;align-self:flex-start}
.ea-card-cta .mdi{font-size:16px;line-height:1;transition:transform .25s var(--ease)}
.ea-card:hover .ea-card-cta{
  background:var(--brand-orange);color:#fff;transform:translateY(-1px);
  box-shadow:inset 0 0 0 2px var(--brand-orange), 0 14px 28px -10px rgba(242,105,33,.7);
}
.ea-card:hover .ea-card-cta .mdi{transform:translateX(3px)}
/* растянутая ссылка: кликается вся карточка, но интерактивный элемент один */
.ea-card-link::after{content:"";position:absolute;inset:0;z-index:3;border-radius:var(--r-lg)}
.ea-card-link:focus-visible::after{outline:3px solid rgba(242,105,33,.75);outline-offset:3px}

/* Адаптив по брейкпоинтам темы (Bootstrap-сетка 991/767): 3 → 2 → 1.
   :has()-правила выше (1 и 2 услуги) специфичнее — поэтому здесь тоже :has()-нейтральные
   селекторы с той же специфичностью не нужны: на 2 колонки и 1 колонку они сходятся. */
@media (max-width:991px){
  .ea-cards{grid-template-columns:repeat(2,1fr)}
  .ea-cards:has(> :last-child:nth-child(2)){grid-template-columns:repeat(2,1fr);justify-content:stretch}
}
@media (max-width:767px){
  .ea-cards,
  .ea-cards:has(> :last-child:nth-child(1)),
  .ea-cards:has(> :last-child:nth-child(2)){grid-template-columns:1fr;justify-content:stretch}
  .ea-card-body{min-height:0}
}
@media (prefers-reduced-motion:reduce){
  .ea-card,.ea-card-media img,.ea-card-cta .mdi{transition:none}
  .ea-card:hover{--lift:0px}
  .ea-card:hover .ea-card-media img{transform:none}
}

/* PAGE /contact (.ea-home.mkC.mkC-cnt).
   Body comes from three theme elements wrapped by CMS block 52 into
   `#block-52 > .block-body`, so the canon rhythm selector `.ea-home.mkC > section`
   (custom.css:2763) cannot reach them — the section carries its own step instead.
   Everything else reuses the canon inventory; no new keyframes, no new transitions. */

.mkC-cnt .mkC-cnt__s{padding-block:var(--mkc-sec-y)}

/* One-word heading: canon `balance` shrinks the line to its own width. */
.mkC-cnt .ea-title--full{text-wrap:pretty}

/* Only the UA italic of <address> is neutralised; size and weight stay canon
   (.mkC-ct__v = 16px/700), so a contact tile reads exactly like every other .mkC page. */
.mkC-cnt address.mkC-ct__v{font-style:normal;margin:3px 0 0}

/* Canon measure for a centred content column. */
.mkC-cnt #MessageViewForm{max-width:1000px;margin-inline:auto}
.mkC-cnt .mkC-cnt__wide{grid-column:1 / -1}
.mkC-cnt #MessageViewForm > .text-center{margin-top:30px}

/* The id is required: the base rule (custom.css:26) is itself id-scoped and no
   class beats it. Row stays flex, not grid — script.js:640 injects a
   <span class="checkbox-custom-dummy"> after each box, and fixed grid columns
   pushed the label onto a second line. */
.mkC-cnt #MessageViewForm .confirmation-wrapper > .form-group{
  display:flex;align-items:center;justify-content:flex-start;
  column-gap:12px;min-height:44px;flex-wrap:wrap;
}
/* attachFormValidator (script.js:176) inserts the message right AFTER the input, i.e.
   inside this flex row and BEFORE the consent text. `order` moves it past the label so it
   reads as an error under the whole row; `flex-basis` gives it its own line. */
.mkC-cnt #MessageViewForm .confirmation-wrapper .form-validation{order:1;flex-basis:100%}
.mkC-cnt #MessageViewForm .confirmation-wrapper .checkbox-custom-dummy{display:none}
.mkC-cnt #MessageViewForm .confirmation-wrapper input[type="checkbox"]{
  width:24px;height:24px;margin:0;accent-color:var(--brand-orange);align-self:center;
}
.mkC-cnt #MessageViewForm .confirmation-wrapper input[type="checkbox"]:focus-visible{
  outline:3px solid rgba(242,105,33,.55);outline-offset:3px;
}
/* The label is the real tap target, so it holds the 44px height. */
.mkC-cnt #MessageViewForm .confirmation-wrapper > .form-group > label{
  margin:0;min-height:44px;display:flex;align-items:center;cursor:pointer;
}
.mkC-cnt #MessageViewForm .confirmation-wrapper label :is(.block,.block-body,p){
  margin:0;line-height:1.45;
}

/* Canon paints this key in --ink-40 = 2.6:1, below WCAG AA at 12px; --ink-60 is
   4.71:1 and the same canon token. Fixing canon-wide is a separate task. */
.mkC-cnt .mkC-ct__k{color:var(--ink-60)}

/* Orphan third tile in the two-column band. The upper bound is required: at
   three columns the tile is :nth-child(odd) too, and would break the 3x1 row. */
@container (min-width:560px) and (max-width:859px){
  .mkC-cnt .mkC-intro .mkC-row--3 > :last-child:nth-child(odd){grid-column:1 / -1}
}

/* Canon rings a DESCENDANT (.mkC-card :focus-visible, custom.css:2418); here the
   card itself is the link and took focus. Values are the canon ones (rule 7). */
.mkC-cnt .mkC-ct:focus-visible{outline:3px solid rgba(242,105,33,.55);outline-offset:3px}

/* Broken/undelivered photo: the placeholder is a 3:2 data URI, so the element keeps
   intrinsic size and the card does not collapse on a dropped connection. Swapped in by
   the inline handler in Layouts/default.ctp. */
/* !important: card and hero rules reach the img through 3 classes and win on specificity,
   cropping the 3:2 placeholder instead of fitting it. */
.ea-img-fallback{object-fit:contain!important;background:#F4EFEA}

/* Header main menu, one line in every locale. Measured: the menu lane is a fixed
   1043px at every desktop width (container 1250, burger below ~1200); label sets at
   15px are en 658 / pl 695 / it 779 / sq 823 / ru 950, budget = 1043 - 32 - 6 gaps.
   Specificity (0,4,2) is required: `li + li{margin-left:40px}` lives in
   `/uploads/files_css/style.css`, which loads AFTER custom.css. */
.rd-navbar-top-panel.rd-navbar-static .rd-navbar-nav.rd-navbar-static{
  flex-wrap:nowrap;
  align-items:center;
  font-size:15px;               /* carries the locale step; the em gap is measured from it */
  column-gap:2em;
  padding-left:32px;            /* guaranteed air between the logo and the first item */
}
/* One shared gap instead of per-item margins, which drifted between items. */
.rd-navbar-top-panel.rd-navbar-static .rd-navbar-nav.rd-navbar-static>li+li{margin-left:0}
.rd-navbar-top-panel.rd-navbar-static .rd-navbar-nav.rd-navbar-static>li>a{
  font-size:inherit;
  white-space:nowrap;           /* a second line broke the bar height */
}
html[lang="it"] .rd-navbar-top-panel.rd-navbar-static .rd-navbar-nav.rd-navbar-static,
html[lang="sq"] .rd-navbar-top-panel.rd-navbar-static .rd-navbar-nav.rd-navbar-static{font-size:14px}
html[lang="ru"] .rd-navbar-top-panel.rd-navbar-static .rd-navbar-nav.rd-navbar-static{font-size:13px}

/* Object page, translated labels (i18n 2026-09-21).
   .btn-half-width is 137.5px with padding 0 24px, so only 89.5px of text fits:
   EN "Send" does, RU "Отправить" (101.6px) does not, and an over-wide nowrap line
   is clamped to the content-box start, overflowing right only — hence the shift.
   line-height:52px keeps the button height, so it stays untouched.
   aside#sidebar, like the neighbouring rules: uploads/estateal/style.css loads later. */
.ea-property-view aside#sidebar .btns-block .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;                     /* + the WhatsApp icon's mr-1 = 6.5px */
  padding-left: 8px;
  padding-right: 8px;
}

/* Block 49 markup has a literal space between <i> and <strong> on some items and
   none on others (3.5px vs 0) — flex makes the icon gap independent of that. */
.ea-property-view .property-overview-data .property-overview-item {
  display: flex;
  align-items: center;
  gap: 4px;
}