/* ==========================================================================
   sections/page.css — 고정 페이지(page.php) 전용

   is_page() 일 때만 enqueue 됩니다(inc/enqueue.php).

   ★ 선택자는 전부 page.php 가 붙이는 .c4-page 로 한정합니다.
     전역 선택자로 쓰면 어느 화면에 닿는지 추적이 안 됩니다.

   이 CSS 가 함께 걸리는 화면:
     · 일반 고정 페이지
     · 약관 2종 (이용약관 · 개인정보처리방침)  → .c4-page--terms
     · 문의 폼 페이지                          → 7단계는 전용 템플릿을 만들지 않고
                                                 page.php 를 그대로 쓰므로 정상입니다.
   ========================================================================== */

/* --------------------------------------------------------------------------
   세로 리듬

   · 상단 여백: 헤더 아래 → 제목. 전 화면 공통이라 --c4-pad-top 하나입니다.
   · 하단 여백: 본문 마지막 요소 → 푸터 배경이 시작되는 지점.
     화면마다 다르므로 고정 페이지 전용 토큰을 씁니다.
     ★ 푸터 안쪽 상단 패딩(PC 40)은 별개이며 여기에 합산되지 않습니다.
       2단계에서 푸터를 붙인 뒤 실제 간격이 확정값 표와 맞는지 한 번 확인하세요.
   · 고정 페이지는 목록이 아니라 상세와 같은 리듬을 씁니다
     (제목이 상세 글 제목 계열이라 리듬도 상세를 따릅니다).
   -------------------------------------------------------------------------- */

.c4-page {
  padding-top: var(--c4-pad-top);
  padding-bottom: var(--c4-pad-bottom-page);
}

/* 제목 → 본문 간격.

   ★ flex column 으로 두는 이유: 블록 컨테이너 안에 인라인 텍스트를 늘어놓으면
     줄 상자 높이를 부모 line-height 가 만든 strut 이 결정해서, 자식 줄간격이
     부모보다 작을 때 위아래로 여백이 더 붙습니다(40 이 43~44 로 실측됨).
     flex column 이면 각 요소가 자기 줄간격만 갖고 부모 strut 이 끼어들지 않습니다. */
.c4-page__body {
  display: flex;
  flex-direction: column;
  gap: var(--c4-page-title-gap);
}

/* --------------------------------------------------------------------------
   제목 — 두 갈래

   판정은 page.php 가 옵션의 약관 페이지 ID 와 현재 페이지 ID 를 비교해서 하고,
   약관일 때만 .c4-page--terms 를 붙입니다. 슬러그로 판정하지 않습니다.

   ★ 계열과 정렬이 함께 갈립니다. 정렬만 따로 판정하는 코드를 만들지 마세요.
   -------------------------------------------------------------------------- */

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

/* 약관 2종 — 상세 글 제목 계열 · 좌측 정렬 (시안 실측) */
.c4-page--terms .c4-page__title {
  font-size: var(--c4-type-single-title-size);
  font-weight: var(--c4-type-single-title-weight);
  line-height: var(--c4-type-single-title-lh);
  text-align: left;
}

/* --------------------------------------------------------------------------
   본문

   .c4-entry-content 의 아티클 본문 타이포(문단·h2·h3·h4·목록·표·인용·코드 …)는
   4단계(상세)에서 만들어집니다. 여기서 본문 스타일을 새로 만들지 마세요 —
   클래스만 붙어 있으면 그때 자동으로 적용됩니다.

   the_content() 를 그대로 출력하므로 숏코드가 실행됩니다(문의 폼 페이지가 이걸 씁니다).
   -------------------------------------------------------------------------- */

.c4-page__content {
  min-width: 0;   /* 긴 URL·코드블록이 본문 폭을 밀어내지 않게 */
}