.bmn-model-navigation{
  --bmn-gap:11px;
  --bmn-card-mobile:calc(31.25% - 7.563px);
  --bmn-card-tablet:calc(25% - 8.25px);
  --bmn-card-desktop:calc(25% - 8.25px);
  --bmn-mobile-visual:166px;
  --bmn-mobile-image:148px;
  --bmn-desktop-visual:235px;
  --bmn-desktop-image:210px;
  --bmn-title-gap-mobile:-8px;
  --bmn-title-align:left;
  --bmn-title-gap-tablet:-8px;
  --bmn-title-gap-desktop:0px;
  --bmn-arrow-y-mobile:67px;
  --bmn-arrow-y-tablet:67px;
  --bmn-arrow-y-desktop:101px;
  --bmn-arrow-left-mobile:5px;
  --bmn-arrow-right-mobile:5px;
  --bmn-arrow-left-tablet:5px;
  --bmn-arrow-right-tablet:5px;
  --bmn-arrow-left-desktop:-10px;
  --bmn-arrow-right-desktop:-10px;
  --bmn-gold:#b58f45;
  --bmn-ink:#111214;
  --bmn-muted:#85878b;
  position:relative;
  width:100%;
  color:var(--bmn-ink);
}
.bmn-model-navigation *{box-sizing:border-box}
.bmn-model-navigation__title{
  margin:0!important;
  padding:0 18px!important;
  color:var(--bmn-ink);
  font:800 24px/1.06 inherit;
  letter-spacing:-.55px;
  text-align:var(--bmn-title-align)!important;
}
.bmn-model-navigation__stage{
  position:relative;
  margin-top:var(--bmn-title-gap-mobile)!important;
}
.bmn-model-navigation__track{
  display:flex;
  gap:var(--bmn-gap);
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  overscroll-behavior-x:contain;
  padding:0 18px 5px;
  margin:0!important;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
.bmn-model-navigation__track::-webkit-scrollbar{display:none}
.bmn-model-card{
  flex:0 0 var(--bmn-card-mobile);
  min-width:0;
  margin:0!important;
  padding:0!important;
  color:inherit;
  text-decoration:none!important;
  text-align:center;
  scroll-snap-align:start;
  -webkit-tap-highlight-color:transparent;
}
.bmn-model-card:hover,.bmn-model-card:focus{color:inherit;text-decoration:none!important}
.bmn-model-card__visual{
  height:var(--bmn-mobile-visual);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:0 2px;
  margin:0!important;
  overflow:visible;
}
.bmn-model-card__visual img{
  display:block;
  width:auto!important;
  height:calc(var(--bmn-mobile-image) * var(--bmn-item-scale,1))!important;
  max-width:100%!important;
  max-height:none!important;
  margin:0!important;
  object-fit:contain;
  object-position:center bottom;
  transform:translate(var(--bmn-item-x,0),var(--bmn-item-y,0));
}
.bmn-model-card__brand,.bmn-model-card__name{display:block}
.bmn-model-card__brand{
  margin-top:8px;
  color:var(--bmn-gold);
  font-size:9px;
  line-height:1;
  font-weight:700;
  letter-spacing:.55px;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.bmn-model-card__name{
  margin-top:5px;
  min-height:29px;
  color:var(--bmn-ink);
  font-size:12px;
  line-height:1.18;
  font-weight:800;
  letter-spacing:-.15px;
}

/*
 * WoodMart applies global button styles aggressively. Reset those styles here
 * so both carousel controls stay anchored to the same stage and cannot be
 * pushed into normal document flow by theme button rules.
 */
.bmn-model-navigation button.bmn-model-navigation__arrow{
  all:unset;
  box-sizing:border-box!important;
  position:absolute!important;
  top:var(--bmn-arrow-y-mobile)!important;
  bottom:auto!important;
  z-index:8!important;
  display:grid!important;
  place-items:center!important;
  width:32px!important;
  min-width:32px!important;
  max-width:32px!important;
  height:32px!important;
  min-height:32px!important;
  max-height:32px!important;
  margin:0!important;
  padding:0!important;
  border:1px solid rgba(17,18,20,.06)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.94)!important;
  color:#55585c!important;
  box-shadow:0 3px 12px rgba(17,18,20,.10)!important;
  cursor:pointer!important;
  opacity:1;
  transition:opacity .16s ease,color .16s ease,box-shadow .16s ease!important;
  -webkit-appearance:none!important;
  appearance:none!important;
}
.bmn-model-navigation button.bmn-model-navigation__arrow svg{
  display:block!important;
  width:15px!important;
  height:15px!important;
  margin:0!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  pointer-events:none;
}
.bmn-model-navigation button.bmn-model-navigation__arrow:hover{
  color:#111214!important;
  box-shadow:0 4px 14px rgba(17,18,20,.14)!important;
}
.bmn-model-navigation button.bmn-model-navigation__arrow:focus-visible{
  outline:2px solid var(--bmn-gold)!important;
  outline-offset:2px!important;
}
.bmn-model-navigation button.bmn-model-navigation__arrow[disabled]{
  opacity:.18!important;
  cursor:default!important;
  box-shadow:none!important;
}
.bmn-model-navigation button.bmn-model-navigation__arrow--prev{
  left:var(--bmn-arrow-left-mobile)!important;
  right:auto!important;
}
.bmn-model-navigation button.bmn-model-navigation__arrow--next{
  left:auto!important;
  right:var(--bmn-arrow-right-mobile)!important;
}
@media (min-width:768px){
  .bmn-model-navigation__stage{margin-top:var(--bmn-title-gap-tablet)!important}
  .bmn-model-card{flex-basis:var(--bmn-card-tablet)}
  .bmn-model-navigation button.bmn-model-navigation__arrow{top:var(--bmn-arrow-y-tablet)!important}
  .bmn-model-navigation button.bmn-model-navigation__arrow--prev{left:var(--bmn-arrow-left-tablet)!important}
  .bmn-model-navigation button.bmn-model-navigation__arrow--next{right:var(--bmn-arrow-right-tablet)!important}
}
@media (min-width:1024px){
  .bmn-model-navigation__title{padding-left:0!important;padding-right:0!important}
  .bmn-model-navigation__stage{margin-top:var(--bmn-title-gap-desktop)!important}
  .bmn-model-navigation__track{padding-left:0;padding-right:0}
  .bmn-model-card{flex-basis:var(--bmn-card-desktop)}
  .bmn-model-card__visual{height:var(--bmn-desktop-visual)}
  .bmn-model-card__visual img{height:calc(var(--bmn-desktop-image) * var(--bmn-item-scale,1))!important}
  .bmn-model-navigation button.bmn-model-navigation__arrow{
    top:var(--bmn-arrow-y-desktop)!important;
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    height:34px!important;
    min-height:34px!important;
    max-height:34px!important;
  }
  .bmn-model-navigation button.bmn-model-navigation__arrow--prev{left:var(--bmn-arrow-left-desktop)!important}
  .bmn-model-navigation button.bmn-model-navigation__arrow--next{right:var(--bmn-arrow-right-desktop)!important}
  .bmn-model-card__brand{font-size:10px}
  .bmn-model-card__name{font-size:14px;min-height:34px}
}
