<!-- 섹션 헤더 바: 파란 배경 + 흰 텍스트 제목 -->
<!--
  📋 section-header-bar
  ─────────────────
  용도: 섹션 시작부 강조 헤더. 전체 너비 파란 바 + 흰 대제목.
  슬롯: title (필수), subtitle (선택)
  Figma 원본: 2-2_01 "Eng. S/W의 구성", "Eng. S/W의 특성"
-->
<div class="block-section-bar">
  <div class="sb-title">{{ title }}</div>
  {% if subtitle %}<div class="sb-sub">{{ subtitle }}</div>{% endif %}
</div>

<style>
.block-section-bar {
  background: linear-gradient(135deg, #0d47a1 0%, #1565c0 100%);
  border-radius: 6px;
  padding: 14px 24px;
  text-align: center;
}
.sb-title {
  font-size: 18px;
  font-weight: 800;
  color: #ffffff;
  line-height: 1.4;
}
.sb-sub {
  font-size: 12px;
  color: rgba(255,255,255,0.8);
  margin-top: 4px;
}
</style>
