.sbb-rsp-wrap{
  margin:1.5rem 0;
  padding:1rem;
  border:2px solid #eee;
  border-radius:16px;
  background:#fff9f0;
}
.sbb-rsp-title{
  margin:0 0 .75rem;
  font-size:1.2rem;
}

/* Default responsive grid */
.sbb-rsp-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:16px;
}

.sbb-rsp-item{
  background:#fff;
  border:1px solid #eee;
  border-radius:14px;
  padding:.75rem;
  text-align:center;
}
.sbb-rsp-thumb{ display:block; }
.sbb-rsp-img{
  width:100%;
  height:auto;
  border-radius:10px;
}
.sbb-rsp-name{
  display:block;
  margin:.5rem 0 .25rem;
  font-weight:600;
  text-decoration:none;
}
.sbb-rsp-price{
  margin:.25rem 0 .5rem;
}
.sbb-rsp-cta .button{
  display:inline-block;
  padding:.5rem .75rem;
  border-radius:10px;
  text-decoration:none;
  border:1px solid #ddd;
}

/* Mobile grid tightening */
@media (max-width: 640px){
  .sbb-rsp-grid{
    grid-template-columns:repeat(2, minmax(140px,1fr));
  }
}

/* Mobile carousel mode */
@media (max-width: 640px){
  .sbb-rsp--mobile-carousel .sbb-rsp-grid{
    display:flex;
    overflow-x:auto;
    gap:12px;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom:8px;
  }
  .sbb-rsp--mobile-carousel .sbb-rsp-item{
    flex:0 0 72%;
    max-width:72%;
    scroll-snap-align:start;
  }
  .sbb-rsp--mobile-carousel .sbb-rsp-grid::-webkit-scrollbar{ height:6px; }
  .sbb-rsp--mobile-carousel .sbb-rsp-grid::-webkit-scrollbar-thumb{
    background:#ddd; border-radius:6px;
  }
}

