/* GhostRoom legal pages (Impressum / Datenschutz) — quiet, readable type on the
   same dark canvas as the landing page. Reuses tokens from /_ds/styles.css. */

.gr-legal-root {
  justify-content: flex-start;
  padding-top: clamp(40px, 9vh, 80px);
}
.gr-legal {
  width: 100%;
  max-width: 640px;
  font-family: var(--body);
  color: var(--ink-soft);
  line-height: 1.7;
}
.gr-legal-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 28px;
}
.gr-legal-back,
.gr-legal-lang {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .08em;
  color: var(--ink-faint);
  text-decoration: none;
}
.gr-legal-lang { text-decoration: underline; text-underline-offset: 2px; }
.gr-legal-back:hover,
.gr-legal-lang:hover { color: var(--ink); }

.gr-legal-h1 {
  font-family: var(--display); font-style: italic; font-weight: 500;
  font-size: clamp(28px, 7vw, 36px); line-height: 1.1; color: #fff;
  margin: 0 0 28px;
}
.gr-legal-h2 {
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint);
  margin: 0 0 8px;
}
.gr-legal-sec { margin: 0 0 26px; }
.gr-legal p { margin: 0; font-size: 14.5px; }
.gr-legal a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.gr-legal-foot {
  margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--line);
  font-family: var(--mono); font-size: 12px;
}