/*! theme-styles-responsive.scss.css */
@media (max-width: 1199px){
  .bb-grid--4{grid-template-columns:repeat(3,minmax(0,1fr))}
  .route-tile{grid-column:span var(--s-t)}
  .route-tile[data-show-d="0"]{display:flex}
  .route-tile[data-show-t="0"]{display:none}
  .bb-catalog--filters{grid-template-columns:230px minmax(0,1fr)}
  .bb-grid--side.bb-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-top .row{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 1023px){
  :root{--gut:24px}
  .header-panel-top .bb-service li:nth-child(n+2){display:none}
  .site-nav-dropdown{width:380px}
  .bb-nav-wide .site-nav-dropdown{width:440px}
  .bb-nav-wide .menu-lv-2{grid-template-columns:1fr}
  .bb-bed,.bb-calc,.bb-sizer,.bb-split,.bb-faq,.bb-closing,.bb-pdp{grid-template-columns:minmax(0,1fr)}
  .bb-split__media,.bb-faq__head,.product-photos{position:static}
  .bb-catalog--filters{grid-template-columns:minmax(0,1fr)}
  .bb-filters{position:fixed;inset:0 auto 0 0;width:min(340px,90vw);max-height:none;z-index:70;border-radius:0;transform:translateX(-105%);visibility:hidden;transition:transform .25s,visibility 0s .25s}
  .bb-filters.is-open{transform:none;visibility:visible;transition:transform .25s}
  .bb-filters__close,.bb-filters__apply{display:inline-flex}
  .bb-filters__apply{width:100%;margin-top:12px}
  .bb-mobile-filter{display:inline-flex}
  .bb-grid--side.bb-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bb-choose,.bb-jcards--3,.bb-jcards--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bb-roads--3,.bb-roads--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bb-article{grid-template-columns:minmax(0,1fr)}
  .bb-article__aside{display:none}
  .bb-stand__head{grid-template-columns:minmax(0,1fr)}
  .bb-az{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 899px){
  .site-nav{display:none}
  .nav-bar{border-bottom:0}
  .bb-drawer{display:block}
  .header-panel-bt{grid-template-columns:auto auto;justify-content:space-between;min-height:70px;gap:12px}
  .header-panel-bt>.search-bar{display:none}
  .header-logo img{width:168px}
}
@media (max-width: 767px){
  .bb-grid--4,.bb-grid--3,.bb-grid--side.bb-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bb-grid{gap:12px}
  .route-tile{grid-column:span var(--s-m)}
  .route-tile[data-show-t="0"]{display:flex}
  .route-tile[data-show-m="0"]{display:none}
  .route-tile--pic{flex-direction:column}
  .route-tile__pic{flex:0 0 auto;align-self:stretch}
  .bb-band{padding:52px 0}
  .bb-head{flex-direction:column;align-items:flex-start;margin-bottom:22px}
  .bb-tiles{grid-template-columns:minmax(0,1fr)}
  .bb-calc__rows,.bb-sizer__rows{grid-template-columns:minmax(0,1fr)}
  .footer-top .row{grid-template-columns:minmax(0,1fr)}
  .bb-foot-two{columns:2;column-gap:20px}
  .bb-foot-two li{break-inside:avoid;margin-bottom:7px}
  .tbl-wrap--stack thead{display:none}
  .tbl-wrap--stack tr{display:block;padding:10px 14px;border-top:1px solid var(--line)}
  .tbl-wrap--stack th,.tbl-wrap--stack td{display:block;border:0;padding:3px 0}
  .tbl-wrap--stack td[data-l]::before{content:attr(data-l);display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--soft)}
  .bb-inset{grid-template-columns:96px minmax(0,1fr)}
}
@media (max-width: 519px){
  :root{--gut:18px}
  body{font-size:16.5px}
  .header-panel-top .bb-service{display:none}
  .header-panel-top .container{justify-content:center}
  .header-logo img{width:150px}
  .cta-long{display:none}
  .cta-short{display:inline-flex}
  .bb-tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut)}
  .bb-tab{flex:0 0 auto}
  .product-bottom{padding:12px 12px 14px}
  .product-title{font-size:15.5px}
  .price-box{font-size:18px}
  .bb-choose,.bb-jcards--3,.bb-jcards--4,.bb-roads--2,.bb-roads--3,.bb-roads--4,.bb-az{grid-template-columns:minmax(0,1fr)}
  .product-cart-buttons .btn{padding:0 10px}
  .bb-pdp__buy .price{font-size:28px}
  .bb-closing__acts .btn{width:100%}
  .bb-calc__total b{font-size:52px}
  .bb-cathead .bb-figures span:nth-child(n+3){display:none}
  .btn img.cta-img{height:auto!important;max-height:1em}
}
@media (max-width: 1023px){
  .bb-roads--5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bb-sizer>:first-child{position:static}
}
@media (max-width: 767px){
  .bb-band{padding:44px 0}
  /* a card on a phone is about 150px of text: the five stars give way to the figure */
  .bb-card .spr-starrating{display:none}
  .bb-card .spr-badge{gap:4px;font-size:13px}
  .bb-roads--5{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* footer: the shop text on its own row, the link lists two by two */
  .footer-top .row{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}
  .footer-top .row>:first-child{grid-column:1/-1}
  .bb-foot-two{columns:1}
  /* side-by-side table: one block per feature, each product a line with its value */
  .bb-cmp-wrap{overflow:visible;border:0;background:none}
  .bb-cmp thead{display:none}
  .bb-cmp,.bb-cmp tbody,.bb-cmp tr{display:block;width:100%}
  .bb-cmp tr{padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper);margin-bottom:10px}
  .bb-cmp tbody th{position:static;display:block;min-width:0;padding:0 0 6px;color:var(--ink);font-weight:700}
  .bb-cmp td{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;min-width:0;padding:5px 0;border:0;background:none}
  .bb-cmp td::before{content:attr(data-l);color:var(--soft);font-size:14px}
  .bb-cmp td.is-this{background:none;font-weight:700}
  .bb-cmp__buy th{display:none}
  /* first screen on a phone: the head is the title, the pills and chips one scrolling row */
  .bb-stand__head{display:block}
  .bb-stand__lede{display:none}
  .bb-tabs,.bb-layers,.bb-sizechips{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);padding-bottom:4px;scrollbar-width:none}
  .bb-tab,.bb-layer,.bb-sizechips li{flex:0 0 auto}
  .bb-cathead .bb-figures{display:none}
  .toolbar{flex-wrap:nowrap}
  .bb-roads--3,.bb-roads--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bb-cathead .bb-layers,.toolbar .bb-sizechips{display:none}
  /* a stacked table row: the name on top, the figures on one line, the button at the end */
  .tbl-wrap--stack tr{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px}
  .tbl-wrap--stack th{flex:1 0 100%}
  .tbl-wrap--stack td[data-l]::before{display:inline;margin-right:6px}
  .tbl-wrap--stack td:has(.btn){margin-left:auto}
}