/* ════════════════════════════════════════════════
   Dumply — Legal docs (privacy / terms)
   문서(법적 고지) 전용 프로즈 레이아웃 — styles.css 토큰 재사용
   ════════════════════════════════════════════════ */

.doc {
  max-width: 760px;
  margin: 0 auto;
  padding: 120px clamp(20px, 5vw, 40px) 80px;
}

.doc__lang {
  display: inline-flex; gap: 4px; margin-bottom: 28px;
  padding: 4px; border-radius: var(--radius-pill);
  background: var(--bg-deep); border: 1px solid var(--border);
}
.doc__lang button {
  font-family: var(--sans); font-size: 13px; font-weight: 600;
  padding: 7px 16px; border-radius: var(--radius-pill);
  border: none; background: transparent; color: var(--text-2);
  cursor: pointer; transition: background .2s, color .2s;
}
.doc__lang button[aria-pressed="true"] {
  background: var(--accent); color: var(--accent-text); box-shadow: var(--shadow-sm);
}

.doc h1 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(28px, 5vw, 40px); letter-spacing: -.01em;
  color: var(--text); margin-bottom: 8px;
}
.doc .doc__meta { font-size: 13.5px; color: var(--text-3); margin-bottom: 40px; }
.doc h2 {
  font-family: var(--serif); font-weight: 500; font-size: 21px;
  color: var(--text); margin: 40px 0 12px;
}
.doc h3 { font-size: 15.5px; font-weight: 700; color: var(--text); margin: 22px 0 8px; }
.doc p, .doc li {
  font-size: 15px; line-height: 1.7; color: var(--text-body);
}
.doc p { margin-bottom: 14px; }
.doc ul { margin: 0 0 16px; padding-left: 22px; }
.doc ul ul { margin: 8px 0 4px; }
.doc li { margin-bottom: 8px; }
.doc strong { color: var(--text); font-weight: 700; }
.doc code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .9em; padding: 1px 5px; border-radius: 5px;
  background: var(--accent-soft); color: var(--text);
}
.doc a.inline { color: var(--feel); text-decoration: underline; text-underline-offset: 2px; }
.doc__lead {
  font-size: 16px; color: var(--text-body);
  padding: 18px 20px; background: var(--surface);
  border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); margin-bottom: 8px;
}
.doc__back {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 48px; font-size: 14px; font-weight: 600; color: var(--text-body);
}
.doc__back:hover { color: var(--text); }

[hidden] { display: none !important; }