/* =========================
YOU MIGHT LIKE
========================= */

.sss-you-might-like{

margin-top:90px;

padding-top:50px;

border-top:1px solid rgba(255,255,255,.08);

text-align:center;

}

.sss-you-might-like__title{

font-size:22px;

margin-bottom:30px;

text-transform:lowercase;

opacity:.85;

}

.sss-you-might-like__kicker{

margin:0 0 10px;

font-size:11px;

letter-spacing:.18em;

text-transform:uppercase;

color:#ff8ac7;

}

/* grid */

/* item */

.sss-you-might-like__item{

display:flex;

flex-direction:column;

align-items:center;

justify-content:center;

padding:18px;

border-radius:12px;

border:1px solid rgba(255,255,255,.12);

background:rgba(255,255,255,.02);

text-decoration:none;

color:#fff;

transition:all .2s ease;

}

.sss-you-might-like__item:hover{

transform:translateY(-3px);

border-color:#e85a9b;

box-shadow:0 12px 28px rgba(0,0,0,.45);

}

.sss-you-might-like__emoji{

font-size:20px;

margin-bottom:6px;

}

.sss-you-might-like__name{

font-size:13px;

text-align:center;

}

/* bottom link */

.sss-you-might-like__all{

display:block;

margin-top:32px;

font-size:13px;

letter-spacing:.12em;

text-transform:uppercase;

color:#ff8ac7;

text-decoration:none;

}

.sss-you-might-like__all:hover{

text-decoration:underline;

}
.sss-you-might-like__grid{

display:grid;

grid-template-columns:repeat(3,220px);

justify-content:center;

gap:22px;

margin:0 auto;

}
.sss-you-might-like__item{

display:flex;

flex-direction:column;

align-items:center;

justify-content:center;

padding:26px 24px;

min-height:110px;

border-radius:14px;

border:1px solid rgba(255,255,255,.12);

background:rgba(255,255,255,.02);

text-decoration:none;

color:#fff;

transition:all .25s ease;

}

.sss-you-might-like__item:hover{

transform:translateY(-3px);

border-color:#ff8ac7;

box-shadow:0 14px 34px rgba(0,0,0,.45);

}
@media(max-width:640px){

/* section spacing */

.sss-you-might-like{
  margin-top:40px;
  padding-top:20px;
}

/* title spacing */

.sss-you-might-like__title{
  margin-bottom:16px;
}

/* scroll row */

.sss-you-might-like__grid{
  display:flex;
  gap:12px;

  overflow-x:auto;
  overflow-y:visible;

  padding:8px 18px 6px;

  scroll-snap-type:x mandatory;
  scroll-padding-left:18px;
  scroll-padding-right:18px;
  -webkit-overflow-scrolling:touch;
}

/* cards */

.sss-you-might-like__item{
  flex:0 0 min(72vw, 188px);
  width:min(72vw, 188px);
  min-height:90px;
  padding:16px;

  scroll-snap-align:start;
}

/* emoji + text */

.sss-you-might-like__emoji{
  font-size:18px;
}

.sss-you-might-like__name{
  font-size:12px;
  max-width:140px;
}

/* bottom link spacing */

.sss-you-might-like__all{
  margin-top:20px;
}

/* scrollbar styling */

.sss-you-might-like__grid::-webkit-scrollbar{
  height:6px;
}

.sss-you-might-like__grid::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.15);
  border-radius:999px;
}

}
.sss-you-might-like__item{

width:220px;

min-height:110px;

display:flex;

flex-direction:column;

align-items:center;

justify-content:center;

padding:24px;

border-radius:14px;

border:1px solid rgba(255,255,255,.12);

background:rgba(255,255,255,.02);

text-decoration:none;

color:#fff;

transition:all .25s ease;

}
.sss-you-might-like__name{
font-size:13px;
text-align:center;
line-height:1.4;
max-width:180px;
}

.sss-you-might-like--mobile{
display:none;
}

.sss-you-might-like--desktop{
display:block;
}

@media(max-width:640px){
.sss-you-might-like--mobile{
display:block;
}

.sss-you-might-like--desktop{
display:none;
}
}