/* ==========================================================================
   MODULE: components/section-head
   섹션 상단 헤드(eyebrow/pill + h2 + 리드 문단) 공통 여백.
   원래 pages/hero.css에 있었는데, 그 파일은 히어로(front-page.php)에서만 로드돼
   서비스안내/자료실 등 다른 페이지에서는 이 여백이 통째로 빠져 있었다(제목-본문이
   줄바꿈 없이 붙어 보이는 문제의 원인) — 거의 모든 페이지 탭에서 쓰이는 만큼
   상시 로드되는 컴포넌트로 옮겼다.

   여백 기준: 눈썹(pill) → 제목 32px, 제목 → 리드 문단 24px, 헤드 전체 → 본문 64px.
   눈썹 바로 아래 제목이 8px로 붙어 있어 답답해 보인다는 지적이 있어 넉넉하게 다시 잡았다.
   ========================================================================== */

.wzs-section-head {
	max-width: 640px;
	margin: 0 auto var(--wzs-space-7);
	text-align: center;
}

.wzs-section-head h2 {
	margin-top: var(--wzs-space-5);
}

/* 눈썹이 없는 섹션에서는 위 여백이 붕 뜨므로 제목이 맨 위일 때만 0으로 되돌린다 */
.wzs-section-head h2:first-child {
	margin-top: 0;
}

.wzs-section-head p {
	margin-top: var(--wzs-space-4);
	color: var(--wzs-ink-soft);
	line-height: var(--wzs-lh-article);
}