/* ResaleCenter — pixel-accurate design from resale-center.com */

:root {
    --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --color-primary: #007469;
    --color-primary-dark: #065B52;
    --color-primary-light: #008D7D;
    --color-accent: #F9C500;
    --color-accent-dark: #564400;
    --color-text: #000000;
    --color-title: #000929;
    --color-muted: #4B5563;
    --color-subtle: #374151;
    --color-border: #D1CFD7;
    --color-bg: #FFFFFF;
    --color-bg-gray: #F3F4F6;
    --color-write-bg: #FFF6D4;
    --color-call-bg: #E5F1F0;
    --gradient-teal: linear-gradient(to right, #008D7D, #00A895);
    --gradient-yellow: linear-gradient(to right, #F9C500, #FFE275);
    --container-max: 1320px;
    --container-pad: 42px;
    --radius-sm: 12px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --radius-xl: 28px;
    --radius-hero: 30px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: var(--font);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text);
    background: var(--color-bg);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; }
a { color: inherit; }
button { font-family: inherit; cursor: pointer; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

.page-container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 var(--container-pad);
}

.page-section {
    padding: 0 0 60px;
}

.page-section + .page-section {
    padding-top: 0;
}

#frequently-searched .page-container,
.page-container:has(> .section-title + .category-cards) {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

#frequently-searched .section-title,
.page-container:has(> .section-title + .category-cards) > .section-title {
    margin-top: 32px;
    margin-bottom: 0;
}

#hot-offers .page-container,
#new-buildings .page-container,
#popular .page-container,
#resale .page-container,
#articles .page-container,
#consultation .page-container {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

#hot-offers .section-header,
#new-buildings .section-header,
#popular .section-header,
#resale .section-header,
#articles .section-header {
    margin-bottom: 0;
}

#hot-offers .property-grid {
    margin-bottom: 0;
}

#hot-offers {
    padding-bottom: 60px;
}

#hot-offers + .promo-section {
    padding-top: 0;
}

.promo-section {
    padding-bottom: 60px;
}

.promo-section + .page-section,
.listing-promo-section + .page-section {
    padding-top: 0;
}

#resale {
    padding-bottom: 60px;
}

#resale + #articles {
    padding-top: 0;
}

#articles {
    padding-bottom: 60px;
}

#articles + .consultation-section {
    padding-top: 0;
}

.hero + .page-section {
    padding-top: 70px;
}

/* ── Header ── */
.site-header {
    position: relative;
    z-index: 100;
    background: var(--color-bg);
    border-bottom-left-radius: var(--radius-hero);
    border-bottom-right-radius: var(--radius-hero);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

.header-shell {
    background: var(--color-bg);
    border-bottom-left-radius: var(--radius-hero);
    border-bottom-right-radius: var(--radius-hero);
}

.header-container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 16px 50px;
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr) auto;
    align-items: center;
    gap: 28px;
    box-sizing: border-box;
}

.logo {
    display: flex;
    align-items: center;
    text-decoration: none;
    flex-shrink: 0;
}

.logo-img {
    display: block;
    width: 88px;
    height: 38px;
}

.logo-resale {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-primary);
    letter-spacing: -0.02em;
}

.logo-center {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-accent);
    letter-spacing: -0.02em;
}

.main-nav {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    flex-wrap: nowrap;
    min-width: 0;
}

.main-nav a {
    text-decoration: none;
    color: var(--color-subtle);
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    transition: color 0.2s, background 0.2s;
    line-height: 1.2;
    padding: 8px 0;
}

.main-nav a:hover { color: var(--color-primary); }

.main-nav a.is-active {
    background: var(--color-primary);
    color: #FFFFFF;
    padding: 8px 14px;
    border-radius: 999px;
}

.main-nav a.is-active:hover {
    color: #FFFFFF;
    opacity: 0.92;
}

.main-nav a.main-nav-create {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 0;
    color: var(--color-primary);
    font-weight: 600;
}

.main-nav-create:hover {
    color: var(--color-primary-dark);
}

.main-nav-create.is-active {
    color: #FFFFFF;
    padding: 8px 14px;
}

.main-nav-create-icon {
    flex-shrink: 0;
    display: block;
}

.main-nav-create-label {
    line-height: 1.2;
}

.header-right {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    flex-shrink: 0;
}

.header-right .lang-switcher,
.header-right .header-currency-switcher,
.header-right .header-auth-wrap {
    display: flex;
    align-items: center;
}

.header-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 44px;
    min-width: 44px;
    padding: 0 12px;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    background: var(--color-bg);
    cursor: pointer;
    font-family: inherit;
}

.lang-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    font-family: inherit;
}

.lang-btn:focus {
    outline: none;
}

.lang-btn:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
    border-radius: 4px;
}

.lang-btn-chevron {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    opacity: 0.55;
}

.currency-header-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    font-family: inherit;
    box-shadow: none;
    filter: none;
}

.currency-header-btn:focus {
    outline: none;
}

.currency-header-btn:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
    border-radius: 4px;
}

.currency-header-chevron {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    opacity: 0.55;
}

.header-pill-chevron {
    opacity: 0.55;
    flex-shrink: 0;
}

.header-flag {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-size: 18px;
    line-height: 1;
    border-radius: 50%;
    overflow: hidden;
}

.currency-header-symbol {
    font-size: 18px;
    font-weight: 600;
    color: var(--color-primary);
    line-height: 1;
    min-width: 14px;
    text-align: center;
}

.header-login-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 28px;
    padding: 0 16px;
    background: var(--color-primary);
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    border: none;
    border-radius: 50px;
    white-space: nowrap;
    flex-shrink: 0;
    transition: opacity 0.2s;
    cursor: pointer;
}

.header-login-btn:hover {
    opacity: 0.92;
    color: #FFFFFF;
}

.header-currency-switcher {
    position: relative;
    display: flex;
    align-items: center;
    background: transparent;
    border-radius: 0;
    padding: 0;
    gap: 0;
    box-shadow: none;
}

/* ── Shared dropdown menus (header currency/lang, card menus, etc.) ── */
.currency-header-menu,
.lang-menu,
.property-menu-dropdown {
    display: none;
    flex-direction: column;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    min-width: 180px;
    padding: 8px;
    z-index: 200;
    overflow: hidden;
}

.lang-menu {
    min-width: 220px;
}

.header-currency-switcher.open .currency-header-menu,
.lang-switcher.open .lang-menu {
    display: flex;
}

.property-menu-dropdown {
    display: flex;
    min-width: 200px;
    z-index: 10;
}

.property-menu-dropdown[hidden] {
    display: none !important;
}

.currency-menu-item,
.lang-menu-item,
.property-menu-item {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 10px 12px;
    border: none;
    background: none;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    color: var(--color-title);
    cursor: pointer;
    border-radius: 10px;
    white-space: nowrap;
    text-decoration: none;
    text-align: left;
}

.currency-menu-item:hover,
.lang-menu-item:hover,
.property-menu-item:hover {
    background: var(--color-bg-gray);
}

.currency-menu-check,
.lang-menu-check {
    display: none;
    margin-left: auto;
    flex-shrink: 0;
}

.currency-menu-item.is-active .currency-menu-check,
.lang-menu-item.is-active .lang-menu-check {
    display: block;
}

/* ── Lang switcher ── */
.lang-switcher {
    position: relative;
    display: flex;
    align-items: center;
}
.lang-menu-item img:first-child,
.lang-menu-item .header-flag-img {
    flex-shrink: 0;
    border-radius: 50%;
}

.currency-header-badge,
.currency-menu-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #E6F4F2;
    font-weight: 600;
    color: var(--color-primary);
    line-height: 1;
    flex-shrink: 0;
}

.currency-header-badge {
    width: 30px;
    height: 30px;
    font-size: 17px;
}

.currency-menu-badge {
    font-size: 15px;
}

.header-flag-img {
    display: block;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    overflow: hidden;
}

.lang-btn .header-flag-img {
    width: 26px;
    height: 26px;
}

.lang-menu-item .header-flag-img {
    width: 24px;
    height: 24px;
}

.header-profile-icon {
    display: block;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
}

.currency-menu-item img:first-of-type {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
}

/* ── Hero ── */
.hero {
    position: relative;
    min-height: 367px;
    padding: 0;
    margin: calc(-1 * var(--radius-hero)) 0 0;
    width: 100%;
    z-index: 1;
}

.hero-bg {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: url('https://3a50bbba9509bbdfe50e4240309a5b64.cdn.bubble.io/cdn-cgi/image/w=3072,h=612,f=auto,dpr=1.25,fit=cover/f1771056771125x931986952403342800/resized-image%20-%202026-02-14T111218.330.jpeg') center center / cover no-repeat;
    border-bottom-left-radius: var(--radius-hero);
    border-bottom-right-radius: var(--radius-hero);
    overflow: hidden;
}

.hero-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0.15) 100%);
    border-bottom-left-radius: var(--radius-hero);
    border-bottom-right-radius: var(--radius-hero);
}

.hero-inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: calc(86px + var(--radius-hero)) 50px 48px;
    box-sizing: border-box;
}

.hero h1 {
    font-size: 36px;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.2;
    margin: 0 auto 16px;
    width: 100%;
    max-width: 1244px;
}

/* ── Search form ── */
.hero-search {
    width: 100%;
    max-width: 1244px;
    margin-left: auto;
    margin-right: auto;
}

.hero-search-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
}

.hero-search-fields {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.hero-search-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

.hero-search-input {
    width: 100%;
    height: 48px;
    padding: 0 48px 0 16px;
    border: 0.8px solid var(--color-border);
    border-radius: var(--radius-md);
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
    background: #FFFFFF;
    outline: none;
}

.hero-search-input:focus {
    border-color: var(--color-primary);
}

.hero-filter-btn {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.7;
}

.hero-filter-row {
    display: flex;
    align-items: stretch;
    gap: 12px;
    flex-wrap: nowrap;
    width: 100%;
}

.hero-select-wrap {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
}

.hero-select {
    width: 100%;
    height: 48px;
    padding: 0 40px 0 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
    background: #FFFFFF;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    outline: none;
}

.hero-select-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    opacity: 0.5;
    transition: transform 0.2s ease;
}

.custom-select.is-open .hero-select-icon {
    transform: translateY(-50%) rotate(180deg);
}

.hero-price-wrap .custom-select-trigger {
    padding-right: 56px;
}

.hero-price-wrap.is-open .hero-select-icon {
    transform: translateY(-50%) rotate(180deg);
}

.hero-price-dropdown {
    min-width: 100%;
}

.hero-price-range {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.hero-price-input {
    width: 100%;
    height: 48px;
    padding: 0 16px;
    border: none;
    border-radius: 12px;
    background: #F3F4F6;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 400;
    color: var(--color-text);
    outline: none;
    -moz-appearance: textfield;
}

.hero-price-input::-webkit-outer-spin-button,
.hero-price-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.hero-price-input::placeholder {
    color: #9CA3AF;
}

.hero-price-input:focus {
    box-shadow: inset 0 0 0 2px var(--color-primary);
}

.hero-price-input-wrap {
    position: relative;
}

.hero-price-input-wrap .hero-price-input {
    padding-right: 40px;
}

.hero-price-input-symbol {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
    pointer-events: none;
}

.custom-select-native {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.custom-select-trigger {
    display: block;
    width: 100%;
    height: 48px;
    padding: 0 40px 0 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
    background: #FFFFFF;
    cursor: pointer;
    outline: none;
    text-align: left;
}

.custom-select-trigger:focus-visible {
    border-color: var(--color-primary);
}

.custom-select-label.is-placeholder {
    color: #6B7280;
}

select:has(> option[value=""]:checked) {
    color: #6B7280;
}

.custom-select-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    z-index: 300;
    background: #FFFFFF;
    border: 1px solid var(--color-border);
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    padding: 12px 16px 16px;
    max-height: 320px;
    overflow-y: auto;
}

.hero-bedrooms-wrap .custom-select-dropdown {
    max-height: 280px;
}

.custom-select-reset-row {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 4px;
}

.custom-select-reset {
    border: none;
    background: none;
    padding: 4px 0;
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    color: #006B5F;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.custom-select-reset:hover {
    opacity: 0.75;
}

.custom-select-options {
    display: flex;
    flex-direction: column;
}

.custom-select-group-label {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--color-title);
    padding: 10px 0 2px;
}

.custom-select-group:first-child .custom-select-group-label {
    padding-top: 2px;
}

.custom-select-option-nested {
    font-weight: 400;
}

.custom-select-option {
    display: block;
    width: 100%;
    padding: 10px 0;
    border: none;
    background: none;
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.35;
    color: #000000;
    text-align: left;
    cursor: pointer;
    border-radius: 0;
    transition: color 0.15s ease;
}

.custom-select-option:hover {
    color: #006B5F;
}

.custom-select-option.is-active {
    font-weight: 600;
    color: #006B5F;
}

.hero-price-symbol {
    position: absolute;
    right: 36px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    font-weight: 500;
    color: var(--color-text);
    pointer-events: none;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: none;
    font-family: var(--font);
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.1s;
    white-space: nowrap;
}

.btn:active { transform: scale(0.98); }

.btn-search {
    height: 48px;
    min-width: 200px;
    padding: 0 20px;
    background: var(--color-accent);
    color: #000000;
    font-size: 16px;
    font-weight: 600;
    border-radius: var(--radius-md);
}

.hero-search-row .hero-search-submit,
.hero-search-row .hero-search-map {
    flex: 0 0 auto;
    min-width: 200px;
}

.btn-search:hover { opacity: 0.92; }

.btn-map {
    height: 48px;
    min-width: 200px;
    padding: 0 20px;
    background: var(--color-primary);
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 600;
    border-radius: var(--radius-md);
}

.hero-map-row .btn-map {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
}

.btn-map:hover { opacity: 0.92; }

/* ── Section titles ── */
.section-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--color-text);
    margin: 0 0 60px;
}

.section-title.center {
    text-align: center;
    margin-left: 0;
}

.section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 60px;
}

.section-header h2 {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
}

.section-all-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-right: 18px;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-primary-light);
    text-decoration: none;
    border-radius: var(--radius-md);
    transition: opacity 0.2s;
}

.section-all-link:hover { opacity: 0.8; }

/* ── Category list page ── */
.category-page {
    padding-top: 8px;
}

.category-page .page-container {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.category-page .page-container > .category-page-title,
.category-page .page-container > .category-search,
.category-page .page-container > .property-grid {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.category-page-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--color-text);
    margin: 30px 0 16px;
    padding: 0;
    box-sizing: border-box;
}

.category-search {
    display: block;
    margin: 0 0 24px;
    padding: 0;
    border: 0;
    box-sizing: border-box;
}

.category-search-input-wrap {
    position: relative;
    display: block;
    width: 100%;
}

.category-search-input {
    display: block;
    width: 100%;
    max-width: 100%;
    height: 48px;
    padding: 0 48px 0 16px;
    border: 0.8px solid var(--color-border);
    border-radius: var(--radius-md);
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
    background: #FFFFFF;
    outline: none;
    box-sizing: border-box;
}

.category-search-input:focus {
    border-color: var(--color-primary);
}

.category-search-filter {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    cursor: pointer;
    border-radius: 8px;
}

.category-search-filter:hover {
    background: var(--color-bg-gray);
}

/* ── Category cards (Frequently searched) ── */
.category-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.category-card {
    text-decoration: none;
    color: var(--color-text);
    text-align: center;
}

.category-card-image {
    position: relative;
    width: 100%;
    aspect-ratio: 1;
    border-radius: var(--radius-xl);
    background-size: cover;
    background-position: center;
    margin-bottom: 12px;
    overflow: hidden;
}

.category-card-image::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 116, 105, 0.72);
    opacity: 0;
    transition: opacity 0.25s ease;
    border-radius: inherit;
}

.category-card-hover {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.2;
    opacity: 0;
    transition: opacity 0.25s ease;
    z-index: 1;
    pointer-events: none;
}

.category-card:hover .category-card-image::before,
.category-card:hover .category-card-hover,
.category-card:focus-visible .category-card-image::before,
.category-card:focus-visible .category-card-hover {
    opacity: 1;
}

.category-card-label {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
}

.category-card-sublabel {
    font-size: 16px;
    font-weight: 400;
    color: var(--color-subtle);
    margin-top: 2px;
}

/* ── Property grid ── */
.property-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.property-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.property-card-main {
    position: relative;
    min-width: 0;
}

.property-card-cover-link {
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: var(--radius-md);
    cursor: pointer;
}

.property-card-main:hover .property-title {
    color: var(--color-primary-light);
}

.property-card-image-link {
    text-decoration: none;
    display: block;
}

.property-card-image {
    position: relative;
    height: 270px;
    border-radius: var(--radius-md);
    overflow: hidden;
    isolation: isolate;
}

.property-card-image .property-image-placeholder {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    background-color: #E5F1F0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.property-badge-hot {
    position: absolute;
    top: 12px;
    left: 0;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 40px;
    max-width: 40px;
    height: 32px;
    padding: 0 8px;
    border-radius: 0 16px 16px 0;
    background: var(--gradient-teal);
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    white-space: nowrap;
    transition: max-width 0.25s ease, padding 0.25s ease;
    pointer-events: none;
}

.property-badge-hot-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    display: block;
    object-fit: contain;
    mix-blend-mode: screen;
}

.property-badge-hot-text {
    opacity: 0;
    visibility: hidden;
    max-width: 0;
    overflow: hidden;
    white-space: nowrap;
    transition: opacity 0.2s ease, max-width 0.25s ease, visibility 0s linear 0.25s;
}

.property-card-image:hover .property-badge-hot,
.property-card-map-image:hover .property-badge-hot,
.property-gallery-main-wrap:hover .property-badge-hot {
    max-width: 260px;
    padding-right: 12px;
}

.property-card-image:hover .property-badge-hot-text,
.property-card-map-image:hover .property-badge-hot-text,
.property-gallery-main-wrap:hover .property-badge-hot-text {
    opacity: 1;
    visibility: visible;
    max-width: 220px;
    transition: opacity 0.2s ease 0.05s, max-width 0.25s ease, visibility 0s;
}

.property-favorite {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 3;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #FFFFFF;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.property-favorite:hover {
    transform: scale(1.06);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.14);
}

.property-card-content {
    padding: 12px 0 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.property-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 2;
}

.property-menu-wrap {
    position: relative;
    z-index: 3;
}

.property-price {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary-dark);
    line-height: 1.2;
}

.property-menu-btn {
    background: none;
    border: none;
    color: var(--color-muted);
    font-size: 14px;
    letter-spacing: 2px;
    padding: 4px 8px;
    cursor: pointer;
}

.property-card-body-link {
    text-decoration: none;
    color: inherit;
    min-width: 0;
}

.property-title {
    transition: color 0.2s ease;
    font-size: 20px;
    font-weight: 600;
    color: var(--color-title);
    line-height: 1.3;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.property-address {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-muted);
    line-height: 1.4;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.property-address svg {
    display: inline-block;
    vertical-align: -2px;
    margin-right: 6px;
    flex-shrink: 0;
    opacity: 0.6;
}

.property-address-text {
    display: inline;
}

.property-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
}

.property-meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text);
    white-space: nowrap;
    flex-shrink: 0;
}

.property-card-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 12px;
    position: relative;
    z-index: 2;
}

.property-card-actions .btn-write,
.property-card-actions .btn-call {
    width: 100%;
    min-width: 0;
    height: 38px;
    font-size: 13px;
    gap: 6px;
}

.property-card-actions .btn-write img,
.property-card-actions .btn-call img {
    width: 14px;
    height: 14px;
}

.property-card-actions .lead-result {
    grid-column: 1 / -1;
}

.property-card-actions .lead-result:empty {
    display: none;
}

.btn-write {
    height: 44px;
    background: var(--color-write-bg);
    color: var(--color-accent-dark);
    font-size: 16px;
    font-weight: 700;
    border: none;
    border-radius: var(--radius-md);
}

.btn-write:hover { opacity: 0.9; }

.btn-call {
    height: 44px;
    background: var(--color-call-bg);
    color: var(--color-primary);
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: var(--radius-md);
    text-decoration: none;
}

.btn-call:hover { opacity: 0.9; }

/* ── Promo cards ── */
.promo-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.promo-card {
    border-radius: var(--radius-lg);
    padding: 40px 32px;
    text-align: center;
    color: #FFFFFF;
}

.promo-card-teal {
    position: relative;
    overflow: hidden;
    min-height: 280px;
    padding: 40px 48px;
    display: flex;
    align-items: center;
    text-align: left;
    background-color: #008d7d;
    background-image:
        url('https://3a50bbba9509bbdfe50e4240309a5b64.cdn.bubble.io/f1746442990489x680927347994149500/CI.svg'),
        linear-gradient(90deg, #00a895 0%, #008d7d 100%);
    background-repeat: no-repeat, no-repeat;
    background-position: right center, 0 0;
    background-size: auto 100%, 100% 100%;
}

.promo-card-content {
    position: relative;
    z-index: 1;
    max-width: 58%;
}

.promo-card-teal h3 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 8px;
    line-height: 1.25;
}

.promo-card-teal p {
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 24px;
    opacity: 0.95;
}

.promo-card-yellow {
    position: relative;
    overflow: hidden;
    min-height: 280px;
    padding: 40px 48px;
    display: flex;
    align-items: center;
    text-align: left;
    color: var(--color-text);
    background-color: #f9c500;
    background-image:
        url('https://3a50bbba9509bbdfe50e4240309a5b64.cdn.bubble.io/f1746442324767x983229166069425400/%D0%BF%D0%BE%D0%B4%D0%B1%D0%BE%D1%80%20%D0%BE%D0%B1%D1%8A%D1%8F%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B9.svg'),
        linear-gradient(90deg, #ffe275 0%, #f9c500 100%);
    background-repeat: no-repeat, no-repeat;
    background-position: right center, 0 0;
    background-size: auto 100%, 100% 100%;
}

.promo-card-yellow h3 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 8px;
    line-height: 1.25;
    color: var(--color-text);
}

.promo-card-yellow p {
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 24px;
    line-height: 1.4;
    color: var(--color-text);
}

.btn-promo-accent {
    height: 48px;
    padding: 0 32px;
    background: var(--color-accent);
    color: var(--color-text);
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: var(--radius-md);
}

.btn-promo-accent:hover { opacity: 0.92; }

.btn-promo-white {
    height: 48px;
    padding: 0 32px;
    background: #FFFFFF;
    color: var(--color-primary);
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: var(--radius-md);
}

.btn-promo-dark {
    height: 48px;
    padding: 0 32px;
    background: var(--color-primary);
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: var(--radius-md);
}

/* ── Articles ── */
.article-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.article-card {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 24px;
    transition: box-shadow 0.2s;
}

.article-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}

.article-card a {
    text-decoration: none;
    color: inherit;
}

.article-card h3 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 8px;
    line-height: 1.4;
}

.article-card p {
    font-size: 14px;
    color: var(--color-muted);
    line-height: 1.5;
}

/* ── Consultation ── */
.consultation-section {
    background: transparent;
    padding-bottom: 60px;
}

.consultation-title {
    margin-bottom: 60px;
}

#consultation .consultation-title {
    margin-bottom: 0;
}

.consultation-panel {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: stretch;
    padding: 40px;
    background: var(--color-bg-gray);
    border-radius: var(--radius-lg);
}

.consultation-info {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.consultation-contacts-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px 32px;
}

.contact-card {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: inherit;
    min-width: 0;
}

.contact-card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #E5F1F0;
    flex-shrink: 0;
}

.contact-card-icon-flag {
    background: #FFFFFF;
    border: 1px solid var(--color-border);
}

.contact-card-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.contact-card-text strong {
    font-size: 16px;
    font-weight: 600;
    color: var(--color-title);
    line-height: 1.3;
}

.contact-card-text span {
    font-size: 14px;
    color: var(--color-muted);
    line-height: 1.3;
}

.consultation-agent {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: auto;
    padding-top: 48px;
}

.consultation-agent-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--gradient-teal);
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
    flex-shrink: 0;
}

.consultation-agent-text strong {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: var(--color-title);
    margin-bottom: 2px;
}

.consultation-agent-text p {
    font-size: 14px;
    color: var(--color-muted);
    line-height: 1.4;
}

.consultation-form-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-title);
    line-height: 1.3;
    margin-bottom: 20px;
}

.consultation-form-full {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.consultation-select-wrap {
    position: relative;
}

.consultation-select {
    width: 100%;
    height: 48px;
    padding: 0 40px 0 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
    background: #FFFFFF;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    outline: none;
}

.consultation-select-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    opacity: 0.5;
}

.consultation-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.consultation-form-full input[type="text"],
.consultation-form-full input[type="tel"]:not(.phone-field-input) {
    height: 48px;
    padding: 0 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-family: var(--font);
    font-size: 16px;
    background: #FFFFFF;
    outline: none;
    min-width: 0;
}

.consultation-form-full input:focus,
.consultation-select:focus {
    border-color: var(--color-primary);
}

/* ── Phone field (country selector + tel input) ── */
.phone-field {
    position: relative;
    width: 100%;
    min-width: 0;
}

.phone-field-shell {
    position: relative;
}

.phone-field-control {
    display: flex;
    align-items: stretch;
    width: 100%;
    min-height: 48px;
    border: 1px solid var(--color-border);
    border-radius: 12px;
    background: #FFFFFF;
    overflow: hidden;
    transition: border-color 0.2s;
}

.phone-field-control:focus-within {
    border-color: var(--color-primary);
}

.phone-field-country-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 78px;
    padding: 0 10px;
    border: none;
    border-right: 1px solid var(--color-border);
    background: #F3F4F6;
    cursor: pointer;
    flex-shrink: 0;
}

.phone-field-flag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

.phone-field-flag-img,
.phone-field-option-flag-img {
    width: 24px;
    height: 18px;
    object-fit: cover;
    border-radius: 2px;
    flex-shrink: 0;
    display: block;
}

.phone-field-chevron {
    flex-shrink: 0;
    opacity: 0.55;
    transition: transform 0.2s ease;
}

.phone-field.is-open .phone-field-chevron {
    transform: rotate(180deg);
}

.phone-field-input {
    flex: 1;
    min-width: 0;
    height: 48px;
    padding: 0 16px;
    border: none !important;
    border-radius: 0 !important;
    outline: none;
    background: transparent !important;
    box-shadow: none !important;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
}

.phone-field-input::placeholder {
    color: #9CA3AF;
}

.phone-field-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    z-index: 400;
    background: #FFFFFF;
    border: 1px solid var(--color-border);
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    overflow: hidden;
}

.phone-field-search {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid #E5E7EB;
    margin: 0;
    cursor: text;
}

.phone-field-search-icon {
    flex-shrink: 0;
    opacity: 0.45;
}

.phone-field-search-input {
    flex: 1;
    min-width: 0;
    height: auto;
    padding: 0;
    border: none !important;
    border-radius: 0 !important;
    outline: none;
    background: transparent !important;
    box-shadow: none !important;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
}

.phone-field-search-input::placeholder {
    color: #9CA3AF;
}

.phone-field-list {
    max-height: 260px;
    overflow-y: auto;
    padding: 8px;
}

.phone-field-option {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 10px 12px;
    border: none;
    background: none;
    border-radius: 10px;
    font-family: inherit;
    font-size: 16px;
    font-weight: 500;
    color: var(--color-title);
    text-align: left;
    cursor: pointer;
}

.phone-field-option:hover,
.phone-field-option.is-active {
    background: #F3F4F6;
}

.phone-field-option-flag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 0;
}

.phone-field-option-label {
    flex: 1;
    min-width: 0;
}

.phone-field--auth .phone-field-control {
    min-height: 44px;
    border: none;
    border-radius: 12px;
    background: #F3F4F6;
}

.phone-field--auth .phone-field-control:focus-within {
    box-shadow: inset 0 0 0 2px rgba(0, 116, 105, 0.35);
    border-color: transparent;
}

.phone-field--auth .phone-field-country-btn {
    width: 56px;
    gap: 4px;
    padding: 0 6px;
    background: transparent;
    border-right-color: #E5E7EB;
}

.phone-field--auth .phone-field-flag-img {
    width: 20px;
    height: 15px;
}

.phone-field--auth .phone-field-chevron {
    width: 12px;
    height: 12px;
}

.phone-field--auth .phone-field-input {
    height: 44px;
    font-size: 14px;
    font-weight: 400;
}

.phone-field--auth .phone-field-dropdown {
    top: calc(100% + 6px);
    border-radius: 12px;
}

.phone-field--auth .phone-field-search {
    gap: 6px;
    padding: 6px 8px;
}

.phone-field--auth .phone-field-search-icon {
    width: 13px;
    height: 13px;
}

.phone-field--auth .phone-field-search-input {
    padding: 0;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.2;
}

.phone-field--auth .phone-field-list {
    max-height: 160px;
    padding: 4px;
}

.phone-field--auth .phone-field-option {
    gap: 6px;
    padding: 5px 6px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.3;
}

.phone-field--auth .phone-field-option-flag-img {
    width: 16px;
    height: 12px;
}

.auth-panel[data-auth-panel="register"] .auth-panel-head {
    margin-bottom: 16px;
}

.auth-panel[data-auth-panel="register"] .auth-panel-title {
    font-size: 22px;
}

.auth-panel[data-auth-panel="register"] .auth-form {
    gap: 12px;
}

.auth-panel[data-auth-panel="register"] .auth-form-row {
    gap: 10px;
}

.auth-panel[data-auth-panel="register"] .auth-field {
    gap: 5px;
}

.auth-panel[data-auth-panel="register"] .auth-label {
    font-size: 13px;
}

.auth-panel[data-auth-panel="register"] .auth-input,
.auth-panel[data-auth-panel="register"] .auth-submit-btn {
    height: 40px;
    font-size: 13px;
}

.auth-panel[data-auth-panel="register"] .phone-field--auth .phone-field-control {
    min-height: 40px;
}

.auth-panel[data-auth-panel="register"] .phone-field--auth .phone-field-input {
    height: 40px;
    font-size: 13px;
}

.auth-panel[data-auth-panel="register"] .phone-field--auth .phone-field-country-btn {
    width: 50px;
    gap: 3px;
    padding: 0 5px;
}

.auth-panel[data-auth-panel="register"] .phone-field--auth .phone-field-flag-img {
    width: 18px;
    height: 13px;
}

.auth-panel[data-auth-panel="register"] .phone-field--auth .phone-field-chevron {
    width: 10px;
    height: 10px;
}

.auth-panel[data-auth-panel="register"] .auth-password-toggle {
    font-size: 12px;
}

.auth-panel[data-auth-panel="register"] .auth-password-toggle svg {
    width: 16px;
    height: 16px;
}

.consultation-form-row .phone-field,
.blog-form-field .phone-field,
.lead-modal-dialog .phone-field {
    width: 100%;
}

.lead-modal-dialog .phone-field {
    margin-bottom: 12px;
}

.blog-sidebar-form .phone-field-input:focus {
    box-shadow: none !important;
}

.btn-consultation-send {
    height: 48px;
    background: #D1D5DB;
    color: var(--color-title);
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: var(--radius-md);
}

.btn-consultation-send:hover { background: #C4C9D1; }

.consultation-subtitle {
    text-align: center;
    color: var(--color-muted);
    font-size: 16px;
    margin-bottom: 24px;
}

.consultation-form {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 640px;
    margin: 0 auto 40px;
}

.consultation-form input {
    height: 48px;
    padding: 0 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-family: var(--font);
    font-size: 16px;
    min-width: 200px;
    outline: none;
}

.consultation-form input:focus {
    border-color: var(--color-primary);
}

.consultation-contacts {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    text-align: center;
}

.contact-item h3 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 4px;
}

.contact-item p {
    font-size: 14px;
    color: var(--color-muted);
}

/* ── Footer ── */
.site-footer {
    margin-top: 0;
    background: var(--color-bg);
}

.footer-shell {
    background: var(--color-primary);
    border-top-left-radius: var(--radius-hero);
    border-top-right-radius: var(--radius-hero);
    padding: 56px 0 36px;
}

.footer-container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 50px;
}

.footer-top {
    display: grid;
    grid-template-columns: 240px minmax(180px, 1fr) minmax(180px, auto);
    align-items: start;
    column-gap: 48px;
}

.footer-brand {
    max-width: 240px;
}

.footer-col-catalog {
    justify-self: center;
}

.footer-col-contacts {
    justify-self: end;
}

.footer-col h4 {
    font-size: 14px;
    font-weight: 600;
    color: #FFFFFF;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.footer-logo {
    display: block;
    text-decoration: none;
}

.footer-logo-img {
    display: block;
    width: 88px;
    height: 38px;
}

.footer-tagline {
    margin-top: 12px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 14px;
    line-height: 1.45;
    max-width: 220px;
}

.footer-col ul {
    list-style: none;
}

.footer-col li + li {
    margin-top: 0;
}

.footer-col a {
    color: rgba(255, 255, 255, 0.92);
    text-decoration: none;
    font-size: 14px;
    line-height: 2;
    transition: color 0.2s;
}

.footer-col a:hover {
    color: #FFFFFF;
}

.footer-contacts-list {
    min-width: 170px;
}

.footer-contact-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.footer-contact-icon {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
}

.footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 48px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
}

.footer-legal,
.footer-copy {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.5;
}

.footer-legal a,
.footer-bottom a {
    color: #FFFFFF;
    text-decoration: none;
}

.footer-legal a:hover,
.footer-bottom a:hover {
    text-decoration: underline;
}

.footer-copy {
    flex-shrink: 0;
    text-align: right;
}

/* ── Chat widget ── */
.chat-widget {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 1000;
}

.chat-fab {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--color-primary);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(0,116,105,0.35);
    cursor: pointer;
}

.chat-fab img {
    filter: brightness(0) invert(1);
}

.chat-panel {
    display: none;
    position: absolute;
    bottom: 68px;
    right: 0;
    width: 320px;
    background: #FFFFFF;
    border-radius: var(--radius-sm);
    box-shadow: 0 8px 32px rgba(0,0,0,0.15);
    padding: 20px;
}

.chat-panel.open { display: block; }

.chat-panel-header {
    margin-bottom: 16px;
}

.chat-panel-header strong {
    font-size: 16px;
    font-weight: 600;
}

.chat-panel-header p {
    font-size: 14px;
    color: var(--color-muted);
    margin-top: 4px;
}

.chat-panel form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}

.chat-panel input {
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-family: var(--font);
    font-size: 14px;
    outline: none;
}

.btn-primary-full {
    height: 44px;
    background: var(--color-primary);
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: var(--radius-sm);
}

.chat-panel-contacts p {
    font-size: 13px;
    margin-bottom: 8px;
    color: var(--color-muted);
}

.chat-panel-contacts strong {
    color: var(--color-text);
}

/* ── Form success ── */
.form-success {
    padding: 12px 16px;
    background: #ECFDF5;
    border-radius: var(--radius-sm);
    color: #065F46;
    font-size: 14px;
    font-weight: 500;
}

.empty-state {
    grid-column: 1 / -1;
    text-align: center;
    padding: 48px;
    color: var(--color-muted);
    font-size: 16px;
}

/* ── Search page ── */
.search-page-title {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 24px;
    margin-left: 18px;
}

/* ── Property detail ── */
.property-detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-top: 24px;
}

.back-link {
    color: var(--color-primary);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.back-link:hover { text-decoration: underline; }

.property-detail-actions form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 24px 0 16px;
}

.property-detail-actions input,
.property-detail-actions textarea {
    padding: 12px 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-family: var(--font);
    font-size: 16px;
    outline: none;
}

.property-detail-actions textarea {
    min-height: 100px;
    resize: vertical;
}

/* ── Legal pages ── */
.legal-page h1 {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 32px;
}

.legal-page h2 {
    font-size: 20px;
    font-weight: 600;
    margin: 24px 0 12px;
}

.legal-page p, .legal-page li {
    font-size: 16px;
    line-height: 1.6;
    color: var(--color-muted);
    margin-bottom: 8px;
}

.legal-page ul {
    padding-left: 24px;
    margin-bottom: 16px;
}

.container-narrow {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 var(--container-pad);
}

/* ── Responsive ── */
@media (max-width: 1200px) {
    .property-grid { grid-template-columns: repeat(3, 1fr); }
    .category-cards { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
    .header-container {
        grid-template-columns: 1fr auto;
        grid-template-rows: auto auto;
        gap: 16px;
        padding: 14px 50px;
    }
    .logo { grid-column: 1; }
    .header-right { grid-column: 2; grid-row: 1; }
    .main-nav {
        grid-column: 1 / -1;
        justify-content: flex-start;
        gap: 16px;
        overflow-x: auto;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }
    .property-grid { grid-template-columns: repeat(2, 1fr); }
    .promo-grid { grid-template-columns: 1fr; }
    .consultation-contacts { grid-template-columns: repeat(2, 1fr); }
    .article-grid { grid-template-columns: 1fr; }
    .property-detail-grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
    :root { --container-pad: 16px; }
    .hero-filter-row { flex-direction: column; align-items: stretch; }
    .hero-search-row { flex-direction: column; align-items: stretch; }
    .hero-select-wrap { max-width: none; }
    .hero-search-row .hero-search-submit,
    .hero-search-row .hero-search-map { width: 100%; min-width: 0; }
    .property-grid { grid-template-columns: 1fr; }
    .category-cards { grid-template-columns: 1fr; }
    .hero h1 { font-size: 28px; }
    .section-header h2, .section-title { font-size: 24px; }
    .property-title { font-size: 20px; }
    .property-price { font-size: 20px; }
    .consultation-contacts { grid-template-columns: 1fr; }
    .footer-top { grid-template-columns: 1fr; gap: 28px; }
    .footer-col-catalog,
    .footer-col-contacts { justify-self: start; }
    .footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
    .footer-copy { text-align: left; }
}

/* ── Property grid variants ── */
.property-grid-4 { grid-template-columns: repeat(4, 1fr); }
.property-grid-3 { grid-template-columns: repeat(3, 1fr); }

/* ── Compact property card (new buildings) ── */
.property-card-compact {
    padding: 0 0 8px;
}

.property-card-compact-link {
    text-decoration: none;
    color: inherit;
    display: block;
    margin-bottom: 12px;
}

.property-address-compact {
    font-size: 16px;
    font-weight: 500;
    color: var(--color-muted);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Listing promo ── */
.listing-promo-section { background: transparent; }

.listing-promo {
    position: relative;
    overflow: hidden;
    min-height: 280px;
    padding: 40px 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    border-radius: var(--radius-lg);
    background: linear-gradient(90deg, #00a895 0%, #008d7d 55%, #007469 100%);
}

.listing-promo-circles {
    position: absolute;
    right: 120px;
    top: 50%;
    transform: translateY(-50%);
    width: 360px;
    height: 360px;
    pointer-events: none;
    background:
        radial-gradient(circle, transparent 58%, rgba(255, 255, 255, 0.14) 58.5%, rgba(255, 255, 255, 0.14) 59.5%, transparent 60%),
        radial-gradient(circle, transparent 68%, rgba(255, 255, 255, 0.11) 68.5%, rgba(255, 255, 255, 0.11) 69.5%, transparent 70%),
        radial-gradient(circle, transparent 78%, rgba(255, 255, 255, 0.08) 78.5%, rgba(255, 255, 255, 0.08) 79.5%, transparent 80%),
        radial-gradient(circle, transparent 88%, rgba(255, 255, 255, 0.06) 88.5%, rgba(255, 255, 255, 0.06) 89.5%, transparent 90%);
}

.listing-promo-content {
    position: relative;
    z-index: 1;
    flex: 0 1 52%;
    max-width: 520px;
    color: #FFFFFF;
}

.listing-promo h2 {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 8px;
    line-height: 1.25;
    color: #FFFFFF;
}

.listing-promo p {
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 24px;
    line-height: 1.45;
    opacity: 0.95;
}

.listing-promo-btn {
    border-radius: 999px;
    color: var(--color-accent-dark);
}

.listing-promo-visual {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    width: 380px;
    min-height: 180px;
}

.listing-promo-card-stack {
    position: relative;
    width: 100%;
    height: 176px;
}

.listing-promo-card-shadow {
    position: absolute;
    right: 0;
    top: 0;
    width: 340px;
    height: 156px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.14);
}

.listing-promo-card-shadow-1 {
    top: 10px;
    right: 16px;
    transform: rotate(-2deg);
}

.listing-promo-card-shadow-2 {
    top: 20px;
    right: 8px;
    transform: rotate(-4deg);
    background: rgba(255, 255, 255, 0.08);
}

.listing-promo-card {
    position: absolute;
    top: 0;
    right: 24px;
    display: flex;
    gap: 12px;
    width: 340px;
    padding: 12px;
    background: #FFFFFF;
    border-radius: 16px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.14);
}

.listing-promo-card-image {
    flex-shrink: 0;
    width: 112px;
    height: 112px;
    border-radius: 12px;
    background-size: cover;
    background-position: center;
}

.listing-promo-card-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding-top: 2px;
}

.listing-promo-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
}

.listing-promo-card-price {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-primary);
    line-height: 1.2;
}

.listing-promo-card-heart {
    display: flex;
    flex-shrink: 0;
}

.listing-promo-card-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--color-title);
    line-height: 1.3;
    margin-bottom: 2px;
}

.listing-promo-card-location {
    font-size: 13px;
    color: var(--color-muted);
    line-height: 1.3;
    margin-bottom: 8px;
}

.listing-promo-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
    margin-top: auto;
    font-size: 12px;
    color: var(--color-muted);
}

.listing-promo-card-meta span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.listing-promo-card-meta img {
    opacity: 0.7;
}

/* ── Article cards (home/blog) ── */
.article-card-home {
    border-radius: var(--radius-md);
    overflow: hidden;
    border: 1px solid var(--color-border);
    transition: box-shadow 0.2s;
}

.article-card-home:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.08); }

.article-card-home a {
    text-decoration: none;
    color: inherit;
    display: block;
}

.article-card-cover {
    height: 200px;
    background-size: cover;
    background-position: center;
}

.article-card-body {
    padding: 20px;
}

.article-card-body h3 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 8px;
}

.article-card-body p {
    font-size: 14px;
    color: var(--color-muted);
    line-height: 1.5;
    margin-bottom: 12px;
}

.article-card-body time {
    font-size: 14px;
    color: var(--color-subtle);
}

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

/* ── Articles home layout ── */
.articles-home-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px;
    align-items: stretch;
}

.article-featured {
    border-radius: 20px;
    overflow: hidden;
    min-height: 0;
    height: 100%;
}

.article-featured-link {
    display: block;
    position: relative;
    height: 100%;
    min-height: 480px;
    text-decoration: none;
    color: #FFFFFF;
}

.article-featured-cover {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
}

.article-featured-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 28px 24px 24px;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.78) 0%, rgba(0, 0, 0, 0.34) 52%, transparent 100%);
}

.article-featured-overlay h3 {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 8px;
}

.article-featured-overlay p {
    font-size: 15px;
    font-weight: 400;
    line-height: 1.45;
    opacity: 0.95;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-list-home {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
    height: 100%;
}

.article-list-item {
    flex: 1 1 0;
    border: none;
    border-radius: 0;
    overflow: visible;
    background: transparent;
}

.article-list-item:hover {
    box-shadow: none;
}

.article-list-link {
    display: flex;
    gap: 16px;
    padding: 0;
    text-decoration: none;
    color: inherit;
    align-items: stretch;
    height: 100%;
}

.article-list-link:hover .article-list-body h3 {
    color: var(--color-primary-light);
}

.article-list-thumb {
    flex: 0 0 128px;
    width: 128px;
    min-height: 96px;
    align-self: stretch;
    border-radius: 16px;
    background-size: cover;
    background-position: center;
    background-color: var(--color-bg-gray);
}

.article-list-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding: 0;
}

.article-list-body h3 {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 8px;
    color: var(--color-title);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.2s;
}

.article-list-body p {
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text);
    line-height: 1.45;
    margin-bottom: auto;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-list-body time {
    font-size: 14px;
    color: #9CA3AF;
    margin-top: 12px;
}

.blog-page-title {
    font-size: 32px;
    font-weight: 700;
    margin: 0 0 12px 18px;
}

.blog-page-subtitle {
    color: var(--color-muted);
    margin: 0 0 32px 18px;
    max-width: 720px;
    line-height: 1.6;
}

/* ── Blog page ── */
.blog-page {
    background: #F3F4F6;
    padding-top: 24px;
    padding-bottom: 48px;
}

.blog-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 408px);
    gap: 24px;
    align-items: start;
}

.blog-layout > .blog-sidebar-card {
    max-width: 408px;
    width: 100%;
    justify-self: end;
}

.article-page-layout {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 408px);
    gap: 20px;
}

.blog-feed-card,
.blog-sidebar-card {
    background: #FFFFFF;
    border-radius: 20px;
    padding: 32px;
}

.blog-breadcrumbs {
    margin-bottom: 24px;
}

.blog-breadcrumbs-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

.blog-breadcrumbs-item {
    min-width: 0;
}

.blog-breadcrumbs-item a {
    color: #111827;
    text-decoration: none;
    transition: color 0.2s;
}

.blog-breadcrumbs-item a:hover {
    color: var(--color-primary);
}

.blog-breadcrumbs-item.is-current {
    color: var(--color-primary);
}

.blog-breadcrumbs-sep {
    color: #D1D5DB;
    font-weight: 400;
    user-select: none;
}

.blog-feed-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.blog-feed-item {
    border-bottom: 1px solid #E5E7EB;
}

.blog-feed-item:last-child {
    border-bottom: none;
}

.blog-feed-link {
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr);
    gap: 24px;
    padding: 24px 0;
    text-decoration: none;
    color: inherit;
    align-items: stretch;
}

.blog-feed-link:hover h2 {
    color: var(--color-primary);
}

.blog-feed-thumb {
    width: 200px;
    height: 191px;
    border-radius: 16px;
    background-size: cover;
    background-position: center;
    background-color: #FAFAFA;
    flex-shrink: 0;
}

.blog-feed-thumb-empty {
    background: linear-gradient(135deg, #E5F1F0 0%, #F3F4F6 100%);
}

.blog-feed-body {
    min-width: 0;
    min-height: 191px;
    display: flex;
    flex-direction: column;
}

.blog-feed-body h2 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.35;
    margin: 0 0 8px;
    color: var(--color-title);
    transition: color 0.2s;
}

.blog-feed-body p {
    font-size: 14px;
    line-height: 1.5;
    color: var(--color-muted);
    margin: 0 0 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-feed-body time {
    font-size: 13px;
    color: #9CA3AF;
    margin-top: auto;
}

.blog-sidebar-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 8px;
    color: var(--color-title);
}

.blog-sidebar-subtitle {
    font-size: 14px;
    color: var(--color-muted);
    line-height: 1.5;
    margin: 0 0 20px;
}

.blog-sidebar-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.blog-form-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.blog-form-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-muted);
}

.blog-sidebar-form input[type="text"],
.blog-sidebar-form input[type="tel"]:not(.phone-field-input) {
    width: 100%;
    height: 48px;
    padding: 0 16px;
    border: none;
    border-radius: 12px;
    background: #F3F4F6;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
    outline: none;
}

.blog-sidebar-form input:focus {
    box-shadow: inset 0 0 0 2px var(--color-primary);
}

.blog-sidebar-form .consultation-select:focus {
    box-shadow: none;
}

.blog-phone-row {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 8px;
}

.blog-phone-prefix {
    text-align: center;
    padding: 0 8px !important;
}

.blog-privacy-check {
    margin-top: -4px;
}

.btn-blog-send {
    height: 48px;
    background: #E5E7EB;
    color: var(--color-title);
    font-size: 16px;
    font-weight: 600;
    border: none;
    border-radius: 12px;
    transition: background 0.2s;
}

.btn-blog-send:hover {
    background: #D1D5DB;
}

@media (max-width: 1100px) {
    .blog-layout {
        grid-template-columns: 1fr;
    }

    .blog-sidebar-card {
        max-width: 480px;
    }
}

@media (max-width: 640px) {
    .blog-feed-link {
        grid-template-columns: 1fr;
    }

    .blog-feed-thumb {
        width: 100%;
        height: 180px;
    }

    .blog-feed-card,
    .blog-sidebar-card {
        padding: 24px 20px;
    }
}

.article-page-cover {
    height: 320px;
    border-radius: var(--radius-lg);
    background-size: cover;
    background-position: center;
    margin: 16px 0 24px;
}

.article-excerpt {
    font-size: 18px;
    color: var(--color-muted);
    margin-bottom: 24px;
    line-height: 1.6;
}

.article-detail-card {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.article-sidebar-stack {
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: sticky;
    top: 24px;
    max-width: 408px;
    width: 100%;
    justify-self: end;
}

.article-back-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 600;
}

.article-back-link img {
    flex-shrink: 0;
}

.article-detail-head {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 0;
}

.article-detail-cover {
    width: 100%;
    aspect-ratio: 100 / 36.567;
    height: auto;
    border-radius: 20px;
    background-size: cover;
    background-position: center;
    background-color: #E5E7EB;
    margin: 0;
}

.article-detail-title {
    margin: 0;
    font-size: 28px;
    font-weight: 600;
    line-height: 1.3;
    color: #000000;
}

.article-detail-date {
    display: block;
    font-size: 16px;
    font-weight: 500;
    color: #4B5563;
}

.article-detail-content {
    font-size: 14px;
    line-height: 1.55;
    color: #000000;
}

.article-detail-content p {
    margin: 0 0 16px;
}

.article-detail-content h2 {
    margin: 0 0 16px;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.4;
    color: #252525;
}

.article-detail-content h3 {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.35;
    color: #252525;
}

.article-detail-content ul {
    margin: 0 0 16px;
    padding-left: 24px;
}

.article-detail-content li {
    margin-bottom: 8px;
}

.article-detail-content strong {
    display: block;
    margin: 0 0 8px;
    color: #252525;
    font-weight: 600;
}

.article-detail-sidebar {
    max-width: none;
    width: 100%;
}

.article-other-articles {
    border-radius: 20px;
    padding: 32px;
}

.article-other-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 8px;
}

.article-other-item {
    display: block;
    padding: 20px 0;
    border-bottom: 1px solid #E5E7EB;
    text-decoration: none;
    color: inherit;
}

.article-other-item:first-child {
    padding-top: 0;
}

.article-other-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.article-other-item:hover h3 {
    color: var(--color-primary);
}

.article-other-thumb {
    width: 100%;
    aspect-ratio: 195 / 186;
    max-height: 186px;
    border-radius: 20px;
    background-size: cover;
    background-position: center;
    background-color: #FAFAFA;
    margin-bottom: 16px;
}

.article-other-thumb-empty {
    background: linear-gradient(135deg, #E5F1F0 0%, #F3F4F6 100%);
}

.article-other-body h3 {
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--color-title);
    transition: color 0.2s;
}

.article-other-body p {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--color-muted);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-page .blog-breadcrumbs-list {
    font-size: 12px;
    line-height: 18px;
}

.article-page .article-other-articles .blog-sidebar-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    margin: 0;
}

@media (max-width: 1100px) {
    .article-page-layout {
        grid-template-columns: 1fr;
    }

    .article-sidebar-stack {
        position: static;
        max-width: none;
        justify-self: stretch;
    }
}

@media (max-width: 640px) {
    .article-detail-title {
        font-size: 24px;
    }

    .article-other-articles {
        padding: 24px 20px;
    }
}

/* ── Consultation (legacy helpers) ── */
.consultation-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
}

.form-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-muted);
}

.phone-input-row {
    display: flex;
    gap: 8px;
    min-width: 0;
}

.phone-input-row input {
    flex: 1;
    height: 48px;
    padding: 0 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-family: var(--font);
    font-size: 16px;
}

.privacy-check {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    color: var(--color-muted);
    line-height: 1.4;
}

.privacy-check a { color: var(--color-primary); }

.btn-full { width: 100%; }

/* ── Chat widget (redesign) ── */
.chat-panel {
    width: 360px;
    border-radius: var(--radius-lg);
    padding: 0;
    overflow: hidden;
}

.chat-panel-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 20px 20px 0;
}

.chat-agent {
    display: flex;
    gap: 12px;
    align-items: center;
}

.chat-agent-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--gradient-teal);
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.chat-agent strong { font-size: 16px; }

.chat-agent p {
    font-size: 13px;
    color: var(--color-muted);
}

.chat-close {
    background: none;
    border: none;
    font-size: 24px;
    line-height: 1;
    color: var(--color-muted);
    cursor: pointer;
}

.chat-panel-subtitle {
    padding: 12px 20px 0;
    font-size: 14px;
    color: var(--color-muted);
}

.chat-panel-form {
    padding: 16px 20px 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.chat-panel-form input[type="text"],
.chat-panel-form input[type="tel"] {
    width: 100%;
}

/* ── Property detail page ── */
.property-page {
    padding-top: 24px;
    padding-bottom: 48px;
}

.property-page-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 32px;
    align-items: start;
}

.property-page-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 380px;
    gap: 40px 32px;
    align-items: start;
    margin-bottom: 28px;
}

.property-page-body {
    min-width: 0;
}

.property-page-agency {
    width: 380px;
    max-width: 100%;
    justify-self: end;
}

.property-page-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 24px;
}

.property-page-intro {
    min-width: 0;
}

.property-page-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.15;
    color: var(--color-title);
    margin-bottom: 12px;
}

.property-page-title-text {
    min-width: 0;
}

.property-page-title-link {
    flex-shrink: 0;
    color: var(--color-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.property-page-title-link:hover {
    opacity: 0.8;
}

.property-page-address {
    display: inline-flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    color: var(--color-muted);
    margin-bottom: 16px;
    max-width: 520px;
}

.property-page-address img {
    flex-shrink: 0;
    margin-top: 3px;
    opacity: 0.55;
}

.property-page-actions-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.property-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 18px;
    border: none;
    border-radius: 999px;
    font-family: var(--font);
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}

.property-action-favorite {
    background: var(--color-call-bg);
    color: var(--color-primary);
}

.property-action-share {
    background: var(--color-write-bg);
    color: var(--color-accent-dark);
}

.property-page-price-block {
    text-align: left;
    flex-shrink: 0;
    min-width: 200px;
    padding-top: 4px;
}

.property-page-price {
    font-size: 32px;
    font-weight: 700;
    color: var(--color-title);
    line-height: 1;
    margin-bottom: 8px;
    white-space: nowrap;
}

.property-page-price-value {
    font-size: inherit;
    font-weight: inherit;
}

.property-page-price-sqm {
    font-size: 16px;
    color: var(--color-muted);
    margin-bottom: 12px;
}

.property-currency-switcher {
    display: inline-flex;
    background: #ECEEF2;
    border-radius: 999px;
    padding: 4px;
    gap: 2px;
}

.property-currency-switcher .currency-btn {
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: transparent;
    font-size: 16px;
    font-weight: 600;
    color: var(--color-title);
    cursor: pointer;
}

.property-currency-switcher .currency-btn.active {
    background: var(--color-primary);
    color: #FFFFFF;
    border-radius: 50%;
}

.property-gallery-main-wrap {
    position: relative;
    display: grid;
    margin-bottom: 12px;
}

.property-gallery-main-wrap > .property-gallery-main {
    grid-area: 1 / 1;
    width: 100%;
    z-index: 1;
    pointer-events: none;
}

.property-gallery-main-wrap > .gallery-fullscreen-btn,
.property-gallery-main-wrap > .gallery-nav-overlay {
    grid-area: 1 / 1;
    z-index: 2;
    pointer-events: auto;
}

.property-gallery-main-wrap > .gallery-fullscreen-btn {
    z-index: 3;
}

.property-gallery-main {
    height: 480px;
    border-radius: 20px;
    background-size: cover;
    background-position: center;
}

.property-gallery-placeholder {
    background: var(--color-bg-gray);
}

.gallery-fullscreen-btn {
    justify-self: end;
    align-self: start;
    margin: 16px 16px 0 0;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.92);
    color: var(--color-title);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    position: relative;
}

.gallery-fullscreen-btn:hover {
    background: #fff;
}

/* Gallery lightbox */
body.gallery-lightbox-open {
    overflow: hidden;
}

.gallery-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 56px 40px 40px;
}

.gallery-lightbox[hidden] {
    display: none;
}

.gallery-lightbox-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.88);
    cursor: pointer;
}

.gallery-lightbox-dialog {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(1080px, 100%);
    max-height: calc(100vh - 96px);
}

.gallery-lightbox-image {
    display: block;
    max-width: 100%;
    max-height: calc(100vh - 120px);
    object-fit: contain;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

.gallery-lightbox-close {
    position: fixed;
    top: 16px;
    right: 16px;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 10001;
}

.gallery-lightbox-close:hover {
    background: rgba(255, 255, 255, 0.25);
}

.gallery-lightbox-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    color: var(--color-title);
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
}

.gallery-lightbox-nav:hover {
    background: #fff;
}

.gallery-lightbox-prev {
    left: -64px;
}

.gallery-lightbox-next {
    right: -64px;
}

@media (max-width: 900px) {
    .gallery-lightbox-prev {
        left: 8px;
    }

    .gallery-lightbox-next {
        right: 8px;
    }
}

.gallery-nav-overlay {
    align-self: center;
    justify-self: start;
    margin-left: 16px;
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
    font-size: 24px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--color-title);
}

.gallery-prev.gallery-nav-overlay { margin-left: 16px; }

.gallery-next.gallery-nav-overlay {
    justify-self: end;
    margin-right: 16px;
    margin-left: 0;
}

.lot-gallery .gallery-nav-overlay {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.85);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
    color: var(--color-primary);
    transition: background 0.2s, box-shadow 0.2s, transform 0.15s, color 0.2s;
}

.lot-gallery .gallery-nav-overlay svg {
    display: block;
    flex-shrink: 0;
    opacity: 0.9;
}

.lot-gallery .gallery-nav-overlay:hover {
    background: #FFFFFF;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
    transform: scale(1.04);
    color: #006B5F;
}

.lot-gallery .gallery-nav-overlay:hover svg {
    opacity: 1;
}

.lot-gallery .gallery-nav-overlay:active {
    transform: scale(0.98);
}

.property-gallery-thumbs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
}

.property-gallery-thumb {
    width: 80px;
    height: 80px;
    border-radius: 12px;
    border: 2px solid transparent;
    background-size: cover;
    background-position: center;
    cursor: pointer;
    flex-shrink: 0;
}

.property-gallery-thumb.active {
    border-color: var(--color-primary);
}

.property-section-title {
    font-size: 28px;
    font-weight: 700;
    color: var(--color-title);
    margin-bottom: 20px;
}

.property-specs-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px 24px;
    margin-bottom: 32px;
}

.property-spec-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
}

.property-spec-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #E5F1F0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.property-spec-label {
    display: block;
    font-size: 14px;
    color: var(--color-muted);
    margin-bottom: 4px;
}

.property-spec-value {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: var(--color-title);
}

.property-description-section {
    margin-bottom: 28px;
}

.property-description-text {
    font-size: 16px;
    line-height: 1.7;
    color: var(--color-text);
}

.property-submit-request {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 220px;
    height: 52px;
    padding: 0 28px;
    margin-bottom: 32px;
    border: none;
    border-radius: 999px;
    background: var(--color-primary);
    color: #FFFFFF;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
}

.property-submit-request:hover {
    opacity: 0.92;
}

.property-location-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 12px;
}

.property-location-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    margin-bottom: 16px;
}

.property-location-head .property-location-title {
    margin-bottom: 0;
    flex-shrink: 0;
}

.property-location-head .property-location-address {
    margin-bottom: 0;
    justify-content: flex-end;
    text-align: right;
    max-width: min(560px, 58%);
    min-width: 0;
}

.property-location-head .property-location-address span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.property-location-address {
    margin-bottom: 16px;
}

.property-lot-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    margin-top: 16px;
    font-size: 14px;
    color: var(--color-muted);
}

.property-lot-meta span:not(:first-child)::before {
    content: ' · ';
}

.property-report-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
    padding: 0 24px;
    height: 48px;
    border: none;
    border-radius: 999px;
    background: var(--color-primary);
    color: #FFFFFF;
    font-family: var(--font);
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}

.property-report-btn img {
    filter: brightness(0) invert(1);
}

.property-report-btn:hover {
    opacity: 0.92;
}

.property-map {
    height: 420px;
    border-radius: 12px;
    margin-top: 0;
    z-index: 1;
    border: 1px solid #E5E7EB;
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.08);
    overflow: hidden;
    background: #EEF2F6;
}

.property-map .leaflet-container {
    font-family: var(--font);
    border-radius: 12px;
}

.property-map .leaflet-control-attribution {
    font-size: 11px;
    background: rgba(255, 255, 255, 0.88);
}

.map-marker-overlay {
    position: absolute;
    pointer-events: none;
}

.map-type-control {
    display: inline-flex;
    background: #FFFFFF;
    border-radius: 4px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
    overflow: hidden;
}

.map-type-btn {
    border: none;
    background: #FFFFFF;
    color: #1F2937;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 500;
    padding: 10px 14px;
    cursor: pointer;
}

.map-type-btn + .map-type-btn {
    border-left: 1px solid #E5E7EB;
}

.map-type-btn.is-active {
    font-weight: 600;
}

.map-fullscreen-btn {
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 2px;
    background: #FFFFFF;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
    color: #374151;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.map-marker-wrap {
    background: transparent;
    border: none;
}

.map-marker-pin {
    position: relative;
    width: 46px;
    height: 46px;
    background: var(--color-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.28);
}

.map-marker-house {
    width: 22px;
    height: 22px;
    background: url('/static/icons/home.svg') center / contain no-repeat;
    filter: brightness(0) invert(1);
}

.map-marker-pin--yellow {
    background: #F4C430;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.22);
}

.map-marker-pin--yellow .map-marker-house {
    filter: brightness(0) invert(1);
}

.map-marker-tail {
    position: absolute;
    left: 50%;
    bottom: -9px;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    border-top: 11px solid var(--color-primary);
}

.property-meta-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin: 28px 0;
    font-size: 14px;
    color: var(--color-muted);
}

.similar-properties {
    margin-top: 12px;
}

.similar-properties-title {
    margin-bottom: 24px;
}

.property-page-sidebar {
    position: sticky;
    top: 24px;
}

.agency-card-inner {
    background: #F3F4F6;
    border-radius: 20px;
    padding: 24px;
}

.agency-card-header {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-bottom: 20px;
}

.agency-card-heading {
    flex: 1;
    min-width: 0;
}

.agency-card-chevron {
    flex-shrink: 0;
    opacity: 0.45;
}

.agency-logo {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #FFFFFF;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 20px;
    flex-shrink: 0;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

.agency-name {
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.25;
}

.agency-label {
    font-size: 14px;
    color: var(--color-muted);
    margin-top: 2px;
}

.agency-actions-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding: 0;
}

.agency-actions-row .lead-result {
    grid-column: 1 / -1;
}

.agency-actions-row .lead-result:empty {
    display: none;
}

.agency-actions-row .btn-agency-write,
.agency-actions-row .btn-agency-call {
    width: 100%;
    min-width: 0;
}

.btn-favorite-page.active,
.property-action-favorite.active {
    background: var(--color-primary);
    color: #fff;
}

/* Header currency switcher — must stay flat (override page-level .currency-switcher) */
.header-currency-switcher {
    display: flex;
    align-items: center;
    background: transparent;
    border-radius: 0;
    padding: 0;
    gap: 0;
    box-shadow: none;
}

.header-currency-switcher .currency-header-btn {
    box-shadow: none;
    filter: none;
    background: transparent;
}

.property-favorite.active svg {
    fill: #EF4444;
}

.property-promo-inline {
    margin: 32px 0;
    padding: 32px;
    border-radius: var(--radius-lg);
    background: var(--gradient-teal);
    color: #FFFFFF;
    text-align: center;
}

.property-promo-inline h3 {
    font-size: 22px;
    margin-bottom: 8px;
}

.property-promo-inline p {
    margin-bottom: 16px;
    opacity: 0.9;
}

.report-link {
    color: var(--color-primary);
    text-decoration: none;
}

.btn-agency-write { width: 100%; }

.btn-agency-call {
    width: 100%;
    background: var(--color-primary) !important;
    color: #FFFFFF !important;
    justify-content: center;
}

.btn-agency-call img {
    filter: brightness(0) invert(1);
}

.search-map {
    height: 480px;
    border-radius: var(--radius-lg);
    margin: 24px 0;
    z-index: 1;
}

.auth-page h1 {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 12px;
}

.auth-subtitle {
    color: var(--color-muted);
    margin-bottom: 24px;
}

.auth-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.auth-form input:not(.phone-field-input):not(.phone-field-search-input),
.auth-form textarea {
    padding: 12px 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-family: var(--font);
    font-size: 16px;
}

.auth-form textarea { min-height: 120px; resize: vertical; }

.auth-note {
    margin-top: 16px;
    font-size: 14px;
    color: var(--color-muted);
}

@media (max-width: 1100px) {
    .property-page-header {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .property-page-agency {
        width: 100%;
        justify-self: stretch;
    }

    .property-page-layout { grid-template-columns: 1fr; }
    .property-page-sidebar { order: -1; }
    .agency-card-inner { position: static; }
    .property-grid-4 { grid-template-columns: repeat(2, 1fr); }
    .property-grid-3 { grid-template-columns: repeat(2, 1fr); }
    .consultation-panel { grid-template-columns: 1fr; gap: 32px; padding: 32px 24px; }

    .consultation-form-row { grid-template-columns: 1fr; }
    .footer-top {
        grid-template-columns: 1fr 1fr;
        gap: 32px 48px;
    }
    .footer-brand { grid-column: 1 / -1; }
    .footer-col-catalog,
    .footer-col-contacts { justify-self: start; }
    .articles-home-layout { grid-template-columns: 1fr; }

    .article-featured,
    .article-featured-link { min-height: 320px; }
    .listing-promo {
        flex-direction: column;
        align-items: flex-start;
        min-height: 240px;
        padding: 32px 24px;
    }
    .listing-promo-content { max-width: 100%; flex-basis: auto; }
    .listing-promo-visual { width: 100%; max-width: 360px; margin: 8px auto 0; }
    .listing-promo-circles { right: 50%; transform: translate(50%, -50%); opacity: 0.6; }
    .listing-promo-card { right: 50%; transform: translateX(50%); }
}

@media (max-width: 900px) {
    .header-right { grid-column: 2; grid-row: 1; }
    .property-page-top { flex-direction: column; }
    .property-page-price-block { text-align: left; }
    .property-specs-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .chat-panel { width: calc(100vw - 48px); }
    .hero-filter-row { display: none; }
    .hero-filter-row.filters-expanded { display: flex; flex-direction: column; align-items: stretch; }
}

/* ── Property card menu ── */
.property-menu-wrap { position: relative; }

.property-menu-item img {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

/* ── Lead modal ── */
.lead-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}
.lead-modal[hidden] { display: none; }
.lead-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.45);
}
.lead-modal-dialog {
    position: relative;
    background: #fff;
    border-radius: var(--radius-lg);
    padding: 32px;
    width: min(440px, calc(100vw - 32px));
    z-index: 1;
}
.lead-modal-dialog h3 { font-size: 24px; font-weight: 700; margin-bottom: 8px; }
.lead-modal-subtitle { color: var(--color-muted); margin-bottom: 20px; }
.lead-modal-dialog input[type="text"],
.lead-modal-dialog input[type="tel"]:not(.phone-field-input):not(.phone-field-search-input) {
    width: 100%;
    height: 48px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    padding: 0 16px;
    margin-bottom: 12px;
    font-family: var(--font);
}
.lead-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    background: none;
    border: none;
    font-size: 24px;
    line-height: 1;
}
.lead-modal-dialog form .btn-search.btn-full {
    margin-top: 32px;
}
.phone-error { color: #DC2626; font-size: 13px; margin: -8px 0 12px; }
.lead-result { width: 100%; font-size: 14px; color: var(--color-primary); }

/* ── Agency card enhanced ── */
.agency-card-header {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-bottom: 12px;
}
.agency-logo {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--gradient-teal);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 20px;
}
.agency-verified {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    color: var(--color-primary);
    background: #E5F1F0;
    padding: 2px 8px;
    border-radius: 999px;
    margin-left: 4px;
}
.agency-agent { font-size: 14px; color: var(--color-muted); margin-bottom: 16px; }

.gallery-counter {
    font-size: 14px;
    color: var(--color-muted);
    margin: 0;
}

.gallery-nav-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin: 8px 0;
}

.gallery-nav.gallery-nav-overlay {
    position: static;
    width: 44px;
    height: 44px;
    border: none;
    padding: 0;
}

.gallery-nav {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--color-border);
    background: #fff;
    font-size: 22px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gallery-nav:hover { border-color: var(--color-primary); color: var(--color-primary); }

.back-link {
    display: inline-block;
    margin-bottom: 20px;
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 600;
}
.back-link:hover { text-decoration: underline; }

/* ── Search modal ── */
.search-modal {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
}

.search-modal[hidden] { display: none; }

.search-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}

.search-modal-shell {
    position: relative;
    width: min(960px, 100%);
    z-index: 1;
}

.search-modal-close {
    position: absolute;
    top: -18px;
    right: -18px;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: #FFFFFF;
    color: var(--color-subtle);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    z-index: 2;
    transition: background 0.2s;
}

.search-modal-close:hover {
    background: #F3F4F6;
}

.search-modal-dialog {
    background: #FFFFFF;
    border-radius: 32px;
    overflow: hidden;
    max-height: min(90vh, 860px);
    display: flex;
    flex-direction: column;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.18);
}

.search-modal-form {
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
}

.search-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 28px 32px 20px;
    flex-shrink: 0;
}

.search-modal-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--color-title);
    margin: 0;
}

.search-modal-clear {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: none;
    background: none;
    color: #DC2626;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    padding: 4px 0;
}

.search-modal-clear:hover { opacity: 0.85; }

.search-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 0 32px 24px;
    scrollbar-width: thin;
    scrollbar-color: #D1D5DB transparent;
}

.search-modal-body::-webkit-scrollbar {
    width: 6px;
}

.search-modal-body::-webkit-scrollbar-thumb {
    background: #D1D5DB;
    border-radius: 999px;
}

.search-modal-query-wrap {
    position: relative;
    margin-bottom: 24px;
}

.search-modal-query {
    width: 100%;
    height: 48px;
    padding: 0 48px 0 16px;
    border: none;
    border-radius: 12px;
    background: #F3F4F6;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
    outline: none;
}

.search-modal-query:focus {
    box-shadow: inset 0 0 0 2px var(--color-primary);
}

.search-modal-query-icon {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.45;
    pointer-events: none;
}

.search-modal-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 24px;
}

.search-modal-row {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 24px;
    min-width: 0;
}

.search-modal-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.search-modal-field-full {
    grid-column: 1 / -1;
}

.search-modal-field-type .search-type-chips {
    flex-wrap: wrap;
}

.search-modal-field-type .search-type-chip {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0 10px;
    font-size: 13px;
}

.search-modal-field-price {
    gap: 10px;
}

.search-modal-price-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 32px;
}

.search-modal-price-head .search-modal-label {
    margin: 0;
    flex-shrink: 0;
}

.search-modal-field-price .search-modal-currency {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    margin: 0;
    flex-shrink: 0;
}

.search-modal-field-price .search-currency-btn {
    width: auto;
    min-width: 0;
    height: auto;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    color: var(--color-title);
}

.search-modal-field-price .search-currency-btn.is-active {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: var(--color-primary);
    color: #FFFFFF;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.search-modal-price-range {
    margin-top: 2px;
}

.search-modal-label {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-title);
}

.search-modal-select-wrap {
    position: relative;
}

.search-modal-select,
.search-modal-input {
    width: 100%;
    height: 48px;
    padding: 0 40px 0 16px;
    border: none;
    border-radius: 12px;
    background: #F3F4F6;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
    outline: none;
    appearance: none;
    -webkit-appearance: none;
}

.search-modal-input {
    padding: 0 16px;
}

.search-modal-select:focus,
.search-modal-input:focus {
    box-shadow: inset 0 0 0 2px var(--color-primary);
}

.search-modal-select-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    opacity: 0.45;
}

.search-type-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.search-type-chip {
    height: 40px;
    padding: 0 16px;
    border: none;
    border-radius: 12px;
    background: #F3F4F6;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text);
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.search-type-chip.is-active {
    background: var(--color-primary);
    color: #FFFFFF;
}

.search-modal-currency {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.search-currency-btn {
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 12px;
    background: #F3F4F6;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 600;
    color: var(--color-text);
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.search-currency-btn.is-active {
    background: var(--color-primary);
    color: #FFFFFF;
}

.search-modal-range {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.search-modal-advantages {
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid #E5E7EB;
}

.search-modal-advantages-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-title);
    margin: 0 0 16px;
}

.search-advantages-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px 20px;
}

.search-advantage {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    font-size: 14px;
    line-height: 1.35;
    color: var(--color-text);
}

.search-advantage input {
    width: 18px;
    height: 18px;
    margin-top: 1px;
    flex-shrink: 0;
    accent-color: var(--color-primary);
    border-radius: 4px;
    cursor: pointer;
}

.search-modal-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding: 20px 32px 28px;
    flex-shrink: 0;
    border-top: 1px solid #E5E7EB;
    background: #FFFFFF;
}

.search-modal-submit,
.search-modal-map {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 48px;
    padding: 0 24px;
    border-radius: 999px;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    border: none;
    white-space: nowrap;
    transition: opacity 0.2s;
}

.search-modal-submit {
    background: var(--color-primary);
    color: #FFFFFF;
}

.search-modal-submit img {
    filter: brightness(0) invert(1);
}

.search-modal-map {
    background: var(--color-accent);
    color: #000000;
}

.search-modal-submit:hover,
.search-modal-map:hover {
    opacity: 0.92;
}

body.search-modal-open {
    overflow: hidden;
}

@media (max-width: 768px) {
    .search-modal-grid {
        grid-template-columns: 1fr;
    }

    .search-modal-row {
        grid-template-columns: 1fr;
    }

    .search-modal-field-full {
        grid-column: auto;
    }

    .search-advantages-grid {
        grid-template-columns: 1fr;
    }

    .search-modal-header,
    .search-modal-body,
    .search-modal-footer {
        padding-left: 20px;
        padding-right: 20px;
    }

    .search-modal-close {
        top: -12px;
        right: -4px;
    }

    .search-modal-footer {
        flex-direction: column;
    }

    .search-modal-submit,
    .search-modal-map {
        width: 100%;
    }
}

/* ── Auth modal (login / registration / recovery) ── */
.auth-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
}

.auth-modal[hidden] {
    display: none;
}

.auth-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}

.auth-modal-shell {
    position: relative;
    width: min(480px, 100%);
    z-index: 1;
}

.auth-modal-close {
    position: absolute;
    top: -32px;
    right: -32px;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: #FFFFFF;
    color: var(--color-subtle);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    z-index: 2;
    transition: background 0.2s;
}

.auth-modal-close:hover {
    background: #F3F4F6;
}

.auth-modal-dialog {
    background: #FFFFFF;
    border-radius: 32px;
    padding: 32px 40px 36px;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.18);
}

.auth-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 20px;
}

.auth-panel-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    color: #000000;
}

.auth-panel-switch {
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 0.35em;
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: #000000;
    text-align: right;
    white-space: nowrap;
}

.auth-switch-link {
    display: inline;
    border: none;
    background: none;
    padding: 0;
    margin: 0;
    font: inherit;
    line-height: inherit;
    vertical-align: baseline;
    color: var(--color-primary);
    text-decoration: underline;
    cursor: pointer;
}

.auth-switch-link:hover {
    opacity: 0.85;
}

.auth-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.auth-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.auth-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.auth-label {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    color: #000000;
}

.auth-input {
    width: 100%;
    height: 44px;
    border: none;
    border-radius: 12px;
    background: #F3F4F6;
    padding: 0 14px;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 400;
    color: #000000;
    outline: none;
}

.auth-input::placeholder {
    color: #9CA3AF;
}

.auth-input:focus {
    box-shadow: inset 0 0 0 2px rgba(0, 116, 105, 0.35);
}

.auth-password-wrap {
    position: relative;
    display: block;
}

.auth-input-password {
    padding-right: 88px;
}

.auth-password-toggle {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: none;
    background: none;
    padding: 0;
    font-family: var(--font);
    font-size: 13px;
    font-weight: 500;
    color: #6B7280;
    cursor: pointer;
}

.auth-password-toggle svg {
    flex-shrink: 0;
}

.auth-phone-wrap {
    display: flex;
    align-items: stretch;
    background: #F3F4F6;
    border-radius: 12px;
    overflow: hidden;
}

.auth-phone-prefix {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 44px;
    padding: 0 10px 0 12px;
    border: none;
    border-right: 1px solid #E5E7EB;
    background: transparent;
    flex-shrink: 0;
    cursor: pointer;
}

.auth-phone-input {
    border-radius: 0;
    background: transparent;
    padding-left: 12px;
}

.auth-select-wrap {
    position: relative;
    display: block;
}

.auth-select-wrap select.custom-select-native {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

.auth-select {
    width: 100%;
    height: 44px;
    padding: 0 40px 0 14px;
    border: none;
    border-radius: 12px;
    background: #F3F4F6;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 400;
    color: #000000;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    outline: none;
}

.auth-select-icon {
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
    pointer-events: none;
    opacity: 0.55;
    transition: transform 0.2s ease;
}

.auth-select-wrap.custom-select.is-open .auth-select-icon {
    transform: translateY(-50%) rotate(180deg);
}

.auth-select-wrap.custom-select .custom-select-trigger {
    width: 100%;
    height: 44px;
    padding: 0 40px 0 14px;
    border: none;
    border-radius: 12px;
    background: #F3F4F6;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 400;
    color: #000000;
    box-shadow: none;
}

.auth-select-wrap.custom-select .custom-select-trigger:focus-visible {
    box-shadow: inset 0 0 0 2px rgba(0, 116, 105, 0.35);
}

.auth-select-wrap.custom-select .custom-select-dropdown {
    top: calc(100% + 6px);
    padding: 8px;
    border: none;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    max-height: none;
    overflow: visible;
}

.auth-select-wrap.custom-select .custom-select-options {
    gap: 2px;
}

.auth-role-option {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 8px 10px;
    border: none;
    border-radius: 8px;
    background: none;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.3;
    color: #000929;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s ease;
}

.auth-role-option:hover {
    background: #F3F4F6;
    color: #000929;
}

.auth-role-option.is-active {
    background: #E6F4F2;
    color: #000929;
    font-weight: 500;
}

.auth-role-option-icon {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #007469;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
    font-style: italic;
    line-height: 18px;
    text-align: center;
}

.auth-role-option-label {
    min-width: 0;
}

.auth-panel[data-auth-panel="register"] .auth-select-wrap.custom-select .custom-select-trigger {
    height: 40px;
    font-size: 13px;
}

.auth-panel[data-auth-panel="register"] .auth-role-option {
    font-size: 13px;
    padding: 7px 8px;
}

.auth-forgot-wrap {
    margin-top: -8px;
    text-align: right;
}

.auth-forgot-link {
    border: none;
    background: none;
    padding: 0;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 400;
    color: #000000;
    text-decoration: underline;
    cursor: pointer;
}

.auth-submit-btn {
    width: 100%;
    height: 44px;
    margin-top: 2px;
    border: none;
    border-radius: 14px;
    background: #D1D5DB;
    color: #000929;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}

.auth-submit-btn:hover {
    background: #C4C9D1;
}

.auth-recovery-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.auth-back-btn {
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: #000000;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
}

.auth-back-btn:hover {
    background: #F3F4F6;
}

.auth-recovery-subtitle {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #4B5563;
    margin-bottom: 20px;
}

.auth-link-action {
    font-size: 14px;
    line-height: 1.5;
    color: #4B5563;
    margin: 0;
}

.auth-panel[data-auth-panel="recovery"] .auth-recovery-head {
    gap: 10px;
    margin-bottom: 8px;
}

.auth-panel[data-auth-panel="recovery"] .auth-panel-title {
    font-size: 22px;
}

.auth-panel[data-auth-panel="recovery"] .auth-back-btn {
    width: 28px;
    height: 28px;
}

.auth-panel[data-auth-panel="recovery"] .auth-recovery-subtitle {
    font-size: 13px;
    line-height: 1.45;
    margin-bottom: 16px;
}

.auth-panel[data-auth-panel="recovery"] .auth-form {
    gap: 12px;
}

.auth-panel[data-auth-panel="recovery"] .auth-field {
    gap: 5px;
}

.auth-panel[data-auth-panel="recovery"] .auth-label {
    font-size: 13px;
}

.auth-panel[data-auth-panel="recovery"] .auth-input,
.auth-panel[data-auth-panel="recovery"] .auth-submit-btn {
    height: 40px;
    font-size: 13px;
}

body.auth-modal-open {
    overflow: hidden;
}

.auth-form-message {
    margin-bottom: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    font-size: 14px;
    line-height: 1.45;
}

.auth-form-message.is-error {
    background: #FEE2E2;
    color: #B91C1C;
}

.auth-form-message.is-success {
    background: #E5F1F0;
    color: #065B52;
}

.header-auth-wrap {
    display: inline-flex;
    align-items: center;
}

.header-profile-link {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #E5F1F0;
    color: var(--color-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 700;
}

.header-profile-link[hidden],
.header-login-btn[hidden] {
    display: none !important;
}

.header-profile-avatar {
    font-size: 12px;
    line-height: 1;
}

.auth-reset-page {
    padding-top: 40px;
    background: var(--color-bg-gray);
    min-height: calc(100vh - 72px);
}

.auth-reset-container {
    display: flex;
    justify-content: center;
}

.auth-reset-card {
    width: min(100%, 520px);
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    padding: 32px 28px;
}

.auth-reset-title {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 8px;
}

.auth-reset-subtitle {
    color: var(--color-muted);
    margin-bottom: 24px;
}

.auth-back-login {
    display: inline-block;
    margin-top: 16px;
    color: var(--color-primary);
    font-weight: 600;
    text-decoration: none;
}

@media (max-width: 640px) {
    .auth-modal-dialog {
        padding: 32px 24px 36px;
        border-radius: 28px;
    }

    .auth-modal-close {
        top: -22px;
        right: -16px;
    }

    .auth-panel-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .auth-panel-switch {
        justify-content: flex-start;
        text-align: left;
        white-space: normal;
    }

    .auth-form-row {
        grid-template-columns: 1fr;
    }

    .auth-panel-title {
        font-size: 22px;
    }
}

/* ── Search results page ── */
.search-results-page {
    background: #FFFFFF;
    padding-top: 24px;
    padding-bottom: 48px;
}

.search-results-layout {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    max-width: 1320px;
    margin: 0 auto;
}

.search-results-sidebar {
    position: sticky;
    top: 24px;
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding-right: 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.search-results-sidebar::-webkit-scrollbar {
    display: none;
}

.search-results-count {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-title);
    margin: 0 0 16px;
}

.search-results-view-toggle {
    display: flex;
    gap: 0;
    padding: 3px;
    margin-bottom: 18px;
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    background: #FFFFFF;
}

.search-view-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 34px;
    padding: 0 10px;
    border-radius: 8px;
    background: transparent;
    color: var(--color-subtle);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
    flex: 1;
}

.search-view-btn img,
.search-view-btn svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.search-view-btn.is-active {
    background: #E5F1F0;
    color: var(--color-primary);
    font-weight: 600;
}

.search-filters-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 22px;
}

.search-filters-title {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 700;
    color: var(--color-title);
}

.search-filters-title img {
    width: 16px;
    height: 16px;
}

.search-filters-reset {
    font-size: 13px;
    font-weight: 500;
    color: var(--color-primary);
    text-decoration: none;
}

.search-filters-reset:hover {
    text-decoration: underline;
}

.search-filter-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 12px;
}

.search-filter-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-title);
}

.search-filter-select-wrap {
    position: relative;
    display: block;
    width: 100%;
}

.search-filters-form .hero-select-wrap {
    flex: none;
    min-width: 0;
}

.search-filters-form .hero-select {
    height: 40px;
    padding: 0 34px 0 12px;
    border-radius: 10px;
    font-size: 14px;
}

.search-filters-form .custom-select-trigger {
    width: 100%;
    height: 40px;
    padding: 0 34px 0 12px;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    font-size: 14px;
}

.search-filters-form .custom-select-trigger:focus-visible {
    border-color: var(--color-primary);
}

.search-filters-form .hero-select-icon {
    position: absolute;
    top: 50%;
    right: 10px;
    width: 18px;
    height: 18px;
    transform: translateY(-50%);
    pointer-events: none;
    opacity: 0.5;
    z-index: 2;
}

.search-filters-form .custom-select.is-open .hero-select-icon {
    transform: translateY(-50%) rotate(180deg);
}

.search-filters-form .custom-select-dropdown {
    top: calc(100% + 6px);
    border-radius: 12px;
    padding: 8px 12px 12px;
    max-height: 320px;
    z-index: 60;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.search-filters-form .custom-select-group-label {
    font-size: 14px;
    padding-top: 8px;
}

.search-filters-form .custom-select-option-nested {
    font-size: 14px;
    padding: 6px 0;
}

.search-filters-form .custom-select-option {
    font-size: 14px;
    padding: 8px 0;
}

.search-filters-form .custom-select-reset {
    font-size: 13px;
}

.search-filters-form .custom-select.is-open {
    z-index: 20;
}

.search-filter-input {
    width: 100%;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    background: #FFFFFF;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text);
    outline: none;
}

.search-filter-input:focus {
    box-shadow: inset 0 0 0 2px var(--color-primary);
}

.search-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.search-filter-chip {
    height: 34px;
    padding: 0 12px;
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    background: #F3F4F6;
    font-family: var(--font);
    font-size: 13px;
    font-weight: 500;
    color: var(--color-text);
    cursor: pointer;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.search-filter-chip.is-active {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #FFFFFF;
    font-weight: 500;
}

.search-filter-range {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}

.search-filter-advantages {
    margin-top: 4px;
    padding-top: 14px;
    border-top: 1px solid #E5E7EB;
}

.search-filter-advantages-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-title);
    margin: 0 0 8px;
}

.search-advantages-grid-sidebar {
    grid-template-columns: 1fr;
    gap: 8px;
    max-height: 240px;
    overflow-y: auto;
    padding-right: 4px;
    scrollbar-width: thin;
}

.search-filters-form .search-advantage {
    gap: 8px;
    font-size: 13px;
    line-height: 1.3;
}

.search-filters-form .search-advantage input {
    width: 16px;
    height: 16px;
    margin-top: 1px;
}

.search-filter-field-price .search-modal-price-head {
    margin-bottom: 6px;
}

.search-filter-field-price .search-filter-currency {
    margin-bottom: 0;
    gap: 6px;
}

.search-filter-field-price .search-currency-btn {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 400;
}

.search-results-main {
    min-width: 0;
}

.search-results-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.search-sort-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 160px;
}

.search-sort-wrap svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    opacity: 0.55;
}

.search-sort-wrap.custom-select .custom-select-trigger {
    width: 100%;
    height: 34px;
    padding: 0 30px 0 10px;
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    background: #FFFFFF;
    font-family: var(--font);
    font-size: 13px;
    font-weight: 500;
    color: var(--color-text);
    box-shadow: none;
}

.search-sort-wrap.custom-select .custom-select-trigger:focus-visible {
    border-color: #BFDBFE;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.12);
}

.search-sort-wrap.custom-select .custom-select-dropdown {
    top: calc(100% + 6px);
    left: 22px;
    right: 0;
    min-width: 220px;
    padding: 8px;
    border: none;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    max-height: none;
    overflow: visible;
}

.search-sort-wrap.custom-select .custom-select-options {
    gap: 0;
}

.search-sort-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 10px 12px;
    border: none;
    border-radius: 8px;
    background: none;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.3;
    color: #000929;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s ease;
}

.search-sort-option:hover {
    background: #F9FAFB;
    color: #000929;
}

.search-sort-option.is-active {
    font-weight: 500;
    color: #000929;
}

.search-sort-option-label {
    min-width: 0;
}

.search-sort-option-check {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    opacity: 0;
    visibility: hidden;
}

.search-sort-option.is-active .search-sort-option-check {
    opacity: 1;
    visibility: visible;
}

.search-sort-select {
    width: 100%;
    height: 34px;
    padding: 0 30px 0 6px;
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    background: #FFFFFF;
    font-family: var(--font);
    font-size: 13px;
    font-weight: 500;
    color: var(--color-text);
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    cursor: pointer;
}

.search-sort-icon {
    position: absolute;
    right: 8px;
    top: 50%;
    width: 18px;
    height: 18px;
    transform: translateY(-50%);
    pointer-events: none;
    opacity: 0.45;
    transition: transform 0.2s ease;
}

.search-sort-wrap.custom-select.is-open .search-sort-icon {
    transform: translateY(-50%) rotate(180deg);
}

.search-card-view-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0;
    padding: 3px;
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    background: #FFFFFF;
}

.search-card-view-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 34px;
    padding: 0 10px;
    border-radius: 8px;
    background: transparent;
    color: var(--color-subtle);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}

.search-card-view-btn svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.search-card-view-btn.is-active {
    background: #E5F1F0;
    color: var(--color-primary);
    font-weight: 600;
}

.property-grid-search {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px 24px;
}

.property-grid-search .property-card-image {
    height: 220px;
}

.property-grid-search .property-title {
    font-size: 20px;
}

.property-grid-search .property-price {
    font-size: 20px;
}

.property-grid-search-list {
    grid-template-columns: 1fr;
    gap: 30px;
}

.search-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 32px;
    padding-bottom: 10px;
}

.search-map-cards-scroll .search-pagination {
    margin-top: 16px;
    padding: 0 4px 10px;
}

.search-pagination-bar {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
    padding: 4px;
    border-radius: 999px;
    border: 1px solid #E5E7EB;
    background: linear-gradient(180deg, #FFFFFF 0%, #F9FAFB 100%);
    box-shadow: 0 4px 16px rgba(0, 41, 41, 0.05);
}

.search-pagination-arrow,
.search-pagination-page,
.search-pagination-ellipsis {
    flex-shrink: 0;
}

.search-pagination-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    border: 1px solid transparent;
    background: #FFFFFF;
    color: var(--color-primary);
    text-decoration: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.search-pagination-arrow svg {
    width: 16px;
    height: 16px;
}

.search-pagination-arrow:hover {
    background: var(--color-call-bg);
    border-color: rgba(0, 116, 105, 0.18);
    transform: translateY(-1px);
    box-shadow: 0 3px 10px rgba(0, 116, 105, 0.1);
}

.search-pagination-arrow.is-disabled {
    opacity: 0.35;
    pointer-events: none;
    box-shadow: none;
}

.search-pagination-pages {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 0 2px;
    min-width: 0;
}

.search-pagination-page {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 4px;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--color-subtle);
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.search-pagination-page:hover {
    background: var(--color-call-bg);
    color: var(--color-primary);
    border-color: rgba(0, 116, 105, 0.12);
}

.search-pagination-page.is-active {
    background: var(--gradient-teal);
    border-color: transparent;
    color: #FFFFFF;
    box-shadow: 0 4px 12px rgba(0, 116, 105, 0.22);
    transform: translateY(-1px);
}

.search-pagination-ellipsis {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 32px;
    color: #9CA3AF;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.06em;
    user-select: none;
}

/* Search list view cards */
.property-card-list {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 20px;
    padding: 16px;
    border: 1px solid #E5E7EB;
    border-radius: 16px;
    background: #FFFFFF;
}

.property-card-list-media {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.property-card-list-main-link {
    display: block;
    text-decoration: none;
}

.property-card-list-main {
    position: relative;
    width: 100%;
    height: 180px;
    border-radius: 12px;
    overflow: hidden;
}

.property-card-list-main .property-image-placeholder {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.property-card-list-main .property-badge-hot {
    top: 8px;
    left: 0;
}

.property-card-list-thumbs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
}

.property-card-list-thumb {
    display: block;
    height: 52px;
    border-radius: 8px;
    background-size: cover;
    background-position: center;
    background-color: #E5E7EB;
}

.property-card-list-body {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.property-card-list-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 4px;
}

.property-card-list-head .property-price {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-title);
    line-height: 1.2;
}

.property-card-list-actions-top {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.property-favorite-inline {
    position: static;
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    box-shadow: none;
    cursor: pointer;
}

.property-card-list-body-link {
    text-decoration: none;
    color: inherit;
}

.property-card-list .property-title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 6px;
}

.property-card-list-specs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 12px 0;
    padding: 12px 0;
    border-top: 1px solid #F3F4F6;
    border-bottom: 1px solid #F3F4F6;
}

.property-card-list-specs span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-muted);
}

.property-card-list-desc {
    font-size: 14px;
    line-height: 1.5;
    color: var(--color-muted);
    margin: 0 0 16px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.property-card-list-footer {
    margin-top: auto;
    justify-content: flex-end;
}

.property-card-list-footer .btn-call {
    order: 1;
}

.property-card-list-footer .btn-write {
    order: 2;
}

.search-empty-state {
    grid-column: 1 / -1;
}

.search-map-results {
    height: 640px;
    border-radius: var(--radius-lg);
    overflow: hidden;
}

/* ── Search map view (full-page map + left overlay panel) ── */
html:has(.search-results-page--map),
body:has(.search-results-page--map) {
    overflow: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

html:has(.search-results-page--map)::-webkit-scrollbar,
body:has(.search-results-page--map)::-webkit-scrollbar {
    display: none;
}

body:has(.search-results-page--map) .site-footer {
    display: none;
}

body:has(.search-results-page--map) .main-content {
    overflow: hidden;
}

.search-results-page--map {
    padding: 0;
    margin: 0;
    background: transparent;
    height: calc(100vh - 72px);
    min-height: calc(100vh - 72px);
}

.search-map-shell {
    position: relative;
    display: flex;
    align-items: stretch;
    width: 100%;
    min-height: calc(100vh - 72px);
    overflow: hidden;
}

.search-map-stage {
    position: absolute;
    inset: 0;
    z-index: 0;
    background: #D1D5DB;
}

.search-map-stage .search-map {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    margin: 0;
    border-radius: 0;
    z-index: 1;
}

.search-map-panel {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    flex: 0 0 526px;
    width: 526px;
    max-width: min(526px, 100%);
    padding: 24px 28px;
    min-height: calc(100vh - 72px);
    max-height: calc(100vh - 72px);
    background: #FFFFFF;
    border-top-right-radius: 40px;
    box-shadow: 8px 0 32px rgba(15, 23, 42, 0.12);
    overflow: hidden;
}

.search-map-panel-head {
    flex-shrink: 0;
    margin-bottom: 16px;
}

.search-map-panel-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
    margin-bottom: 16px;
}

.search-map-panel-toolbar .search-sort-wrap {
    flex: 1;
    min-width: 0;
}

.search-map-filters-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 44px;
    padding: 0 16px;
    border: 1px solid #E5E7EB;
    border-radius: 12px;
    background: #FFFFFF;
    font-size: 15px;
    font-weight: 600;
    color: var(--color-title);
    flex-shrink: 0;
    white-space: nowrap;
}

.search-map-filters-btn:hover {
    background: #F9FAFB;
}

.search-map-cards-scroll {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 4px 8px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.search-map-cards-scroll::-webkit-scrollbar {
    display: none;
}

.search-map-cards-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 12px;
}

.search-map-cards-grid .search-empty-state {
    grid-column: 1 / -1;
}

/* Map property cards */
.property-card-map {
    min-width: 0;
    max-width: 100%;
    position: relative;
    padding: 4px;
    border-radius: 16px;
    transition: box-shadow 0.18s ease, background-color 0.18s ease, opacity 0.18s ease;
}

.search-map-cards-grid:has(.property-card-map.is-highlighted) .property-card-map:not(.is-highlighted) {
    opacity: 0.65;
}

.property-card-map.is-highlighted {
    background: rgba(229, 241, 240, 0.98);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12);
    z-index: 1;
    opacity: 1 !important;
}

.property-card-map-image-link {
    display: block;
    text-decoration: none;
    margin-bottom: 8px;
}

.property-card-map-image {
    position: relative;
    width: 100%;
    aspect-ratio: 1;
    border-radius: 16px;
    overflow: hidden;
    isolation: isolate;
}

.property-card-map-image .property-image-placeholder {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
}

.property-card-map-image .property-favorite {
    top: 8px;
    right: 8px;
    width: 32px;
    height: 32px;
}

.property-card-map-image .property-badge-hot {
    top: 8px;
    left: 0;
}

.property-card-map-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.property-card-map-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.property-card-map-top .property-price {
    font-size: 16px;
    font-weight: 700;
    color: var(--color-primary-dark);
    line-height: 1.2;
}

.property-card-map-icons {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.property-map-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    padding: 0;
    cursor: pointer;
}

.property-card-map-body-link {
    text-decoration: none;
    color: inherit;
    min-width: 0;
}

.property-card-map .property-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--color-title);
    line-height: 1.3;
    margin-bottom: 2px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.property-card-map .property-address-compact {
    font-size: 13px;
    font-weight: 500;
    color: var(--color-muted);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
}

.property-meta-map {
    gap: 8px;
    margin-top: 4px;
}

.property-meta-map span {
    font-size: 12px;
    gap: 4px;
}

.property-meta-map img {
    width: 14px !important;
    height: 14px !important;
}

/* Leaflet house markers */
.map-house-marker {
    background: none !important;
    border: none !important;
    transition: transform 0.15s ease, filter 0.15s ease;
}

.map-house-marker-img {
    display: block;
    width: 24px;
    height: 35px;
    transform-origin: center bottom;
    filter: drop-shadow(0 2px 4px rgba(15, 23, 42, 0.22));
    transition: transform 0.18s ease, filter 0.18s ease;
}

.map-house-marker:hover {
    z-index: 900 !important;
}

.map-house-marker:hover .map-house-marker-img {
    transform: scale(1.2);
    filter: drop-shadow(0 3px 8px rgba(15, 23, 42, 0.3));
}

.map-house-marker.is-active {
    z-index: 1000 !important;
}

.map-house-marker.is-active .map-house-marker-img {
    transform: scale(1.22);
    filter: drop-shadow(0 0 0 3px rgba(15, 23, 42, 0.55)) drop-shadow(0 4px 10px rgba(15, 23, 42, 0.28));
}

.leaflet-popup-content-wrapper {
    border-radius: 12px !important;
    padding: 4px 8px 8px !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.18) !important;
}

.leaflet-popup-content {
    margin: 10px 12px !important;
    font-family: var(--font);
    font-size: 13px;
    line-height: 1.4;
}

@media (max-width: 1100px) {
    .search-map-shell {
        flex-direction: column;
        min-height: auto;
    }

    .search-map-stage {
        position: relative;
        order: 2;
        min-height: 480px;
    }

    .search-map-panel {
        order: 1;
        flex: 0 0 auto;
        width: 100%;
        max-width: none;
        max-height: none;
        min-height: 0;
        border-top-right-radius: 0;
        border-bottom: 1px solid #E5E7EB;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
    }
}

@media (max-width: 640px) {
    .search-pagination-bar {
        width: 100%;
        justify-content: center;
        padding: 3px;
    }

    .search-pagination-arrow,
    .search-pagination-page {
        width: 30px;
        min-width: 30px;
        height: 30px;
        font-size: 12px;
    }

    .search-pagination-ellipsis {
        width: 18px;
        height: 30px;
        font-size: 14px;
    }

    .search-map-panel {
        padding: 16px;
    }

    .search-map-cards-grid {
        grid-template-columns: 1fr;
    }

    .search-map-panel-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .search-map-filters-btn {
        width: 100%;
    }
}

@media (max-width: 1100px) {
    .search-results-layout {
        grid-template-columns: 1fr;
    }

    .search-results-sidebar {
        position: static;
        max-height: none;
    }

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

    .property-card-list {
        grid-template-columns: 220px minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .search-results-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .search-sort-wrap {
        width: 100%;
    }

    .search-card-view-toggle {
        width: 100%;
    }

    .search-card-view-btn {
        flex: 1;
        justify-content: center;
    }

    .property-grid-search {
        grid-template-columns: 1fr;
    }

    .property-card-list {
        grid-template-columns: 1fr;
    }

    .property-card-list-specs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ── Complex detail page ── */
.complex-page {
    padding-top: 24px;
    padding-bottom: 48px;
    font-family: "Inter", Helvetica, Arial, sans-serif;
}

.complex-page-layout {
    max-width: 100%;
}

.complex-page-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-top: 30px;
    margin-bottom: 24px;
}

.complex-page-intro {
    min-width: 0;
    flex: 1;
}

.complex-page-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 33.6px;
    color: #000000;
    margin-bottom: 8px;
}

.complex-page-address {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 400;
    line-height: 16px;
    color: #000000;
    margin-bottom: 16px;
    max-width: 100%;
    min-width: 0;
}

.complex-page-address span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.complex-page-address img {
    flex-shrink: 0;
    display: block;
    opacity: 0.55;
}

.complex-page-actions-row {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

.complex-page .property-action-share {
    font-size: 16px;
    font-weight: 600;
    line-height: 16px;
    height: 44px;
}

.complex-favorite-btn {
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 50%;
    background: var(--color-call-bg);
    color: var(--color-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
}

.complex-favorite-btn.active {
    background: var(--color-primary);
    color: #fff;
}

.complex-page-price-block {
    flex-shrink: 0;
    display: grid;
    grid-template-columns: auto auto;
    justify-content: end;
    align-items: start;
    column-gap: 20px;
    padding-top: 0;
    min-width: 0;
}

.complex-page-price-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
    text-align: right;
    min-width: 0;
}

.complex-page .property-page-price.complex-page-price {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    color: #000000;
}

.complex-page .property-page-price.complex-page-price .property-page-price-value {
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.complex-page-price {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    color: #000000;
    margin-bottom: 0;
    white-space: nowrap;
    text-align: right;
}

.complex-page-price .property-page-price-value {
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.complex-page-price-sqm {
    font-size: 16px;
    font-weight: 500;
    line-height: 22.4px;
    color: rgba(0, 0, 0, 0.6);
    margin-bottom: 0;
    text-align: right;
    white-space: nowrap;
}

.complex-currency-switcher {
    display: inline-flex;
    background: #ECEEF2;
    border-radius: 999px;
    padding: 4px;
    gap: 2px;
    flex-shrink: 0;
    align-self: start;
}

.complex-currency-switcher .currency-btn {
    width: 44px;
    height: 40px;
    border: none;
    border-radius: 999px;
    background: transparent;
    font-size: 20px;
    font-weight: 500;
    line-height: 20px;
    color: var(--color-title);
    cursor: pointer;
}

.complex-currency-switcher .currency-btn.active {
    background: var(--color-primary);
    color: #FFFFFF;
    border-radius: 999px;
}

.complex-page .property-section-title,
.complex-page .similar-properties-title {
    font-size: 24px;
    font-weight: 600;
    line-height: 31.2px;
    color: #000000;
    margin-bottom: 16px;
}

.complex-page .complex-consultation-title {
    font-weight: 700;
    margin-bottom: 20px;
}

.complex-page .property-description-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #000000;
}

.property-location--complex .property-location-title {
    font-size: 24px;
    font-weight: 600;
    line-height: 31.2px;
    color: #000000;
}

.property-location--complex .property-location-address {
    font-size: 16px;
    font-weight: 500;
    line-height: 19.2px;
    color: #4B5563;
}

.complex-gallery .property-gallery-main {
    height: auto;
    aspect-ratio: 1536 / 677;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.complex-gallery-thumbs {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
}

.complex-gallery-thumbs .property-gallery-thumb {
    width: 100%;
    aspect-ratio: 4 / 3;
    height: auto;
    border-radius: 12px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border: 2px solid transparent;
}

.complex-gallery-thumbs .property-gallery-thumb.active {
    border-color: var(--color-primary);
    outline: none;
}

.complex-about {
    margin-top: 32px;
}

.complex-specs-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px 32px;
}

.complex-specs-row .property-spec-value {
    font-size: 18px;
    font-weight: 600;
    line-height: 27px;
    margin-bottom: 2px;
    color: #000000;
}

.complex-specs-row .property-spec-label {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 0;
    color: rgba(0, 0, 0, 0.6);
}

.complex-distances {
    margin: 32px 0;
}

.complex-distances-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.complex-distance-item {
    background: var(--color-bg-gray);
    border-radius: 16px;
    padding: 16px 20px;
}

.complex-distance-value {
    display: block;
    font-size: 18px;
    font-weight: 600;
    line-height: 27px;
    color: #000000;
    margin-bottom: 4px;
}

.complex-distance-label {
    display: block;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: rgba(0, 0, 0, 0.6);
}

.complex-advantages {
    margin: 32px 0;
}

.complex-advantages-list {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 48px;
    row-gap: 8px;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #000000;
}

.complex-advantages-list li::before {
    content: '• ';
    color: #000000;
    font-weight: 400;
}

.property-location--complex {
    margin-top: 32px;
}

.complex-property-map {
    margin-bottom: 0;
}

.complex-consultation-inline {
    margin: 32px 0;
}

.complex-consultation-title {
    margin-bottom: 20px;
}

.complex-consultation-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 48px;
    align-items: stretch;
    background: var(--color-bg-gray);
    border-radius: var(--radius-lg);
    padding: 40px;
}

.complex-consultation-panel .consultation-contacts-grid {
    gap: 24px 32px;
}

.complex-consultation-panel .consultation-info {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.complex-consultation-panel .consultation-agent {
    margin-top: auto;
    padding-top: 24px;
}

.consultation-agent-avatar--photo {
    width: 54px;
    height: 54px;
    padding: 0;
    overflow: hidden;
    background: transparent;
}

.consultation-agent-avatar--photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.complex-consultation-form-row {
    grid-template-columns: 1fr 1fr;
}

.complex-similar {
    margin-top: 48px;
    margin-bottom: 24px;
}

.complex-consultation {
    background: var(--color-bg-gray);
    margin-top: 0;
}

@media (max-width: 1024px) {
    .complex-page-top {
        flex-direction: column;
    }

    .complex-page-price-block {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        gap: 12px;
    }

    .complex-page-price-copy {
        align-items: flex-start;
        text-align: left;
        width: 100%;
    }

    .complex-page-price,
    .complex-page-price-sqm {
        text-align: left;
        white-space: normal;
    }

    .complex-currency-switcher {
        align-self: flex-start;
    }

    .complex-gallery-thumbs {
        grid-template-columns: repeat(5, 1fr);
    }

    .complex-distances-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .complex-specs-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .complex-consultation-panel {
        grid-template-columns: 1fr;
        gap: 32px;
        padding: 32px 24px;
    }
}

@media (max-width: 640px) {
    .complex-page-title {
        font-size: 24px;
        line-height: 28.8px;
    }

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

    .complex-distances-grid {
        grid-template-columns: 1fr;
    }

    .complex-advantages-list {
        grid-template-columns: 1fr;
        column-gap: 0;
    }

    .property-location-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .property-location-head .property-location-address {
        max-width: 100%;
        text-align: left;
        justify-content: flex-start;
    }
}

/* ── Lot detail page ── */
.lot-page {
    font-family: "Inter", Helvetica, Arial, sans-serif;
    padding-top: 32px;
}

.lot-page-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    column-gap: 48px;
    row-gap: 0;
    align-items: start;
}

.lot-page-header {
    grid-column: 1;
    grid-row: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto auto;
    column-gap: 24px;
    row-gap: 0;
    align-items: start;
    margin-bottom: 16px;
}

.lot-page-header-title {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    display: flex;
    align-items: center;
}

.lot-page-header-top-right {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    align-items: center;
    gap: 20px;
    justify-self: end;
    margin-top: 4px;
}

.lot-page-header-top-right .property-page-price {
    margin: 0;
}

.lot-page-header-address {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
    margin: 4px 0 0;
    align-self: center;
}

.lot-page-header-price-sqm {
    grid-column: 2;
    grid-row: 2;
    justify-self: start;
    align-self: center;
    margin: 4px 0 0;
    text-align: left;
    white-space: nowrap;
}

.lot-page-header-actions-line {
    grid-column: 1 / -1;
    grid-row: 3;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 24px;
    align-items: center;
    margin-top: 16px;
}

.lot-page-header-actions-line .lot-page-actions-row {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: nowrap;
    min-width: 0;
}

.lot-page-header-commission {
    justify-self: end;
    margin: 0;
    text-align: right;
    white-space: nowrap;
}

.lot-page-sidebar-cell {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: start;
    position: sticky;
    top: 24px;
    width: 100%;
    max-width: 340px;
    justify-self: end;
}

.lot-page-body-left {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
}

.lot-page-price-block {
    flex-shrink: 0;
    display: grid;
    grid-template-columns: auto auto;
    justify-content: end;
    align-items: start;
    column-gap: 20px;
    padding-top: 0;
    min-width: 0;
    text-align: right;
}


.lot-page-main {
    min-width: 0;
}

.lot-page-sidebar-cell .agency-card-inner {
    background: #FFFFFF;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    padding: 16px;
    border-radius: 16px;
    max-width: 340px;
    width: 100%;
}

.lot-page-sidebar-cell .agency-card-header {
    gap: 10px;
    margin-bottom: 16px;
}

.lot-page-sidebar-cell .agency-logo {
    width: 36px;
    height: 36px;
    font-size: 16px;
}

.lot-page-sidebar-cell .agency-card-chevron {
    width: 16px;
    height: 16px;
}

.lot-page-sidebar-cell .agency-actions-row {
    gap: 8px;
}

.lot-page-sidebar-cell .agency-actions-row .btn-write,
.lot-page-sidebar-cell .agency-actions-row .btn-call {
    height: 34px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 12px;
    gap: 6px;
    padding: 0 12px;
}

.lot-page-sidebar-cell .agency-actions-row .btn-write img,
.lot-page-sidebar-cell .agency-actions-row .btn-call img {
    width: 14px;
    height: 14px;
}

.lot-page .property-page-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
    color: #000000;
    margin-bottom: 0;
}

.lot-page-header-address,
.lot-page-header-price-sqm,
.lot-page-header-commission {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.35;
    color: #4B5563;
}

.lot-page-header-commission strong {
    color: var(--color-primary);
    font-weight: 700;
}

.lot-page-header-address {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 100%;
}

.lot-page-header-price-sqm {
    font-weight: 500;
    margin-bottom: 0;
}


.lot-page .property-page-address img {
    margin-top: 0;
}

.lot-page .property-page-price {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    color: #000000;
    margin-bottom: 0;
}

.lot-page .property-page-price-sqm {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    color: #4B5563;
    margin-bottom: 0;
}

.lot-page-actions-row {
    align-items: center;
    gap: 16px;
    flex-wrap: nowrap;
}

.lot-page .property-action-btn {
    height: auto;
    padding: 0;
    border-radius: 0;
    background: transparent !important;
    color: var(--color-primary);
    font-size: 14px;
    font-weight: 500;
    gap: 6px;
}

.lot-page .property-action-btn svg {
    flex-shrink: 0;
}

.lot-page .property-action-favorite.active {
    background: transparent !important;
    color: var(--color-primary);
}

.lot-page .property-action-favorite.active svg {
    fill: var(--color-primary);
    stroke: var(--color-primary);
}

.lot-page .property-action-commission {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.2;
    color: #6B7280;
    white-space: nowrap;
}

.lot-page .property-action-commission strong {
    color: var(--color-primary);
    font-weight: 700;
}

.lot-page .property-currency-switcher {
    padding: 2px;
    gap: 1px;
}

.lot-page .property-currency-switcher .currency-btn {
    width: 26px;
    height: 26px;
    font-size: 12px;
    border-radius: 50%;
}

.lot-page .property-section-title,
.lot-page .similar-properties-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    color: #000000;
    margin-bottom: 16px;
}

.lot-page .property-description-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
    color: #000000;
}

.lot-page .property-submit-request {
    min-width: 200px;
    height: 38px;
    padding: 0 24px;
    font-size: 13px;
    border-radius: 12px;
}

.lot-page .property-lot-meta {
    font-size: 12px;
}

.lot-page .property-report-btn {
    height: 44px;
    padding: 0 20px;
    font-size: 13px;
}

.lot-page .agency-name {
    font-size: 13px;
}

.lot-page .agency-label {
    font-size: 12px;
}

.lot-page .agency-actions-row .btn-write,
.lot-page .agency-actions-row .btn-call {
    height: 38px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 12px;
    gap: 6px;
}

.lot-page .agency-actions-row .btn-write img,
.lot-page .agency-actions-row .btn-call img {
    width: 16px;
    height: 16px;
}

.lot-gallery .property-gallery-main-wrap {
    margin-bottom: 0;
    overflow: hidden;
    border-radius: 16px;
}

.lot-gallery .property-gallery-main,
.lot-gallery .property-gallery-main-alt {
    height: auto;
    aspect-ratio: 857 / 570;
    background-size: cover;
    background-color: #F3F4F6;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 16px;
    opacity: 1;
    transform: scale(1);
    transition: opacity 0.48s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.48s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

.lot-gallery .property-gallery-main-wrap > .property-gallery-main-alt {
    grid-area: 1 / 1;
    width: 100%;
    z-index: 2;
    opacity: 0;
    transform: scale(1.04);
    pointer-events: none;
}

.lot-gallery.is-switching .property-gallery-main {
    z-index: 1;
}

.lot-gallery.is-switching.is-switching-active .property-gallery-main {
    opacity: 0;
    transform: scale(0.98);
}

.lot-gallery.is-switching.is-switching-active .property-gallery-main-alt {
    opacity: 1;
    transform: scale(1);
}

.lot-gallery-thumbs-wrap {
    position: relative;
    width: 100%;
    margin-top: 12px;
}

.lot-gallery-thumbs {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 4px 0;
}

.lot-gallery-thumbs::-webkit-scrollbar {
    display: none;
}

.lot-gallery-thumbs .property-gallery-thumb {
    flex: 0 0 129px;
    width: 129px;
    aspect-ratio: 129 / 96;
    height: auto;
    border-radius: 10px;
    overflow: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #ECEEF2;
    border: 1px solid transparent;
    scroll-snap-align: start;
    cursor: pointer;
    transition: border-color 0.2s ease, background-size 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.lot-gallery-thumbs .property-gallery-thumb:hover {
    background-size: 108%;
}

.lot-gallery-thumbs .property-gallery-thumb.active {
    border-color: var(--color-primary);
}

.lot-gallery-thumbs-nav {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 36px;
    height: 36px;
    border: 1px solid #E5E7EB;
    border-radius: 50%;
    background: rgba(249, 250, 251, 0.96);
    color: var(--color-title);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transform: translateY(-50%);
    transition: background 0.2s, border-color 0.2s, box-shadow 0.2s, opacity 0.2s, transform 0.2s ease;
}

.lot-gallery-thumbs-prev {
    left: 0;
}

.lot-gallery-thumbs-next {
    right: 0;
}

.lot-gallery-thumbs-nav img {
    display: block;
    opacity: 0.7;
}

.lot-gallery-thumbs-nav:hover:not(:disabled) {
    background: #FFFFFF;
    border-color: #D1D5DB;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transform: translateY(-50%) scale(1.06);
}

.lot-gallery-thumbs-nav:hover:not(:disabled) img {
    opacity: 1;
}

.lot-gallery-thumbs-nav[hidden] {
    display: none;
}

.property-gallery-main-wrap > .gallery-hot-badge {
    grid-area: 1 / 1;
    z-index: 3;
    justify-self: start;
    align-self: start;
    margin: 16px 0 0;
    pointer-events: none;
}

.lot-about {
    margin-top: 32px;
}

.lot-specs-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px 32px;
    margin-bottom: 0;
}

.lot-specs-row .property-spec-item {
    gap: 12px;
    align-items: center;
}

.lot-specs-row .property-spec-copy {
    min-width: 0;
}

.lot-specs-row .property-spec-icon {
    width: 48px;
    height: 48px;
    background: #E5F1F0;
}

.lot-specs-row .property-spec-icon img {
    width: 20px;
    height: 20px;
    display: block;
}

.lot-specs-row .property-spec-label {
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.35;
    color: #6B7280;
    margin-bottom: 4px;
}

.lot-specs-row .property-spec-value {
    display: block;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    color: #000000;
}

.lot-description {
    margin: 32px 0;
}

.lot-advantages {
    margin: 32px 0;
}

.lot-advantages-list {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
    margin: 0;
}

.lot-advantages-list li {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border-radius: 999px;
    background: #F3F4F6;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: #000000;
    transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.lot-advantages-list li:hover {
    transform: translateY(-2px);
    background: #E8EAEE;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.lot-advantages-list li::before {
    content: none;
}

.lot-management-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin: 32px 0;
    padding: 24px 28px;
    border-radius: 20px;
    background: #F3F4F6;
}

.lot-management-title {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
    color: #000000;
    margin-bottom: 4px;
}

.lot-management-subtitle {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.45;
    color: rgba(0, 0, 0, 0.6);
}

.lot-management-cta .property-submit-request {
    margin-bottom: 0;
    flex-shrink: 0;
}

.property-location--lot {
    margin-top: 32px;
}

.property-location--lot .property-location-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    color: #000000;
    margin: 0;
}

.property-location--lot .property-location-address {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    color: #4B5563;
    margin: 0;
}

.lot-similar {
    margin-top: 40px;
}

.lot-similar .similar-properties-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 24px;
}

.property-page-agency--bottom {
    display: none;
    width: 100%;
    max-width: 395px;
    margin: 32px 0;
}

@media (max-width: 1100px) {
    .lot-page-shell {
        grid-template-columns: 1fr;
    }

    .lot-page-header {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        margin-bottom: 16px;
    }

    .lot-page-header-title,
    .lot-page-header-top-right,
    .lot-page-header-address,
    .lot-page-header-price-sqm,
    .lot-page-header-actions-line,
    .lot-page-sidebar-cell,
    .lot-page-body-left {
        grid-column: 1;
        grid-row: auto;
        max-width: none;
        justify-self: stretch;
    }

    .lot-page-header-top-right {
        margin-top: 12px;
    }

    .lot-page-sidebar-cell {
        position: static;
        display: none;
    }

    .property-page-agency--bottom {
        display: block;
    }

    .lot-management-cta {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 640px) {
    .lot-page-header .lot-page-price-block {
        justify-content: flex-start;
        text-align: left;
    }

    .lot-page .property-page-title {
        font-size: 24px;
        line-height: 1.2;
    }

    .lot-gallery-thumbs .property-gallery-thumb {
        flex-basis: 96px;
        width: 96px;
    }
}

/* Lot page — motion & interactions */
@keyframes lotFadeInUp {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes lotFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@media (prefers-reduced-motion: no-preference) {
    .lot-about.lot-reveal.is-visible .property-spec-item {
        animation: lotFadeInUp 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .lot-about.lot-reveal.is-visible .property-spec-item:nth-child(1) { animation-delay: 0.08s; }
    .lot-about.lot-reveal.is-visible .property-spec-item:nth-child(2) { animation-delay: 0.14s; }
    .lot-about.lot-reveal.is-visible .property-spec-item:nth-child(3) { animation-delay: 0.2s; }
    .lot-about.lot-reveal.is-visible .property-spec-item:nth-child(4) { animation-delay: 0.26s; }
    .lot-about.lot-reveal.is-visible .property-spec-item:nth-child(5) { animation-delay: 0.32s; }
    .lot-about.lot-reveal.is-visible .property-spec-item:nth-child(6) { animation-delay: 0.38s; }

    .lot-reveal.is-visible .property-section-title {
        animation: lotFadeInUp 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .lot-advantages.lot-reveal.is-visible .lot-advantages-list li {
        animation: lotFadeInUp 0.4s cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .lot-advantages.lot-reveal.is-visible .lot-advantages-list li:nth-child(1) { animation-delay: 0.1s; }
    .lot-advantages.lot-reveal.is-visible .lot-advantages-list li:nth-child(2) { animation-delay: 0.16s; }
    .lot-advantages.lot-reveal.is-visible .lot-advantages-list li:nth-child(3) { animation-delay: 0.22s; }
    .lot-advantages.lot-reveal.is-visible .lot-advantages-list li:nth-child(4) { animation-delay: 0.28s; }
    .lot-advantages.lot-reveal.is-visible .lot-advantages-list li:nth-child(5) { animation-delay: 0.34s; }
    .lot-advantages.lot-reveal.is-visible .lot-advantages-list li:nth-child(6) { animation-delay: 0.4s; }
    .lot-advantages.lot-reveal.is-visible .lot-advantages-list li:nth-child(n+7) { animation-delay: 0.46s; }

    .property-location--lot.lot-reveal.is-visible .property-map {
        animation: lotFadeIn 0.65s ease 0.12s both;
    }

    .lot-reveal {
        transition: opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1),
                    transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
    }

    .lot-reveal[data-reveal-delay="80"] { transition-delay: 0.08s; }
    .lot-reveal[data-reveal-delay="120"] { transition-delay: 0.12s; }
    .lot-reveal[data-reveal-delay="160"] { transition-delay: 0.16s; }

    .lot-similar .property-card.lot-reveal {
        transition-delay: var(--reveal-delay, 0ms);
    }

    .lot-page.is-scroll-reveal-ready .lot-reveal:not(.is-visible) {
        opacity: 0;
        transform: translateY(28px);
    }

    .lot-page.is-scroll-reveal-ready .lot-reveal.is-visible {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .lot-page.is-scroll-reveal-ready .lot-reveal {
        opacity: 1;
        transform: none;
    }
}

/* ── Home page scroll reveal ── */
@media (prefers-reduced-motion: no-preference) {
    .home-page .scroll-reveal {
        transition: opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
                    transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
        transition-delay: var(--reveal-delay, 0ms);
    }

    .home-page.is-scroll-reveal-ready .scroll-reveal:not(.is-visible) {
        opacity: 0;
        transform: translateY(32px);
    }

    .home-page.is-scroll-reveal-ready .scroll-reveal.is-visible {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-page.is-scroll-reveal-ready .scroll-reveal {
        opacity: 1;
        transform: none;
    }
}

.lot-page .property-action-btn {
    transition: color 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
}

.lot-page .property-action-btn:hover {
    transform: translateY(-1px);
    opacity: 0.82;
}

.lot-page .property-action-btn:active {
    transform: translateY(0);
}

.lot-page .property-currency-switcher .currency-btn {
    transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.lot-page .property-currency-switcher .currency-btn:hover:not(.active) {
    transform: scale(1.08);
}

.lot-page-sidebar-cell .agency-card-inner {
    transition: box-shadow 0.3s ease, transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.lot-page-sidebar-cell .agency-card-inner:hover {
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.lot-page-sidebar-cell .agency-actions-row .btn-write,
.lot-page-sidebar-cell .agency-actions-row .btn-call {
    transition: transform 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
}

.lot-page-sidebar-cell .agency-actions-row .btn-write:hover,
.lot-page-sidebar-cell .agency-actions-row .btn-call:hover {
    transform: translateY(-1px);
}

.lot-specs-row .property-spec-icon {
    transition: transform 0.25s ease, background 0.25s ease;
}

.lot-specs-row .property-spec-item:hover .property-spec-icon {
    transform: scale(1.06);
    background: #D9EBE9;
}

.lot-gallery .gallery-fullscreen-btn {
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.lot-gallery .gallery-fullscreen-btn:hover {
    transform: scale(1.06);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16);
}

.lot-management-cta .property-submit-request {
    transition: transform 0.2s ease, box-shadow 0.25s ease, opacity 0.2s ease;
}

.lot-management-cta .property-submit-request:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 141, 125, 0.28);
}

.lot-similar .property-card {
    transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s ease;
}

.lot-similar .property-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.1);
}


/* ── Create listing page ── */
.create-listing-page {
    background: #F3F4F6;
    padding-top: 24px;
    padding-bottom: 48px;
    font-family: "Inter", Helvetica, Arial, sans-serif;
}

.create-listing-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 32px;
    align-items: start;
}

.create-listing-panel {
    background: #FFFFFF;
    border-radius: 20px;
    padding: 28px 32px 32px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

.create-listing-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 28px;
}

.create-listing-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 33.6px;
    color: #000000;
    margin: 0;
}

.create-listing-close {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #F3F4F6;
    color: #6B7280;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.create-listing-close:hover {
    background: #E5E7EB;
}

.create-listing-section {
    margin-bottom: 28px;
}

.create-listing-section-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    color: #000000;
    margin: 0 0 16px;
}

.create-listing-label,
.create-field-label {
    display: block;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #000000;
    margin-bottom: 8px;
}

.create-type-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.create-type-chip {
    height: 44px;
    padding: 0 20px;
    border: none;
    border-radius: 999px;
    background: #F3F4F6;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 500;
    color: #000000;
    cursor: pointer;
}

.create-type-chip.is-active {
    background: #E5E7EB;
    font-weight: 600;
}

.create-photo-tip {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    margin-bottom: 16px;
    border-radius: 12px;
    background: #E8F4FD;
    font-size: 14px;
    line-height: 20px;
    color: #1F2937;
}

.create-photo-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.create-photo-upload,
.create-doc-upload {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 120px;
    min-height: 120px;
    padding: 16px;
    border: 2px dashed #D1D5DB;
    border-radius: 16px;
    background: #FAFAFA;
    cursor: pointer;
    text-align: center;
    font-size: 14px;
    color: #4B5563;
}

.create-doc-upload {
    width: 140px;
}

.create-photo-upload-icon,
.create-doc-upload-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--color-primary);
    color: #FFFFFF;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    line-height: 1;
}

.create-photo-thumb {
    width: 120px;
    height: 120px;
    border-radius: 16px;
    background-size: cover;
    background-position: center;
}

.create-field {
    display: block;
    min-width: 0;
}

.create-field-full {
    margin-bottom: 16px;
}

.create-field-hint {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    line-height: 18px;
    color: #6B7280;
}

.create-fields-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 24px;
    margin-top: 20px;
}

.create-input,
.create-textarea,
.create-select {
    width: 100%;
    min-height: 48px;
    padding: 0 16px;
    border: 1px solid #E5E7EB;
    border-radius: 12px;
    background: #FFFFFF;
    font-family: var(--font);
    font-size: 16px;
    color: #000000;
}

.create-textarea {
    min-height: 180px;
    padding: 16px;
    resize: vertical;
}

.create-select-wrap {
    position: relative;
    display: block;
}

.create-select {
    appearance: none;
    padding-right: 44px;
}

.create-select-icon {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    opacity: 0.5;
}

.create-listing-map {
    height: 280px;
    border-radius: 16px;
    overflow: hidden;
    margin-top: 8px;
}

.create-field-price .create-price-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.create-listing-currency {
    flex-shrink: 0;
}

.create-input-price.is-invalid,
.create-textarea.is-invalid {
    border-color: #EF4444;
}

.create-commission-block {
    margin-top: 24px;
    padding-top: 8px;
}

.create-commission-head {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    align-items: baseline;
    margin-bottom: 12px;
}

.create-commission-min {
    font-size: 14px;
    color: #6B7280;
}

.create-commission-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    align-items: center;
    margin-bottom: 20px;
}

.create-input-percent {
    width: 80px;
    text-align: center;
}

.create-percent-sign {
    font-weight: 600;
    color: #000000;
}

.create-radio {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    color: #000000;
    cursor: pointer;
}

.create-split-slider {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 16px;
    align-items: center;
    margin-top: 10px;
    font-size: 15px;
    color: #4B5563;
}

.create-range {
    width: 100%;
    accent-color: #F5C842;
}

.create-advantages-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.create-adv-tag {
    padding: 8px 14px;
    border: 1px solid #F4A5A5;
    border-radius: 999px;
    background: #FFFFFF;
    font-family: var(--font);
    font-size: 14px;
    line-height: 20px;
    color: #000000;
    cursor: pointer;
}

.create-adv-tag.is-selected {
    background: #FEF2F2;
    border-color: #EF4444;
}

.create-add-advantage {
    margin-top: 12px;
    border: none;
    background: none;
    padding: 0;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 600;
    color: var(--color-primary);
    cursor: pointer;
}

.create-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    color: #000000;
    cursor: pointer;
    margin-bottom: 20px;
}

.create-hot-offer {
    margin-top: 8px;
}

.create-proof-text {
    font-size: 15px;
    line-height: 22px;
    color: #4B5563;
    margin: 0 0 16px;
}

.create-doc-upload-hint {
    font-size: 12px;
    color: #6B7280;
}

.create-agency-banner {
    padding: 20px 24px;
    margin-bottom: 28px;
    border-radius: 16px;
    background: #E8F4FD;
}

.create-agency-banner p {
    margin: 0 0 12px;
    font-size: 16px;
    line-height: 24px;
    color: #000000;
}

.create-description-head {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.create-description-head .create-listing-section-title {
    margin-bottom: 0;
}

.create-ai-btn {
    height: 40px;
    padding: 0 16px;
    border: none;
    border-radius: 999px;
    background: #F5C842;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 600;
    color: #000000;
    cursor: pointer;
}

.create-description-min {
    margin: 8px 0 0;
    text-align: right;
    font-size: 14px;
    color: #6B7280;
}

.create-listing-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

.create-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 160px;
    height: 52px;
    padding: 0 24px;
    border: none;
    border-radius: 999px;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}

.create-action-clear {
    background: #FEE2E2;
    color: #DC2626;
}

.create-action-exit {
    background: #E5E7EB;
    color: #374151;
}

.create-action-save {
    background: var(--color-primary);
    color: #FFFFFF;
}

.create-save-result {
    margin-top: 16px;
    font-size: 15px;
    font-weight: 600;
    color: var(--color-primary);
}

.create-save-result.is-success {
    color: #059669;
}

.create-listing-preview-wrap {
    position: sticky;
    top: 24px;
    width: 100%;
    max-width: 340px;
    justify-self: end;
}

.property-card-preview {
    background: #FFFFFF;
    border-radius: 20px;
    padding: 16px;
}

.property-card-preview-photo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 200px;
    margin-bottom: 12px;
    border: 1px dashed #D1D5DB;
    border-radius: 16px;
    background: #FFFFFF;
    background-size: cover;
    background-position: center;
    text-align: center;
}

.property-card-preview-photo-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #E5F1F0;
    color: var(--color-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.property-card-preview-photo-label {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--color-muted);
    max-width: 180px;
}

.property-card-preview-photo.has-image {
    border-style: solid;
    border-color: #E5E7EB;
}

.property-card-preview-photo.has-image .property-card-preview-photo-icon,
.property-card-preview-photo.has-image .property-card-preview-photo-label {
    display: none;
}

.property-card-preview .property-card-content {
    padding-top: 0;
    gap: 6px;
}

.property-card-preview .property-card-top {
    margin-bottom: 2px;
}

.property-card-preview .property-price {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-primary-dark);
}

.property-card-preview-favorite {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.property-card-preview .property-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--color-title);
    margin-bottom: 0;
    -webkit-line-clamp: 2;
}

.property-card-preview-address {
    font-size: 16px;
    font-weight: 500;
    color: var(--color-muted);
}

.property-card-preview-meta {
    margin-top: 2px;
}

.property-card-preview-meta span {
    font-size: 14px;
    font-weight: 500;
    color: #6B7280;
}

.property-card-preview-meta img {
    opacity: 0.55;
}

.property-card-preview .property-card-actions {
    margin-top: 8px;
}

.create-preview-caption {
    margin: 16px 0 0;
    text-align: center;
    font-size: 14px;
    line-height: 20px;
    color: #6B7280;
}

@media (max-width: 1100px) {
    .create-listing-layout {
        grid-template-columns: 1fr;
    }

    .create-listing-preview-wrap {
        position: static;
        order: -1;
        max-width: 340px;
        margin: 0 auto 24px;
    }
}

@media (max-width: 640px) {
    .create-listing-panel {
        padding: 20px 16px 24px;
    }

    .create-fields-grid {
        grid-template-columns: 1fr;
    }

    .create-listing-actions {
        flex-direction: column;
    }

    .create-action-btn {
        width: 100%;
    }
}

/* ── Profile page ── */
.profile-page {
    padding-top: 24px;
    background: var(--color-bg-gray);
}

.profile-layout {
    display: grid;
    grid-template-columns: 318px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.profile-sidebar,
.profile-main {
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    padding: 24px 28px;
}

.profile-sidebar {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 318px;
    max-width: 318px;
}

.profile-sidebar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.profile-sidebar-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-title);
    line-height: 1.2;
}

.profile-settings-btn {
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--color-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.profile-settings-btn:hover {
    background: #E5F1F0;
}

.profile-avatar-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.profile-avatar {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: #F3F4F6;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
    overflow: hidden;
}

.profile-avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-public-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid #CFE7E4;
    background: #E5F1F0;
    color: var(--color-primary);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.profile-user-info {
    text-align: center;
}

.profile-user-name {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-title);
    line-height: 1.2;
}

.profile-user-role {
    margin-top: 4px;
    font-size: 14px;
    color: var(--color-muted);
}

.profile-contacts {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.profile-contact-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.profile-contact-label {
    font-size: 13px;
    color: var(--color-muted);
}

.profile-contact-value {
    font-size: 15px;
    font-weight: 500;
    color: var(--color-title);
    word-break: break-word;
}

.profile-stats-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0;
    border-top: 1px solid #E5E7EB;
    border-bottom: 1px solid #E5E7EB;
    padding: 4px 0;
}

.profile-stat-link {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border: none;
    background: transparent;
    font-size: 15px;
    color: var(--color-title);
    text-align: left;
}

.profile-stat-link:hover,
.profile-stat-link.is-active {
    color: var(--color-primary);
    font-weight: 600;
}

.profile-stat-link span:last-child {
    color: var(--color-muted);
    font-weight: 500;
}

.profile-sidebar-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: auto;
}

.profile-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 44px;
    padding: 0 16px;
    border-radius: var(--radius-md);
    border: none;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}

.profile-action-btn-outline {
    background: #E5F1F0;
    color: var(--color-primary);
    border: 1px solid #CFE7E4;
}

.profile-action-btn-primary {
    background: var(--color-primary-light);
    color: #FFFFFF;
}

.profile-action-btn-muted {
    background: #4B5563;
    color: #FFFFFF;
}

.profile-main {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}

.profile-main-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.profile-tabs {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.profile-tab {
    position: relative;
    padding: 0 0 8px;
    border: none;
    background: transparent;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-muted);
    cursor: pointer;
}

.profile-tab.is-active {
    color: var(--color-primary);
    font-weight: 600;
}

.profile-tab.is-active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    border-radius: 2px;
    background: var(--color-primary-light);
}

.profile-view-toggle {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border-radius: 10px;
    background: #F3F4F6;
}

.profile-view-toggle-listings[hidden] {
    display: none;
}

.profile-view-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    padding: 0 10px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: var(--color-subtle);
    font-size: 13px;
    font-weight: 500;
}

.profile-view-btn svg {
    width: 16px;
    height: 16px;
}

.profile-view-btn.is-active {
    background: #E5F1F0;
    color: var(--color-primary);
    font-weight: 600;
}

.profile-panel[hidden] {
    display: none !important;
}

.profile-toolbar {
    display: flex;
    align-items: center;
    gap: 16px;
}

.profile-select-all {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: var(--color-subtle);
    white-space: nowrap;
    flex-shrink: 0;
}

.profile-checkbox {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
}

.profile-search-wrap {
    position: relative;
    flex: 1;
    min-width: 0;
}

.profile-search-input {
    width: 100%;
    height: 44px;
    padding: 0 44px 0 16px;
    border: 1px solid #E5E7EB;
    border-radius: var(--radius-md);
    background: #FFFFFF;
    font-size: 15px;
    color: var(--color-title);
}

.profile-search-input::placeholder {
    color: #9CA3AF;
}

.profile-search-icon {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--color-muted);
    pointer-events: none;
}

.profile-subtabs {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.profile-subtab {
    height: 36px;
    padding: 0 14px;
    border: none;
    border-radius: 10px;
    background: transparent;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-subtle);
}

.profile-subtab.is-active {
    background: var(--color-write-bg);
    color: var(--color-accent-dark);
    font-weight: 600;
}

.profile-listings {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 32px;
}

.profile-listing-card {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 20px;
    padding: 16px;
    border: 1px solid #E5E7EB;
    border-radius: var(--radius-lg);
    background: #FFFFFF;
}

.profile-listing-media {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.profile-listing-main-photo {
    position: relative;
    height: 180px;
    border-radius: var(--radius-md);
    overflow: hidden;
    isolation: isolate;
}

.profile-listing-main-photo .property-image-placeholder {
    width: 100%;
    height: 100%;
    background-color: #E5F1F0;
    background-size: cover;
    background-position: center;
}

.profile-listing-main-photo .property-badge-hot {
    top: 10px;
}

.profile-listing-thumbs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

.profile-listing-thumb {
    height: 56px;
    border-radius: 10px;
    background-color: #E5F1F0;
    background-size: cover;
    background-position: center;
}

.profile-listing-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.profile-listing-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.profile-listing-price {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-title);
    line-height: 1.2;
}

.profile-listing-tools {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.profile-listing-favorite {
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.profile-menu-dropdown {
    right: 0;
    left: auto;
    min-width: 220px;
}

.property-menu-item-danger {
    color: #DC2626 !important;
}

.profile-listing-title {
    font-size: 20px;
    font-weight: 600;
    color: var(--color-title);
}

.profile-listing-address {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 15px;
    color: var(--color-muted);
    min-width: 0;
}

.profile-listing-address span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-listing-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.profile-listing-meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text);
    white-space: nowrap;
}

.profile-listing-desc {
    font-size: 14px;
    line-height: 1.5;
    color: var(--color-subtle);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.profile-listing-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: auto;
    padding-top: 4px;
}

.profile-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    border: none;
    border-radius: var(--radius-md);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}

.profile-btn-boost {
    background: #E5F1F0;
    color: var(--color-primary);
}

.profile-btn-edit {
    background: var(--color-write-bg);
    color: var(--color-accent-dark);
}

.profile-btn-muted {
    background: #E5E7EB;
    color: var(--color-subtle);
}

.profile-btn-call {
    background: var(--color-call-bg);
    color: var(--color-primary);
}

.profile-btn-write {
    background: var(--color-write-bg);
    color: var(--color-accent-dark);
}

.profile-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 320px;
    padding: 40px 20px;
}

.profile-empty-icon {
    color: var(--color-primary);
    margin-bottom: 16px;
}

.profile-empty-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-title);
    margin-bottom: 8px;
}

.profile-empty-text {
    max-width: 360px;
    font-size: 15px;
    color: var(--color-muted);
    line-height: 1.5;
}

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

.profile-selection-card {
    border: 1px solid #E5E7EB;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: #FFFFFF;
}

.profile-selection-card-new {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 260px;
    padding: 24px 20px;
    background: #E5F1F0;
    border-color: #CFE7E4;
}

.profile-selection-new-icon {
    color: var(--color-primary);
    margin-bottom: 12px;
}

.profile-selection-new-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-title);
    margin-bottom: 8px;
}

.profile-selection-new-text {
    font-size: 14px;
    color: var(--color-muted);
    line-height: 1.45;
    margin-bottom: 16px;
    max-width: 220px;
}

.profile-selection-create-btn {
    width: auto;
    min-width: 180px;
}

.profile-selection-images {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 4px;
    padding: 4px;
    aspect-ratio: 1.2;
}

.profile-selection-image {
    border-radius: 10px;
    background-color: #E5F1F0;
    background-size: cover;
    background-position: center;
    min-height: 80px;
}

.profile-selection-menu {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    color: var(--color-muted);
    font-size: 14px;
    letter-spacing: 1px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.profile-selection-name {
    padding: 12px 14px 4px;
    font-size: 16px;
    font-weight: 700;
    color: var(--color-title);
}

.profile-selection-count {
    padding: 0 14px 14px;
    font-size: 14px;
    color: var(--color-muted);
}

.profile-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(17, 24, 39, 0.45);
}

.profile-modal-overlay[hidden] {
    display: none !important;
}

.profile-modal {
    width: min(100%, 480px);
    max-height: calc(100vh - 48px);
    overflow: auto;
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    padding: 24px 28px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18);
}

.profile-modal-wide {
    width: min(100%, 720px);
}

.profile-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 20px;
}

.profile-modal-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-title);
}

.profile-modal-close {
    width: 36px;
    height: 36px;
    border: 1px solid #E5E7EB;
    border-radius: 50%;
    background: #FFFFFF;
    color: var(--color-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.profile-modal-field {
    display: block;
    margin-bottom: 20px;
}

.profile-modal-input,
.profile-modal-textarea {
    width: 100%;
    border: 1px solid #E5E7EB;
    border-radius: var(--radius-md);
    background: #F9FAFB;
    font-size: 15px;
    color: var(--color-title);
}

.profile-modal-input {
    height: 44px;
    padding: 0 14px;
}

.profile-modal-textarea {
    padding: 12px 14px;
    resize: vertical;
    min-height: 96px;
}

.profile-modal-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.profile-modal-btn {
    min-height: 44px;
    border: none;
    border-radius: var(--radius-md);
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}

.profile-modal-btn-secondary {
    background: #E5F1F0;
    color: var(--color-primary);
}

.profile-modal-btn-save {
    background: #E5E7EB;
    color: #9CA3AF;
}

.profile-modal-btn-save:not(:disabled) {
    background: var(--color-primary-light);
    color: #FFFFFF;
}

.profile-edit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.profile-edit-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.profile-edit-field-full {
    grid-column: 1 / -1;
}

.profile-edit-label {
    font-size: 13px;
    color: var(--color-muted);
}

.profile-edit-upload {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
}

.profile-edit-upload-box {
    width: 88px;
    height: 88px;
    border: 1px dashed #D1D5DB;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--color-primary);
    background: #F9FAFB;
}

.profile-edit-upload-plus {
    font-size: 28px;
    line-height: 1;
}

.profile-edit-upload-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--color-title);
    margin-bottom: 4px;
}

.profile-edit-upload-hint {
    font-size: 13px;
    color: var(--color-muted);
    line-height: 1.45;
}

.profile-edit-section-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--color-title);
    margin-bottom: 12px;
}

.profile-edit-socials {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.profile-edit-social {
    display: flex;
    align-items: center;
    gap: 10px;
}

.profile-edit-social .profile-modal-input {
    flex: 1;
}

.profile-edit-password {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #E5E7EB;
}

.profile-edit-password-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.profile-edit-show {
    border: none;
    background: transparent;
    color: var(--color-primary);
    font-size: 14px;
    font-weight: 600;
}

@media (max-width: 1100px) {
    .profile-layout {
        grid-template-columns: 1fr;
    }

    .profile-sidebar {
        min-width: 0;
        max-width: none;
    }

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

@media (max-width: 768px) {
    .profile-listing-card {
        grid-template-columns: 1fr;
    }

    .profile-main-head {
        flex-direction: column;
        align-items: stretch;
    }

    .profile-view-toggle {
        align-self: flex-end;
    }

    .profile-selections-grid {
        grid-template-columns: 1fr;
    }

    .profile-edit-grid,
    .profile-edit-socials,
    .profile-modal-actions {
        grid-template-columns: 1fr;
    }
}
