/*
Theme Name: Bike Moto Modern
Description: Dark, premium-automotive redesign of the Bike Moto site — dashboard-console hero, tabular price displays, red/black brand identity. Reads the same data as the classic theme via the bikemoto-core mu-plugin.
Author: Bike Moto
Version: 1.0.0
Text Domain: bikemoto-modern
*/

/* ============================================================
   TOKENS
   ============================================================ */
/* Light palette — the default token values, used whenever the viewer has
   explicitly chosen light mode (data-theme="light"). */
:root{
  --bg: #f6f3ef;
  --bg-alt: #ece7e0;
  --surface: #ffffff;
  --surface-2: #f0ece6;
  --border: #ddd6cc;
  --accent: #e73b19;
  --accent-dim: #b52c11;
  --accent-glow: rgba(231,59,25,.35);
  --good: #2f8a5b;
  --bad: #c23b3b;
  --text: #17140f;
  --text-dim: #55504a;
  --text-faint: #928c82;
  --shadow: 0 1px 2px rgba(23,20,15,.06);
}

/* Dark palette — the site's default look (the approved brand direction),
   applied unless the viewer has explicitly switched to light mode. Higher
   specificity than the bare :root above, so this wins by default; picking
   light mode removes the [data-theme="dark"] attribute and the light
   values above take over. */
:root:not([data-theme="light"]){
  --bg: #0a0a0c; --bg-alt: #111013; --surface: #17151a; --surface-2: #1e1b21;
  --border: #2c282e; --accent: #e73b19; --accent-dim: #ff5a35; --accent-glow: rgba(231,59,25,.45);
  --good: #3fbf82; --bad: #ef5a5a;
  --text: #f5f1ec; --text-dim: #a39d98; --text-faint: #6b6560; --shadow: 0 1px 2px rgba(0,0,0,.4);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:'Manrope',sans-serif; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{ color:inherit; text-decoration:none; }
img,svg{ display:block; max-width:100%; }
button,select,input{ font-family:inherit; cursor:pointer; }
ul{ list-style:none; margin:0; padding:0; }
.mono{ font-family:'Rajdhani',sans-serif; font-variant-numeric:tabular-nums; }
.wrap{ max-width:1240px; margin:0 auto; padding:0 32px; }
@media (max-width:640px){ .wrap{ padding:0 18px; } }
.eyebrow{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:var(--accent); display:flex; align-items:center; gap:10px; }
.eyebrow::before{ content:""; width:22px; height:2px; background:var(--accent); }
h1,h2,h3{ font-family:'Big Shoulders Display',sans-serif; text-transform:uppercase; line-height:.98; margin:0; text-wrap:balance; }
::selection{ background:var(--accent); color:#fff; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }
@media (prefers-reduced-motion: reduce){ *{ animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; } }

/* ============================================================
   NAV
   ============================================================ */
.bm-nav{ position:sticky; top:0; z-index:60; background:color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter:blur(14px); border-bottom:1px solid var(--border); }
.bm-nav-row{ display:flex; align-items:center; justify-content:space-between; height:72px; gap:20px; }
.bm-logo{ display:flex; align-items:baseline; gap:2px; font-family:'Big Shoulders Display',sans-serif; font-weight:800; font-size:26px; flex:none; }
.bm-logo em{ font-style:normal; color:var(--accent); }
.bm-logo img{ height:34px; width:auto; }
.bm-logo .bm-logo-img{ height:58px; width:auto; max-width:none; }
.bm-logo .bm-logo-img--light{ display:none; }
:root[data-theme="light"] .bm-logo .bm-logo-img--dark{ display:none; }
:root[data-theme="light"] .bm-logo .bm-logo-img--light{ display:block; }
.bm-logo--footer .bm-logo-img{ height:88px; }
@media (max-width:640px){ .bm-logo .bm-logo-img{ height:48px; } .bm-logo--footer .bm-logo-img{ height:72px; } }
.bm-nav-links{ display:flex; align-items:center; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:15px; letter-spacing:.03em; text-transform:uppercase; flex:1; justify-content:center; position:relative; }
.bm-nav-links ul{ display:flex; align-items:center; gap:30px; list-style:none; margin:0; padding:0; }
.bm-nav-links li{ position:relative; }
.bm-nav-links a{ position:relative; color:var(--text-dim); transition:color .15s ease; padding:4px 0; display:block; }
.bm-nav-links a:hover{ color:var(--text); }
.bm-nav-links li.current-menu-item > a,
.bm-nav-links li.bm-current > a{ color:var(--text); }
.bm-nav-links li.current-menu-item > a::after,
.bm-nav-links li.bm-current > a::after{ content:""; position:absolute; left:0; right:0; bottom:-4px; height:2px; background:var(--accent); }
.bm-nav-links .sub-menu{
  display:none; position:absolute; top:calc(100% + 14px); left:50%; transform:translateX(-50%);
  background:var(--surface); border:1px solid var(--border); min-width:200px; max-height:340px; overflow-y:auto;
  padding:8px; z-index:70; box-shadow:0 16px 40px rgba(0,0,0,.35);
}
.bm-nav-links li:hover > .sub-menu{ display:block; }
.bm-nav-links .sub-menu li a{ padding:8px 12px; font-weight:500; letter-spacing:.01em; text-transform:none; font-size:14px; }
.bm-nav-links .sub-menu li a:hover{ background:var(--bg-alt); color:var(--accent); }
.bm-nav-actions{ display:flex; align-items:center; gap:10px; flex:none; }
.bm-icon-btn{ width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--border); background:var(--surface); clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px); color:var(--text-dim); }
.bm-icon-btn svg{ width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:1.8; }
#bm-theme-toggle svg{ stroke-linecap:round; stroke-linejoin:round; }
#bm-theme-toggle .bm-icon-moon{ display:none; }
:root[data-theme="light"] #bm-theme-toggle .bm-icon-sun{ display:none; }
:root[data-theme="light"] #bm-theme-toggle .bm-icon-moon{ display:block; }
.bm-btn-solid{
  font-family:'Rajdhani',sans-serif; font-weight:700; font-size:14px; letter-spacing:.05em; text-transform:uppercase;
  padding:11px 22px; background:var(--accent); border:1px solid var(--accent); color:#fff;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  transition:box-shadow .2s ease, transform .15s ease;
}
.bm-btn-solid:hover{ box-shadow:0 6px 24px -4px var(--accent-glow); transform:translateY(-1px); }
.bm-burger{ display:none; }
.bm-search-panel{ border-top:1px solid var(--border); background:var(--bg-alt); }
.bm-search-panel form{ display:flex; align-items:center; gap:10px; padding:14px 32px; }
.bm-search-panel input[type="search"]{ flex:1; border:none; background:none; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:16px; color:var(--text); }
.bm-search-panel input[type="search"]:focus{ outline:none; }
.bm-search-panel button{ width:36px; height:36px; display:grid; place-items:center; border:none; background:var(--accent); color:#fff; flex:none; }
.bm-search-panel button svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; }
@media (max-width:980px){
  .bm-nav-links{ display:none; }
  .bm-burger{ display:grid; }
  .bm-nav-actions .bm-only-desktop{ display:none; }
}

/* Mobile off-canvas menu */
.bm-mobile-menu{
  position:fixed; inset:0 0 0 auto; width:min(320px,86vw); background:var(--surface);
  border-left:1px solid var(--border); z-index:100; transform:translateX(100%);
  transition:transform .25s ease; padding:24px 20px; overflow-y:auto;
}
.bm-mobile-menu.is-open{ transform:translateX(0); }
.bm-mobile-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:99; opacity:0; pointer-events:none; transition:opacity .25s ease; }
.bm-mobile-overlay.is-open{ opacity:1; pointer-events:auto; }
.bm-mobile-close{ background:none; border:1px solid var(--border); width:36px; height:36px; display:grid; place-items:center; margin-left:auto; color:var(--text-dim); }
.bm-mobile-menu ul{ margin-top:24px; display:flex; flex-direction:column; gap:2px; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:16px; text-transform:uppercase; letter-spacing:.03em; }
.bm-mobile-menu li a{ display:block; padding:12px 4px; color:var(--text-dim); border-bottom:1px solid var(--border); }
.bm-mobile-menu .sub-menu{ padding-left:14px; font-size:14px; }
.bm-mobile-menu .sub-menu li a{ border-bottom:none; padding:8px 4px; color:var(--text-faint); text-transform:none; font-weight:500; }

/* ============================================================
   BREADCRUMB
   ============================================================ */
.bm-crumb{ padding:18px 0; border-bottom:1px solid var(--border); }
.bm-crumb-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-faint); }
.bm-crumb-row a:hover{ color:var(--accent); }
.bm-crumb-row .sep{ opacity:.5; }
.bm-crumb-row .cur{ color:var(--text-dim); }

/* ============================================================
   HERO
   ============================================================ */
.bm-hero{
  position:relative; padding:64px 0 0;
  background:
    radial-gradient(ellipse 900px 520px at 78% -10%, color-mix(in srgb, var(--accent) 20%, transparent), transparent 60%),
    var(--bg);
  overflow:hidden; border-bottom:1px solid var(--border);
}
.bm-hero::before{
  content:""; position:absolute; inset:0;
  background-image:
    linear-gradient(color-mix(in srgb, var(--text) 5%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--text) 5%, transparent) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 700px 460px at 82% 8%, black, transparent 72%);
  pointer-events:none;
}
.bm-hero-grid{ position:relative; display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:stretch; padding-bottom:64px; }
@media (max-width:980px){ .bm-hero-grid{ grid-template-columns:1fr; } }
.bm-hero-kicker{
  display:inline-flex; align-items:center; gap:8px; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12.5px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--text-dim); background:var(--surface); border:1px solid var(--border);
  padding:7px 14px 7px 10px; clip-path:polygon(8px 0,100% 0,100% 100%,0 100%,0 8px); margin-bottom:24px;
}
.bm-hero-kicker .dot{ width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 3px var(--accent-glow); }
.bm-hero h1{ font-size:clamp(40px,6vw,78px); font-weight:800; }
.bm-hero h1 .accent{ color:var(--accent); }
.bm-hero h1 .outline{ -webkit-text-stroke:1.5px var(--text); color:transparent; }
.bm-hero-sub{ margin:26px 0 0; font-size:17px; line-height:1.65; color:var(--text-dim); max-width:480px; }
.bm-hero-actions{ display:flex; align-items:center; gap:18px; margin-top:36px; flex-wrap:wrap; }
.bm-hero-link{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:14px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-dim); display:inline-flex; align-items:center; gap:8px; border-bottom:1px solid var(--border); padding-bottom:2px; transition:color .15s ease,border-color .15s ease; }
.bm-hero-link:hover{ color:var(--accent); border-color:var(--accent); }
.bm-hero-stats{ display:flex; gap:36px; margin-top:52px; padding-top:26px; border-top:1px solid var(--border); flex-wrap:wrap; }
.bm-hero-stat b{ display:block; font-family:'Big Shoulders Display',sans-serif; font-weight:800; font-size:32px; color:var(--text); }
.bm-hero-stat span{ font-family:'Rajdhani',sans-serif; font-weight:600; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint); }

.bm-console{
  position:relative; background:var(--surface); border:1px solid var(--border); padding:30px;
  clip-path:polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px); box-shadow:var(--shadow);
  display:flex; flex-direction:column; height:100%;
}
.bm-console-body{ flex:1; display:flex; flex-direction:column; }
.bm-console-media{
  position:relative; flex:1; min-height:110px; margin-top:18px;
  background:radial-gradient(ellipse 70% 55% at 50% 100%, color-mix(in srgb, var(--accent) 45%, transparent), transparent 72%),
             linear-gradient(180deg, var(--bg-alt), var(--surface-2));
  border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.bm-console-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.bm-console-media svg.bm-moto{ width:50%; color:var(--text-faint); }
.bm-console-fields{ padding-top:20px; }
.bm-console-facts{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); margin-top:28px; }
.bm-console-facts div{ background:var(--bg-alt); padding:16px 10px; text-align:center; }
.bm-console-facts svg{ width:20px; height:20px; stroke:var(--accent); fill:none; stroke-width:1.6; margin:0 auto 8px; }
.bm-console-facts span{ display:block; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:11.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-dim); line-height:1.35; }
.bm-console::after{ content:""; position:absolute; inset:0; background:linear-gradient(155deg, color-mix(in srgb, var(--accent) 7%, transparent), transparent 45%); pointer-events:none; }
.bm-console-head{ display:flex; align-items:center; justify-content:space-between; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); margin-bottom:18px; }
.bm-console-head .live{ display:flex; align-items:center; gap:6px; color:var(--accent); }
.bm-console-head .live i{ width:6px; height:6px; border-radius:50%; background:var(--accent); animation:bmPulse 1.8s ease-in-out infinite; }
@keyframes bmPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }
.bm-console-copy{ font-size:14px; line-height:1.6; color:var(--text-dim); margin-bottom:20px; }
.bm-console-copy b{ color:var(--text); font-weight:700; }
.bm-console-fields{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.bm-field{ border:1px solid var(--border); background:var(--bg-alt); padding:12px 14px; }
.bm-field label{ display:block; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-faint); margin-bottom:6px; }
.bm-field .v{ font-family:'Rajdhani',sans-serif; font-weight:600; font-size:15px; }
.bm-console-submit{
  width:100%; margin-top:14px; background:var(--accent); color:#fff; border:none; padding:14px;
  font-family:'Rajdhani',sans-serif; font-weight:700; font-size:14.5px; letter-spacing:.06em; text-transform:uppercase;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  transition:box-shadow .2s ease, transform .15s ease;
}
.bm-console-submit:hover{ box-shadow:0 8px 26px -6px var(--accent-glow); transform:translateY(-1px); }
.bm-field--select{ position:relative; }
.bm-field--select select{
  width:100%; border:none; background:none; padding:0; margin:0; appearance:none; -webkit-appearance:none;
  font-family:'Rajdhani',sans-serif; font-weight:600; font-size:15px; color:var(--text); cursor:pointer;
}
.bm-field--select select:focus{ outline:none; }
.bm-field--select::after{
  content:""; position:absolute; right:0; top:50%; width:8px; height:8px;
  border-right:2px solid var(--text-faint); border-bottom:2px solid var(--text-faint);
  transform:translateY(-70%) rotate(45deg); pointer-events:none;
}
.bm-field--select select option{ background:var(--surface); color:var(--text); }

/* ============================================================
   SECTION SCAFFOLD
   ============================================================ */
.bm-section{ padding:76px 0; }
.bm-section.bordered{ border-bottom:1px solid var(--border); }
.bm-section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:40px; flex-wrap:wrap; }
.bm-section-head h2{ font-size:clamp(30px,4vw,46px); font-weight:800; margin-top:12px; }
.bm-view-all{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:14px; letter-spacing:.05em; text-transform:uppercase; display:inline-flex; align-items:center; gap:8px; color:var(--text-dim); border-bottom:1px solid var(--border); padding-bottom:3px; transition:color .15s ease,border-color .15s ease; }
.bm-view-all:hover{ color:var(--accent); border-color:var(--accent); }

/* ============================================================
   CATEGORY STRIP
   ============================================================ */
.bm-cat-strip{ padding:32px 0; border-bottom:1px solid var(--border); }
.bm-cat-strip .wrap{ position:relative; }
.bm-cat-row{ display:flex; gap:12px; overflow-x:auto; scroll-behavior:smooth; scrollbar-width:none; padding-bottom:2px; }
.bm-cat-row::-webkit-scrollbar{ display:none; }
.bm-cat-arrow{
  position:absolute; top:50%; transform:translateY(-50%); width:38px; height:38px; border-radius:50%;
  border:1px solid var(--border); background:var(--bg); color:var(--text-dim); display:grid; place-items:center;
  box-shadow:0 4px 14px rgba(0,0,0,.25); z-index:5; transition:border-color .15s ease,color .15s ease;
}
.bm-cat-arrow:hover{ border-color:var(--accent); color:var(--accent); }
.bm-cat-arrow.prev{ left:-4px; }
.bm-cat-arrow.next{ right:-4px; }
.bm-cat-arrow svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; }
.bm-cat-arrow[hidden]{ display:none; }
@media (max-width:640px){ .bm-cat-arrow{ display:none; } }
.bm-cat-pill{ flex:none; display:flex; align-items:center; gap:8px; padding:11px 18px; border:1px solid var(--border); background:var(--surface); font-family:'Rajdhani',sans-serif; font-weight:600; font-size:14px; letter-spacing:.03em; text-transform:uppercase; color:var(--text-dim); transition:border-color .15s ease,color .15s ease,background .15s ease; }
.bm-cat-pill:hover{ color:var(--text); border-color:var(--text-faint); }
.bm-cat-pill.is-active{ background:var(--accent); border-color:var(--accent); color:#fff; }

/* ============================================================
   BIKE CARDS (shared grid/rail component)
   ============================================================ */
.bm-bike-rail{ display:grid; grid-auto-flow:column; grid-auto-columns:min(300px,82vw); gap:20px; overflow-x:auto; padding:6px 6px 20px 6px; scroll-snap-type:x proximity; }
.bm-bike-rail::-webkit-scrollbar{ height:6px; }
.bm-bike-rail::-webkit-scrollbar-thumb{ background:var(--border); }
.bm-bike-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
@media (max-width:1080px){ .bm-bike-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px){ .bm-bike-grid{ grid-template-columns:1fr; } }

.bm-card{ scroll-snap-align:start; background:var(--surface); border:1px solid var(--border); display:flex; flex-direction:column; transition:border-color .2s ease, transform .2s ease; }
.bm-card:hover{ border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); transform:translateY(-3px); }
.bm-card-media{ position:relative; aspect-ratio:4/3; background:radial-gradient(ellipse 200px 90px at 50% 108%, color-mix(in srgb, var(--accent) 50%, transparent), transparent 70%), linear-gradient(180deg, var(--bg-alt), var(--surface-2)); display:grid; place-items:center; overflow:hidden; border-bottom:1px solid var(--border); }
.bm-card-media img{ width:100%; height:100%; object-fit:cover; }
.bm-card-media svg.bm-moto{ width:60%; color:var(--text); opacity:.9; }
.bm-tag{ position:absolute; top:12px; left:12px; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:11px; letter-spacing:.08em; text-transform:uppercase; background:var(--bg); border:1px solid var(--border); color:var(--text-dim); padding:5px 10px; }
.bm-tag.hot{ background:var(--accent); border-color:var(--accent); color:#fff; }
.bm-card-body{ padding:18px; display:flex; flex-direction:column; gap:12px; flex:1; }
.bm-card-name-row{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.bm-card-name{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:17.5px; line-height:1.25; }
.bm-card-name a{ color:inherit; }
.bm-card-brand{ font-size:12px; color:var(--text-faint); margin-top:2px; }
.bm-card-price{ text-align:right; flex:none; }
.bm-card-price b{ display:block; font-family:'Big Shoulders Display',sans-serif; font-weight:800; font-size:20px; color:var(--accent); }
.bm-card-price span{ font-family:'Rajdhani',sans-serif; font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-faint); }
.bm-card-specs{ display:flex; border-top:1px solid var(--border); padding-top:12px; }
.bm-card-specs div{ flex:1; text-align:center; border-right:1px solid var(--border); }
.bm-card-specs div:last-child{ border-right:none; }
.bm-card-specs b{ display:block; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13.5px; }
.bm-card-specs span{ font-size:10px; color:var(--text-faint); text-transform:uppercase; letter-spacing:.05em; }
.bm-card-foot{ display:flex; gap:10px; margin-top:auto; }
.bm-card-view{ flex:1; text-align:center; border:1px solid var(--border); padding:10px; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12.5px; letter-spacing:.05em; text-transform:uppercase; transition:background .15s ease, border-color .15s ease; }
.bm-card-view:hover{ background:var(--accent); border-color:var(--accent); color:#fff; }
.bm-card-cmp{ width:40px; flex:none; display:grid; place-items:center; border:1px solid var(--border); background:none; color:var(--text-dim); transition:border-color .15s ease; }
.bm-card-cmp svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.6; }
.bm-card-cmp.is-active{ background:var(--accent); border-color:var(--accent); color:#fff; }

/* ============================================================
   BRAND GRID
   ============================================================ */
.bm-brand-section{ background:var(--bg-alt); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.bm-brand-grid{ display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--border); }
@media (max-width:760px){ .bm-brand-grid{ grid-template-columns:repeat(2,1fr); } }
.bm-brand-cell{ display:flex; align-items:center; justify-content:center; padding:28px 14px; border-right:1px solid var(--border); border-bottom:1px solid var(--border); font-family:'Big Shoulders Display',sans-serif; font-weight:700; font-size:21px; letter-spacing:.02em; text-transform:uppercase; color:var(--text-dim); transition:color .18s ease, background .18s ease; text-align:center; }
.bm-brand-cell:hover{ color:var(--text); background:var(--surface); }

.bm-brand-page-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
@media (max-width:900px){ .bm-brand-page-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .bm-brand-page-grid{ grid-template-columns:1fr; } }
.bm-brand-page-card{
  display:block; padding:28px 26px; border:1px solid var(--border); background:var(--surface);
  transition:border-color .18s ease, transform .18s ease;
}
.bm-brand-page-card:hover{ border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); transform:translateY(-3px); }
.bm-brand-page-name{ font-family:'Big Shoulders Display',sans-serif; font-weight:800; font-size:26px; text-transform:uppercase; }
.bm-brand-page-count{ font-family:'Rajdhani',sans-serif; font-weight:600; font-size:13px; letter-spacing:.05em; text-transform:uppercase; color:var(--text-faint); margin-top:6px; }
.bm-brand-page-range{ margin-top:16px; padding-top:14px; border-top:1px solid var(--border); font-weight:700; color:var(--accent); font-size:15px; }

/* ============================================================
   BLOG GRID (1 row × 3 col, wraps as needed)
   ============================================================ */
.bm-blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media (max-width:980px){ .bm-blog-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px){ .bm-blog-grid{ grid-template-columns:1fr; } }
.bm-blog-card{ display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--border); transition:border-color .18s ease, transform .18s ease; }
.bm-blog-card:hover{ border-color:color-mix(in srgb, var(--accent) 55%, var(--border)); transform:translateY(-3px); }
.bm-blog-media{ display:block; aspect-ratio:16/10; overflow:hidden; background:linear-gradient(180deg,var(--bg-alt),var(--surface-2)); border-bottom:1px solid var(--border); }
.bm-blog-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.bm-blog-media svg.bm-moto{ width:50%; height:100%; margin:0 auto; color:var(--text-faint); }
.bm-blog-body{ padding:22px; display:flex; flex-direction:column; gap:12px; flex:1; }
.bm-blog-meta{ display:flex; align-items:center; gap:10px; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; }
.bm-blog-cat{ color:var(--accent); }
.bm-blog-date{ color:var(--text-faint); }
.bm-blog-title{ font-family:'Rajdhani',sans-serif; text-transform:none; font-weight:700; font-size:19px; line-height:1.3; letter-spacing:0; }
.bm-blog-title a{ color:var(--text); }
.bm-blog-title a:hover{ color:var(--accent); }
.bm-blog-excerpt{ font-size:14px; line-height:1.65; color:var(--text-dim); margin:0; flex:1; }
.bm-blog-readmore{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13px; letter-spacing:.05em; text-transform:uppercase; color:var(--accent); margin-top:auto; }

/* ============================================================
   SINGLE BLOG POST
   ============================================================ */
.bm-article-meta{ display:flex; align-items:center; gap:14px; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12px; letter-spacing:.06em; text-transform:uppercase; margin-bottom:18px; }
.bm-article-title{ font-size:clamp(28px,4vw,44px); font-weight:800; margin-bottom:28px; }
.bm-article-media{ margin-bottom:32px; border:1px solid var(--border); overflow:hidden; }
.bm-article-media img{ width:100%; height:auto; display:block; }
.bm-article-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:36px; padding-top:24px; border-top:1px solid var(--border); }
.bm-article-tags a{ font-family:'Rajdhani',sans-serif; font-size:12.5px; font-weight:600; letter-spacing:.03em; color:var(--text-dim); border:1px solid var(--border); padding:5px 12px; }
.bm-article-tags a:hover{ color:var(--accent); border-color:var(--accent); }

/*
 * Post content pasted/written for a white-background editor often carries
 * inline color styles (style="color:#000000") baked into the HTML itself.
 * No ordinary stylesheet rule can out-rank an inline style, so this is one
 * of the few places !important is the correct tool: it forcibly normalizes
 * arbitrary editor content to the dark theme's palette instead of leaving
 * black-on-black invisible text.
 */
.bm-article-content, .bm-article-content *,
.bm-summary-box, .bm-summary-box *{
  color: var(--text-dim) !important;
  background-color: transparent !important;
  border-color: var(--border) !important;
}
.bm-article-content h1, .bm-article-content h2, .bm-article-content h3,
.bm-article-content h4, .bm-article-content h5, .bm-article-content h6,
.bm-article-content strong, .bm-article-content b,
.bm-summary-box h1, .bm-summary-box h2, .bm-summary-box h3,
.bm-summary-box h4, .bm-summary-box h5, .bm-summary-box h6,
.bm-summary-box strong, .bm-summary-box b{
  color: var(--text) !important;
}
.bm-article-content a, .bm-summary-box a{ color: var(--accent) !important; text-decoration: underline; }
.bm-article-content img, .bm-summary-box img{ max-width: 100%; height: auto; }
.bm-article-content table, .bm-summary-box table{ width: 100%; border-collapse: collapse; }
.bm-article-content th, .bm-article-content td,
.bm-summary-box th, .bm-summary-box td{ border: 1px solid var(--border) !important; padding: 8px 12px; }
.bm-article-content blockquote, .bm-summary-box blockquote{ border-left: 3px solid var(--accent); padding-left: 18px; margin-left: 0; font-style: italic; }

/* ============================================================
   PILLARS / TRUST
   ============================================================ */
.bm-pillars{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
@media (max-width:820px){ .bm-pillars{ grid-template-columns:1fr; } }
.bm-pillar{ background:var(--bg); padding:36px 32px; }
.bm-pillar .num{ font-family:'Rajdhani',sans-serif; font-weight:700; color:var(--accent); font-size:13px; letter-spacing:.1em; }
.bm-pillar h3{ font-size:23px; margin-top:14px; font-weight:700; letter-spacing:.01em; }
.bm-pillar p{ margin:14px 0 0; font-size:14.5px; line-height:1.7; color:var(--text-dim); }

/* ============================================================
   FAQ ACCORDION (shared)
   ============================================================ */
.bm-faq-item{ border-bottom:1px solid var(--border); }
.bm-faq-item:first-child{ border-top:1px solid var(--border); }
.bm-faq-q{ width:100%; text-align:left; background:none; border:none; padding:18px 4px; display:flex; justify-content:space-between; align-items:center; gap:14px; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:15.5px; color:var(--text); }
.bm-faq-q .plus{ flex:none; width:22px; height:22px; position:relative; }
.bm-faq-q .plus::before, .bm-faq-q .plus::after{ content:""; position:absolute; background:var(--accent); top:50%; left:50%; transform:translate(-50%,-50%); }
.bm-faq-q .plus::before{ width:14px; height:2px; }
.bm-faq-q .plus::after{ width:2px; height:14px; transition:transform .2s ease; }
.bm-faq-item.is-open .bm-faq-q .plus::after{ transform:translate(-50%,-50%) rotate(90deg) scale(0); }
.bm-faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
.bm-faq-item.is-open .bm-faq-a{ max-height:600px; }
.bm-faq-a p{ margin:0 0 18px; padding:0 4px; font-size:14px; line-height:1.7; color:var(--text-dim); }

/* ============================================================
   CTA BAND
   ============================================================ */
.bm-cta-band{ position:relative; padding:76px 0; background:linear-gradient(120deg, var(--accent-dim), var(--accent)); overflow:hidden; }
.bm-cta-band::before{ content:""; position:absolute; inset:0; background-image:repeating-linear-gradient(115deg, rgba(255,255,255,.07) 0 2px, transparent 2px 34px); }
.bm-cta-inner{ position:relative; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.bm-cta-inner h2{ color:#fff; font-size:clamp(26px,3.4vw,40px); max-width:560px; }
.bm-cta-inner p{ color:rgba(255,255,255,.85); margin-top:10px; font-size:15px; }
.bm-cta-band .bm-btn-solid{ background:#0a0a0c; border-color:#0a0a0c; }
.bm-cta-band .bm-btn-solid:hover{ background:#000; }

/* ============================================================
   FOOTER
   ============================================================ */
.bm-footer{ padding:64px 0 28px; }
.bm-foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:46px; border-bottom:1px solid var(--border); }
@media (max-width:820px){ .bm-foot-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .bm-foot-grid{ grid-template-columns:1fr; } }
.bm-foot-about p{ font-size:14px; line-height:1.7; color:var(--text-dim); max-width:320px; margin:16px 0 20px; }
.bm-foot-social{ display:flex; gap:10px; }
.bm-foot-social a{ width:36px; height:36px; display:grid; place-items:center; border:1px solid var(--border); color:var(--text-dim); transition:border-color .15s ease,color .15s ease; }
.bm-foot-social a:hover{ border-color:var(--accent); color:var(--accent); }
.bm-foot-social svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.7; }
.bm-foot-col h4{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-faint); margin:0 0 16px; }
.bm-foot-col ul{ display:flex; flex-direction:column; gap:11px; }
.bm-foot-col a{ font-size:14.5px; color:var(--text-dim); transition:color .15s ease; }
.bm-foot-col a:hover{ color:var(--accent); }
.bm-foot-bottom{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-top:24px; font-size:12.5px; color:var(--text-faint); }
.bm-foot-bottom nav{ display:flex; gap:16px; flex-wrap:wrap; }
.bm-foot-bottom a{ color:var(--text-faint); }
.bm-foot-bottom a:hover{ color:var(--text-dim); }

/* ============================================================
   SINGLE BIKE PAGE
   ============================================================ */
.bm-showcase{ padding:40px 0 0; }
.bm-showcase-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:start; }
@media (max-width:980px){ .bm-showcase-grid{ grid-template-columns:1fr; } }
.bm-gallery{ position:relative; border:1px solid var(--border); background:var(--surface); }
.bm-gallery-main{ position:relative; aspect-ratio:16/11; background:radial-gradient(ellipse 320px 130px at 50% 112%, color-mix(in srgb, var(--accent) 50%, transparent), transparent 70%), linear-gradient(180deg, var(--bg-alt), var(--surface-2)); display:grid; place-items:center; overflow:hidden; border-bottom:1px solid var(--border); }
.bm-gallery-main img{ width:100%; height:100%; object-fit:cover; }
.bm-gallery-main svg.bm-moto{ width:58%; color:var(--text); }
.bm-gallery-badges{ position:absolute; top:14px; left:14px; display:flex; gap:8px; }
.bm-badge{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:11px; letter-spacing:.08em; text-transform:uppercase; background:var(--bg); border:1px solid var(--border); padding:5px 10px; }
.bm-badge.hot{ background:var(--accent); border-color:var(--accent); color:#fff; }
.bm-gallery-thumbs{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); }
.bm-gallery-thumbs button{ aspect-ratio:1; background:var(--surface-2); border:none; display:flex; align-items:center; justify-content:center; overflow:hidden; padding:0; }
.bm-gallery-thumbs button img{ width:100%; height:100%; object-fit:cover; }
.bm-gallery-thumbs button.is-active{ box-shadow:inset 0 0 0 2px var(--accent); }
.bm-info h1{ font-size:clamp(28px,3.2vw,42px); font-weight:800; }
.bm-info .brand-line{ font-family:'Rajdhani',sans-serif; font-weight:600; font-size:15px; color:var(--text-faint); margin-top:8px; letter-spacing:.02em; text-transform:uppercase; }
.bm-info .brand-line b{ color:var(--accent); }
.bm-quickstats{ display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--border); margin-top:22px; }
.bm-quickstats div{ text-align:center; padding:14px 8px; border-right:1px solid var(--border); }
.bm-quickstats div:last-child{ border-right:none; }
.bm-quickstats b{ display:block; font-family:'Big Shoulders Display',sans-serif; font-weight:800; font-size:20px; }
.bm-quickstats span{ font-family:'Rajdhani',sans-serif; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-faint); }
.bm-city-select{ margin-top:22px; border:1px solid var(--border); background:var(--surface); padding:14px 16px; display:flex; align-items:center; gap:12px; position:relative; }
.bm-city-select svg.pin{ width:18px; height:18px; stroke:var(--accent); fill:none; stroke-width:1.8; flex:none; }
.bm-city-select .txt{ flex:1; min-width:0; }
.bm-city-select label{ display:block; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-faint); }
.bm-city-select .v{ font-family:'Rajdhani',sans-serif; font-weight:600; font-size:15px; margin-top:2px; }
.bm-city-select input{ border:none; background:none; width:100%; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:15px; color:var(--text); padding:0; }
.bm-city-select input:focus{ outline:none; }
/* Generated by assets/js/bike-location-picker.js (shared with the classic
   theme — same element IDs/classes, restyled here for the dark design). */
.loc-picker{ position:relative; flex:1; min-width:0; }
.loc-picker__input{ width:100%; border:none; background:none; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:15px; color:var(--text); padding:0; }
.loc-picker__input:focus{ outline:none; }
.loc-picker__panel{ position:absolute; top:calc(100% + 10px); left:-16px; right:-16px; background:var(--surface); border:1px solid var(--border); max-height:320px; overflow-y:auto; padding:8px; z-index:20; box-shadow:0 16px 40px rgba(0,0,0,.35); }
.loc-picker__group{ padding:6px 8px; border-bottom:1px solid var(--border); }
.loc-picker__group:last-child{ border-bottom:none; }
.loc-picker__district{ display:block; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13.5px; color:var(--text); padding:4px 4px; text-decoration:none; }
.loc-picker__district:hover, .loc-picker__district.is-current{ color:var(--accent); }
.loc-picker__children{ display:flex; flex-wrap:wrap; gap:6px; padding:6px 4px 2px; }
.loc-picker__child{ font-family:'Rajdhani',sans-serif; font-size:12.5px; color:var(--text-dim); padding:4px 10px; border:1px solid var(--border); text-decoration:none; }
.loc-picker__child:hover, .loc-picker__child.is-current{ border-color:var(--accent); color:var(--text); }
.loc-picker__more{ font-size:11px; color:var(--text-faint); padding:2px 4px; }
.loc-picker__empty{ padding:14px; text-align:center; font-size:13px; color:var(--text-faint); }
.loc-picker__geo-banner{ margin-top:10px; padding:10px 12px; border:1px solid var(--border); background:var(--surface); font-size:13px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.loc-picker__geo-yes{ background:var(--accent); color:#fff; padding:5px 12px; text-decoration:none; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12.5px; }
.loc-picker__geo-no{ background:none; border:none; color:var(--text-faint); text-decoration:underline; font-size:12.5px; }
.bm-price-console{ margin-top:16px; border:1px solid var(--border); background:var(--surface); padding:22px; position:relative; overflow:hidden; }
.bm-price-console::after{ content:""; position:absolute; inset:0; background:linear-gradient(155deg, color-mix(in srgb, var(--accent) 7%, transparent), transparent 45%); pointer-events:none; }
.bm-price-console .lbl{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-faint); }
.bm-price-console .amt{ font-family:'Big Shoulders Display',sans-serif; font-weight:900; font-size:clamp(36px,5vw,50px); color:var(--accent); margin-top:6px; }
.bm-price-console .sub{ font-size:13.5px; color:var(--text-dim); margin-top:4px; }
.bm-price-actions{ display:flex; gap:12px; margin-top:20px; }
.bm-price-actions .bm-btn-solid{ flex:1; text-align:center; }
.bm-price-actions .bm-btn-ghost{ flex:none; width:52px; display:grid; place-items:center; border:1px solid var(--border); background:none; color:var(--text-dim); }
.bm-price-actions .bm-btn-ghost svg{ width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.7; }

.bm-tabnav{ position:sticky; top:72px; z-index:40; background:var(--bg); border-bottom:1px solid var(--border); margin-top:48px; }
.bm-tabnav-row{ display:flex; gap:0; overflow-x:auto; scrollbar-width:none; }
.bm-tabnav-row::-webkit-scrollbar{ display:none; }
.bm-tabnav-row a{ flex:none; padding:16px 18px; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-faint); border-bottom:2px solid transparent; }
.bm-tabnav-row a:hover{ color:var(--text); }

.bm-pg-section{ padding:60px 0; border-bottom:1px solid var(--border); }
.bm-pg-head{ margin-bottom:30px; }
.bm-pg-head h2{ font-size:clamp(24px,3.2vw,34px); font-weight:800; margin-top:12px; }

.bm-variant-list{ border:1px solid var(--border); background:var(--surface); }
.bm-variant-list__head{ display:flex; justify-content:space-between; padding:12px 18px; background:var(--surface-2); font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-dim); }
.bm-variant-row{ padding:16px 18px; border-bottom:1px solid var(--border); }
.bm-variant-row:last-child{ border-bottom:none; }
.bm-variant-row__top{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.bm-variant-row__main{ min-width:0; }
.bm-variant-row__name{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:16px; line-height:1.3; }
.bm-variant-row__specs{ font-size:13px; color:var(--text-faint); margin-top:4px; }
.bm-variant-row__main .bm-colour-dots{ margin-top:10px; }
.bm-variant-row__price{ text-align:right; flex-shrink:0; }
.bm-variant-row__price .amt{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:17px; color:var(--accent); white-space:nowrap; }
.bm-variant-row__label{ display:block; font-size:11px; color:var(--text-faint); margin-top:3px; }
.bm-variant-row__chev{ display:flex; align-items:center; gap:4px; margin-top:3px; font-size:11px; color:var(--text-faint); margin-left:auto; }
.bm-variant-row__chev:hover{ color:var(--accent); }
.bm-variant-row__foot{ display:flex; justify-content:space-between; align-items:center; margin-top:12px; padding-top:12px; border-top:1px dashed var(--border); }
.bm-variant-row__emi{ font-size:13px; color:var(--text-dim); }
.bm-variant-row__viewbtn{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12px; letter-spacing:.04em; text-transform:uppercase; color:var(--accent); }
.bm-variant-row__viewbtn:hover{ text-decoration:underline; }
.bm-colour-dots{ display:flex; gap:6px; }
.bm-colour-dots button{ width:20px; height:20px; border-radius:50%; border:2px solid var(--border); padding:0; background-size:cover; }
.bm-colour-dots button.is-active{ border-color:var(--accent); }

.bm-colour-preview{ margin-top:24px; border:1px solid var(--border); background:var(--surface); padding:24px; text-align:center; }
.bm-colour-preview__media{ max-width:360px; margin:0 auto; aspect-ratio:4/3; display:grid; place-items:center; }
.bm-colour-preview__media img{ width:100%; height:100%; object-fit:contain; }
.bm-colour-preview__media svg{ width:70%; color:var(--text-faint); }
.bm-colour-preview__label{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:15px; margin:14px 0 4px; }
.bm-colour-preview__label span{ color:var(--accent); }
.bm-colour-preview__note{ font-size:12.5px; color:var(--text-faint); margin:0; }

.bm-highlights-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:1px; background:var(--border); border:1px solid var(--border); }
.bm-highlight-cell{ background:var(--surface); padding:18px; }
.bm-highlight-cell span{ display:block; font-size:12px; color:var(--text-faint); text-transform:uppercase; letter-spacing:.05em; }
.bm-highlight-cell b{ display:block; font-family:'Big Shoulders Display',sans-serif; font-weight:800; font-size:21px; margin-top:6px; }

.bm-proscons{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--border); border:1px solid var(--border); }
@media (max-width:640px){ .bm-proscons{ grid-template-columns:1fr; } }
.bm-proscons > div{ background:var(--surface); padding:22px; }
.bm-proscons h3{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:14px; letter-spacing:.06em; text-transform:uppercase; margin-bottom:14px; }
.bm-proscons .good h3{ color:var(--good); }
.bm-proscons .bad h3{ color:var(--bad); }
.bm-proscons ul{ display:flex; flex-direction:column; gap:10px; }
.bm-proscons li{ font-size:14px; color:var(--text-dim); padding-left:20px; position:relative; }
.bm-proscons .good li::before{ content:"+"; position:absolute; left:0; color:var(--good); font-weight:700; }
.bm-proscons .bad li::before{ content:"\2013"; position:absolute; left:0; color:var(--bad); font-weight:700; }

.bm-summary-box{
  font-size:15.5px; line-height:1.85; color:var(--text-dim); max-width:780px;
  background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--accent);
  padding:32px 34px; position:relative;
}
.bm-summary-box::before{
  content:"\201C"; position:absolute; top:6px; right:26px; font-family:'Big Shoulders Display',sans-serif;
  font-size:90px; font-weight:800; color:var(--border); line-height:1; pointer-events:none;
}
.bm-summary-box > *:first-child{ margin-top:0; }
.bm-summary-box > *:last-child{ margin-bottom:0; }
.bm-summary-box p{ margin:0 0 18px; position:relative; }
.bm-summary-box strong{ color:var(--text); font-weight:700; }
.bm-summary-box h2, .bm-summary-box h3, .bm-summary-box h4{
  font-family:'Rajdhani',sans-serif; text-transform:none; color:var(--text); font-weight:700;
  font-size:18px; letter-spacing:.01em; margin:28px 0 12px; padding-left:14px; border-left:2px solid var(--accent);
}
.bm-summary-box h2:first-child, .bm-summary-box h3:first-child, .bm-summary-box h4:first-child{ margin-top:0; }
.bm-summary-box ul, .bm-summary-box ol{ margin:0 0 18px; padding-left:22px; }
.bm-summary-box li{ margin-bottom:8px; }
.bm-summary-box li::marker{ color:var(--accent); }
.bm-summary-box a{ color:var(--accent); text-decoration:underline; text-underline-offset:2px; }

.bm-spec-tabnav{ display:flex; gap:1px; background:var(--border); border:1px solid var(--border); margin-bottom:1px; }
.bm-spec-tabnav button{ flex:1; padding:14px; background:var(--surface); border:none; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--text-faint); }
.bm-spec-tabnav button.is-active{ background:var(--accent); color:#fff; }
.bm-spec-panel[hidden]{ display:none; }
.bm-spec-groups{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--border); border:1px solid var(--border); border-top:none; }
@media (max-width:760px){ .bm-spec-groups{ grid-template-columns:1fr; } }
.bm-spec-group{ background:var(--surface); padding:20px; }
.bm-spec-group h4{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); margin:0 0 12px; }
.bm-spec-row{ display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--border); font-size:13.5px; }
.bm-spec-row:last-child{ border-bottom:none; }
.bm-spec-row span:first-child{ color:var(--text-faint); }
.bm-spec-row span:last-child{ font-weight:600; text-align:right; font-family:'Rajdhani',sans-serif; }
.bm-spec-more{ display:block; width:100%; padding:12px; background:var(--surface); border:1px solid var(--border); border-top:none; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--accent); }

.bm-emi-panel{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--border); border:1px solid var(--border); }
@media (max-width:760px){ .bm-emi-panel{ grid-template-columns:1fr; } }
.bm-emi-panel > div{ background:var(--surface); padding:24px; }
.bm-emi-field{ margin-bottom:16px; }
.bm-emi-field label{ display:block; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-faint); margin-bottom:6px; }
.bm-emi-field input[type="number"]{ width:100%; border:1px solid var(--border); background:var(--bg-alt); color:var(--text); padding:9px 10px; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:15px; }
.bm-emi-result{ display:flex; flex-direction:column; height:100%; justify-content:center; gap:16px; }
.bm-emi-result .big{ text-align:center; }
.bm-emi-result .big span{ font-family:'Rajdhani',sans-serif; font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-faint); }
.bm-emi-result .big b{ display:block; font-family:'Big Shoulders Display',sans-serif; font-weight:900; font-size:40px; color:var(--accent); margin-top:6px; }
.bm-emi-result .rows{ display:flex; justify-content:space-around; border-top:1px solid var(--border); padding-top:14px; flex-wrap:wrap; gap:10px; }
.bm-emi-result .rows div{ text-align:center; }
.bm-emi-result .rows b{ display:block; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:14.5px; }
.bm-emi-result .rows span{ font-size:10.5px; color:var(--text-faint); text-transform:uppercase; letter-spacing:.05em; }

.bm-review-summary{ display:flex; align-items:center; gap:22px; margin-bottom:24px; flex-wrap:wrap; }
.bm-review-score{ font-family:'Big Shoulders Display',sans-serif; font-weight:900; font-size:48px; color:var(--accent); }
.bm-review-stars{ display:flex; gap:3px; }
.bm-review-stars svg{ width:15px; height:15px; fill:var(--accent); }
.bm-review-stars svg.empty{ fill:var(--border); }
.bm-review-count{ font-size:13px; color:var(--text-faint); }

/* ============================================================
   COMMENTS / REVIEWS
   ============================================================ */
.bm-comments__title{ font-family:'Rajdhani',sans-serif; text-transform:none; font-size:20px; font-weight:700; color:var(--text); margin:0 0 20px; }
.bm-comments__closed, .bm-comments__pending{ font-size:13.5px; color:var(--text-faint); font-style:italic; }

.bm-comment-list{ list-style:none; margin:0 0 40px; padding:0; display:flex; flex-direction:column; gap:1px; background:var(--border); border:1px solid var(--border); }
.bm-comment{ background:var(--surface); padding:20px 22px; }
.bm-comment__head{ display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:wrap; }
.bm-comment__head img{ border-radius:50%; flex:none; }
.bm-comment__author{ display:block; font-family:'Rajdhani',sans-serif; font-size:15px; font-weight:700; color:var(--text); }
.bm-comment__date{ display:block; font-size:12px; color:var(--text-faint); }
.bm-comment__stars{ display:flex; gap:2px; margin-left:auto; }
.bm-comment__stars svg{ width:14px; height:14px; fill:var(--accent); }
.bm-comment__stars svg.empty{ fill:var(--border); }
.bm-comment__body{ font-size:14.5px; line-height:1.7; color:var(--text-dim); }
.bm-comment__body p{ margin:0 0 10px; }
.bm-comment__body p:last-child{ margin-bottom:0; }

.bm-comment-form{ border:1px solid var(--border); background:var(--surface); padding:28px; display:flex; flex-wrap:wrap; gap:16px 20px; }
.bm-comment-form > p, .bm-comment-form .comment-form-rating, .bm-comment-form .comment-notes, .bm-comment-form .form-submit{ width:100%; margin:0; }
.bm-form-field{ display:flex; flex-direction:column; gap:8px; }
.bm-form-field--half{ width:calc(50% - 10px) !important; }
@media (max-width:560px){ .bm-form-field--half{ width:100% !important; } }
.bm-comment-form label{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-faint); }
.bm-comment-form input[type="text"], .bm-comment-form input[type="email"], .bm-comment-form input[type="url"], .bm-comment-form textarea, .bm-comment-form select{
  border:1px solid var(--border); background:var(--bg-alt); color:var(--text); padding:11px 13px; font-family:'Manrope',sans-serif; font-size:14.5px; width:100%;
}
.bm-comment-form textarea{ resize:vertical; min-height:120px; }
.bm-comment-form input:focus, .bm-comment-form textarea:focus, .bm-comment-form select:focus{ outline:2px solid var(--accent); outline-offset:1px; }
.bm-comment-form .comment-notes{ font-size:12.5px; color:var(--text-faint); }
.bm-comment-form .comment-form-rating{ display:flex; flex-direction:column; gap:8px; }
.bm-comment-form .comment-form-rating label{ display:block; }
.bm-comment-form .required{ color:var(--accent); }
.bm-comment-form .form-submit{ margin-top:6px !important; }

/* ============================================================
   LISTINGS / FILTERS
   ============================================================ */
.bm-listing-head{ padding:48px 0 36px; background:radial-gradient(ellipse 700px 340px at 85% -30%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 65%), var(--bg); border-bottom:1px solid var(--border); }
.bm-listing-head h1{ font-size:clamp(32px,4.2vw,54px); font-weight:800; }
.bm-listing-head p{ margin:14px 0 0; color:var(--text-dim); max-width:560px; font-size:15px; line-height:1.65; }
.bm-listing-count{ margin-top:20px; display:flex; gap:22px; flex-wrap:wrap; }
.bm-listing-count b{ font-family:'Big Shoulders Display',sans-serif; font-weight:800; font-size:24px; color:var(--accent); }
.bm-listing-count span{ font-family:'Rajdhani',sans-serif; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint); display:block; }
.bm-listing-body{ padding:40px 0 90px; display:grid; grid-template-columns:260px 1fr; gap:36px; align-items:start; }
.bm-filters{ border:1px solid var(--border); background:var(--surface); position:sticky; top:90px; }
@media (max-width:900px){
  .bm-listing-body{ grid-template-columns:1fr; }
  /* position:sticky only makes sense in the desktop 2-column layout, where
     the sidebar has room to float beside the scrolling grid. Stacked to a
     single column on mobile, "sticky" instead pins the filter box in place
     while it visually overlaps the bike cards scrolling underneath it —
     revert to normal in-flow positioning here. */
  .bm-filters{ position:static; top:auto; }
}
.bm-filter-group{ padding:18px; border-bottom:1px solid var(--border); }
.bm-filter-group:last-child{ border-bottom:none; }
.bm-filter-group h4{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-faint); margin:0 0 12px; }
.bm-filter-opt{ display:flex; align-items:center; justify-content:space-between; padding:6px 0; font-size:13.5px; color:var(--text-dim); }
.bm-filter-opt:hover{ color:var(--text); }
.bm-filter-opt input{ accent-color:var(--accent); width:15px; height:15px; }
.bm-toolbar{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:24px; }
.bm-toolbar .cnt{ font-family:'Rajdhani',sans-serif; font-weight:600; font-size:14px; color:var(--text-dim); }
.bm-toolbar .cnt b{ color:var(--text); }
.bm-sort select{ border:1px solid var(--border); background:var(--surface); color:var(--text); padding:9px 12px; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:13.5px; }
.bm-pagination{ display:flex; justify-content:center; gap:8px; margin-top:44px; }
.bm-pagination a, .bm-pagination span{ min-width:38px; height:38px; padding:0 10px; display:grid; place-items:center; border:1px solid var(--border); font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13.5px; color:var(--text-dim); }
.bm-pagination .current{ background:var(--accent); border-color:var(--accent); color:#fff; }
.bm-empty{ padding:60px 20px; text-align:center; color:var(--text-dim); border:1px solid var(--border); }

/* ============================================================
   FLOATING COMPARE BAR
   ============================================================ */
#bm-compare-bar{
  position:fixed; bottom:0; left:0; right:0; z-index:9999;
  background:var(--surface); border-top:1px solid var(--border); color:var(--text); padding:14px 24px;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px;
  box-shadow:0 -8px 30px rgba(0,0,0,.3);
  transform:translateY(100%); opacity:0; pointer-events:none;
  transition:transform .3s ease, opacity .3s ease;
}
#bm-compare-bar.is-visible{ transform:translateY(0); opacity:1; pointer-events:auto; }
#bm-compare-bar .list{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
#bm-compare-bar .count{ font-family:'Rajdhani',sans-serif; font-size:12px; font-weight:700; color:var(--accent); text-transform:uppercase; letter-spacing:.05em; }
#bm-compare-bar .chip{ background:var(--bg-alt); border:1px solid var(--border); border-radius:20px; padding:6px 8px 6px 14px; font-size:13px; display:inline-flex; align-items:center; gap:8px; max-width:220px; }
#bm-compare-bar .chip span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#bm-compare-bar .chip button{ flex:none; width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; background:var(--border); border-radius:50%; border:none; color:var(--text); font-weight:bold; font-size:13px; line-height:1; }
@media (max-width:575px){ #bm-compare-bar{ padding:10px 14px; justify-content:center; } }

/* ============================================================
   HTML SITEMAP
   ============================================================ */
.bm-sitemap-nav{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:18px 0; border-bottom:1px solid var(--border); margin-bottom:28px; }
.bm-sitemap-nav:last-of-type{ border-bottom:none; border-top:1px solid var(--border); margin-bottom:0; margin-top:28px; }
.bm-sitemap-current{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:14px; color:var(--text-dim); }
.bm-sitemap-jump{ display:flex; align-items:center; gap:8px; }
.bm-sitemap-jump label{ font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:var(--text-faint); }
.bm-sitemap-jump input{ width:80px; border:1px solid var(--border); background:var(--bg-alt); color:var(--text); padding:8px 10px; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:14px; }
.bm-sitemap-jump button{ padding:8px 16px; font-size:12.5px; }
.bm-sitemap-groups{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); border:1px solid var(--border); }
@media (max-width:900px){ .bm-sitemap-groups{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .bm-sitemap-groups{ grid-template-columns:1fr; } }
.bm-sitemap-group{ background:var(--surface); padding:20px; }
.bm-sitemap-group h3{ font-family:'Rajdhani',sans-serif; text-transform:none; font-weight:700; font-size:16px; letter-spacing:0; margin-bottom:10px; }
.bm-sitemap-group h3 a{ color:var(--text); }
.bm-sitemap-group h3 a:hover{ color:var(--accent); }
.bm-sitemap-group ul{ display:flex; flex-direction:column; gap:6px; }
.bm-sitemap-group li a{ font-size:13px; color:var(--text-faint); line-height:1.4; }
.bm-sitemap-group li a:hover{ color:var(--accent); }

/* ============================================================
   LOCATION-SPECIFIC BIKE PRICE PAGE
   ============================================================ */
.bm-loc-breadcrumb{ display:flex; align-items:center; gap:8px; padding:18px 32px; font-family:'Rajdhani',sans-serif; font-weight:600; font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-faint); border-bottom:1px solid var(--border); max-width:1240px; margin:0 auto; }
.bm-loc-breadcrumb a:hover{ color:var(--accent); }
.bm-loc-breadcrumb .cur{ color:var(--text-dim); }

.bm-loc-gallery-section{ padding:28px 0 0; }
.bm-loc-gallery__main{ aspect-ratio:16/9; background:linear-gradient(180deg, var(--bg-alt), var(--surface-2)); border:1px solid var(--border); display:grid; place-items:center; overflow:hidden; max-width:720px; margin:0 auto; }
.bm-loc-gallery__main img{ width:100%; height:100%; object-fit:contain; }
.bm-loc-gallery__thumbs{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:12px; max-width:720px; margin-left:auto; margin-right:auto; }
.bm-loc-gallery__thumbs button{ width:64px; height:64px; padding:0; border:2px solid var(--border); background:var(--surface); overflow:hidden; }
.bm-loc-gallery__thumbs button img{ width:100%; height:100%; object-fit:cover; }
.bm-loc-gallery__thumbs button.is-active{ border-color:var(--accent); }
.bm-loc-hero{ padding:44px 0; background:radial-gradient(ellipse 700px 340px at 85% -30%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 65%), var(--bg); border-bottom:1px solid var(--border); }
.bm-loc-hero h1{ font-size:clamp(28px,3.6vw,44px); font-weight:800; }
.bm-loc-intro{ margin:14px 0 0; font-size:16px; color:var(--text-dim); }
.bm-loc-intro strong{ color:var(--accent); }
.bm-loc-minitable{ margin-top:26px; border:1px solid var(--border); background:var(--surface); max-width:520px; overflow-x:auto; }
.bm-loc-minitable table{ width:100%; border-collapse:collapse; }
.bm-loc-minitable th, .bm-loc-minitable td{ padding:11px 16px; text-align:left; font-size:13.5px; border-bottom:1px solid var(--border); white-space:nowrap; }
.bm-loc-minitable th{ font-family:'Rajdhani',sans-serif; font-weight:700; letter-spacing:.04em; text-transform:uppercase; font-size:11.5px; color:var(--text-faint); background:var(--surface-2); }
.bm-loc-minitable tr:last-child td{ border-bottom:none; }
.bm-loc-switcher{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width:640px){ .bm-loc-switcher{ grid-template-columns:1fr; } }
.bm-loc-switcher .bm-field{ border:1px solid var(--border); background:var(--surface); padding:12px 14px; }
.bm-loc-breakup{ display:flex; flex-direction:column; gap:0; margin-top:8px; }
.bm-loc-breakup > div{ display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--border); font-size:14px; color:var(--text-dim); }
.bm-loc-breakup__total{ border-bottom:none !important; padding-top:12px !important; font-size:16px !important; font-weight:700; color:var(--text) !important; }
.bm-loc-breakup__total b{ color:var(--accent); }

/* Utility */
.bm-text-center{ text-align:center; }
.bm-mt-2{ margin-top:24px; }


/* ═════════ Variant price cards (location + bike pages) ═════════ */
.bm-variant-list{ border:none; background:transparent; display:flex; flex-direction:column; gap:14px; }
.bm-variant-list__head{ background:transparent; padding:0 4px 2px; font-size:12px; letter-spacing:.14em; color:var(--text-faint); }
.bm-variant-row{ position:relative; overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:20px 22px 18px 26px; transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.bm-variant-row:last-child{ border-bottom:1px solid var(--border); }
.bm-variant-row::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:linear-gradient(180deg,var(--accent),var(--accent-dim)); }
.bm-variant-row:hover{ border-color:color-mix(in srgb,var(--accent) 55%,var(--border)); box-shadow:0 12px 32px -14px var(--accent-glow); transform:translateY(-2px); }
.bm-variant-row__top{ align-items:center; gap:20px; }
.bm-variant-row__name{ font-size:20px; line-height:1.25; display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.bm-variant-row__badge{ font-family:'Manrope',sans-serif; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:var(--accent); padding:3px 9px; border-radius:999px; }
.bm-variant-row__specs{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; font-size:13px; }
.bm-variant-row__specs span{ border:1px solid var(--border); background:var(--surface-2); color:var(--text-dim); padding:4px 11px; border-radius:999px; line-height:1.3; }
.bm-variant-row__price{ display:flex; flex-direction:column; align-items:flex-end; gap:2px; }
.bm-variant-row__price .amt{ font-size:32px; line-height:1.1; letter-spacing:.01em; }
.bm-variant-row__label{ margin:0; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); }
.bm-variant-row__exs{ font-size:12.5px; color:var(--text-faint); margin-top:2px; }
.bm-variant-row__foot{ flex-wrap:wrap; gap:12px; margin-top:16px; padding-top:16px; border-top:1px solid var(--border); }
.bm-variant-row__emi{ display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; color:var(--text); background:color-mix(in srgb,var(--accent) 11%,transparent); border:1px solid color-mix(in srgb,var(--accent) 28%,transparent); padding:7px 14px; border-radius:999px; }
.bm-variant-row__viewbtn{ display:inline-flex; align-items:center; gap:8px; font-size:13px; letter-spacing:.05em; background:transparent; color:var(--accent); border:1.5px solid var(--accent); padding:9px 18px; border-radius:9px; cursor:pointer; transition:background .18s ease, color .18s ease, box-shadow .18s ease; }
.bm-variant-row__viewbtn::after{ content:"→"; transition:transform .18s ease; }
.bm-variant-row__viewbtn:hover{ background:var(--accent); color:#fff; text-decoration:none; box-shadow:0 8px 20px -8px var(--accent-glow); }
.bm-variant-row__viewbtn:hover::after{ transform:translateX(3px); }
@media (max-width:620px){
  .bm-variant-row{ padding:18px 16px 16px 20px; }
  .bm-variant-row__top{ flex-direction:column; align-items:flex-start; gap:14px; }
  .bm-variant-row__price{ align-items:flex-start; }
  .bm-variant-row__price .amt{ font-size:28px; }
  .bm-variant-row__foot{ flex-direction:column; align-items:stretch; }
  .bm-variant-row__emi{ justify-content:center; }
  .bm-variant-row__viewbtn{ justify-content:center; width:100%; }
}

/* ═════════ Compare bikes table ═════════ */
.bm-cmp-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--border); border-radius:16px; background:var(--surface); }
.bm-cmp{ width:100%; border-collapse:separate; border-spacing:0; table-layout:fixed; min-width:calc(140px + var(--cmp-cols,2) * 230px); }
.bm-cmp th, .bm-cmp td{ padding:16px 14px; text-align:center; vertical-align:middle; border-bottom:1px solid var(--border); border-left:1px solid var(--border); font-size:15px; }
.bm-cmp tr > :first-child{ border-left:none; }
.bm-cmp tbody tr:last-child > *{ border-bottom:none; }
.bm-cmp__corner, .bm-cmp tbody th[scope="row"]{ width:140px; text-align:left; position:sticky; left:0; z-index:2; background:var(--surface-2); font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13px; letter-spacing:.07em; text-transform:uppercase; color:var(--text-dim); }
.bm-cmp__corner{ z-index:3; vertical-align:bottom; }
.bm-cmp thead th.bm-cmp__bike{ vertical-align:top; padding:22px 16px 20px; background:var(--surface); }
.bm-cmp__img{ display:flex; align-items:center; justify-content:center; aspect-ratio:4/3; max-width:320px; margin:0 auto 14px; background:#fff; border-radius:12px; padding:10px; overflow:hidden; }
.bm-cmp__img img{ display:block; max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; }
.bm-cmp__noimg{ font-size:12px; color:#8a8580; }
.bm-cmp__name{ display:flex; align-items:center; justify-content:center; min-height:2.5em; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:19px; line-height:1.25; color:var(--text); text-transform:none; letter-spacing:0; }
.bm-cmp__name:hover{ color:var(--accent); }
.bm-cmp__cta{ display:inline-block; margin-top:8px; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:12.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); }
.bm-cmp__cta:hover{ text-decoration:underline; }
.bm-cmp tbody tr:nth-child(even) td{ background:color-mix(in srgb,var(--surface-2) 45%,transparent); }
.bm-cmp__price b{ font-family:'Rajdhani',sans-serif; font-size:23px; color:var(--accent); }
.bm-cmp__badge{ display:inline-block; margin-left:8px; font-style:normal; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:var(--accent); padding:3px 9px; border-radius:999px; vertical-align:middle; }
.bm-cmp-hint{ display:none; text-align:center; font-size:12px; color:var(--text-faint); margin-top:10px; }
@media (max-width:760px){
  .bm-cmp{ min-width:calc(104px + var(--cmp-cols,2) * 175px); }
  .bm-cmp th, .bm-cmp td{ padding:12px 8px; font-size:14px; }
  .bm-cmp__corner, .bm-cmp tbody th[scope="row"]{ width:104px; font-size:11px; letter-spacing:.04em; }
  .bm-cmp thead th.bm-cmp__bike{ padding:16px 8px 14px; }
  .bm-cmp__img{ padding:6px; margin-bottom:10px; }
  .bm-cmp__name{ font-size:15px; }
  .bm-cmp__price b{ font-size:18px; }
  .bm-cmp__badge{ display:block; width:max-content; margin:6px auto 0; }
  .bm-cmp-hint{ display:block; }
}


/* ═════════ Bike photo slider (single bike page) ═════════ */
.bm-slider{ outline:none; }
.bm-slider__stage{ position:relative; background:#fff; border-bottom:1px solid var(--border); overflow:hidden; }
.bm-slider__track{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; -webkit-overflow-scrolling:touch; scrollbar-width:none; overscroll-behavior-x:contain; }
.bm-slider__track::-webkit-scrollbar{ display:none; }
.bm-slide{ position:relative; flex:0 0 100%; scroll-snap-align:center; scroll-snap-stop:always; margin:0; aspect-ratio:16/11; background:#fff; }
.bm-slide img{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; display:block; user-select:none; -webkit-user-drag:none; }
.bm-slider .bm-gallery-badges{ z-index:2; }
.bm-slider__nav{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:44px; height:44px; border-radius:50%; border:1px solid var(--border); background:color-mix(in srgb,var(--bg) 82%,transparent); color:var(--text); display:grid; place-items:center; padding:0; cursor:pointer; backdrop-filter:blur(6px); transition:background .15s ease, border-color .15s ease, opacity .15s ease; }
.bm-slider__nav svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.bm-slider__nav:hover{ background:var(--accent); border-color:var(--accent); color:#fff; }
.bm-slider__nav[disabled]{ opacity:.35; pointer-events:none; }
.bm-slider__prev{ left:12px; }
.bm-slider__next{ right:12px; }
.bm-slider__counter{ position:absolute; right:12px; bottom:12px; z-index:3; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13px; letter-spacing:.06em; color:#fff; background:rgba(10,10,12,.72); padding:4px 11px; border-radius:999px; }
.bm-slider__caption{ position:absolute; left:12px; bottom:12px; z-index:3; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:13px; letter-spacing:.04em; color:#fff; background:rgba(10,10,12,.72); padding:4px 12px; border-radius:999px; max-width:60%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bm-slider__thumbs{ display:flex; gap:8px; padding:10px; overflow-x:auto; scrollbar-width:thin; background:var(--surface); }
.bm-slider__thumbs button{ flex:0 0 auto; width:76px; height:56px; padding:0; border:2px solid var(--border); background:#fff; overflow:hidden; cursor:pointer; opacity:.75; transition:opacity .15s ease, border-color .15s ease; }
.bm-slider__thumbs button img{ width:100%; height:100%; object-fit:contain; display:block; }
.bm-slider__thumbs button:hover{ opacity:1; }
.bm-slider__thumbs button.is-active{ border-color:var(--accent); opacity:1; }
.bm-slider:focus-visible{ box-shadow:0 0 0 2px var(--accent); }
@media (max-width:620px){
  .bm-slider__nav{ width:38px; height:38px; }
  .bm-slider__thumbs button{ width:64px; height:48px; }
}
@media (prefers-reduced-motion: reduce){ .bm-slider__track{ scroll-behavior:auto; } }

/* Fix: a long thumbnail strip / track must never widen the grid column (it pushed the price panel off-screen). */
.bm-showcase-grid > *{ min-width:0; }
.bm-gallery.bm-slider, .bm-slider__stage, .bm-slider__track, .bm-slider__thumbs{ min-width:0; max-width:100%; }
.bm-slider__thumbs{ width:100%; box-sizing:border-box; }


/* ═════════ Blog table of contents ═════════ */
html{ scroll-behavior:smooth; }
.bm-article-content h2[id], .bm-article-content h3[id], .bm-article-content h4[id]{ scroll-margin-top:96px; }
.bm-toc{ margin:8px 0 30px; border:1px solid var(--border); border-left:4px solid var(--accent); border-radius:10px; background:var(--surface); }
.bm-toc summary{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; cursor:pointer; list-style:none; font-family:'Rajdhani',sans-serif; font-weight:700; font-size:15px; letter-spacing:.12em; text-transform:uppercase; }
.bm-toc summary::-webkit-details-marker{ display:none; }
.bm-toc summary::after{ content:"–"; font-size:20px; line-height:1; color:var(--accent); }
.bm-toc details:not([open]) summary::after{ content:"+"; }
.bm-toc ol{ margin:0; padding:0 18px 16px 44px; list-style:decimal; }
.bm-toc ol ol{ padding:6px 0 2px 22px; list-style:lower-alpha; }
.bm-toc li{ margin:6px 0; line-height:1.45; }
.bm-toc li::marker{ color:var(--accent); font-weight:700; }
.bm-article-content .bm-toc a{ color:var(--text) !important; text-decoration:none !important; }
.bm-article-content .bm-toc a:hover{ color:var(--accent) !important; text-decoration:underline !important; }
@media (max-width:620px){ .bm-toc summary{ padding:12px 14px; font-size:14px; } .bm-toc ol{ padding:0 14px 14px 36px; } }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
.bm-toc--own-numbers ol{ list-style:none; padding-left:18px; }
.bm-toc--own-numbers ol ol{ list-style:none; padding-left:20px; }
