/* v38 selected cases, scoped to media marketing #cases only. */
.media-marketing-page #cases{
  --mk-case-blue:#1559ef;
  --mk-case-serif:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif;
  scroll-margin-top:88px;
  background:
    radial-gradient(circle at 88% 4%,rgba(15,85,245,.035),transparent 26%),
    var(--mk-soft,#f4f8ff);
}
.media-marketing-page #cases .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-size:11px;
  line-height:1;
  letter-spacing:.18em;
  font-weight:800;
  color:var(--mk-case-blue);
  text-transform:uppercase;
}
.media-marketing-page #cases .eyebrow:before{
  content:"";
  width:20px;
  height:1px;
  background:var(--mk-case-blue);
}
.media-marketing-page #cases .case-head{display:block;margin-bottom:24px}
.media-marketing-page #cases .case-head-copy{max-width:980px}
.media-marketing-page #cases .case-head-copy h2{
  max-width:960px;
  font-family:var(--mk-case-serif);
  font-size:40px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:-.025em;
  margin:14px 0;
  color:#071525;
}
.media-marketing-page #cases .case-head-copy p{
  max-width:900px;
  font-size:14px;
  line-height:1.82;
  color:#465970;
  margin:0;
}
.media-marketing-page #cases .case-filters{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:8px;
  margin-bottom:26px;
}
.media-marketing-page #cases .case-filter{
  min-width:124px;
  padding:10px 20px;
  border:1px solid #dfe6f0;
  border-radius:999px;
  background:#fff;
  color:#53677f;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  transition:.2s ease;
}
.media-marketing-page #cases .case-filter:hover{
  background:#edf3ff;
  border-color:#c9d9fb;
  color:var(--mk-case-blue);
}
.media-marketing-page #cases .case-filter.active{
  color:#fff;
  background:var(--mk-case-blue);
  border-color:var(--mk-case-blue);
  box-shadow:0 8px 20px rgba(15,85,245,.16);
}
.media-marketing-page #cases .case-viewport{position:relative;width:100%}
.media-marketing-page #cases .case-track{
  display:flex;
  gap:18px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding:3px 3px 22px;
  scrollbar-width:none;
}
.media-marketing-page #cases .case-track::-webkit-scrollbar{display:none}
.media-marketing-page #cases .case-card-v10{
  flex:0 0 390px;
  min-height:360px;
  scroll-snap-align:start;
  border:1px solid #dde5f0;
  border-radius:20px;
  background:
    radial-gradient(circle at 92% 6%,rgba(15,85,245,.055),transparent 22%),
    linear-gradient(180deg,#fff,#fbfcff);
  overflow:hidden;
  box-shadow:0 9px 30px rgba(24,69,142,.05);
  transition:.25s ease;
}
.media-marketing-page #cases .case-card-v10:hover{
  transform:translateY(-4px);
  border-color:#c7d8f7;
  box-shadow:0 20px 48px rgba(24,69,142,.09);
}
.media-marketing-page #cases .case-card-v10.is-hidden{display:none}
.media-marketing-page #cases .case-card-text .case-body-v10{
  position:relative;
  height:100%;
  min-height:360px;
  padding:27px 27px 25px;
  display:flex;
  flex-direction:column;
}
.media-marketing-page #cases .case-card-text .case-kicker{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:28px;
  padding-bottom:16px;
  border-bottom:1px solid #e5ebf3;
}
.media-marketing-page #cases .case-card-text .case-kicker small{
  display:inline-flex;
  padding:6px 9px;
  border-radius:999px;
  background:#eef4ff;
  color:var(--mk-case-blue);
  font-size:9px;
  letter-spacing:.12em;
  font-weight:800;
}
.media-marketing-page #cases .case-card-text .case-kicker span{
  font-size:10px;
  color:#75859a;
}
.media-marketing-page #cases .case-card-text h3{
  font-family:var(--mk-case-serif);
  font-size:27px;
  font-weight:600;
  line-height:1.32;
  margin:0 0 10px;
  color:#071525;
}
.media-marketing-page #cases .case-card-text h4{
  margin:0 0 14px;
  font-family:var(--mk-case-serif);
  font-size:20px;
  line-height:1.42;
  font-weight:600;
  color:#193454;
}
.media-marketing-page #cases .case-card-text p{
  min-height:auto;
  margin:0;
  font-size:11px;
  line-height:1.78;
  color:#566980;
}
.media-marketing-page #cases .case-proofline{
  margin-top:auto;
  padding-top:19px;
  border-top:1px solid #e7edf4;
}
.media-marketing-page #cases .case-proofline b{
  display:block;
  margin-bottom:6px;
  font-size:9px;
  letter-spacing:.08em;
  color:var(--mk-case-blue);
}
.media-marketing-page #cases .case-proofline span{
  font-size:10px;
  line-height:1.55;
  color:#536980;
}
.media-marketing-page #cases .case-detail-btn{
  margin-top:20px;
  width:100%;
  height:42px;
  border:1px solid #d6e2f7;
  border-radius:12px;
  background:#f8fbff;
  color:var(--mk-case-blue);
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
  cursor:pointer;
  transition:.22s ease;
}
.media-marketing-page #cases .case-detail-btn span{
  display:inline-block;
  margin-left:5px;
  transition:.22s ease;
}
.media-marketing-page #cases .case-detail-btn:hover{
  color:#fff;
  background:var(--mk-case-blue);
  border-color:var(--mk-case-blue);
  box-shadow:0 10px 24px rgba(15,85,245,.15);
}
.media-marketing-page #cases .case-detail-btn:hover span{transform:translate(2px,-2px)}
.media-marketing-page #cases .case-scrollbar{margin-top:24px;padding:0 2px}
.media-marketing-page #cases .case-scrollbar-track{
  position:relative;
  width:100%;
  height:5px;
  border-radius:999px;
  background:#e6edf7;
  cursor:pointer;
  overflow:hidden;
}
.media-marketing-page #cases .case-scrollbar-thumb{
  position:absolute;
  left:0;top:0;
  height:100%;
  width:22%;
  border-radius:999px;
  background:linear-gradient(90deg,#0f55f5,#61ccef);
  box-shadow:0 4px 12px rgba(15,85,245,.18);
  cursor:grab;
  touch-action:none;
}
.media-marketing-page #cases .case-scrollbar-thumb:active{cursor:grabbing}

@media(max-width:720px){
  .media-marketing-page #cases .case-head-copy h2{font-size:32px}
  .media-marketing-page #cases .case-card-text{flex-basis:86vw}
}
@media(prefers-reduced-motion:reduce){
  .media-marketing-page #cases .case-card-v10{transition:none}
  .media-marketing-page #cases .case-card-v10:hover{transform:none}
  .media-marketing-page #cases .case-track{scroll-behavior:auto}
}
