/*
 * MediRoyal Blog — Bento stats wall.
 * Scoped under body.log-blog-page.
 */

.log-blog-page .bl2-stats-wall {
  padding: 0 88px 72px;
}

.log-blog-page .bl2-sw-inner {
  max-width: 1220px;
  margin: 0 auto;
}

.log-blog-page .bl2-sw-heading {
  margin-bottom: 32px;
}

.log-blog-page .bl2-sw-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.log-blog-page .bl2-sw-card {
  border-radius: var(--r-lg);
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
  transition: all 0.28s var(--ease);
}

.log-blog-page .bl2-sw-card:hover {
  transform: translateY(-4px);
}

.log-blog-page .bl2-sw-card.bl2-c-plum {
  background: linear-gradient(135deg, var(--plum-800), var(--plum-700));
}

.log-blog-page .bl2-sw-card.bl2-c-plum:hover {
  box-shadow: 0 16px 40px rgba(122, 31, 110, 0.3);
}

.log-blog-page .bl2-sw-card.bl2-c-sage {
  background: linear-gradient(135deg, var(--sage-600), var(--sage-500));
}

.log-blog-page .bl2-sw-card.bl2-c-sage:hover {
  box-shadow: 0 16px 40px rgba(29, 219, 149, 0.25);
}

.log-blog-page .bl2-sw-card.bl2-c-dark {
  background: linear-gradient(135deg, var(--plum-950), var(--plum-900));
}

.log-blog-page .bl2-sw-card.bl2-c-dark:hover {
  box-shadow: 0 16px 40px rgba(45, 10, 53, 0.45);
}

.log-blog-page .bl2-sw-card.bl2-c-white {
  background: var(--white);
  border: 1.5px solid var(--line);
}

.log-blog-page .bl2-sw-card.bl2-c-white:hover {
  box-shadow: var(--shadow-md);
  border-color: var(--sage-500);
}

.log-blog-page .bl2-sw-ico {
  font-size: 32px;
  margin-bottom: 12px;
}

.log-blog-page .bl2-sw-num {
  font-family: var(--display);
  font-size: clamp(32px, 3vw, 46px);
  font-weight: 700;
  line-height: 1;
  margin-bottom: 5px;
}

.log-blog-page .bl2-sw-lbl {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}

.log-blog-page .bl2-c-plum .bl2-sw-num,
.log-blog-page .bl2-c-dark .bl2-sw-num {
  color: var(--sage-400);
}

.log-blog-page .bl2-c-plum .bl2-sw-lbl,
.log-blog-page .bl2-c-dark .bl2-sw-lbl {
  color: rgba(255, 255, 255, 0.58);
}

.log-blog-page .bl2-c-sage .bl2-sw-num,
.log-blog-page .bl2-c-sage .bl2-sw-lbl {
  color: var(--plum-950);
}

.log-blog-page .bl2-c-white .bl2-sw-num {
  color: var(--plum-700);
}

.log-blog-page .bl2-c-white .bl2-sw-lbl {
  color: var(--gray-600);
}