/* ==========================================================================
   bf.strip — 본문 띠배너

   전역 main.css '9. 띠배너' 에서 옮겨 왔다.
   ========================================================================== */

.strip-banner {
  position: relative;
  display: flex; align-items: center; gap: 18px;
  padding: 22px 30px;
  border-radius: var(--r-lg);
  background: linear-gradient(110deg, var(--sky-700), var(--sky-500) 55%, #5FC0E8);
  color: #fff;
  overflow: hidden;
  box-shadow: var(--sh-md);
  transition: transform .25s;
}
.strip-banner:hover { transform: translateY(-3px); }
.strip-bg { position: absolute; inset: 0; z-index: 0; display: block; }
.strip-bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.strip-banner::before {
  content: ''; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(100deg, rgba(18,76,124,.95) 0%, rgba(33,122,182,.9) 52%, rgba(62,168,214,.74) 100%);
}
.strip-banner::after {
  content: ''; position: absolute; right: -30px; top: -60px; z-index: 1;
  width: 220px; height: 220px; border-radius: 50%;
  background: rgba(255,255,255,.1);
}
.strip-label {
  position: relative; z-index: 2;
  flex: none;
  display: inline-flex; align-items: center;
  height: 26px; padding: 0 12px;
  border-radius: var(--r-full);
  background: rgba(255,255,255,.2);
  border: 1px solid rgba(255,255,255,.4);
  font-size: 10.5px; font-weight: 700; letter-spacing: 1.1px;
}
.strip-banner strong {
  position: relative; z-index: 2;
  flex: 1 1 auto;
  font-size: 19px; font-weight: 700; letter-spacing: -.5px;
}
.strip-banner em {
  position: relative; z-index: 2;
  flex: none;
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 14.5px; font-weight: 600;
}
.strip-banner em .ico { width: 15px; height: 15px; stroke-width: 2.4; transition: transform .2s; }
.strip-banner:hover em .ico { transform: translateX(4px); }


/* ---------------------------------------------------------- 반응형 */

@media (max-width: 900px) {
  .strip-banner { flex-wrap: wrap; gap: 8px; padding: 18px 20px; border-radius: var(--r-md); }
  .strip-banner strong { flex: 1 1 100%; font-size: 16px; }
  .strip-banner em { font-size: 13px; }
}
/* 숫자·영문 글꼴. 전역 base.css 가 한 줄에 몰아 지정하던 것을 이리로
   가져왔다 — 이 위젯을 떼어 내도 남은 곳이 영향받지 않게. */
.strip-label { font-family: var(--font-en); }