.catalog-hero {
    padding-top: var(--space-8);
    padding-bottom: var(--space-4);
}

.catalog-hero h1 {
    margin: 0;
    font-size: var(--font-size-section-title);
    line-height: 1.1;
    font-weight: var(--weight-semibold);
}

.catalog-hero p {
    margin: var(--space-4) 0 0;
    max-width: 920px;
    color: var(--color-text-dim);
    line-height: 1.6;
}
.bike-catalog--catalog {
    padding-top: var(--space-8);
    padding-bottom: var(--space-10);
}

.catalog-listing__status {
    margin: var(--space-6) 0 0;
    color: var(--color-text-dim);
    font-size: var(--font-size-body);
    text-align: center;
}

.catalog-listing__empty {
    margin: var(--space-6) 0 0;
    color: var(--color-text-dim);
    font-size: var(--font-size-body);
}

.catalog-listing__sentinel {
    height: 1px;
}

.catalog-listing.is-map-mode {
    width: min(100%, var(--layout-max-width));
    margin-inline: auto;
    padding-inline: var(--space-8);
}

.catalog-listing.is-map-mode .catalog-listing__grid-view {
    display: none;
}

.catalog-listing__map-view {
    margin-top: 0;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    display: none;
    grid-template-columns: minmax(320px, 1fr) minmax(0, 2fr);
    min-height: calc(100vh - 220px);
    background: var(--color-bg-header);
}

.catalog-listing.is-map-mode .catalog-listing__map-view {
    display: grid;
}

.catalog-listing__map-sidebar {
    border-right: 1px solid var(--color-border);
    background: var(--ui-dropdown-item-active-bg);
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.catalog-listing__map-count {
    margin: 0;
    padding: var(--space-5);
    border-bottom: 1px solid var(--color-border);
    color: var(--color-text-dim);
    font-size: var(--font-size-body);
}

.catalog-listing__map-list {
    min-height: 0;
    height: calc(100vh - 280px);
    overflow-y: auto;
    padding: var(--space-5);
}

.catalog-listing__map-list .bike-grid--map {
    grid-template-columns: 1fr;
}

.catalog-listing__map-empty {
    margin-top: var(--space-4);
}

.catalog-listing__map-status {
    text-align: left;
    margin-top: var(--space-4);
}

.catalog-listing__map-pane {
    position: relative;
    min-width: 0;
    background: var(--color-bg-header);
}

.catalog-listing__map-canvas {
    position: sticky;
    top: 0;
    height: calc(100vh - 180px);
    min-height: 520px;
    background: var(--ui-dropdown-item-active-bg);
}

.catalog-listing__map-canvas .maplibregl-map,
.catalog-listing__map-canvas .maplibregl-canvas-container,
.catalog-listing__map-canvas .maplibregl-canvas {
    width: 100%;
    height: 100%;
}

.catalog-listing__map-canvas .maplibregl-canvas {
    display: block;
}

.catalog-listing__map-canvas .maplibregl-ctrl-group {
    border-radius: 0;
}

.catalog-listing__map-canvas-status {
    position: absolute;
    top: var(--space-4);
    left: var(--space-4);
    margin: 0;
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--color-border);
    background: var(--color-auto-neutral-13);
    color: var(--color-text-dim);
    font-size: var(--font-size-sm);
    max-width: min(90%, 420px);
}

.catalog-map-marker {
    min-width: 56px;
    min-height: 58px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--color-text);
    font-size: var(--font-size-sm);
    font-weight: var(--weight-semibold);
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: none;
}

.catalog-map-pin {
    position: relative;
    width: 56px;
    height: 58px;
    display: inline-flex;
    align-items: flex-start;
    justify-content: center;
}

.catalog-map-pin__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    pointer-events: none;
    box-shadow: none;
    filter: none;
}

.catalog-map-pin__core {
    position: relative;
    z-index: 2;
    min-width: 0;
    height: auto;
    margin-top: 14px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: var(--color-text);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-map-pin-label);
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1;
    text-shadow: 0 1px 2px var(--color-auto-black-05);
    white-space: nowrap;
}

.catalog-map-pin__core--cluster {
    margin-top: 14px;
}

.catalog-map-marker:hover .catalog-map-pin__image {
    filter: brightness(1.06);
}

.catalog-map-marker--cluster {
    min-width: 56px;
    min-height: 58px;
}