/* 강조 띠(n1) - 사진 위 글은 짙은 층의 반대쪽 토큰(--nx-on-deep). 색은 전부 토큰 · 테마마다 따라간다 */
.nxbn {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: 220px;
  padding: 3rem 1rem;
}
@media (min-width: 768px) {
  .nxbn { min-height: 300px; padding: 4rem 1.5rem; }
}
@media (min-width: 1024px) {
  .nxbn { padding-inline: 2rem; }
}
.nxbn--photo { color: var(--nx-on-deep); }
.nxbn--plain { background-color: var(--muted, var(--background)); color: var(--foreground); }
/* 사진 띠는 가운데를 조금 더 가라앉힌다(글 뒤) - 공용 배경의 두 겹 위에 한 겹 */
.nxbn--photo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(90deg, color-mix(in srgb, var(--nx-deep) 58%, transparent) 0%, color-mix(in srgb, var(--nx-deep) 28%, transparent) 60%, transparent 100%);
}
.nxbn--photo.nxbn--center::before {
  background: radial-gradient(70% 90% at 50% 50%, color-mix(in srgb, var(--nx-deep) 52%, transparent), transparent 100%);
}
.nxbn__sweep { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.nxbn__wrap { position: relative; z-index: 1; width: 100%; max-width: 1280px; margin-inline: auto; }
.nxbn__in { max-width: min(100%, 46rem); }
.nxbn--center .nxbn__in { margin-inline: auto; text-align: center; }
.nxbn__label {
  margin: 0 0 0.85rem;
  font-family: var(--font-sdv-mono), "Pretendard Variable", "Pretendard", sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: color-mix(in srgb, currentColor 86%, transparent);
}
.nxbn__title {
  margin: 0;
  font-family: var(--font-heading, "Pretendard Variable", sans-serif);
  font-weight: var(--heading-weight, 700);
  line-height: 1.14;
  word-break: keep-all;
  text-wrap: balance;
}
.nxbn--photo .nxbn__title { text-shadow: 0 2px 24px color-mix(in srgb, var(--nx-deep) 55%, transparent); }
.nxbn[data-size="xl"] .nxbn__title { font-size: clamp(2rem, 6vw, 3.75rem); }
.nxbn[data-size="lg"] .nxbn__title { font-size: clamp(1.9rem, 5vw, 3.1rem); }
.nxbn[data-size="md"] .nxbn__title { font-size: clamp(1.6rem, 4.2vw, 2.5rem); }
.nxbn[data-size="sm"] .nxbn__title { font-size: clamp(1.45rem, 3.4vw, 2.1rem); }
/* 제목 밑 빛나는 선 - 등장 때 왼쪽(가운데 정렬이면 가운데)에서 그어진다 */
.nxbn__rule {
  display: block;
  width: 4.5rem;
  height: 2px;
  margin-top: 1.1rem;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 10%, transparent));
  box-shadow: 0 0 14px color-mix(in srgb, var(--accent) 60%, transparent);
  transform-origin: left center;
}
.nxbn--photo .nxbn__rule {
  background: linear-gradient(90deg, var(--nx-on-deep), color-mix(in srgb, var(--nx-on-deep) 8%, transparent));
  box-shadow: 0 0 14px color-mix(in srgb, var(--nx-on-deep) 45%, transparent);
}
.nxbn--center .nxbn__rule { margin-inline: auto; transform-origin: center; }
html.nx-js .nxbn .nxfx-rv:not(.nxfx-in) .nxbn__rule { transform: scaleX(0); }
.nxbn .nxfx-rv.nxfx-in .nxbn__rule { transform: scaleX(1); transition: transform 0.9s cubic-bezier(0.22, 0.61, 0.36, 1) var(--nxfx-d, 0ms); }
.nxbn__body {
  margin: 1rem 0 0;
  max-width: 48ch;
  font-size: 15px;
  line-height: 1.85;
  white-space: pre-line;
  color: color-mix(in srgb, currentColor 84%, transparent);
}
.nxbn--center .nxbn__body { margin-inline: auto; }
@media (min-width: 768px) {
  .nxbn__body { font-size: 16px; }
}