/* =========================================================
CROWNBARSHOP
FEATURED FLAVORS V2
REAL 60K PRODUCT IMAGES
========================================================= */

.cbs-flavors{
padding:82px 0 86px;
background:#f4f4f2;
overflow:hidden;
}

.cbs-flavors-heading{
max-width:690px;
margin:0 auto 38px;
text-align:center;
}

.cbs-flavors-kicker{
margin:0 0 10px;
color:#dc171d;
font-size:10px;
line-height:1;
font-weight:800;
letter-spacing:2.5px;
}

.cbs-flavors-heading h2{
margin:0;
color:#151515;
font-size:44px;
line-height:1.08;
letter-spacing:-1.7px;
}

.cbs-flavors-heading > p:last-child{
max-width:590px;
margin:14px auto 0;
color:#747671;
font-size:15px;
line-height:1.6;
}


/* =========================================================
DESKTOP — 6 CARDS
========================================================= */

.cbs-flavor-track{
display:grid;
grid-template-columns:repeat(6,minmax(0,1fr));
gap:12px;
}

.cbs-flavor-card{
  text-decoration:none;
  color:inherit;
min-width:0;
overflow:hidden;
background:#fff;
border:1px solid rgba(20,20,20,.08);
border-radius:16px;
transition:transform .22s ease,box-shadow .22s ease;
}

.cbs-flavor-card:hover{
transform:translateY(-4px);
box-shadow:0 18px 42px rgba(20,20,20,.09);
}


/* =========================================================
PRODUCT IMAGE
========================================================= */

.cbs-flavor-art{
position:relative;
height:250px;
display:flex;
align-items:center;
justify-content:center;
padding:4px;
overflow:hidden;
background:#fff;
border-bottom:1px solid #eeeeeb;
}

.cbs-flavor-art img{
display:block;
width:100%;
height:100%;
object-fit:contain;
object-position:center;
transform:scale(1.10);
transition:transform .28s ease;
}

.cbs-flavor-card:hover .cbs-flavor-art img{
transform:scale(1.14);
}

.cbs-flavor-number{
position:absolute;
left:12px;
top:12px;
z-index:3;
min-width:30px;
height:23px;
display:flex;
align-items:center;
justify-content:center;
padding:0 7px;
background:#171717;
color:#fff;
border-radius:999px;
font-size:9px;
line-height:1;
font-weight:800;
letter-spacing:1px;
}


/* =========================================================
COPY
========================================================= */

.cbs-flavor-copy{
min-height:82px;
padding:14px 15px 16px;
}

.cbs-flavor-type{
display:block;
margin-bottom:7px;
color:#dc171d;
font-size:8px;
line-height:1.2;
font-weight:800;
letter-spacing:1.45px;
}

.cbs-flavor-copy h3{
margin:0;
color:#171717;
font-size:18px;
line-height:1.14;
letter-spacing:-.45px;
}

.cbs-flavor-copy p{
display:none;
}

.cbs-flavor-swipe{
display:none;
}


/* =========================================================
TABLET
========================================================= */

@media(max-width:1100px){

.cbs-flavor-track{
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px;
}

.cbs-flavor-art{
height:270px;
}

.cbs-flavor-copy{
min-height:82px;
}

}


/* =========================================================
MOBILE — HORIZONTAL SWIPE
========================================================= */

@media(max-width:760px){

.cbs-flavors{
padding:56px 0 52px;
}

.cbs-flavors-heading{
margin-bottom:27px;
}

.cbs-flavors-heading h2{
font-size:33px;
letter-spacing:-1px;
}

.cbs-flavors-heading > p:last-child{
max-width:330px;
font-size:14px;
line-height:1.55;
}

.cbs-flavor-track{
width:calc(100% + 16px);
margin-right:-16px;
padding-right:16px;
display:flex;
gap:12px;
overflow-x:auto;
overflow-y:hidden;
scroll-snap-type:x mandatory;
overscroll-behavior-x:contain;
-webkit-overflow-scrolling:touch;
scrollbar-width:none;
}

.cbs-flavor-track::-webkit-scrollbar{
display:none;
}

.cbs-flavor-card{
flex:0 0 72%;
max-width:285px;
scroll-snap-align:start;
border-radius:15px;
}

.cbs-flavor-art{
height:245px;
padding:4px;
}

.cbs-flavor-copy{
min-height:82px;
padding:14px 16px 16px;
}

.cbs-flavor-copy h3{
font-size:19px;
}

.cbs-flavor-copy p{
font-size:11.5px;
}

.cbs-flavor-swipe{
display:block;
margin:16px 0 0;
color:#92938f;
font-size:10px;
font-weight:700;
}

}

@media(max-width:430px){

.cbs-flavor-card{
flex-basis:76%;
}

.cbs-flavor-art{
height:245px;
}

}