/* =============================================================
   Back Market-inspired Homepage Styling — v3 (header + cards)
   Scope: site-wide header (body level) + .bm-home + .bm-pcard
   Goal: highly accurate Back Market premium marketplace UI
   No backend logic touched — purely visual layer
   ============================================================= */

:root {
    --bm-lime: #97D700;
    --bm-lime-dark: #7CB300;
    --bm-lime-soft: #E8F8C7;
    --bm-lime-pale: #F4FCE3;
    --bm-lime-deep: #5E8A00;
    --bm-ink: #0A0B0F;
    --bm-ink-soft: #1F2228;
    --bm-text: #1A1D24;
    --bm-text-muted: #5B6471;
    --bm-text-subtle: #8B95A6;
    --bm-bg: #FFFFFF;
    --bm-bg-soft: #F4F5F8;
    --bm-bg-section: #FAFBFC;
    --bm-bg-card: #FFFFFF;
    --bm-border: #E8EAF0;
    --bm-border-soft: #F1F3F7;
    --bm-border-strong: #D2D6DF;
    --bm-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
    --bm-shadow-sm: 0 4px 12px rgba(15, 23, 42, 0.06);
    --bm-shadow-md: 0 10px 30px rgba(15, 23, 42, 0.08);
    --bm-shadow-lg: 0 20px 50px rgba(15, 23, 42, 0.12);
    --bm-shadow-card: 0 1px 2px rgba(0,0,0,0.03), 0 4px 10px rgba(0,0,0,0.03);
    --bm-shadow-card-hover: 0 4px 8px rgba(0,0,0,0.04), 0 24px 48px rgba(0,0,0,0.12);
    --bm-radius-sm: 8px;
    --bm-radius-md: 16px;
    --bm-radius-lg: 22px;
    --bm-radius-xl: 32px;
    --bm-radius-pill: 999px;
    --bm-transition: 250ms cubic-bezier(0.4, 0, 0.2, 1);
    --bm-transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);
    --bm-font: 'Public Sans', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ============================================================
   BASE
   ============================================================ */
body { -webkit-font-smoothing: antialiased; }
.bm-home {
    font-family: var(--bm-font);
    color: var(--bm-text);
    background: var(--bm-bg);
    line-height: 1.6;
    letter-spacing: -0.005em;
}
.bm-home img { image-rendering: -webkit-optimize-contrast; }
.bm-home a, body header a { transition: color var(--bm-transition); }
.bm-home a:hover { text-decoration: none !important; }
.bm-home button { font-family: inherit; }
.bm-home .container, .bm-home .container-fluid { padding-left: 24px; padding-right: 24px; }
@media (min-width: 1280px) {
    .bm-home .container,
    body header .container,
    body .top-navbar .container { max-width: 1360px !important; }
}

/* ============================================================
   ★ HEADER — full site-wide Back Market makeover (body-level overrides)
   ============================================================ */

/* TOP NAVBAR (.bm-topbar) — Back Market promise/journal strip */
body .top-navbar,
body .bm-topbar,
body .top-navbar[style*="background-color"] {
    background: #F4F5F8 !important;
    background-color: #F4F5F8 !important;
    border-bottom: 1px solid var(--bm-border) !important;
    min-height: 32px !important;
    height: auto !important;
    font-family: var(--bm-font);
    padding: 0 !important;
}
body .bm-topbar .container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.bm-topbar-inner {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 32px;
    padding: 4px 0;
    flex-wrap: wrap;
}

/* LEFT navigation */
.bm-topbar-nav {
    display: inline-flex;
    align-items: center;
    gap: 22px;
    flex-wrap: wrap;
}
.bm-topbar-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--bm-text) !important;
    text-decoration: none !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    letter-spacing: -0.005em;
    line-height: 1;
    padding: 4px 0 !important;
    transition: color var(--bm-transition);
    position: relative;
}
.bm-topbar-link::after {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 0; height: 1px;
    background: currentColor;
    transition: width 220ms ease;
}
.bm-topbar-link:hover { color: var(--bm-lime-deep) !important; }
.bm-topbar-link:hover::after { width: 100%; }
.bm-topbar-link svg { color: var(--bm-text); opacity: 0.85; flex-shrink: 0; }
.bm-topbar-link:hover svg { color: var(--bm-lime-deep); opacity: 1; }

/* RIGHT meta cluster */
.bm-topbar-meta {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}
.bm-topbar-select {
    display: inline-block;
    position: relative;
}
.bm-topbar-select-toggle,
.bm-topbar-select-toggle.dropdown-toggle {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    color: var(--bm-text) !important;
    text-decoration: none !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    line-height: 1;
    padding: 4px 8px !important;
    border-radius: 6px;
    cursor: pointer;
    transition: background var(--bm-transition), color var(--bm-transition);
}
.bm-topbar-select-toggle::after { display: none !important; }
.bm-topbar-select-toggle:hover { background: rgba(0, 0, 0, 0.05); color: var(--bm-text) !important; }
.bm-topbar-flag {
    width: 18px;
    height: 13px;
    object-fit: cover;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.06);
}
.bm-topbar-currency-symbol {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    font-size: 12px;
    font-weight: 800;
    color: var(--bm-text-muted);
    border-radius: 50%;
    background: #fff;
    border: 1px solid var(--bm-border);
}
.bm-topbar-select-toggle svg { color: var(--bm-text-muted); }

/* Seller + helpline (right side) */
.bm-topbar-seller,
.bm-topbar-help {
    color: var(--bm-text-muted) !important;
    text-decoration: none !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    transition: color var(--bm-transition);
}
.bm-topbar-seller:hover,
.bm-topbar-help:hover { color: var(--bm-lime-deep) !important; }
.bm-topbar-help .helpline-label { opacity: 0.85; margin-right: 4px; }
.bm-topbar-help .helpline-number-preview { font-weight: 700; color: var(--bm-text); }

/* DROPDOWNS (language + currency) */
body .bm-topbar .dropdown-menu.bm-topbar-dropdown {
    border-radius: 12px !important;
    border: 1px solid var(--bm-border) !important;
    box-shadow: var(--bm-shadow-md) !important;
    padding: 8px !important;
    margin-top: 6px !important;
    min-width: 180px;
}
body .bm-topbar .dropdown-menu.bm-topbar-dropdown .dropdown-item {
    border-radius: 8px;
    padding: 8px 12px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--bm-text) !important;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: background var(--bm-transition);
}
body .bm-topbar .dropdown-menu.bm-topbar-dropdown .dropdown-item:hover {
    background: var(--bm-bg-soft) !important;
    color: var(--bm-text) !important;
}
body .bm-topbar .dropdown-menu.bm-topbar-dropdown .dropdown-item.active {
    background: var(--bm-lime-pale) !important;
    color: var(--bm-lime-deep) !important;
    font-weight: 700 !important;
}

/* Responsive */
@media (max-width: 991px) {
    .bm-topbar-inner { gap: 12px; padding: 6px 0; }
    .bm-topbar-nav { gap: 18px; }
    .bm-topbar-link { font-size: 12.5px !important; }
    .bm-topbar-link svg { width: 12px; height: 14px; }
}
@media (max-width: 767px) {
    .bm-topbar-inner { flex-direction: column; align-items: flex-start; gap: 8px; }
    .bm-topbar-nav { gap: 14px; }
    .bm-topbar-meta { gap: 12px; align-self: stretch; justify-content: flex-end; }
    .bm-topbar-link { font-size: 12px !important; padding: 4px 0 !important; }
}
@media (max-width: 575px) {
    .bm-topbar-nav { gap: 10px; overflow-x: auto; flex-wrap: nowrap; width: 100%; padding-bottom: 4px; }
    .bm-topbar-nav::-webkit-scrollbar { display: none; }
    .bm-topbar-link { white-space: nowrap; }
}

/* MAIN HEADER (sticky, white, generous height) */
body header.sticky-top,
body header.middle-background-color-visibility,
body .stikcy-header-visibility {
    background: #fff !important;
    border-bottom: 1px solid var(--bm-border-soft) !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.02) !important;
}
body header.sticky-top.is-stuck,
body header.sticky-top { backdrop-filter: saturate(180%) blur(10px); }

body .logo-bar-area {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}
body .logo-bar-area > .container > .d-flex {
    min-height: 72px !important;
    gap: 20px !important;
}
@media (max-width: 991px) {
    body .logo-bar-area > .container > .d-flex { min-height: 56px !important; gap: 12px !important; }
}

/* LOGO sizing — clean, larger */
body .logo-bar-area .col-auto.pl-0 { padding-right: 0 !important; }
body .logo-bar-area .col-auto a img,
body #header-logo-preview {
    height: 44px !important;
    max-height: 44px !important;
    width: auto !important;
}
@media (max-width: 575px) {
    body .logo-bar-area .col-auto a img,
    body #header-logo-preview { height: 32px !important; max-height: 32px !important; }
}

/* MOBILE menu hamburger */
body .logo-bar-area button[data-target=".aiz-top-menu-sidebar"] {
    margin-right: 12px !important;
    padding: 8px !important;
    border-radius: 10px !important;
}
body .logo-bar-area button[data-target=".aiz-top-menu-sidebar"]:hover { background: var(--bm-bg-soft); }

/* SEARCH BAR — handled by bm-header.css (single source of truth across all pages).
   Previous duplicate overrides removed here so the homepage matches every other page. */

/* TRADE-IN button */
body .btn-soft-primary,
body header .btn-soft-primary {
    background: var(--bm-lime-pale) !important;
    color: var(--bm-lime-deep) !important;
    border-radius: var(--bm-radius-pill) !important;
    border: 0 !important;
    font-weight: 700 !important;
    padding: 12px 22px !important;
    font-size: 13.5px !important;
    transition: all var(--bm-transition) !important;
    box-shadow: none !important;
    height: auto !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
}
body .btn-soft-primary:hover {
    background: var(--bm-lime) !important;
    color: var(--bm-ink) !important;
    transform: translateY(-1px);
}
body .btn-soft-primary i { font-size: 16px; margin-right: 2px; }

/* Right-side icons cluster: compare / wishlist / notifications / user */
body header .nav-user-info {
    padding: 8px 12px !important;
    border-radius: var(--bm-radius-md) !important;
    transition: background var(--bm-transition);
}
body header .nav-user-info:hover { background: var(--bm-bg-soft); }
body header .nav-user-img {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: var(--bm-bg-soft) !important;
    border: 0 !important;
    overflow: hidden;
}
body header .nav-user-img svg,
body header .nav-user-img img { width: 100% !important; height: 100% !important; padding: 8px; box-sizing: border-box; }
body header .nav-user-info h4,
body header .nav-user-info a {
    color: var(--bm-text) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: -0.005em;
}
body header .nav-user-info a:hover { color: var(--bm-lime-deep) !important; }

/* Compare / wishlist / notification icons containers */
body header #compare,
body header #wishlist,
body header .dropdown {
    border-radius: var(--bm-radius-md);
    transition: background var(--bm-transition);
}
body header #compare:hover,
body header #wishlist:hover { background: var(--bm-bg-soft); }
body header #compare a,
body header #wishlist a {
    padding: 10px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: var(--bm-radius-md);
    color: var(--bm-text) !important;
}
body header #compare svg,
body header #wishlist svg {
    width: 22px !important;
    height: 22px !important;
}
body header #compare svg path,
body header #wishlist svg path { fill: var(--bm-text) !important; }
body header #compare:hover svg path,
body header #wishlist:hover svg path { fill: var(--bm-lime-deep) !important; }

/* Notification button */
body header .dropdown-toggle.no-arrow {
    padding: 10px !important;
    border-radius: var(--bm-radius-md);
    transition: background var(--bm-transition);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
body header .dropdown-toggle.no-arrow:hover { background: var(--bm-bg-soft); }
body header .dropdown-toggle.no-arrow svg { width: 20px; height: 22px; }
body header .dropdown-toggle.no-arrow svg path { fill: var(--bm-text) !important; }

/* Cart / wishlist count badges */
body .badge.badge-primary,
body header .badge-primary {
    background: var(--bm-lime) !important;
    color: var(--bm-ink) !important;
    font-weight: 700 !important;
    border-radius: var(--bm-radius-pill) !important;
    font-size: 10.5px !important;
    padding: 2px 7px !important;
}
body header .absolute-top-right--10px {
    top: -6px !important;
    right: -6px !important;
}

/* mobile search trigger icon */
body .logo-bar-area .d-lg-none.ml-auto a {
    padding: 10px !important;
    border-radius: var(--bm-radius-md);
    color: var(--bm-text) !important;
}
body .logo-bar-area .d-lg-none.ml-auto a:hover { background: var(--bm-bg-soft); }

/* Login / Registration text links — minimize */
body header .nav-user-info a.border-right {
    border-right: 0 !important;
    padding-right: 0 !important;
    opacity: 1 !important;
}
body header .nav-user-info a {
    text-decoration: none !important;
    opacity: 1 !important;
    margin-left: 8px !important;
}
body header .nav-user-info a + a { margin-left: 12px !important; position: relative; }
body header .nav-user-info a + a::before {
    content: '';
    position: absolute;
    left: -8px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 14px;
    background: var(--bm-border-strong);
}

/* Sidebar (mobile menu) */
body .aiz-top-menu-sidebar .collapse-sidebar { background: #fff; }
body .aiz-top-menu-sidebar .header_menu_links {
    font-weight: 600 !important;
    color: var(--bm-text) !important;
    padding: 16px 20px !important;
    border-radius: var(--bm-radius-md);
    transition: background var(--bm-transition);
}
body .aiz-top-menu-sidebar .header_menu_links:hover { background: var(--bm-bg-soft); color: var(--bm-lime-deep) !important; }
body .aiz-top-menu-sidebar .header_menu_links.active { color: var(--bm-lime-deep) !important; }

/* User hover menu dropdown */
body .hover-user-top-menu .aiz-user-top-menu {
    border-radius: var(--bm-radius-md) !important;
    border-top: 0 !important;
    box-shadow: var(--bm-shadow-md) !important;
    margin-top: 8px;
    overflow: hidden;
}
body .user-top-nav-element { border: 0 !important; }
body .user-top-nav-element a {
    padding: 12px 20px !important;
    font-size: 13px !important;
    transition: background var(--bm-transition);
}
body .user-top-nav-element a:hover { background: var(--bm-bg-soft); color: var(--bm-lime-deep) !important; }

/* Top banner (promo strip) — soften */
body .top-banner { border-radius: 0; }
body .top-banner .top-banner-scroll-inner a { font-weight: 500 !important; letter-spacing: 0.01em; }

/* Hide sticky shadow blur to keep crisp */
body header.sticky-top { z-index: 1030 !important; }

/* ============================================================
   ANNOUNCEMENT BAR (homepage-only)
   ============================================================ */
.bm-announce {
    background: var(--bm-ink);
    color: #fff;
    padding: 11px 0;
    font-size: 12.5px;
    font-weight: 500;
    letter-spacing: 0.02em;
    overflow: hidden;
    position: relative;
}
.bm-announce .container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    flex-wrap: wrap;
}
.bm-announce-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    opacity: 0.92;
}
.bm-announce-item i { color: var(--bm-lime); font-size: 15px; }
@media (max-width: 767px) {
    .bm-announce { font-size: 11px; padding: 8px 0; }
    .bm-announce .container { gap: 14px; }
}

/* ============================================================
   HERO BANNER — compact half-height, flush with announce bar
   ============================================================ */
.bm-home .home-banner-area {
    background: var(--bm-bg) !important;
    padding: 0 !important;
    margin: 0 !important;
}
.bm-home .home-banner-area .container { max-width: 1360px; padding: 0 24px; }
.bm-home .home-banner-area > .p-0 { padding: 0 !important; }
.bm-home .home-slider .aiz-carousel { border-radius: 0 !important; overflow: hidden; }
.bm-home .home-slider .carousel-box > a {
    border-radius: 0 !important;
    display: block;
    overflow: hidden;
    position: relative;
}
.bm-home .home-slider .carousel-box img {
    border-radius: 0 !important;
    transition: transform var(--bm-transition-slow);
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.bm-home .home-slider .carousel-box:hover img { transform: scale(1.015); }
.bm-home .home-slider .slick-dots { bottom: 16px !important; z-index: 5; }

/* ★ Banner heights — professional proportions (original was 180/320/460/553) */
.bm-home .home-banner-area .h-180px,
.bm-home .home-banner-area div.h-180px,
.bm-home .home-banner-area .h-md-320px,
.bm-home .home-banner-area div.h-md-320px,
.bm-home .home-banner-area .h-lg-460px,
.bm-home .home-banner-area div.h-lg-460px,
.bm-home .home-banner-area .h-xl-553px,
.bm-home .home-banner-area div.h-xl-553px {
    height: 240px !important;
}
@media (min-width: 768px) {
    .bm-home .home-banner-area .h-md-320px,
    .bm-home .home-banner-area .h-lg-460px,
    .bm-home .home-banner-area .h-xl-553px { height: 360px !important; }
}
@media (min-width: 992px) {
    .bm-home .home-banner-area .h-lg-460px,
    .bm-home .home-banner-area .h-xl-553px { height: 480px !important; }
}
@media (min-width: 1200px) {
    .bm-home .home-banner-area .h-xl-553px { height: 560px !important; }
}
.bm-home .home-slider .slick-dots li button:before {
    color: rgba(255,255,255,0.7) !important;
    font-size: 11px !important;
    opacity: 1 !important;
}
.bm-home .home-slider .slick-dots li.slick-active button:before {
    color: var(--bm-lime) !important;
    font-size: 13px !important;
}

/* ============================================================
   TRUST BADGES (homepage)
   ============================================================ */
/* HERO TAGLINE — centered serif heading + sub above the trust pills.
   Editable via admin settings home_hero_headline / home_hero_subline. */
.bm-hero-tagline {
    background: var(--bm-bg, #f4f5f8);
    padding: 72px 0 24px;
    text-align: center;
}
.bm-hero-tagline-heading {
    font-family: "Times New Roman", Georgia, "Cambria", serif;
    font-size: clamp(36px, 5vw, 60px);
    line-height: 1.08;
    letter-spacing: -0.018em;
    font-weight: 700;
    color: #0f1320;
    margin: 0 0 14px;
}
.bm-hero-tagline-sub {
    font-size: 16px;
    line-height: 1.5;
    color: #4f5666;
    max-width: 720px;
    margin: 0 auto;
}
@media (max-width: 991px) {
    .bm-hero-tagline { padding: 48px 0 16px; }
    .bm-hero-tagline-heading { font-size: 34px; }
}
@media (max-width: 575px) {
    .bm-hero-tagline { padding: 36px 0 12px; }
    .bm-hero-tagline-heading { font-size: 26px; }
    .bm-hero-tagline-sub { font-size: 14px; }
}

/* TRUST PILLS — compact inline feature row under the tagline.
   Activated by adding .bm-trust--pills to .bm-trust. Original card design
   is preserved for any page that uses .bm-trust without the modifier. */
.bm-trust.bm-trust--pills {
    padding: 8px 0 56px;
    background: var(--bm-bg, #f4f5f8);
}
.bm-trust.bm-trust--pills .bm-trust-grid {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px 32px;
    max-width: 1100px;
    margin: 0 auto;
}
.bm-trust.bm-trust--pills .bm-trust-card {
    background: transparent;
    border-radius: 0;
    padding: 0;
    box-shadow: none;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-height: 0;
    flex-direction: row;
    cursor: default;
    transition: none;
}
.bm-trust.bm-trust--pills .bm-trust-card:hover {
    transform: none;
    box-shadow: none;
    background: transparent;
}
.bm-trust.bm-trust--pills .bm-trust-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #fff;
    color: #1a1d24;
    margin: 0;
    font-size: 18px;
    border: 1px solid #e5e7ec;
    flex-shrink: 0;
}
.bm-trust.bm-trust--pills .bm-trust-card:hover .bm-trust-icon {
    transform: none;
}
.bm-trust.bm-trust--pills .bm-trust-title {
    font-size: 14px;
    font-weight: 600;
    color: #1a1d24;
    margin: 0;
    line-height: 1.3;
    letter-spacing: -0.005em;
}
.bm-trust.bm-trust--pills .bm-trust-desc {
    display: none;
}
@media (max-width: 991px) {
    .bm-trust.bm-trust--pills .bm-trust-grid {
        gap: 12px 24px;
    }
}
@media (max-width: 575px) {
    .bm-trust.bm-trust--pills .bm-trust-grid {
        flex-direction: column;
        align-items: flex-start;
        padding: 0 8px;
        gap: 14px;
    }
    .bm-trust.bm-trust--pills .bm-trust-card {
        width: 100%;
    }
}

.bm-trust { padding: 64px 0 24px; background: var(--bm-bg); }
.bm-trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.bm-trust-card {
    background: var(--bm-bg-soft);
    border-radius: var(--bm-radius-lg);
    padding: 32px 28px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    transition: transform var(--bm-transition), box-shadow var(--bm-transition), background var(--bm-transition);
    cursor: default;
    min-height: 200px;
    position: relative;
    overflow: hidden;
}
.bm-trust-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--bm-shadow-md);
    background: var(--bm-lime-pale);
}
.bm-trust-icon {
    width: 56px; height: 56px;
    border-radius: 16px;
    background: var(--bm-lime-soft);
    color: var(--bm-lime-deep);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    font-size: 28px;
    transition: transform var(--bm-transition);
}
.bm-trust-card:hover .bm-trust-icon { transform: rotate(-4deg) scale(1.05); }
.bm-trust-title {
    font-size: 18px; font-weight: 700; color: var(--bm-text);
    margin-bottom: 8px; line-height: 1.3; letter-spacing: -0.015em;
}
.bm-trust-desc { font-size: 14px; color: var(--bm-text-muted); line-height: 1.5; margin: 0; }
@media (max-width: 991px) { .bm-trust-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) {
    .bm-trust-grid { grid-template-columns: 1fr; gap: 12px; }
    .bm-trust { padding: 36px 0 12px; }
    .bm-trust-card { padding: 24px 22px; min-height: auto; }
}

/* ============================================================
   SECTION TITLES (large, ultra-bold, left-aligned)
   Exclude .bm-pcard-title and .bm-faq-head h2 from this rule.
   ============================================================ */
.bm-home section > .container > .d-flex > h3,
.bm-home section > .container > h3,
.bm-home #flash_deal h3,
.bm-home #section_featured h3,
.bm-home #section_best_selling h3,
.bm-home #section_newest h3,
.bm-home #section_home_categories h3,
.bm-home #todays_deal h3 {
    font-size: 32px !important;
    font-weight: 800 !important;
    color: var(--bm-text) !important;
    letter-spacing: -0.035em !important;
    line-height: 1.1 !important;
    margin-bottom: 0 !important;
}
.bm-home section > .container > .d-flex > h3 span,
.bm-home section > .container > h3 span {
    font-weight: 800 !important;
    color: var(--bm-text) !important;
    padding-bottom: 0 !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    -webkit-text-fill-color: initial !important;
}
@media (max-width: 767px) {
    .bm-home section > .container > .d-flex > h3,
    .bm-home section > .container > h3,
    .bm-home #flash_deal h3,
    .bm-home #section_featured h3,
    .bm-home #section_best_selling h3,
    .bm-home #section_newest h3,
    .bm-home #section_home_categories h3,
    .bm-home #todays_deal h3 { font-size: 24px !important; }
}

/* "View All" link styling */
.bm-home .animate-underline-primary,
.bm-home .animate-underline-white,
.bm-home a.fs-10.fw-700,
.bm-home a.fs-md-12.fw-700 {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: var(--bm-text) !important;
    text-decoration: underline !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 6px !important;
    text-decoration-color: var(--bm-lime) !important;
    opacity: 1 !important;
    transition: text-decoration-color var(--bm-transition) !important;
    letter-spacing: 0.005em;
}
.bm-home .animate-underline-primary:hover {
    color: var(--bm-text) !important;
    text-decoration-color: var(--bm-lime-dark) !important;
}

/* Section title alignment */
.bm-home section .d-flex.align-items-baseline { margin-bottom: 28px !important; align-items: center !important; }

/* section spacing rhythm */
.bm-home section,
.bm-home #section_featured,
.bm-home #section_best_selling,
.bm-home #section_newest,
.bm-home #section_home_categories,
.bm-home #todays_deal,
.bm-home #flash_deal,
.bm-home #section_featured_preorder_products,
.bm-home #auction_products {
    margin-bottom: 72px !important;
    padding-top: 8px;
}

/* ============================================================
   ★ PRODUCT CARD + SLIDER — moved to bm-products.css (sole owner)
   ============================================================ */
/* Card + section styles intentionally removed from this file.
   See public/assets/css/bm-products.css for the current Back Market
   product card, section header, and slider styling.
   Keeping this stub so the cascade in this file remains intact. */
.bm-pcard-removed-marker { display: none; }
/* Begin stripped block (kept commented for traceability) */
/*
.bm-home .bm-pcard,
div.bm-pcard {
    background: var(--bm-bg-card) !important;
    border: 1px solid var(--bm-border) !important;
    border-radius: 16px !important;
    padding: 16px !important;
    margin: 6px !important;
    transition: transform var(--bm-transition), box-shadow var(--bm-transition), border-color var(--bm-transition);
    position: relative !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 0 !important;
    box-shadow: none;
    width: auto !important;
}
.bm-home .bm-pcard:hover,
div.bm-pcard:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 24px rgba(0,0,0,0.08) !important;
    border-color: var(--bm-border-soft) !important;
}
/* Media area — fixed height (not aspect-ratio) so card stays compact */
.bm-home .bm-pcard .bm-pcard-media,
.bm-pcard .bm-pcard-media {
    position: relative !important;
    background: transparent !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    margin-bottom: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 180px !important;
    aspect-ratio: auto !important;
}
@media (min-width: 1280px) {
    .bm-home .bm-pcard .bm-pcard-media,
    .bm-pcard .bm-pcard-media { height: 200px !important; }
}
@media (max-width: 575px) {
    .bm-home .bm-pcard .bm-pcard-media,
    .bm-pcard .bm-pcard-media { height: 160px !important; }
}
.bm-pcard-imglink {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    position: relative !important;
}
.bm-home .bm-pcard .bm-pcard-img,
.bm-pcard .bm-pcard-img {
    position: absolute !important;
    inset: 0 !important;
    margin: auto !important;
    width: auto !important;
    height: auto !important;
    max-width: 80% !important;
    max-height: 80% !important;
    object-fit: contain !important;
    transition: opacity var(--bm-transition), transform var(--bm-transition-slow);
}
.bm-pcard-img-main { opacity: 1; }
.bm-pcard-img-hover { opacity: 0; }
.bm-pcard:hover .bm-pcard-img-main { opacity: 0; transform: scale(1.05); }
.bm-pcard:hover .bm-pcard-img-hover { opacity: 1; transform: scale(1.05); }

/* Badges */
.bm-pcard-badges {
    position: absolute;
    top: 12px;
    left: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    z-index: 3;
    align-items: flex-start;
    pointer-events: none;
}
.bm-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 11px;
    border-radius: var(--bm-radius-pill);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.2;
    background: var(--bm-ink);
    color: #fff;
    pointer-events: auto;
}
.bm-badge-discount { background: var(--bm-lime); color: var(--bm-ink); }
.bm-badge-wholesale { background: #455a64; color: #fff; }
.bm-badge-buybox { background: #fff; color: var(--bm-text); border: 1px solid var(--bm-border-strong); }

/* Wishlist/compare floating icons */
.bm-pcard-icons {
    position: absolute;
    top: 12px;
    right: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    z-index: 3;
    opacity: 0;
    transform: translateX(8px);
    transition: opacity var(--bm-transition), transform var(--bm-transition);
}
.bm-pcard:hover .bm-pcard-icons { opacity: 1; transform: translateX(0); }
.bm-pcard-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid var(--bm-border);
    color: var(--bm-text);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all var(--bm-transition);
    padding: 0;
    font-size: 17px;
    box-shadow: var(--bm-shadow-xs);
}
.bm-pcard-icon:hover {
    background: var(--bm-ink);
    color: #fff;
    border-color: var(--bm-ink);
    transform: scale(1.08);
}
.bm-pcard-icon i { line-height: 1; }

/* Quick add-to-cart button (hover-revealed at bottom of image) */
.bm-pcard-cta {
    position: absolute;
    bottom: 12px;
    left: 12px;
    right: 12px;
    background: var(--bm-ink);
    color: #fff;
    border: 0;
    border-radius: var(--bm-radius-pill);
    height: 44px;
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: 0.01em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity var(--bm-transition), transform var(--bm-transition), background var(--bm-transition);
    z-index: 2;
    padding: 0 18px;
}
.bm-pcard-cta i { font-size: 17px; }
.bm-pcard:hover .bm-pcard-cta { opacity: 1; transform: translateY(0); }
.bm-pcard-cta:hover { background: var(--bm-lime-dark); color: #fff; }
.bm-pcard-cta.is-active { background: var(--bm-lime); color: var(--bm-ink); }

/* Card body — compact */
.bm-home .bm-pcard .bm-pcard-body,
.bm-pcard .bm-pcard-body {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    flex: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
}

/* Trust indicators row inside cards (grade / warranty / certification badges) */
.bm-pcard-body .product-card-trust { margin: 0 !important; padding: 0 !important; }
.bm-pcard-body .product-card-trust .badge,
.bm-pcard-body .product-card-trust .badge-inline {
    background: var(--bm-bg-soft) !important;
    color: var(--bm-text-muted) !important;
    border: 1px solid var(--bm-border) !important;
    border-radius: var(--bm-radius-pill) !important;
    padding: 3px 9px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    line-height: 1.4 !important;
    margin-right: 4px !important;
    margin-bottom: 4px !important;
}
.bm-pcard-body .product-card-trust .badge-success,
.bm-pcard-body .product-card-trust .badge-info {
    background: var(--bm-lime-pale) !important;
    color: var(--bm-lime-deep) !important;
    border-color: var(--bm-lime-soft) !important;
}
.bm-pcard-body .product-card-trust__warranty {
    background: #fff !important;
    color: var(--bm-text) !important;
}
.bm-pcard-body .product-card-trust .fs-11.text-muted {
    font-size: 11.5px !important;
    color: var(--bm-text-subtle) !important;
    margin-top: 4px !important;
}

/* TITLE — Back Market spec: 15px, 700 weight, compact (no forced height) */
.bm-home .bm-pcard .bm-pcard-title,
.bm-pcard .bm-pcard-title,
div.bm-pcard-title,
h3.bm-pcard-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: var(--bm-text) !important;
    margin: 4px 0 0 !important;
    padding: 0 !important;
    text-align: left !important;
    letter-spacing: -0.015em !important;
    min-height: 0 !important;
    max-height: 2.6em;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden !important;
    text-overflow: ellipsis;
    white-space: normal !important;
    background: none !important;
    -webkit-text-fill-color: initial !important;
    font-family: var(--bm-font) !important;
}
.bm-home .bm-pcard .bm-pcard-title a,
.bm-pcard .bm-pcard-title a,
div.bm-pcard-title a,
h3.bm-pcard-title a {
    color: var(--bm-text) !important;
    text-decoration: none !important;
    transition: color var(--bm-transition);
    font-weight: 700 !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
    letter-spacing: -0.015em !important;
    font-family: var(--bm-font) !important;
}
.bm-pcard-title a:hover { color: var(--bm-lime-deep) !important; }

/* ★ KILL old AIZ wrapper styles around the card (green outline, borders) */
.bm-home .carousel-box.hov-animate-outline,
.bm-home .carousel-box.hov-animate-outline:hover,
.bm-home .carousel-box.hov-animate-outline::before,
.bm-home .carousel-box.hov-animate-outline::after {
    outline: 0 !important;
    box-shadow: none !important;
    border: 0 !important;
    background: transparent !important;
}
.bm-home .carousel-box.border-right,
.bm-home .carousel-box.border-left,
.bm-home .carousel-box.border-top,
.bm-home .carousel-box.border-bottom {
    border: 0 !important;
}
.bm-home .hov-shadow-out,
.bm-home .has-transition.hov-shadow-out.z-1:hover { box-shadow: none !important; }

/* RATING — compact, clean */
.bm-pcard-body .rating,
.bm-pcard-body > div .rating {
    margin: 0 !important;
    font-size: 13px;
    display: inline-flex !important;
    align-items: center;
    gap: 4px;
}
.bm-pcard-body .rating i {
    color: var(--bm-lime-deep) !important;
    font-size: 14px !important;
}
.bm-pcard-body .rating span,
.bm-pcard-body .rating + span {
    color: var(--bm-text-muted) !important;
    opacity: 1 !important;
    font-size: 12.5px !important;
    font-weight: 500;
}
.bm-pcard-body small { font-size: 12.5px !important; color: var(--bm-text-muted) !important; }

/* The trust indicators row may bring its own text — neutralize colors */
.bm-pcard-body .text-secondary,
.bm-pcard-body .text-muted,
.bm-pcard-body .opacity-60 {
    color: var(--bm-text-muted) !important;
    opacity: 1 !important;
    font-size: 13px !important;
}

/* ★ PRICE BLOCK — Back Market style: stacked, large bold price + small old price */
.bm-pcard-pricing {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
    margin-top: 8px !important;
    padding-top: 0 !important;
}
.bm-home .bm-pcard .bm-pcard-price,
.bm-pcard .bm-pcard-price,
span.bm-pcard-price {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: var(--bm-text) !important;
    letter-spacing: -0.025em !important;
    line-height: 1.05 !important;
    font-family: var(--bm-font) !important;
    order: 2;
}
.bm-home .bm-pcard .bm-pcard-price-old,
.bm-pcard .bm-pcard-price-old,
del.bm-pcard-price-old {
    font-size: 12.5px !important;
    color: var(--bm-text-subtle) !important;
    font-weight: 500 !important;
    text-decoration: line-through !important;
    margin: 0 !important;
    line-height: 1.2 !important;
    order: 3;
}
@media (min-width: 1280px) {
    .bm-home .bm-pcard .bm-pcard-price,
    .bm-pcard .bm-pcard-price { font-size: 26px !important; }
}
@media (max-width: 575px) {
    .bm-home .bm-pcard .bm-pcard-price,
    .bm-pcard .bm-pcard-price { font-size: 20px !important; }
    .bm-pcard { padding: 14px !important; }
}

/* Smaller variant (product_box_2) */
.bm-pcard-sm { padding: 14px !important; min-height: 0 !important; }
.bm-pcard-sm .bm-pcard-media { height: 160px !important; }
.bm-pcard-sm .bm-pcard-title { font-size: 14px !important; }
.bm-pcard-sm .bm-pcard-price { font-size: 22px !important; }

/* Slick carousel — give cards full height */
.bm-home .aiz-carousel .slick-track { display: flex !important; align-items: stretch; }
.bm-home .aiz-carousel .slick-slide { height: auto !important; }
.bm-home .aiz-carousel .slick-slide > div { height: 100%; }
.bm-home .aiz-carousel .slick-slide .carousel-box { height: 100%; padding: 0 !important; }

/* Kill the heavy borders of carousel wrappers (since bm-pcard has its own visual) */
.bm-home section .border-top,
.bm-home section .border-left,
.bm-home section .border-right,
.bm-home section .border-bottom { border-color: transparent !important; }
.bm-home #flash_deal .border-top { border-top: 0 !important; }
.bm-home .aiz-carousel .carousel-box.bg-white,
.bm-home .aiz-carousel .carousel-box.border-left,
.bm-home .aiz-carousel .carousel-box.border-bottom,
.bm-home .aiz-carousel .carousel-box.position-relative.has-transition.hov-animate-outline {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
.bm-home .aiz-carousel .carousel-box .px-3 { padding: 0 !important; }
*/
/* End stripped block */

/* ============================================================
   FLASH DEAL — lime gradient banner
   ============================================================ */
.bm-home #flash_deal {
    background: linear-gradient(135deg, var(--bm-lime-pale) 0%, #ffffff 100%) !important;
    padding: 40px 0 !important;
    border-radius: var(--bm-radius-xl);
    margin: 8px 16px 72px !important;
}
@media (max-width: 575px) { .bm-home #flash_deal { margin: 8px 8px 32px !important; border-radius: var(--bm-radius-lg); } }
.bm-home #flash_deal .container { max-width: 1360px; }
.bm-home #flash_deal h3,
.bm-home #flash_deal .text-white,
.bm-home #flash_deal .text-dark { color: var(--bm-text) !important; }
.bm-home #flash_deal .flash-deal-item {
    background: #fff !important;
    border-radius: var(--bm-radius-md) !important;
    box-shadow: var(--bm-shadow-card);
    padding: 20px !important;
    margin: 4px;
    transition: transform var(--bm-transition), box-shadow var(--bm-transition);
    height: auto !important;
}
.bm-home #flash_deal .flash-deal-item:hover {
    transform: translateY(-4px);
    box-shadow: var(--bm-shadow-card-hover);
}
.bm-home #flash_deal .flash-deal-item img.product-main-image {
    border-radius: 12px;
    transition: transform var(--bm-transition-slow);
}
.bm-home #flash_deal .flash-deal-item:hover img.product-main-image { transform: scale(1.05); }
.bm-home #flash_deal .flash-deal-price .text-primary,
.bm-home #flash_deal .flash-deal-price .fw-700.text-primary {
    color: var(--bm-text) !important;
    font-weight: 800 !important;
    font-size: 22px !important;
    letter-spacing: -0.02em;
}
.bm-home #flash_deal .flash-deal-price del {
    color: var(--bm-text-subtle) !important;
    font-weight: 500 !important;
    font-size: 13px !important;
}
.bm-home #flash_deal .aiz-count-down-circle { background: transparent !important; padding: 8px; }
.bm-home .aiz-count-down-circle [class*="count"],
.bm-home .aiz-count-down [class*="count"] { color: var(--bm-ink) !important; }

/* ============================================================
   FEATURED CATEGORIES
   ============================================================ */
.bm-home section .aiz-carousel.sm-gutters-17 .carousel-box.position-relative {
    border: 0 !important;
    border-radius: var(--bm-radius-lg) !important;
    overflow: hidden;
    transition: transform var(--bm-transition), box-shadow var(--bm-transition);
    background: var(--bm-bg-soft);
    margin: 8px;
}
.bm-home section .aiz-carousel.sm-gutters-17 .carousel-box.position-relative:hover {
    transform: translateY(-6px);
    box-shadow: var(--bm-shadow-md);
}
.bm-home section .aiz-carousel.sm-gutters-17 .h-200px,
.bm-home section .aiz-carousel.sm-gutters-17 .h-sm-250px,
.bm-home section .aiz-carousel.sm-gutters-17 .h-md-340px {
    border-radius: var(--bm-radius-lg);
    overflow: hidden;
}
.bm-home .home-category-name {
    font-size: 22px !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em;
    color: #fff !important;
}
.bm-home .absolute-bottom-left[style*="linear-gradient"] {
    background: linear-gradient(to top, rgba(10, 11, 15, 0.82) 0%, rgba(10, 11, 15, 0.0) 78%) !important;
    padding: 28px !important;
}
.bm-home .home-category-name + .d-flex.flex-wrap a {
    color: rgba(255,255,255,0.88) !important;
    transition: color var(--bm-transition);
    font-size: 13px !important;
}
.bm-home .home-category-name + .d-flex.flex-wrap a:hover { color: var(--bm-lime) !important; }

/* ============================================================
   BANNER SECTIONS
   ============================================================ */
.bm-home div[style*="background: #f5f5fa"],
.bm-home div[style*="background:#f5f5fa"] {
    background: var(--bm-bg-section) !important;
    padding: 56px 0 !important;
    margin: 16px 0 !important;
}
.bm-home .carousel-box.overflow-hidden.hov-scale-img a img { border-radius: var(--bm-radius-lg) !important; }

/* ============================================================
   CAROUSEL ARROWS
   ============================================================ */
.bm-home .slick-prev,
.bm-home .slick-next {
    width: 48px !important;
    height: 48px !important;
    background: #fff !important;
    border-radius: 50% !important;
    box-shadow: var(--bm-shadow-md) !important;
    border: 0 !important;
    z-index: 10;
    transition: all var(--bm-transition) !important;
}
.bm-home .slick-prev { left: -8px !important; }
.bm-home .slick-next { right: -8px !important; }
.bm-home .slick-prev:hover,
.bm-home .slick-next:hover {
    background: var(--bm-ink) !important;
    box-shadow: var(--bm-shadow-lg) !important;
    transform: scale(1.05);
}
.bm-home .slick-prev:before,
.bm-home .slick-next:before {
    color: var(--bm-text) !important;
    font-size: 20px !important;
    opacity: 1 !important;
    transition: color var(--bm-transition);
}
.bm-home .slick-prev:hover:before,
.bm-home .slick-next:hover:before { color: #fff !important; }

.bm-home .slick-dots li button:before { color: var(--bm-border-strong) !important; opacity: 0.5; font-size: 8px !important; }
.bm-home .slick-dots li.slick-active button:before { color: var(--bm-lime) !important; opacity: 1; font-size: 10px !important; }

/* ============================================================
   TOP BRANDS — pill cards
   ============================================================ */
.bm-home section .row.row-cols-xxl-6,
.bm-home section .row.row-cols-xl-6 {
    border: 0 !important;
    gap: 14px !important;
    padding: 20px 0 !important;
    margin: 0 !important;
}
.bm-home section .row.row-cols-xxl-6 > .col {
    background: var(--bm-bg-soft);
    border: 0 !important;
    border-radius: var(--bm-radius-md);
    transition: transform var(--bm-transition), background var(--bm-transition), box-shadow var(--bm-transition);
    overflow: hidden;
    flex-basis: calc(16.66% - 14px);
    max-width: calc(16.66% - 14px);
}
@media (max-width: 991px) {
    .bm-home section .row.row-cols-xxl-6 > .col { flex-basis: calc(25% - 14px); max-width: calc(25% - 14px); }
}
@media (max-width: 575px) {
    .bm-home section .row.row-cols-xxl-6 > .col { flex-basis: calc(33.33% - 14px); max-width: calc(33.33% - 14px); }
}
.bm-home section .row.row-cols-xxl-6 > .col:hover {
    background: #fff;
    box-shadow: var(--bm-shadow-md);
    transform: translateY(-3px);
}
.bm-home section .row.row-cols-xxl-6 > .col a { padding: 24px 18px !important; }
.bm-home section .row.row-cols-xxl-6 > .col p {
    font-weight: 600 !important;
    color: var(--bm-text) !important;
    letter-spacing: -0.005em;
    margin-top: 10px !important;
    font-size: 13.5px !important;
}

/* ============================================================
   TOP SELLERS
   ============================================================ */
.bm-home section .carousel-box.text-center {
    border: 0 !important;
    background: var(--bm-bg-soft);
    border-radius: var(--bm-radius-lg);
    margin: 8px;
    overflow: hidden;
    transition: transform var(--bm-transition), box-shadow var(--bm-transition);
}
.bm-home section .carousel-box.text-center:hover {
    transform: translateY(-4px);
    box-shadow: var(--bm-shadow-md);
}
.bm-home .btn-visit {
    background: var(--bm-ink) !important;
    color: #fff !important;
    border-radius: var(--bm-radius-pill) !important;
    padding: 11px 24px !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    border: 0 !important;
    transition: all var(--bm-transition) !important;
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
}
.bm-home .btn-visit:hover { background: var(--bm-lime-dark) !important; transform: translateY(-1px); }
.bm-home .btn-visit .circle {
    width: 26px !important; height: 26px !important;
    border-radius: 50% !important;
    background: var(--bm-lime) !important;
    display: inline-flex; align-items: center; justify-content: center;
}

/* ============================================================
   COUPON SECTION
   ============================================================ */
.bm-home div[style*="background-color: #292933"],
.bm-home div[style*="background-color:#292933"] {
    background: var(--bm-ink) !important;
    border-radius: var(--bm-radius-xl);
    margin: 32px 16px;
    overflow: hidden;
}
@media (max-width: 575px) { .bm-home div[style*="background-color:"] { margin: 24px 8px; border-radius: var(--bm-radius-lg); } }
.bm-home div[style*="background-color: #292933"] h5.fs-36 { letter-spacing: -0.03em !important; font-weight: 800 !important; }
.bm-home div[style*="background-color: #292933"] .btn {
    background: var(--bm-lime) !important; color: var(--bm-ink) !important;
    border: 0 !important; box-shadow: none !important; font-weight: 700 !important;
}
.bm-home div[style*="background-color: #292933"] .btn:hover {
    background: #fff !important; color: var(--bm-ink) !important; transform: translateY(-2px);
}

/* ============================================================
   NEWSLETTER
   ============================================================ */
.bm-newsletter {
    background: var(--bm-lime);
    border-radius: var(--bm-radius-xl);
    margin: 72px 16px;
    padding: 80px 32px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.bm-newsletter::before { content: ''; position: absolute; top: -50%; left: -10%; width: 60%; height: 200%; background: radial-gradient(ellipse at center, rgba(255,255,255,0.15) 0%, transparent 60%); pointer-events: none; }
.bm-newsletter::after  { content: ''; position: absolute; bottom: -50%; right: -10%; width: 60%; height: 200%; background: radial-gradient(ellipse at center, rgba(0,0,0,0.06) 0%, transparent 60%); pointer-events: none; }
.bm-newsletter-inner { position: relative; z-index: 2; max-width: 680px; margin: 0 auto; }
.bm-newsletter-eyebrow {
    display: inline-block;
    background: rgba(10, 11, 15, 0.08);
    color: var(--bm-ink);
    padding: 6px 16px;
    border-radius: var(--bm-radius-pill);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 20px;
}
.bm-newsletter h2 {
    font-size: 44px;
    font-weight: 800;
    color: var(--bm-ink);
    letter-spacing: -0.035em;
    line-height: 1.08;
    margin-bottom: 14px;
}
.bm-newsletter p { font-size: 16px; color: var(--bm-ink-soft); margin-bottom: 32px; line-height: 1.55; }
.bm-newsletter-form {
    display: flex;
    background: #fff;
    border-radius: var(--bm-radius-pill);
    padding: 6px;
    box-shadow: var(--bm-shadow-md);
    max-width: 500px;
    margin: 0 auto;
    gap: 6px;
}
.bm-newsletter-form input {
    flex: 1; background: transparent; border: 0; outline: 0;
    padding: 14px 22px; font-size: 15px;
    font-family: var(--bm-font); color: var(--bm-text); min-width: 0;
}
.bm-newsletter-form input::placeholder { color: var(--bm-text-subtle); }
.bm-newsletter-form button {
    background: var(--bm-ink); color: #fff; border: 0;
    border-radius: var(--bm-radius-pill);
    padding: 14px 30px;
    font-size: 14px; font-weight: 700;
    cursor: pointer; transition: all var(--bm-transition); white-space: nowrap;
}
.bm-newsletter-form button:hover { background: var(--bm-lime-dark); color: #fff; transform: translateY(-1px); }
@media (max-width: 767px) {
    .bm-newsletter { padding: 56px 20px; margin: 36px 8px; border-radius: var(--bm-radius-lg); }
    .bm-newsletter h2 { font-size: 30px; }
    .bm-newsletter p { font-size: 14px; }
    .bm-newsletter-form { flex-direction: column; border-radius: var(--bm-radius-lg); padding: 12px; }
    .bm-newsletter-form button { width: 100%; padding: 14px; }
    .bm-newsletter-form input { padding: 12px 16px; text-align: center; }
}

/* ============================================================
   FAQ
   ============================================================ */
.bm-faq { padding: 72px 0 32px; background: var(--bm-bg); }
.bm-faq-head { text-align: center; max-width: 680px; margin: 0 auto 48px; }
.bm-faq-head h2 {
    font-size: 42px;
    font-weight: 800;
    color: var(--bm-text);
    letter-spacing: -0.035em;
    margin-bottom: 12px;
    line-height: 1.08;
}
.bm-faq-head p { color: var(--bm-text-muted); font-size: 16px; }
.bm-faq-list { max-width: 860px; margin: 0 auto; }
.bm-faq-item {
    background: var(--bm-bg-soft);
    border-radius: var(--bm-radius-md);
    margin-bottom: 12px;
    overflow: hidden;
    transition: background var(--bm-transition), box-shadow var(--bm-transition);
}
.bm-faq-item:hover { background: #fff; box-shadow: var(--bm-shadow-sm); }
.bm-faq-item summary {
    list-style: none; cursor: pointer; padding: 24px 30px;
    font-size: 16px; font-weight: 600; color: var(--bm-text);
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px; transition: color var(--bm-transition);
}
.bm-faq-item summary::-webkit-details-marker { display: none; }
.bm-faq-item summary::after {
    content: '+'; font-size: 28px; font-weight: 300; color: var(--bm-text-muted);
    transition: transform var(--bm-transition), color var(--bm-transition); flex-shrink: 0;
}
.bm-faq-item[open] summary { color: var(--bm-lime-deep); }
.bm-faq-item[open] summary::after { content: '−'; color: var(--bm-lime-deep); }
.bm-faq-answer { padding: 0 30px 26px; color: var(--bm-text-muted); font-size: 15px; line-height: 1.65; }
@media (max-width: 767px) {
    .bm-faq-head h2 { font-size: 30px; }
    .bm-faq-item summary { padding: 20px 22px; font-size: 15px; }
    .bm-faq-answer { padding: 0 22px 22px; }
    .bm-faq { padding: 44px 0 16px; }
}

/* ============================================================
   SKELETON LOADERS for AJAX sections
   ============================================================ */
.bm-home #section_featured:empty,
.bm-home #section_best_selling:empty,
.bm-home #section_newest:empty,
.bm-home #section_home_categories:empty,
.bm-home #todays_deal:empty { min-height: 0; }
.bm-home #section_featured:empty::before,
.bm-home #section_best_selling:empty::before,
.bm-home #section_newest:empty::before,
.bm-home #section_home_categories:empty::before,
.bm-home #todays_deal:empty::before {
    content: '';
    display: block;
    height: 380px;
    margin: 24px 16px;
    border-radius: var(--bm-radius-lg);
    background: linear-gradient(90deg, var(--bm-bg-soft) 0%, #fff 50%, var(--bm-bg-soft) 100%);
    background-size: 200% 100%;
    animation: bm-shimmer 1.6s linear infinite;
}
@keyframes bm-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* ============================================================
   AJAX-section partials inherit color system
   ============================================================ */
.bm-home #section_featured h3,
.bm-home #section_best_selling h3,
.bm-home #section_newest h3,
.bm-home #section_home_categories h3,
.bm-home #todays_deal h3 { color: var(--bm-text) !important; }
.bm-home #section_featured .container,
.bm-home #section_best_selling .container,
.bm-home #section_newest .container,
.bm-home #section_home_categories .container,
.bm-home #todays_deal .container { background: transparent !important; }
.bm-home #section_featured .bg-white,
.bm-home #section_best_selling .bg-white,
.bm-home #section_newest .bg-white,
.bm-home #section_home_categories .bg-white { background: transparent !important; }

/* ============================================================
   FOOTER — site-wide dark ink theme
   ============================================================ */
body footer.aiz-main-footer { background: var(--bm-ink) !important; color: rgba(255,255,255,0.78) !important; }
body footer.aiz-main-footer a { color: rgba(255,255,255,0.78) !important; }
body footer.aiz-main-footer a:hover { color: var(--bm-lime) !important; }
body footer.aiz-main-footer h6,
body footer.aiz-main-footer h5,
body footer.aiz-main-footer .footer-title { color: #fff !important; }

/* ============================================================
   GENERAL POLISH
   ============================================================ */
.bm-home .btn-primary {
    background: var(--bm-ink) !important;
    border-color: var(--bm-ink) !important;
    border-radius: var(--bm-radius-pill) !important;
    font-weight: 700 !important;
    padding: 12px 28px !important;
    box-shadow: none !important;
}
.bm-home .btn-primary:hover {
    background: var(--bm-lime-dark) !important;
    border-color: var(--bm-lime-dark) !important;
    transform: translateY(-1px);
}
.bm-home .border-soft-light { border-color: var(--bm-border-soft) !important; }

/* fix Bootstrap left-aligned section title alignment after my .d-flex tweak */
.bm-home section h3 { padding-bottom: 0 !important; }

/* =============================================================
   Top Sellers — closing meet-the-merchants section (above footer)
   ============================================================= */
.bm-top-sellers {
    background: #ffffff;
    padding: 64px 0 80px;
    border-top: 1px solid #f1f3f7;
}
.bm-top-sellers-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin: 0 0 32px;
    gap: 16px;
}
.bm-top-sellers-title {
    font-family: "Times New Roman", Georgia, Cambria, serif;
    font-size: clamp(26px, 3.2vw, 36px);
    line-height: 1.15;
    letter-spacing: -0.015em;
    font-weight: 700;
    color: #0f1320;
    margin: 0;
}
.bm-top-sellers-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 600;
    color: #0f1320;
    text-decoration: none;
    white-space: nowrap;
    transition: gap .2s ease;
}
.bm-top-sellers-link:hover,
.bm-top-sellers-link:focus {
    color: #0f1320;
    gap: 10px;
    text-decoration: none;
}
.bm-top-sellers-link svg { transition: transform .2s ease; }
.bm-top-sellers-link:hover svg { transform: translateX(2px); }

.bm-top-sellers-carousel .carousel-box,
.bm-top-sellers-carousel .slick-slide > div { padding: 0 8px; }

/* Seller card */
.bm-seller-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: #ffffff;
    border: 1px solid #e8eaf0;
    border-radius: 16px;
    padding: 28px 20px 24px;
    height: 100%;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.bm-seller-card:hover {
    border-color: #0f1320;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.07);
}
.bm-seller-verified {
    position: absolute;
    top: 14px;
    right: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: #1e7e2c;
    color: #ffffff;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(30, 126, 44, 0.25);
}
.bm-seller-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #eef0f5;
    margin: 0 0 16px;
    transition: transform .25s ease;
}
.bm-seller-card:hover .bm-seller-logo { transform: scale(1.03); }
.bm-seller-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 8px;
}
.bm-seller-name {
    font-size: 15px;
    line-height: 1.3;
    font-weight: 700;
    color: #0f1320;
    margin: 0 0 8px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bm-seller-name a,
.bm-seller-name a:hover,
.bm-seller-name a:focus {
    color: inherit;
    text-decoration: none;
}
.bm-seller-rating {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0 0 18px;
    font-size: 12px;
    color: #5b6471;
}
.bm-seller-rating .rating { font-size: 12px; line-height: 1; }
.bm-seller-rating-count { font-size: 12px; color: #5b6471; }

/* Professional Visit Store pill button — outlined → solid on hover */
.bm-seller-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 11px 18px;
    background: #ffffff;
    color: #0f1320;
    border: 1.5px solid #0f1320;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-decoration: none;
    cursor: pointer;
    transition: background .2s ease, color .2s ease, transform .15s ease;
}
.bm-seller-btn:hover,
.bm-seller-btn:focus {
    background: #0f1320;
    color: #ffffff;
    text-decoration: none;
}
.bm-seller-btn svg { transition: transform .2s ease; }
.bm-seller-btn:hover svg { transform: translateX(3px); }

@media (max-width: 991px) {
    .bm-top-sellers { padding: 48px 0 64px; }
    .bm-top-sellers-head { margin-bottom: 22px; }
}
@media (max-width: 767px) {
    .bm-top-sellers { padding: 36px 0 48px; }
    .bm-top-sellers-head { margin-bottom: 18px; }
    .bm-seller-card { padding: 22px 16px 18px; border-radius: 14px; }
    .bm-seller-logo { width: 80px; height: 80px; margin-bottom: 12px; }
    .bm-seller-name { font-size: 14px; min-height: 36px; margin-bottom: 6px; }
    .bm-seller-rating { margin-bottom: 14px; }
    .bm-seller-btn { padding: 10px 14px; font-size: 12px; }
}

/* =============================================================
   Tech Journal Articles — homepage carousel (BM "Best articles" UI)
   ============================================================= */
.bm-tj-articles {
    background: #ffffff;
    padding: 56px 0 32px;
}
.bm-tj-articles-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 22px;
}
.bm-tj-articles-title {
    font-family: "Times New Roman", Georgia, Cambria, serif;
    font-size: clamp(22px, 2.6vw, 30px);
    line-height: 1.2;
    letter-spacing: -0.012em;
    font-weight: 700;
    color: #0f1320;
    margin: 0;
}
.bm-tj-articles-arrows {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.bm-tj-arrow {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f1f3f7;
    color: #0f1320;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    transition: background .2s ease, color .2s ease, transform .15s ease;
    padding: 0;
}
.bm-tj-arrow:hover { background: #0f1320; color: #ffffff; }
.bm-tj-arrow:focus { outline: none; box-shadow: 0 0 0 3px rgba(15, 19, 32, 0.12); }
.bm-tj-arrow--next { background: #0f1320; color: #ffffff; }
.bm-tj-arrow--next:hover { background: #1f2530; }

.bm-tj-articles-carousel .carousel-box,
.bm-tj-articles-carousel .slick-slide > div { padding: 0 8px; }

/* Article card */
.bm-tj-card {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #e8eaf0;
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    height: 100%;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.bm-tj-card:hover,
.bm-tj-card:focus {
    border-color: #0f1320;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.08);
    color: inherit;
    text-decoration: none;
    transform: translateY(-2px);
}
.bm-tj-card-media {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #f4f5f8;
}
.bm-tj-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}
.bm-tj-card:hover .bm-tj-card-media img { transform: scale(1.04); }
.bm-tj-card-body {
    padding: 18px 18px 22px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex-grow: 1;
}
.bm-tj-card-eyebrow {
    font-size: 12px;
    font-weight: 600;
    color: #5b6471;
    letter-spacing: 0.01em;
}
.bm-tj-card-title {
    font-size: 16px;
    line-height: 1.32;
    font-weight: 700;
    color: #0f1320;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.bm-tj-articles-foot {
    display: flex;
    justify-content: flex-end;
    margin-top: 22px;
}
.bm-tj-read-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 22px;
    background: #0f1320;
    color: #ffffff !important;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: background .2s ease, transform .15s ease;
}
.bm-tj-read-more:hover,
.bm-tj-read-more:focus {
    background: #1f2530;
    color: #ffffff !important;
    text-decoration: none;
    transform: translateY(-1px);
}
.bm-tj-read-more svg { transition: transform .2s ease; }
.bm-tj-read-more:hover svg { transform: translateX(3px); }

@media (max-width: 767px) {
    .bm-tj-articles { padding: 36px 0 24px; }
    .bm-tj-articles-head { margin-bottom: 16px; }
    .bm-tj-arrow { width: 34px; height: 34px; }
    .bm-tj-card-body { padding: 14px 14px 18px; }
    .bm-tj-card-title { font-size: 15px; }
}

/* =============================================================
   Tech Journal article detail page
   ============================================================= */
.bm-article {
    background: #ffffff;
    padding-top: 32px;
}
.bm-article-header { padding: 24px 0 32px; }
.bm-article-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #5b6471;
    margin-bottom: 28px;
}
.bm-article-breadcrumb a {
    color: #5b6471;
    text-decoration: none;
}
.bm-article-breadcrumb a:hover {
    color: #0f1320;
    text-decoration: underline;
}
.bm-article-eyebrow {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #5b6471;
    margin-bottom: 14px;
}
.bm-article-title {
    font-family: "Times New Roman", Georgia, Cambria, serif;
    font-size: clamp(30px, 5vw, 56px);
    line-height: 1.1;
    letter-spacing: -0.02em;
    font-weight: 700;
    color: #0f1320;
    margin: 0 0 18px;
    max-width: 880px;
}
.bm-article-lede {
    font-size: clamp(16px, 1.4vw, 19px);
    line-height: 1.55;
    color: #3a4150;
    margin: 0 0 22px;
    max-width: 780px;
}
.bm-article-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #5b6471;
}
.bm-article-meta strong { color: #0f1320; font-weight: 700; }
.bm-article-meta-dot { color: #cbd0db; }

.bm-article-hero {
    margin: 0 0 40px;
}
.bm-article-hero img {
    width: 100%;
    max-height: 560px;
    object-fit: cover;
    border-radius: 18px;
    display: block;
}

.bm-article-body-wrap { padding-bottom: 80px; }
.bm-article-body {
    max-width: 760px;
    margin: 0 auto;
    font-size: 17px;
    line-height: 1.75;
    color: #1a1d24;
}
.bm-article-body > * + * { margin-top: 1.1em; }
.bm-article-body h2 {
    font-family: "Times New Roman", Georgia, Cambria, serif;
    font-size: clamp(22px, 2.2vw, 30px);
    line-height: 1.2;
    font-weight: 700;
    color: #0f1320;
    margin: 2em 0 0.6em;
}
.bm-article-body h3 {
    font-size: clamp(18px, 1.7vw, 22px);
    line-height: 1.3;
    font-weight: 700;
    color: #0f1320;
    margin: 1.6em 0 0.4em;
}
.bm-article-body p { margin: 0 0 1.1em; }
.bm-article-body a {
    color: #0f1320;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.bm-article-body a:hover { color: var(--bm-lime-dark, #7CB300); }
.bm-article-body ul,
.bm-article-body ol { padding-left: 1.4em; margin: 0 0 1.1em; }
.bm-article-body li + li { margin-top: 6px; }
.bm-article-body img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    display: block;
    margin: 1.6em auto;
}
.bm-article-body blockquote {
    border-left: 3px solid #0f1320;
    padding: 4px 0 4px 22px;
    margin: 1.8em 0;
    font-style: italic;
    color: #3a4150;
}

.bm-article-share {
    max-width: 760px;
    margin: 48px auto 0;
    padding-top: 28px;
    border-top: 1px solid #e8eaf0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.bm-article-share-label {
    font-size: 14px;
    font-weight: 600;
    color: #5b6471;
}
.bm-article-share-links {
    display: inline-flex;
    gap: 10px;
}
.bm-article-share-links a {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f1f3f7;
    color: #0f1320;
    border-radius: 50%;
    transition: background .2s ease, color .2s ease, transform .15s ease;
}
.bm-article-share-links a:hover {
    background: #0f1320;
    color: #ffffff;
    transform: translateY(-1px);
}

.bm-article-related {
    background: #fafbfc;
    border-top: 1px solid #f1f3f7;
    padding: 56px 0 72px;
}
.bm-article-related-title {
    font-family: "Times New Roman", Georgia, Cambria, serif;
    font-size: clamp(22px, 2.6vw, 30px);
    line-height: 1.2;
    font-weight: 700;
    color: #0f1320;
    margin: 0 0 22px;
}
.bm-article-related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 18px;
}

@media (max-width: 767px) {
    .bm-article-header { padding: 16px 0 22px; }
    .bm-article-breadcrumb { margin-bottom: 18px; }
    .bm-article-hero { margin: 0 0 24px; }
    .bm-article-hero img { border-radius: 12px; max-height: 320px; }
    .bm-article-body-wrap { padding-bottom: 48px; }
    .bm-article-body { font-size: 16px; }
    .bm-article-share {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    .bm-article-related { padding: 36px 0 48px; }
}

/* End of Back Market homepage CSS v3 */