/* ================================================================
 * 26 — Hi Car Match Marketplace Refresh
 * Encar-grade information structure + original HICM red/cream mascot.
 * Final override layer: keeps routes, forms and backend contracts intact.
 * ================================================================ */

:root {
    --hicm-ui-border: #E3E6EB;
    --hicm-ui-border-strong: #CDD2DA;
    --hicm-ui-surface: #FFFFFF;
    --hicm-ui-soft: #F6F7F9;
    --hicm-ui-ink: #17191D;
    --hicm-ui-muted: #69707D;
    --hicm-ui-shadow: 0 12px 34px rgba(23, 25, 29, 0.08);
    --hicm-ui-shadow-sm: 0 4px 16px rgba(23, 25, 29, 0.07);
    --hicm-z-header: 200;
    --hicm-z-nav: 1200;
    --hicm-z-backdrop: 1290;
    --hicm-z-sheet: 1300;
    --hicm-z-drawer: 1500;
    --hicm-z-modal: 1800;
    --hicm-z-lightbox: 1900;
    --hicm-z-search: 2000;
}

body {
    color: var(--hicm-ui-ink);
    background: #fff;
}

/* Marketplace pages use a neutral information typeface. The playful display
   face remains in the actual logo only. */
h1, h2, h3,
.gab-section-header h2,
.gab-section-title,
.gab-hx-title,
.gab-aw-makes-title,
.gab-reco-title,
.gab-how-title,
.gab-cta-title,
.gab-page-hero-title,
.gab-empty-title,
.gab-car-card-price-value,
.gab-detail-price-value,
.gab-aw-stat b,
.gab-shipmini-title {
    font-family: var(--gab-font-sans);
    font-weight: 800;
    letter-spacing: -0.025em;
}

.gab-logo-name,
.gab-drawer-logo,
.gab-auth-logo-name,
.gab-reg-logo-name {
    font-family: var(--gab-font-display);
    letter-spacing: 0;
}

/* Header: light, structured and intentionally quieter than the mascot. */
.gab-site-header {
    z-index: var(--hicm-z-header);
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid var(--hicm-ui-border);
    box-shadow: 0 3px 14px rgba(23, 25, 29, 0.05);
    backdrop-filter: blur(14px);
}

.gab-main-header,
.gab-nav-bar {
    background: transparent;
}

.gab-nav-bar {
    border-bottom: 0;
}

.gab-header-search-form {
    height: 44px;
    background: var(--hicm-ui-soft);
    border: 1px solid var(--hicm-ui-border);
    border-radius: 12px;
    box-shadow: none;
}

.gab-header-search-form:focus-within {
    background: #fff;
    border-color: var(--gab-primary-500);
    box-shadow: 0 0 0 3px rgba(216, 52, 44, 0.10);
}

.gab-header-search-btn {
    width: 42px;
    border-radius: 10px;
}

.gab-btn-primary,
.gab-btn--primary,
.gab-fm-cta-btn,
.gab-filter-apply {
    border: 0 !important;
    border-radius: 10px;
    box-shadow: 0 7px 16px rgba(176, 35, 24, 0.20);
}

.gab-btn-primary:hover,
.gab-btn--primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 9px 20px rgba(176, 35, 24, 0.24);
}

/* ----------------------------------------------------------------
 * Home hero
 * ---------------------------------------------------------------- */
.gab-hx {
    min-height: 650px;
    padding: 58px 0 66px;
    overflow: hidden;
    background: linear-gradient(135deg, #FFFDFC 0%, #F9F5F1 54%, #F2F6FA 100%);
    border-bottom: 1px solid var(--hicm-ui-border);
}

.gab-hx-bg {
    background:
        radial-gradient(680px 340px at 18% 8%, rgba(216, 52, 44, 0.07), transparent 66%),
        radial-gradient(760px 430px at 86% 20%, rgba(201, 224, 244, 0.48), transparent 68%);
}

.gab-hx-bg::after {
    opacity: 0.45;
    background-size: 32px 32px;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.45), transparent 72%);
}

.gab-hx::before {
    content: none;
}

.gab-hx::after {
    height: 58px;
    opacity: 0.035;
}

.gab-hx-inner {
    position: relative;
    z-index: 2;
    max-width: var(--gab-container-2xl);
    margin: 0 auto;
    padding: 0 clamp(20px, 4vw, 48px);
    text-align: start;
}

.gab-hx-badge,
.gab-hx-title,
.gab-hx-sub,
.gab-hx-makes {
    width: min(56%, 780px);
}

.gab-hx-badge {
    display: inline-flex;
    width: auto;
    min-height: 34px;
    margin-bottom: 18px;
    padding: 6px 13px;
    background: #fff;
    border: 1px solid var(--hicm-ui-border-strong);
    border-radius: 999px;
    box-shadow: var(--hicm-ui-shadow-sm);
    color: #3C424B;
    font-size: 12.5px;
}

.gab-hx-title {
    max-width: 760px;
    font-size: clamp(38px, 3.5vw, 54px);
    line-height: 1.08;
    color: var(--hicm-ui-ink);
}

.gab-hx-accent {
    color: var(--gab-primary-600);
    text-decoration: none;
    -webkit-text-fill-color: currentColor;
}

.gab-hx-sub {
    max-width: 710px;
    margin-top: 18px;
    color: #555D69;
    font-size: 16px;
    line-height: 1.75;
}

.gab-hx-visual {
    position: absolute;
    top: 14px;
    right: clamp(20px, 4vw, 48px);
    width: min(42%, 600px);
    height: 400px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 26px;
    box-shadow: 0 24px 62px rgba(23, 25, 29, 0.16);
    background: #F6F1EA;
    isolation: isolate;
}

body[dir="rtl"] .gab-hx-visual {
    right: auto;
    left: clamp(20px, 4vw, 48px);
}

.gab-hx-visual picture,
.gab-hx-visual picture img {
    display: block;
    width: 100%;
    height: 100%;
}

.gab-hx-visual picture img {
    object-fit: cover;
    object-position: center;
}

.gab-hx-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(180deg, transparent 58%, rgba(15, 18, 22, 0.28));
}

.gab-hx-visual-label {
    position: absolute;
    left: 18px;
    bottom: 17px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 6px 12px;
    color: #fff;
    background: rgba(18, 21, 26, 0.74);
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 999px;
    backdrop-filter: blur(9px);
    font-size: 12px;
    font-weight: 800;
}

body[dir="rtl"] .gab-hx-visual-label {
    left: auto;
    right: 18px;
}

.gab-hx-visual-label i {
    color: #8DE0A4;
}

.gab-hx-visual-mascot {
    position: absolute;
    right: -10px;
    bottom: -18px;
    z-index: 4;
    width: 124px;
    height: auto;
    filter: drop-shadow(0 10px 14px rgba(0, 0, 0, 0.18));
    pointer-events: none;
}

body[dir="rtl"] .gab-hx-visual-mascot {
    right: auto;
    left: -10px;
    transform: scaleX(-1);
}

.gab-hx-makes {
    max-width: 780px;
    margin: 30px 0 0;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--hicm-ui-border);
    border-radius: 18px;
    box-shadow: var(--hicm-ui-shadow);
    backdrop-filter: blur(10px);
}

body[dir="rtl"] .gab-hx-makes {
    margin-right: 0;
    margin-left: auto;
}

.gab-hx-makes-tabs {
    min-height: 54px;
    padding: 8px 10px 0;
    border-bottom: 1px solid var(--hicm-ui-border);
}

.gab-hx-mtab {
    top: 1px;
    padding: 9px 18px 11px;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    font-family: var(--gab-font-sans);
    font-size: 15px;
    font-weight: 800;
}

.gab-hx-mtab.is-on {
    color: var(--gab-primary-600);
    background: transparent;
    border-color: var(--gab-primary-600);
}

.gab-hx-makes-grid {
    padding: 8px 10px;
    gap: 4px;
}

.gab-hx-make {
    min-height: 50px;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: 10px;
}

.gab-hx-make:hover {
    background: #FFF6F5;
    border-color: #F6D1CD;
}

.gab-hx-mini {
    min-height: 52px;
    padding: 8px 10px 8px 15px;
    border-top: 1px solid var(--hicm-ui-border);
}

.gab-hx-mini button {
    min-width: 76px;
    min-height: 36px;
    background: var(--gab-primary-600);
    border-radius: 9px;
}

/* Statistics and quick quote: compact, data-first, character-light. */
.gab-aw-stats {
    padding: 24px 0 8px;
}

.gab-aw-stats-mascot,
.gab-shipmini-mascot,
.gab-footer-mascot {
    display: none !important;
}

.gab-aw-stats-grid {
    gap: 10px;
}

.gab-aw-stat {
    min-height: 96px;
    padding: 16px 14px;
    border: 1px solid var(--hicm-ui-border) !important;
    border-radius: 14px;
    box-shadow: none;
}

.gab-aw-stat b {
    font-size: 25px;
    color: var(--hicm-ui-ink);
}

.gab-aw-stat i {
    color: var(--gab-primary-600);
}

.gab-shipmini {
    padding: 18px 0 10px;
}

.gab-shipmini-inner {
    gap: 18px;
    padding: 18px 22px;
    background: linear-gradient(110deg, #F2F7FB, #FFFFFF 58%);
    border: 1px solid #D8E4EF;
    border-radius: 16px;
    box-shadow: none;
}

.gab-shipmini-badge {
    border: 0;
    background: #E6F0F8;
    color: #244B6C;
}

.gab-shipmini-title {
    font-size: 21px;
}

.gab-shipmini-select,
.gab-shipmini-btn {
    min-height: 46px;
    border: 1px solid var(--hicm-ui-border-strong);
    border-radius: 10px;
    box-shadow: none;
}

.gab-shipmini-btn {
    border-color: var(--hicm-ui-ink);
}

/* Data components: light borders, crisp hierarchy. */
.gab-mkpick,
.gab-filter-sidebar,
.gab-list-toolbar,
.gab-reco-section,
.gab-how-node,
.gab-cta-inner,
.gab-auth-card,
.gab-reg-card {
    border: 1px solid var(--hicm-ui-border) !important;
    box-shadow: var(--hicm-ui-shadow-sm);
}

.gab-mkpick {
    border-radius: 16px;
}

.gab-mkpick-brands {
    background: #FAFAFB;
    border-right: 1px solid var(--hicm-ui-border);
}

body[dir="rtl"] .gab-mkpick-brands {
    border-right: 0;
    border-left: 1px solid var(--hicm-ui-border);
}

.gab-mkpick-brand {
    border-bottom: 1px solid #ECEEF2;
}

.gab-mkpick-brand.is-on {
    background: #fff;
}

.gab-mkpick-model {
    border: 1px solid var(--hicm-ui-border);
    box-shadow: none;
}

.gab-mkpick-model:hover {
    transform: translateY(-2px);
    border-color: #EEB5AF;
    box-shadow: var(--hicm-ui-shadow-sm);
}

.gab-car-card {
    border: 1px solid var(--hicm-ui-border) !important;
    border-radius: 16px;
    box-shadow: 0 3px 14px rgba(23, 25, 29, 0.065);
}

.gab-car-card:hover {
    transform: translateY(-4px);
    border-color: #C9CED6 !important;
    box-shadow: 0 14px 32px rgba(23, 25, 29, 0.12);
}

.gab-car-card-fav {
    border: 1px solid rgba(23, 25, 29, 0.15) !important;
    box-shadow: 0 3px 10px rgba(23, 25, 29, 0.12);
}

.gab-ccg-ribbon,
.gab-seller-type {
    border-width: 1px;
    box-shadow: none;
}

.gab-car-card-price-value {
    color: #B9211B;
}

/* ----------------------------------------------------------------
 * Destination spotlight
 * ---------------------------------------------------------------- */
.gab-market-spotlight {
    position: relative;
    min-height: 270px;
    margin: 24px 0 20px;
    overflow: hidden;
    border-radius: 20px;
    background: #111820;
    box-shadow: var(--hicm-ui-shadow);
    isolation: isolate;
}

.gab-market-spotlight-media,
.gab-market-spotlight-media img {
    display: block;
    width: 100%;
    height: 100%;
}

.gab-market-spotlight-media {
    position: absolute;
    inset: 0;
}

.gab-market-spotlight-media img {
    object-fit: cover;
    object-position: center;
}

.gab-market-spotlight::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(90deg, rgba(11, 17, 24, 0.90) 0%, rgba(11, 17, 24, 0.66) 42%, rgba(11, 17, 24, 0.10) 72%);
}

body[dir="rtl"] .gab-market-spotlight::after {
    background: linear-gradient(270deg, rgba(11, 17, 24, 0.90) 0%, rgba(11, 17, 24, 0.66) 42%, rgba(11, 17, 24, 0.10) 72%);
}

.gab-market-spotlight-copy {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: min(55%, 650px);
    min-height: 270px;
    padding: 34px 40px;
    color: #fff;
}

.gab-market-spotlight-copy > span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 10px;
    color: #FFD3CE;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.gab-market-spotlight-copy strong {
    max-width: 560px;
    font-size: clamp(25px, 2.4vw, 38px);
    line-height: 1.18;
    letter-spacing: -0.035em;
}

.gab-market-spotlight-copy p {
    max-width: 520px;
    margin-top: 12px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 14px;
}

.gab-market-tabs {
    gap: 7px;
}

.gab-market-tab {
    min-height: 42px;
    border-radius: 10px;
}

.gab-market-tab.is-on {
    box-shadow: 0 5px 12px rgba(176, 35, 24, 0.18);
}

/* ----------------------------------------------------------------
 * Inspection / support / shipping photo cards
 * ---------------------------------------------------------------- */
.gab-proof {
    background: #F6F7F9;
    border-top: 1px solid var(--hicm-ui-border);
    border-bottom: 1px solid var(--hicm-ui-border);
}

.gab-proof-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 28px;
}

.gab-proof-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    color: var(--gab-primary-600);
    font-size: 11.5px;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.gab-proof-kicker img {
    width: 24px;
    height: 24px;
}

.gab-proof-head h2 {
    font-size: clamp(27px, 3vw, 42px);
    line-height: 1.2;
}

.gab-proof-head p {
    max-width: 720px;
    margin-top: 10px;
    color: var(--hicm-ui-muted);
    font-size: 15px;
}

.gab-proof-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex-shrink: 0;
    min-height: 42px;
    padding: 0 16px;
    color: var(--hicm-ui-ink);
    background: #fff;
    border: 1px solid var(--hicm-ui-border-strong);
    border-radius: 10px;
    font-size: 13px;
    font-weight: 800;
}

.gab-proof-link:hover {
    color: var(--gab-primary-600);
    border-color: var(--gab-primary-300);
}

.gab-proof-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.gab-proof-card {
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--hicm-ui-border);
    border-radius: 18px;
    box-shadow: 0 6px 22px rgba(23, 25, 29, 0.06);
    transition: transform .2s ease, box-shadow .2s ease;
}

.gab-proof-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--hicm-ui-shadow);
}

.gab-proof-media {
    position: relative;
    height: 225px;
    overflow: hidden;
    background: #E9EDF1;
}

.gab-proof-media::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 40%;
    background: linear-gradient(transparent, rgba(12, 16, 21, 0.30));
}

.gab-proof-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .45s ease;
}

.gab-proof-card:hover .gab-proof-media img {
    transform: scale(1.025);
}

.gab-proof-num {
    position: absolute;
    right: 14px;
    bottom: 12px;
    z-index: 2;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
}

body[dir="rtl"] .gab-proof-num {
    right: auto;
    left: 14px;
}

.gab-proof-body {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 20px;
}

.gab-proof-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    color: var(--gab-primary-600);
    background: var(--gab-primary-50);
    border-radius: 12px;
    font-size: 19px;
}

.gab-proof-body h3 {
    margin: 1px 0 6px;
    font-size: 18px;
}

.gab-proof-body p {
    color: var(--hicm-ui-muted);
    font-size: 13.5px;
    line-height: 1.65;
}

/* Process and CTA: retain one large mascot at the final conversion point. */
.gab-how-section {
    padding: 66px 24px 72px;
    background: #fff;
}

.gab-how-node {
    padding: 24px 16px 22px;
    border-radius: 16px;
    box-shadow: none;
}

.gab-how-node:hover {
    transform: translateY(-3px);
    border-color: #D2D6DC !important;
    box-shadow: var(--hicm-ui-shadow-sm);
}

.gab-how-node-circle {
    width: 58px;
    height: 58px;
    border: 0;
    background: #FFF0EE;
    box-shadow: none;
}

.gab-cta {
    padding: 12px 0 72px;
}

.gab-cta-inner {
    overflow: hidden;
    border-radius: 20px;
    background: linear-gradient(115deg, #FFF7F5, #FFFFFF 62%, #EEF5FA);
}

.gab-btn-accent,
.gab-btn-outline-white {
    border-width: 1px !important;
    border-radius: 10px;
    box-shadow: none;
}

/* ----------------------------------------------------------------
 * Mobile consolidation
 * ---------------------------------------------------------------- */
@media (max-width: 1024px) {
    .gab-hx {
        min-height: 0;
        padding-top: 42px;
    }

    .gab-hx-badge,
    .gab-hx-title,
    .gab-hx-sub,
    .gab-hx-makes {
        width: 100%;
        max-width: none;
    }

    .gab-hx-visual {
        position: relative;
        top: auto;
        right: auto;
        left: auto;
        width: 100%;
        height: clamp(280px, 48vw, 440px);
        margin-top: 26px;
    }

    body[dir="rtl"] .gab-hx-visual {
        right: auto;
        left: auto;
    }

    .gab-hx-makes {
        margin-top: 18px;
    }
}

@media (max-width: 860px) {
    .gab-proof-grid {
        grid-template-columns: 1fr;
    }

    .gab-proof-card {
        display: grid;
        grid-template-columns: minmax(240px, 42%) 1fr;
    }

    .gab-proof-media {
        height: 100%;
        min-height: 210px;
    }
}

@media (max-width: 768px) {
    body {
        padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    }

    .gab-main-header,
    .gab-main-header-inner {
        height: 58px;
    }

    .gab-main-header .gab-logo-icon,
    .gab-logo-icon .hicm-logo-mark {
        width: 40px;
        height: 40px;
    }

    .gab-burger,
    .gab-main-header .gab-btn-icon {
        width: 42px;
        height: 42px;
    }

    .gab-header-search-form {
        height: 42px;
        border-radius: 10px;
    }

    .gab-hx {
        padding: 30px 0 38px;
    }

    .gab-hx-inner {
        padding: 0 16px;
    }

    .gab-hx-badge {
        min-height: 31px;
        margin-bottom: 14px;
        padding: 5px 10px;
        font-size: 10.5px;
    }

    .gab-hx-title {
        font-size: clamp(29px, 8.8vw, 38px);
        line-height: 1.12;
    }

    .gab-hx-sub {
        margin-top: 13px;
        font-size: 13.5px;
        line-height: 1.65;
    }

    .gab-hx-visual {
        height: min(64vw, 300px);
        margin-top: 20px;
        border-radius: 18px;
        box-shadow: 0 14px 34px rgba(23, 25, 29, 0.14);
    }

    .gab-hx-visual picture img {
        object-position: 55% center;
    }

    .gab-hx-visual-mascot {
        width: 84px;
        right: -6px;
        bottom: -12px;
    }

    body[dir="rtl"] .gab-hx-visual-mascot {
        right: auto;
        left: -6px;
    }

    .gab-hx-visual-label {
        left: 10px;
        bottom: 10px;
        min-height: 29px;
        padding: 4px 9px;
        font-size: 10px;
    }

    body[dir="rtl"] .gab-hx-visual-label {
        left: auto;
        right: 10px;
    }

    .gab-hx-makes {
        margin: 15px 0 0;
        border: 1px solid var(--hicm-ui-border);
        border-radius: 14px;
        box-shadow: 0 8px 24px rgba(23, 25, 29, 0.09);
    }

    .gab-hx-makes-tabs {
        min-height: 49px;
        padding-top: 5px;
    }

    .gab-hx-mtab {
        min-height: 44px;
        padding: 9px 13px 10px;
        font-size: 13.5px;
    }

    .gab-hx-makes-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-height: 205px;
        overflow-y: auto;
    }

    .gab-hx-make {
        min-height: 46px;
    }

    .gab-hx-mini {
        min-height: 54px;
    }

    .gab-aw-stats {
        padding-top: 16px;
    }

    .gab-aw-stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .gab-aw-stat {
        min-height: 84px;
        padding: 12px 8px;
    }

    .gab-aw-stat b {
        font-size: 20px;
    }

    .gab-shipmini-inner {
        display: grid;
        grid-template-columns: 1fr;
        padding: 15px;
        border-radius: 14px;
    }

    .gab-shipmini-form {
        width: 100%;
    }

    .gab-shipmini-select,
    .gab-shipmini-btn {
        min-height: 48px;
    }

    .gab-market-spotlight {
        min-height: 310px;
        margin: 18px 0 16px;
        border-radius: 16px;
    }

    .gab-market-spotlight::after,
    body[dir="rtl"] .gab-market-spotlight::after {
        background: linear-gradient(180deg, rgba(11, 17, 24, 0.10) 22%, rgba(11, 17, 24, 0.92) 84%);
    }

    .gab-market-spotlight-copy {
        justify-content: flex-end;
        width: 100%;
        min-height: 310px;
        padding: 22px;
    }

    .gab-market-spotlight-copy strong {
        font-size: 25px;
    }

    .gab-market-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 4px;
        scrollbar-width: none;
    }

    .gab-market-tabs::-webkit-scrollbar {
        display: none;
    }

    .gab-market-tab {
        flex: 0 0 auto;
        min-height: 44px;
    }

    .gab-proof-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .gab-proof-head h2 {
        font-size: 27px;
    }

    .gab-proof-link {
        min-height: 44px;
    }

    .gab-proof-card {
        display: block;
    }

    .gab-proof-media {
        height: 58vw;
        min-height: 205px;
        max-height: 300px;
    }

    .gab-proof-body {
        padding: 17px;
    }

    .gab-how-section {
        padding: 48px 16px 54px;
    }

    .gab-how-flow {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .gab-how-node {
        padding: 18px 10px 16px;
    }

    .gab-how-node-circle {
        width: 50px;
        height: 50px;
        font-size: 21px;
    }

    .gab-how-node-step {
        font-size: 13.5px;
    }

    .gab-how-node-desc {
        font-size: 11.5px;
    }

    .gab-cta {
        padding-bottom: 42px;
    }

    .gab-cta-mascot {
        width: 90px;
    }

    /* One bottom navigation only; footer remains available for legal/contact. */
    .gab-tabbar {
        z-index: var(--hicm-z-nav);
        height: calc(64px + env(safe-area-inset-bottom, 0px));
        border-top: 1px solid var(--hicm-ui-border);
        box-shadow: 0 -8px 26px rgba(23, 25, 29, 0.08);
    }

    .gab-tabbar-item {
        min-height: 64px;
    }

    .gab-tabbar-cta-btn {
        border: 3px solid #fff;
        border-radius: 15px;
        box-shadow: 0 7px 18px rgba(176, 35, 24, 0.26);
    }

    .gab-footer {
        display: block !important;
        padding-bottom: calc(22px + env(safe-area-inset-bottom, 0px));
    }

    /* Listing: qbar is the only mobile filter/sort controller. */
    .gab-filter-mtoggle,
    .gab-list-controls {
        display: none !important;
    }

    .gab-list-toolbar {
        position: static !important;
        padding: 10px 12px !important;
        border: 0 !important;
        border-bottom: 1px solid var(--hicm-ui-border) !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    .gab-qbar {
        top: 58px;
        z-index: calc(var(--hicm-z-header) - 1);
        min-height: 54px;
        padding: 7px 10px;
        border-bottom: 1px solid var(--hicm-ui-border);
        box-shadow: 0 5px 12px rgba(23, 25, 29, 0.05);
    }

    .gab-site-header.gab-hdr-hidden ~ main .gab-qbar,
    .gab-hdr-hidden + main .gab-qbar {
        top: 0;
    }

    .gab-qbar-filter,
    .gab-qbar-sort,
    .gab-qchip {
        min-height: 42px;
        border-width: 1px !important;
        border-radius: 10px !important;
        box-shadow: none !important;
    }

    /* Final mobile card system: compact horizontal marketplace rows. */
    .gab-cars-grid,
    .gab-cars-grid-3,
    .gab-cars-grid-4 {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .gab-cars-grid .gab-car-card,
    .gab-cars-grid-3 .gab-car-card,
    .gab-cars-grid-4 .gab-car-card {
        display: grid !important;
        grid-template-columns: 132px minmax(0, 1fr);
        align-items: stretch !important;
        min-height: 132px;
        overflow: hidden;
        border: 1px solid var(--hicm-ui-border) !important;
        border-radius: 13px !important;
        box-shadow: 0 2px 9px rgba(23, 25, 29, 0.055) !important;
    }

    .gab-car-card:active {
        transform: scale(0.992);
    }

    .gab-car-card-gallery {
        width: 132px !important;
        height: 100%;
        min-height: 132px;
    }

    .gab-ccg-main {
        width: 100% !important;
        height: 100% !important;
        min-height: 132px !important;
        aspect-ratio: auto !important;
        border-radius: 0 !important;
    }

    .gab-ccg-main-img,
    .gab-car-card-image-placeholder {
        width: 100%;
        height: 100% !important;
        object-fit: cover;
    }

    .gab-ccg-thumbs,
    .gab-ccg-ribbon,
    .gab-car-card-badges,
    .gab-ccg-video {
        display: none !important;
    }

    .gab-car-card-fav {
        width: 34px !important;
        height: 34px !important;
        top: 7px;
        right: 7px;
        font-size: 15px;
        border: 0 !important;
    }

    [dir="rtl"] .gab-car-card-fav {
        right: auto;
        left: 7px;
    }

    .gab-ccg-meta {
        right: 7px;
        bottom: 7px;
    }

    [dir="rtl"] .gab-ccg-meta {
        right: auto;
        left: 7px;
    }

    .gab-car-card-body {
        min-width: 0;
        padding: 11px 12px !important;
    }

    .gab-car-card-topline {
        gap: 5px;
    }

    .gab-car-card-brand {
        font-size: 10px;
    }

    .gab-cert-mini {
        padding: 2px 5px;
        font-size: 7.5px;
    }

    .gab-seller-type {
        padding: 3px 6px;
        font-size: 8px;
    }

    .gab-car-card-title {
        display: -webkit-box;
        min-height: 0 !important;
        margin: 4px 0 7px !important;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        font-size: 14px !important;
        line-height: 1.28;
    }

    .gab-car-card-specs {
        display: flex;
        gap: 5px;
        margin: 0 0 4px !important;
        overflow: hidden;
        color: #777E88;
        font-size: 10px;
        white-space: nowrap;
    }

    .gab-car-card-spec:nth-of-type(3),
    .gab-car-card-spec-divider:nth-of-type(4) {
        display: none;
    }

    .gab-car-card-location {
        display: none;
    }

    .gab-car-card-price-row {
        display: flex !important;
        align-items: flex-end;
        justify-content: space-between;
        margin-top: 5px !important;
        padding: 0 !important;
        border: 0 !important;
    }

    .gab-car-card-price-label,
    .gab-car-card-price-original {
        display: none;
    }

    .gab-car-card-price-value {
        font-size: 16px !important;
        line-height: 1.1;
    }

    .gab-car-card-price-currency {
        font-size: 8.5px;
    }

    /* Overlay order: dialogs and lightbox always cover fixed navigation. */
    .gab-sheet-ov,
    .gab-sheet-backdrop,
    .gab-filter-overlay {
        z-index: var(--hicm-z-backdrop) !important;
    }

    .gab-filter-sidebar,
    .gab-sort-sheet {
        z-index: var(--hicm-z-sheet) !important;
    }

    .gab-drawer-ov {
        z-index: calc(var(--hicm-z-drawer) - 1) !important;
    }

    .gab-drawer {
        z-index: var(--hicm-z-drawer) !important;
    }

    .gab-modal-backdrop,
    .gab-modal-box,
    .gab-modal-card,
    .gab-bw-bd {
        z-index: var(--hicm-z-modal) !important;
    }

    .gab-lb {
        z-index: var(--hicm-z-lightbox) !important;
    }

    .gab-msearch {
        z-index: var(--hicm-z-search) !important;
    }

    .gab-mbar {
        z-index: 1150 !important;
    }

    /* Real detail template selectors (legacy mobile rules used stale names). */
    .gab-gallery {
        margin-inline: -12px;
        overflow: hidden;
        border-radius: 0 !important;
    }

    .gab-gallery-main {
        aspect-ratio: 4 / 3;
        min-height: 0;
    }

    .gab-gallery-main > img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .gab-detail-info {
        min-width: 0;
    }

    .gab-price-card-value {
        font-size: clamp(25px, 8vw, 34px);
        letter-spacing: -0.035em;
    }
}

@media (max-width: 390px) {
    .gab-hx-mall {
        font-size: 10.5px;
    }

    .gab-hx-makes-grid {
        grid-template-columns: 1fr 1fr;
    }

    .gab-hx-make {
        padding: 8px 7px;
    }

    .gab-hx-make-name {
        font-size: 12px;
    }

    .gab-cars-grid .gab-car-card,
    .gab-cars-grid-3 .gab-car-card,
    .gab-cars-grid-4 .gab-car-card {
        grid-template-columns: 116px minmax(0, 1fr);
    }

    .gab-car-card-gallery {
        width: 116px !important;
    }

    .gab-car-card-body {
        padding: 10px !important;
    }

    .gab-seller-type i,
    .gab-cert-mini img {
        display: none;
    }
}

/* Arabic and mixed numeric data. */
body[dir="rtl"] .gab-num,
body[dir="rtl"] .gab-price,
body[dir="rtl"] .gab-car-card-price-value,
body[dir="rtl"] .gab-detail-price-value,
body[dir="rtl"] [data-vin],
body[dir="rtl"] input[type="tel"] {
    direction: ltr;
    unicode-bidi: isolate;
}

@media (prefers-reduced-motion: reduce) {
    .gab-proof-card,
    .gab-proof-media img,
    .gab-car-card,
    .gab-hx-visual {
        transition: none !important;
    }
}