/* ===========================================================
   block_stat_showcase — 통계 쇼케이스
   풀블리드 배경 이미지 + 세로 그라데이션(상단 투명→하단 어둠) 위 하단 중앙 카피 + 통계 카드 3열.
   토큰만 사용(base.css :root). 포인트색 --orange-700. hover 효과 없음.
   =========================================================== */

.block_stat_showcase {
  position: relative;
  isolation: isolate;
  background-color: var(--ink-900);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* 이미지가 보이도록 상단 여백 크게, 하단은 카드 호흡 */
  padding-block: clamp(300px, 40vw, 560px) clamp(48px, 6vw, 80px); /* 상단 사진 비율 ↑↑ */
  color: var(--white);
  overflow: hidden;
}

/* 세로 그라데이션 오버레이: 상단 투명(사진 노출) → 하단 어둠(카피/카드 대비) */
.block_stat_showcase::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    to bottom,
    var(--ink-900-08) 0%,
    var(--ink-900-25) 40%,
    var(--ink-900-72) 100%
  );
}

.block_stat_showcase__inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xl);
}

/* ==== 하단 중앙 카피 ==== */
.block_stat_showcase__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-sm);
  text-align: left;
}

.block_stat_showcase__eyebrow {
  font-size: var(--fs-caption-up);
  font-weight: 600;
  letter-spacing: var(--tracking-up);
  text-transform: uppercase;
  color: var(--orange-300);
}

.block_stat_showcase__title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--fs-display-md);
  line-height: var(--lh-display-md);
  letter-spacing: var(--tracking-display-md);
  color: var(--white);
  max-width: 22ch;
}
.block_stat_showcase__title em {
  font-style: italic;
  font-weight: 500;
  color: var(--orange-300);
}

/* ==== 통계 카드 3열 ==== */
.block_stat_showcase .stat-grid { grid-template-columns: repeat(3, 1fr); }

/* ==== 반응형 ==== */
@media (max-width: 860px) {
  .block_stat_showcase .stat-grid { grid-template-columns: 1fr; }
}