/* ==========================================================================
   문서 지면 — Books 하위 4쪽, Resources 자료 2쪽 (GB-39)
   정본: 모바일 K01 216:965, K02 216:1042. 데스크톱은 Articles 머리(list.css)와 기사 본문 폭을 따른다.
   ========================================================================== */

.gb-doc {
  --gb-doc-pad: 80px;
  /* 본문 폭 = 글 화면 본문 열 폭(1440 912 — Astra 컨테이너 1000 - 좌우 여백). 고객 10-07 "다른 페이지와 동일하게" */
  --gb-doc-body: 912px;
  --gb-label-ls: 0.12em;
  background: var(--gb-white);
}

.gb-doc__inner {
  max-inline-size: calc(var(--gb-page-max) + 2 * var(--gb-doc-pad));
  margin-inline: auto;
  padding-inline: var(--gb-doc-pad);
}

.gb-doc__eyebrow,
.gb-doc__label,
.gb-sample-note__label {
  margin: 0;
  font-family: var(--gb-font-family-ui);
  font-size: 11px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: var(--gb-label-ls);
  text-transform: uppercase;
}

/* ── 남색 머리 ───────────────────────────────────────── */
.gb-doc__head { background: var(--gb-navy); color: var(--gb-paper); }
.gb-doc__head .gb-doc__inner {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-block: 48px 64px;
}
.gb-doc__eyebrow { color: var(--gb-gold); }
.gb-doc__title {
  margin: 0;
  font-family: var(--gb-font-display-family);
  font-size: 56px;
  font-weight: 400;
  line-height: 1.04;
  color: var(--gb-paper);
}
.gb-doc__standfirst {
  max-inline-size: var(--gb-doc-body); /* 680 에서 본문 폭으로 — 자료 2쪽 설명문이 PC 에서 두 줄로 꺾였다 (고객 10-07 요청 2-3) */
  margin: 0;
  font-family: var(--gb-font-serif);
  font-size: 20px;
  line-height: 1.5;
  color: var(--gb-paper);
}

/* ── 본문 ────────────────────────────────────────────── */
.gb-doc__body { padding: 56px var(--gb-gutter) 88px; }
.gb-doc__prose > figure { margin-inline: 0; }
.gb-doc__prose .wp-block-image img { display: block; inline-size: 100%; block-size: auto; border: 1px solid var(--gb-gray-200); }
.gb-doc__prose .wp-block-image figcaption { margin-block-start: 8px; text-align: start; }

/* 더미 안내 상자 (본문 블록 group.gb-sample-note — 원고가 오면 블록째 지운다) */
.gb-doc__prose > .gb-sample-note {
  padding: 12px 14px;
  border: 1px solid var(--gb-gold);
  background: var(--gb-white);
}
.gb-sample-note > * + * { margin-block-start: 4px; }
.gb-sample-note__label { color: var(--gb-navy); }
.gb-sample-note p:not(.gb-sample-note__label) {
  margin: 0;
  font-family: var(--gb-font-family-ui);
  font-size: 13px;
  line-height: 1.5;
  color: var(--gb-gray-600);
}

.gb-doc__back { margin: 0; }
.gb-doc__body > .gb-doc__back { margin-block-start: 40px; } /* 폭과 왼쪽선은 아래 문서 6쪽 규칙 */
.gb-doc__back a {
  font-family: var(--gb-font-family-ui);
  font-size: 14px;
  font-weight: 500;
  color: var(--gb-navy);
  text-decoration: none;
}
.gb-doc__back a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* 문서 6쪽 모두: 본문, 4쪽 목록, 돌아가기를 머리 경로 라벨 왼쪽선에 맞추고 글 본문과 같은 폭으로 (고객 10-07 요청 2-1.
   10-06 시안 L2 A안은 책 4쪽만, 읽기 폭 670 이었다). 라벨 왼쪽선 = max(0, (화면폭 - page-max)/2 - doc-pad) + doc-pad (.gb-doc__inner 공식) */
.gb-doc .gb-doc__body { padding-inline: 0; }
.gb-doc .gb-doc__prose,
.gb-doc .gb-doc__body > .gb-doc__back,
.gb-doc--book .gb-doc__inside .gb-doc__inner {
  max-width: none; /* base.css .gb-prose 읽기 폭(670) 상한을 푼다 */
  max-inline-size: var(--gb-doc-body);
  margin-inline: calc(max(0px, (100% - var(--gb-page-max)) / 2 - var(--gb-doc-pad)) + var(--gb-doc-pad)) var(--gb-doc-pad);
}
.gb-doc--book .gb-doc__inside .gb-doc__inner { padding-inline: 0; }

/* ── Inside the book (책 하위 4쪽 목록) ──────────────── */
.gb-doc__inside { background: var(--gb-paper); }
.gb-doc__inside .gb-doc__inner {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-inline-size: calc(min(var(--gb-content-max), var(--gb-measure)) + 2 * var(--gb-gutter));
  padding: 56px var(--gb-gutter) 64px;
}
.gb-doc__label { color: var(--gb-navy); }
.gb-doc__pages { margin: 0; padding: 0; list-style: none; }
.gb-doc__page {
  display: flex;
  align-items: center;
  gap: 16px;
  padding-block: 14px;
  border-block-end: 1px solid var(--gb-gray-200);
  color: var(--gb-ink);
  text-decoration: none;
}
.gb-doc__num { font-family: var(--gb-font-display-family); font-size: 24px; line-height: 1; color: var(--gb-gold); }
.gb-doc__name { flex: 1; font-family: var(--gb-font-serif); font-size: 19px; font-weight: 600; line-height: 1.3; }
.gb-doc__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--gb-font-family-ui);
  font-size: 13px;
  font-weight: 500;
  color: var(--gb-navy);
}
.gb-doc__page.is-current .gb-doc__name,
.gb-doc__page.is-current .gb-doc__more { color: var(--gb-gray-600); }
a.gb-doc__page:hover .gb-doc__name { text-decoration: underline; text-underline-offset: 3px; }
a.gb-doc__page:focus-visible { outline: 2px solid var(--gb-navy); outline-offset: 2px; }
.gb-doc__inside .gb-doc__back { margin-block-start: 8px; }

/* ── 1023px 이하 (K01·K02 390) ───────────────────────── */
@media (max-width: 1023px) {
  .gb-doc { --gb-doc-pad: 20px; }
  .gb-doc__head .gb-doc__inner { gap: 14px; padding-block: 32px; }
  .gb-doc__title { font-size: 40px; }
  .gb-doc__standfirst { font-size: 17px; }
  .gb-doc__body { padding: 32px 20px 48px; }
  .gb-doc__inside .gb-doc__inner { padding: 40px 20px 48px; }
}
