/* =========================================================================
   Runeflake — legal pages
   Long-form reading layer on top of styles.css. Loaded only by
   /privacy/, /cookies/ and /terms/.
   ========================================================================= */

.legal { max-width: 760px; margin-inline: auto; }

.legal__meta {
  margin-top: 14px;
  font-size: .82rem; color: var(--ink-soft);
}

/* the in-page contents list */
.legal__toc {
  margin-top: clamp(28px, 3.4vw, 40px);
  padding: clamp(20px, 2.4vw, 28px);
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: var(--surface);
}
.legal__toc h2 {
  font-size: .72rem; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 14px;
}
.legal__toc ol {
  display: grid; gap: 9px;
  counter-reset: toc;
}
.legal__toc li { counter-increment: toc; }
.legal__toc a {
  display: inline-block;
  font-size: .93rem; color: var(--ink-soft);
  padding-block: 3px;
}
.legal__toc a::before {
  content: counter(toc) ". ";
  color: var(--ink-faint);
}
.legal__toc a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }

/* body copy */
.legal__body { margin-top: clamp(30px, 3.8vw, 46px); }

.legal__body section + section { margin-top: clamp(30px, 3.6vw, 44px); }

.legal__body h2 {
  font-size: clamp(1.15rem, 1.7vw, 1.45rem);
  font-weight: 500; letter-spacing: -.02em;
  line-height: 1.25;
  margin-bottom: 12px;
}
.legal__body h3 {
  font-size: clamp(1rem, 1.25vw, 1.08rem);
  font-weight: 500; letter-spacing: -.01em;
  margin-top: 22px; margin-bottom: 8px;
}
.legal__body p,
.legal__body li {
  font-size: 1rem; line-height: 1.72; color: #3b3742;
}
.legal__body p + p { margin-top: 14px; }

.legal__body ul, .legal__body ol {
  margin-top: 12px;
  display: grid; gap: 9px;
  padding-left: 22px;
}
.legal__body ul { list-style: disc; }
.legal__body ol { list-style: decimal; }
.legal__body li::marker { color: var(--ink-faint); }

.legal__body a:not(.btn) {
  color: var(--violet-deep);
  text-decoration: underline; text-underline-offset: 3px;
}
.legal__body a:not(.btn):hover { color: var(--ink); }

.legal__body strong { font-weight: 600; color: var(--ink); }

/* a definition-style table for the "what we store" rows */
.legal__table {
  margin-top: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  overflow: hidden;
  background: var(--surface);
}
.legal__row {
  display: grid;
  grid-template-columns: minmax(0, 200px) minmax(0, 1fr);
  gap: clamp(10px, 1.6vw, 22px);
  padding: clamp(14px, 1.6vw, 18px) clamp(14px, 1.8vw, 22px);
}
.legal__row + .legal__row { border-top: 1px solid var(--line); }
.legal__row dt { font-weight: 500; color: var(--ink); font-size: .95rem; }
.legal__row dd { margin: 0; font-size: .95rem; line-height: 1.65; color: #3b3742; }

/* a callout for the one thing on the page a reader must not miss */
.legal__note {
  margin-top: 18px;
  padding: clamp(16px, 1.8vw, 22px);
  border-radius: var(--radius-card);
  border: 1px solid rgba(124, 108, 246, .28);
  background: rgba(124, 108, 246, .07);
}
.legal__note p { color: #322e3d; }

/* cross-links to the sibling policies */
.legal__also {
  margin-top: clamp(34px, 4vw, 52px);
  padding-top: clamp(22px, 2.6vw, 30px);
  border-top: 1px solid var(--line);
}
.legal__also h2 {
  font-size: .72rem; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 14px;
}
.legal__also ul { display: flex; flex-wrap: wrap; gap: 10px; }
.legal__also a {
  display: inline-block;
  padding: 9px 16px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface);
  font-size: .88rem; color: var(--ink-soft);
}
.legal__also a:hover { color: var(--ink); border-color: rgba(20, 18, 24, .22); }
.legal__also a[aria-current] { background: var(--ink); color: #fff; border-color: transparent; }

@media (max-width: 560px) {
  .legal__row { grid-template-columns: 1fr; gap: 4px; }
}