/* 보호자 안내서 (js/parent.js guide) — 넉넉한 여백 · 읽기 좋은 폭(1040px) · 섹션 번호 */
.v2.gd { max-width: 1040px; margin: 0 auto; padding: 4px 8px 64px; }
.gd .gd-back { margin: 0 0 18px -4px; }
.gd .gd-hero { display: grid; grid-template-columns: 1.25fr 1fr; align-items: center; gap: 32px; padding: 48px 52px; border-radius: 32px; background: linear-gradient(135deg, #edf2e6 0%, #f6f1e6 100%); border: 1px solid #e2e8d8; }
.gd .gd-hero h1 { font-size: clamp(32px, 4vw, 48px); line-height: 1.28; letter-spacing: -.055em; color: #2c4735; margin: 18px 0; }
.gd .gd-hero p { font-size: 16px; line-height: 1.9; color: #566b55; }
.gd .gd-keys { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.gd .gd-keys span { padding: 9px 14px; border-radius: 99px; background: rgba(255,255,255,.85); border: 1px solid #e1e7d8; font-size: 13.5px; font-weight: 800; color: #4b6347; }
.gd .gd-hero-art { position: relative; height: 260px; }
.gd .gd-ch { position: absolute; object-fit: contain; filter: drop-shadow(0 10px 18px rgba(60,80,55,.12)); }
.gd .gd-ch.c0 { width: 46%; left: 6%; bottom: 0; }
.gd .gd-ch.c1 { width: 38%; right: 4%; top: 0; }
.gd .gd-ch.c2 { width: 34%; right: 18%; bottom: 0; }
.gd .gd-toc { display: flex; flex-wrap: wrap; gap: 10px; margin: 40px 0 8px; padding: 0 2px; }
.gd .gd-toc a { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 10px 16px; border-radius: 14px; background: #fff; border: 1px solid var(--v2-line); color: var(--v2-ink); text-decoration: none; font-size: 14px; font-weight: 700; }
.gd .gd-toc a b { font: 700 12px system-ui; color: #8aa07a; }
.gd .gd-toc a:hover { border-color: #9eb08f; }
.gd .gd-sec { margin-top: 88px; scroll-margin-top: 24px; }
.gd .gd-head { display: flex; gap: 22px; align-items: flex-start; margin-bottom: 34px; }
.gd .gd-num { flex: 0 0 auto; font: 600 44px/1 var(--v2-font); letter-spacing: -.04em; color: #c3d0b8; padding-top: 2px; }
.gd .gd-head h2 { font-size: clamp(24px, 2.6vw, 31px); line-height: 1.45; letter-spacing: -.045em; margin-top: 4px; }
.gd .gd-head h2 em { font-style: normal; color: var(--v2-brand); background: linear-gradient(transparent 62%, #e3ead4 62%); }
.gd .gd-lead { font-size: 16px; line-height: 1.9; color: var(--v2-muted); margin-top: 12px; max-width: 720px; }
.gd .gd-sub { font-size: 18px; margin: 48px 0 18px; }
.gd .gd-sub small { font-size: 13px; color: var(--v2-muted); font-weight: 600; margin-left: 6px; }
.gd .gd-src { display: block; font-size: 12.5px; color: var(--v2-muted); margin-top: 18px; }
.gd .gd-note { display: flex; gap: 10px; align-items: flex-start; margin-top: 28px; padding: 16px 18px; border-radius: 14px; background: #f3f5ee; color: #61705a; font-size: 14px; line-height: 1.8; }
.gd .gd-note .icon { margin-top: 3px; flex: 0 0 auto; }

.gd .gd-parts { display: flex; align-items: center; gap: 14px; }
.gd .gd-parts > i { font-style: normal; font-size: 22px; color: #b6c3aa; }
.gd .gd-parts article { flex: 1; display: flex; flex-direction: column; gap: 6px; padding: 26px 22px; border-radius: 22px; background: #fff; border: 1px solid var(--v2-line); }
.gd .gd-parts article span { font-size: 30px; }
.gd .gd-parts article b { font-size: 18px; }
.gd .gd-parts article small { font-size: 14px; color: var(--v2-muted); line-height: 1.6; }
.gd .gd-parts article.on { background: #e6eddc; border: 2px solid var(--v2-brand); }

.gd .gd-says { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
.gd .gd-says figure { margin: 0; padding: 22px 20px; border-radius: 22px 22px 22px 6px; background: #fff; border: 1px solid var(--v2-line); display: flex; flex-direction: column; gap: 6px; }
.gd .gd-says figure > span { font-size: 28px; }
.gd .gd-says figcaption { font-size: 13px; font-weight: 800; color: var(--v2-muted); }
.gd .gd-says blockquote { margin: 4px 0 0; font-size: 15.5px; line-height: 1.75; font-weight: 700; color: #3d5839; }

.gd .gd-grid { display: grid; gap: 18px; }
.gd .gd-grid.two { grid-template-columns: repeat(2, minmax(0,1fr)); }
.gd .gd-grid.three { grid-template-columns: repeat(3, minmax(0,1fr)); }
.gd .gd-card { padding: 28px 26px; border-radius: 22px; background: #fff; border: 1px solid var(--v2-line); }
.gd .gd-card.small { padding: 24px 22px; }
.gd .gd-ic { display: block; font-size: 32px; line-height: 1; margin-bottom: 14px; }
.gd .gd-card h3 { font-size: 18px; }
.gd .gd-card p { font-size: 14.5px; line-height: 1.85; color: var(--v2-muted); margin-top: 8px; }
.gd .gd-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.gd .gd-tags span { padding: 5px 11px; border-radius: 99px; background: var(--v2-sage); color: var(--v2-sage-deep); font-size: 12.5px; font-weight: 800; }

.gd .gd-flips { display: grid; gap: 12px; margin-bottom: 30px; }
.gd .gd-flip { display: grid; grid-template-columns: 1fr auto 1.6fr; align-items: center; gap: 18px; padding: 18px 22px; border-radius: 18px; background: #fff; border: 1px solid var(--v2-line); }
.gd .gd-heard { font-size: 16px; font-weight: 800; color: #9a6a55; }
.gd .gd-arrow { color: #b6c3aa; font-size: 20px; }
.gd .gd-real { font-size: 15px; line-height: 1.7; color: #3d5839; font-weight: 700; }

.gd .gd-stats { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
.gd .gd-stats article { padding: 26px 22px; border-radius: 22px; background: #eef2e6; }
.gd .gd-stats strong { display: block; font: 700 30px/1.2 var(--v2-font); letter-spacing: -.04em; color: #365e4d; }
.gd .gd-stats p { font-size: 14px; line-height: 1.8; color: #566b55; margin-top: 10px; }
.gd .gd-stats small { display: block; margin-top: 12px; font-size: 12px; color: #7d8c76; }

.gd .gd-ladder { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 12px; align-items: end; }
.gd .gd-ladder li { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 20px 16px; border-radius: 20px; background: #fff; border: 1px solid var(--v2-line); }
.gd .gd-ladder li:nth-child(1) { min-height: 150px; }
.gd .gd-ladder li:nth-child(2) { min-height: 170px; }
.gd .gd-ladder li:nth-child(3) { min-height: 190px; }
.gd .gd-ladder li:nth-child(4) { min-height: 210px; }
.gd .gd-ladder li:nth-child(5) { min-height: 230px; }
.gd .gd-ladder li.now { background: #e6eddc; border: 2px solid var(--v2-brand); }
.gd .gd-lv-ic { font-size: 30px; line-height: 1; margin-bottom: 8px; }
.gd .gd-ladder b { font-size: 15.5px; }
.gd .gd-ladder em { font-style: normal; font-size: 13.5px; font-weight: 800; color: var(--v2-sage-deep); }
.gd .gd-ladder small { font-size: 12.5px; color: var(--v2-muted); }
.gd .gd-now { position: absolute; top: 12px; right: 12px; padding: 2px 8px; border-radius: 99px; background: var(--v2-brand); color: #fff; font-size: 11px; font-weight: 800; }
.gd .gd-goals { display: flex; flex-wrap: wrap; gap: 10px; }
.gd .gd-goals span { display: inline-flex; align-items: center; gap: 8px; padding: 12px 16px; border-radius: 14px; background: #fff; border: 1px solid var(--v2-line); font-size: 14.5px; font-weight: 700; }
.gd .gd-goals i { font-style: normal; font-size: 18px; }
.gd .gd-chain { display: flex; flex-wrap: wrap; gap: 10px; }
.gd .gd-chain span { flex: 1 1 160px; padding: 16px 18px; border-radius: 16px; background: var(--v2-sky); color: var(--v2-sky-ink); font-size: 14.5px; font-weight: 700; line-height: 1.6; }

.gd .gd-steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); }
.gd .gd-steps li { position: relative; padding: 30px 18px 0 0; border-top: 3px solid #d5dfcb; }
.gd .gd-steps li::before { content: ""; position: absolute; top: -9px; left: 0; width: 15px; height: 15px; border-radius: 50%; background: var(--v2-brand); border: 3px solid var(--v2-canvas); }
.gd .gd-steps b { display: block; font-size: 16px; margin-bottom: 6px; }
.gd .gd-steps span { font-size: 14.5px; line-height: 1.75; color: var(--v2-muted); }

.gd .gd-swaps { display: grid; gap: 14px; }
.gd .gd-swap { display: grid; grid-template-columns: 1fr 1.2fr; gap: 12px 18px; padding: 20px 22px; border-radius: 20px; background: #fff; border: 1px solid var(--v2-line); }
.gd .gd-swap small { grid-column: 1 / -1; font-size: 13px; color: var(--v2-muted); }
.gd .gd-no, .gd .gd-yes { display: flex; gap: 10px; align-items: flex-start; font-size: 15.5px; line-height: 1.7; }
.gd .gd-no { color: #9a6a55; }
.gd .gd-yes { color: #2f5a3c; font-weight: 800; }
.gd .gd-no i, .gd .gd-yes i { font-style: normal; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 8px; font-size: 13px; margin-top: 2px; }
.gd .gd-no i { background: #f6e3dd; color: #a0574b; }
.gd .gd-yes i { background: #dfead5; color: #365e4d; }
.gd .gd-next { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 48px; padding: 28px 30px; border-radius: 24px; background: #ece9ef; color: #5b4868; }
.gd .gd-next h3 { font-size: 18px; color: #4f3d5c; }
.gd .gd-next p { font-size: 14px; margin-top: 6px; }
.gd .gd-next .button { flex: 0 0 auto; }

.gd .gd-refs { margin-top: 88px; padding: 0 22px; border-radius: 18px; background: #fff; border: 1px solid var(--v2-line); }
.gd .gd-refs summary { min-height: 60px; display: flex; align-items: center; gap: 8px; cursor: pointer; font-weight: 800; }
.gd .gd-refs ul { margin: 0; padding: 0 0 0 18px; font-size: 13px; line-height: 1.9; color: var(--v2-muted); }
.gd .gd-refs p { font-size: 13px; color: var(--v2-muted); padding: 14px 0 22px; }

@media (max-width: 1000px) {
  .gd .gd-says, .gd .gd-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .gd .gd-grid.three { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .gd .gd-ladder { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .gd .gd-ladder li:nth-child(n) { min-height: 0; }
}
@media (max-width: 680px) {
  .v2.gd { padding: 0 2px 40px; }
  .gd .gd-hero { grid-template-columns: 1fr; padding: 30px 24px; gap: 8px; border-radius: 26px; }
  .gd .gd-hero-art { height: 160px; order: -1; }
  .gd .gd-hero p br { display: none; }
  .gd .gd-toc { margin-top: 28px; gap: 8px; }
  .gd .gd-toc a { padding: 8px 12px; font-size: 13px; min-height: 44px; }
  .gd .gd-sec { margin-top: 60px; }
  .gd .gd-head { gap: 14px; margin-bottom: 24px; }
  .gd .gd-num { font-size: 32px; }
  .gd .gd-lead { font-size: 15px; }
  .gd .gd-sub { margin: 36px 0 14px; font-size: 17px; }
  .gd .gd-parts { flex-direction: column; align-items: stretch; gap: 8px; }
  .gd .gd-parts > i { text-align: center; }
  .gd .gd-says, .gd .gd-stats, .gd .gd-grid.two, .gd .gd-grid.three { grid-template-columns: 1fr; gap: 12px; }
  .gd .gd-card, .gd .gd-card.small { padding: 22px 20px; }
  .gd .gd-flip { grid-template-columns: 1fr; gap: 6px; padding: 16px 18px; }
  .gd .gd-arrow { transform: rotate(90deg); justify-self: start; }
  .gd .gd-ladder { grid-template-columns: 1fr 1fr; }
  .gd .gd-steps { grid-template-columns: 1fr; padding-left: 10px; }
  .gd .gd-steps li { border-top: 0; border-left: 3px solid #d5dfcb; padding: 0 0 24px 22px; }
  .gd .gd-steps li::before { left: -9px; top: 2px; }
  .gd .gd-swap { grid-template-columns: 1fr; padding: 18px; }
  .gd .gd-next { flex-direction: column; align-items: flex-start; padding: 24px; }
  .gd .gd-refs { margin-top: 60px; }
}