:root {
    --market-primary: #131353;
    --market-secondary: #DB4953;
    --market-ink: #353f4f;
    --market-muted: #72758a;
    --market-soft: #f6f6fa;
    --market-line: #e7e8f0;
    --market-card: #ffffff;
    --market-shadow: 0 18px 55px rgba(19, 19, 83, .09);
    --market-radius: 24px;
}

.marketplace-page { background: #fff; color: var(--market-ink); }
.marketplace-hero {
    position: relative;
    overflow: hidden;
    padding: 160px 0 72px;
    background:
        radial-gradient(circle at 82% 22%, rgba(219,73,83,.12), transparent 24%),
        radial-gradient(circle at 15% 20%, rgba(19,19,83,.10), transparent 30%),
        linear-gradient(180deg, #fbfbfe 0%, #f6f6fa 100%);
    border-bottom: 1px solid var(--market-line);
}
.marketplace-hero::after {
    content: "";
    position: absolute;
    width: 340px;
    height: 340px;
    border-radius: 50%;
    right: -130px;
    bottom: -190px;
    border: 58px solid rgba(19,19,83,.05);
}
.market-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: .5rem .85rem;
    border: 1px solid rgba(19,19,83,.10);
    background: rgba(255,255,255,.88);
    border-radius: 999px;
    color: var(--market-primary);
    font-weight: 700;
    font-size: .84rem;
}
.marketplace-hero h1 {
    max-width: 920px;
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: 1.02;
}
.marketplace-hero .lead { max-width: 800px; color: var(--market-muted); }
.market-stat {
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    padding: .8rem 1rem;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--market-line);
    box-shadow: 0 10px 28px rgba(19,19,83,.06);
    font-weight: 700;
}
.market-stat i { color: var(--market-secondary); }

.market-filter-shell { margin-top: -34px; position: relative; z-index: 8; }
.market-filter-card {
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    border: 1px solid var(--market-line);
    box-shadow: var(--market-shadow);
    padding: 20px;
}
.market-filter-card label {
    display: block;
    margin: 0 0 .4rem;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .02em;
    color: #51536b;
}
.market-filter-card .form-select,
.market-filter-card .form-control {
    min-height: 48px;
    border-radius: 14px;
    border-color: #dfe0ea;
    color: var(--market-ink);
    font-weight: 500;
}
.market-filter-card .form-select:focus,
.market-filter-card .form-control:focus {
    border-color: rgba(19,19,83,.35);
    box-shadow: 0 0 0 .2rem rgba(19,19,83,.08);
}
.market-filter-card .btn { min-height: 48px; }
.market-toggle {
    display: inline-flex;
    gap: .4rem;
    padding: .35rem;
    border: 1px solid var(--market-line);
    border-radius: 999px;
    background: var(--market-soft);
}
.market-toggle a {
    border-radius: 999px;
    padding: .6rem .9rem;
    text-decoration: none;
    color: var(--market-muted);
    font-weight: 700;
    font-size: .88rem;
}
.market-toggle a.active { background: #fff; color: var(--market-primary); box-shadow: 0 5px 18px rgba(19,19,83,.08); }

.market-section { padding: 78px 0; }
.market-section-title h2 { font-weight: 800; letter-spacing: -.03em; }
.market-section-title p { color: var(--market-muted); }
.property-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; }
.property-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--market-line);
    border-radius: var(--market-radius);
    background: var(--market-card);
    box-shadow: 0 10px 30px rgba(19,19,83,.07);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.property-card:hover { transform: translateY(-5px); box-shadow: var(--market-shadow); border-color: rgba(19,19,83,.20); }
.property-media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #eeeef5; }
.property-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.property-card:hover .property-media img { transform: scale(1.035); }
.property-badges { position: absolute; inset: 14px auto auto 14px; display: flex; gap: 7px; flex-wrap: wrap; }
.property-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: .36rem .7rem;
    background: rgba(255,255,255,.94);
    color: var(--market-primary);
    font-size: .72rem;
    font-weight: 800;
    box-shadow: 0 8px 20px rgba(19,19,83,.12);
}
.property-badge--accent { background: var(--market-primary); color: #fff; }
.property-card-body { padding: 20px; display: flex; flex-direction: column; flex: 1; }
.property-location { color: var(--market-secondary); font-size: .76rem; font-weight: 800; text-transform: uppercase; letter-spacing: .045em; margin-bottom: .5rem; }
.property-title { color: var(--market-ink); font-size: 1.06rem; font-weight: 800; line-height: 1.35; margin-bottom: .8rem; }
.property-title:hover { color: var(--market-primary); }
.property-specs { display: flex; gap: .7rem; flex-wrap: wrap; color: var(--market-muted); font-size: .84rem; margin-bottom: 1rem; }
.property-specs span { display: inline-flex; align-items: center; gap: .35rem; }
.property-price-label { color: var(--market-muted); font-size: .76rem; }
.property-price { color: var(--market-primary); font-size: 1.45rem; font-weight: 800; letter-spacing: -.025em; }
.property-card-footer { margin-top: auto; padding-top: 1rem; display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.property-card-footer .btn { white-space: nowrap; }
.source-label { font-size: .7rem; color: #8b8da0; }

.market-empty,
.market-error {
    border: 1px solid var(--market-line);
    border-radius: var(--market-radius);
    background: var(--market-soft);
    padding: 42px;
    text-align: center;
}
.market-error { background: #fff7f7; border-color: #f2d6d8; }

.market-pagination .page-link {
    border: 0;
    margin: 0 .18rem;
    min-width: 42px;
    height: 42px;
    border-radius: 50% !important;
    display: grid;
    place-items: center;
    color: var(--market-primary);
    font-weight: 700;
    background: var(--market-soft);
}
.market-pagination .page-item.active .page-link { background: var(--market-primary); color: #fff; }
.market-pagination .page-link:hover { background: rgba(19,19,83,.10); color: var(--market-primary); }

.market-info-band {
    border-radius: 30px;
    padding: 34px;
    background: linear-gradient(135deg, var(--market-primary), #27276f);
    color: #fff;
    overflow: hidden;
    position: relative;
}
.market-info-band::after { content:""; position:absolute; width:190px; height:190px; border-radius:50%; right:-40px; top:-70px; background:rgba(255,255,255,.07); }
.market-info-band h2 { color: #fff; }
.market-info-band p { color: rgba(255,255,255,.78); }
.market-info-band .btn-light { border: 0; }

/* map page */
.map-layout { display: grid; grid-template-columns: 420px minmax(0,1fr); min-height: 690px; border: 1px solid var(--market-line); border-radius: 28px; overflow: hidden; box-shadow: var(--market-shadow); background: #fff; }
.map-list { overflow: auto; max-height: 760px; padding: 18px; background: #fff; border-right: 1px solid var(--market-line); }
.map-list-card { display: grid; grid-template-columns: 112px minmax(0,1fr); gap: 14px; padding: 11px; border-radius: 18px; border: 1px solid transparent; cursor: pointer; transition: .2s ease; text-decoration: none; color: inherit; }
.map-list-card + .map-list-card { margin-top: 8px; }
.map-list-card:hover, .map-list-card.is-active { background: var(--market-soft); border-color: rgba(19,19,83,.10); }
.map-list-card img { width: 112px; height: 92px; object-fit: cover; border-radius: 14px; background: #eeeef5; }
.map-list-card h3 { font-size: .94rem; line-height: 1.28; margin: 0 0 .35rem; font-weight: 800; }
.map-list-card .map-price { color: var(--market-primary); font-weight: 800; }
#propertiesMap { min-height: 690px; width: 100%; background: #eef0f6; }
.abrok-map-marker { background: transparent; border: 0; }
.abrok-map-marker span { display: inline-flex; align-items:center; justify-content:center; min-width: 54px; height: 34px; padding: 0 9px; border-radius: 999px; background: var(--market-primary); color:#fff; border:2px solid #fff; font-size:.75rem; font-weight:800; box-shadow:0 10px 24px rgba(19,19,83,.24); white-space:nowrap; }
.map-status { font-size: .82rem; color: var(--market-muted); }

@media (max-width: 1199.98px) {
    .property-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .map-layout { grid-template-columns: 360px minmax(0,1fr); }
}
@media (max-width: 991.98px) {
    .marketplace-hero { padding-top: 130px; }
    .market-filter-shell { margin-top: -24px; }
    .map-layout { display: flex; flex-direction: column; }
    #propertiesMap { min-height: 520px; order: 1; }
    .map-list { max-height: 520px; border-right: 0; border-top: 1px solid var(--market-line); order: 2; }
}
@media (max-width: 767.98px) {
    .marketplace-hero { padding: 122px 0 54px; }
    .marketplace-hero h1 { font-size: 2.3rem; }
    .market-section { padding: 56px 0; }
    .property-grid { grid-template-columns: 1fr; }
    .market-filter-card { padding: 16px; }
    .market-info-band { padding: 26px; }
}
@media (max-width: 480px) {
    .map-list-card { grid-template-columns: 90px minmax(0,1fr); }
    .map-list-card img { width: 90px; height: 82px; }
}