/* ==========================================================================
   sections/page.css — 고정 페이지(page.php)
   --------------------------------------------------------------------------
   본문 720 단독 컬럼. 사이드 박스 · 하단 검색 폼 없음.
   약관 2종도 이 템플릿을 쓴다 — 제목 계열과 정렬만 달라진다.

   ★★ 선택자를 반드시 `.c4-page` 안으로 한정한다.
      이 파일은 is_page() 조건으로 로드되므로 **7단계의 문의 폼 페이지에도 함께 로드**된다.
      선택자가 넓으면 폼 페이지의 세로 리듬이 이중으로 걸려 시안과 어긋나는데,
      CSS 에러는 나지 않고 7단계에 가서야 드러난다.
      (문의 폼은 자기 래퍼 클래스를 쓰고 .c4-page 를 붙이지 않는다.)

   ★ 아티클 본문(.c4-entry-content) 타이포는 4단계에서 만든다. 여기서 만들지 말 것.
   ========================================================================== */

/* 세로 리듬 — DESIGN-TOKENS.md §3-4 '페이지 세로 여백' 표.
   고정 페이지는 목록이 아니라 **상세와 같은 줄**을 쓴다(상단 80/60, 하단 60/60). */
.c4-page {
	padding-top: var(--c4-page-pt);
	/* 본문 끝에서 푸터 배경이 시작되는 지점까지의 거리.
	   푸터 안쪽 상단 패딩은 별개이며 여기에 합산되지 않는다. */
	padding-bottom: var(--c4-page-pb-page);
}

.c4-page .c4-page__header {
	margin-bottom: var(--c4-page-title-gap);
}

/* 일반 고정 페이지 — 페이지 제목 계열 + 가운데 정렬 */
.c4-page .c4-page__title {
	margin: 0;
	font-size: var(--c4-fs-page-title);
	font-weight: var(--c4-fw-bold);
	line-height: var(--c4-lh-page-title);
	color: var(--c4-color-text);
	text-align: center;
}

/* 약관 2종 — 상세 글 제목 계열 + 좌측 정렬(시안 실측).
   계열과 정렬은 **같은 조건 하나**로 갈린다. page.php 가 이 클래스를 함께 붙인다.
   판정은 옵션의 약관 페이지 ID ↔ 현재 페이지 ID 비교(슬러그 판정 금지). */
.c4-page .c4-page__title--terms {
	font-size: var(--c4-fs-single-title);
	line-height: var(--c4-lh-single-title);
	text-align: left;
}

@media (max-width: 767.98px) {
	/* 하단(--c4-page-pb-page)은 PC·모바일이 같아 다시 선언하지 않는다. */
	.c4-page { padding-top: var(--c4-page-pt-m); }

	.c4-page .c4-page__header { margin-bottom: var(--c4-page-title-gap-m); }

	.c4-page .c4-page__title { font-size: var(--c4-fs-page-title-m); }

	.c4-page .c4-page__title--terms { font-size: var(--c4-fs-single-title-m); }
}