/* Personvern og hjelp: samme tokens som plagesidene, men en rolig leseside med innholdsliste i marg. */
.legal-hero { padding-block: clamp(40px, 7vw, 88px) clamp(28px, 4vw, 48px); }
.legal-hero .wrap { display: grid; gap: 18px; }
.legal-hero h1 { font-size: clamp(42px, 6.4vw, 80px); font-weight: 900; max-width: 12em; }
.legal-hero .updated { font-size: 14px; color: var(--ink-soft); font-variant-numeric: tabular-nums; }

.doc { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: clamp(28px, 6vw, 88px); padding-block: clamp(56px, 8vw, 110px); align-items: start; }
.toc { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 80px); display: grid; gap: 12px; }
.toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; counter-reset: toc; }
.toc li { counter-increment: toc; }
.toc a { display: flex; gap: 10px; text-decoration: none; color: var(--ink-soft); font-size: 14px; line-height: 1.35; padding: 4px 0; }
.toc a::before { content: counter(toc); min-width: 1.4em; font: 800 13px/1.35 var(--display); color: var(--multe-deep); font-variant-numeric: tabular-nums; }
.toc a:hover, .toc a.on { color: var(--ink); }

.prose { max-width: 42em; display: grid; gap: 16px; }
.prose h2 { font-size: clamp(26px, 2.6vw, 34px); margin-top: 28px; scroll-margin-top: 90px; }
.prose h2:first-child { margin-top: 0; }
.prose p, .prose li { color: var(--ink-soft); text-wrap: pretty; }
.prose b { color: var(--ink); font-weight: 700; }
.prose ul { margin: 0; padding-left: 1.2em; display: grid; gap: 8px; }
.prose li::marker { color: var(--multe); }
.prose a { color: var(--ink); text-decoration-color: var(--multe); text-underline-offset: 3px; }
.prose .en { display: grid; gap: 12px; padding: 22px 24px; border-radius: 22px; background: var(--raised); }
.prose .en p { font-size: 15px; }

dl.card { display: grid; grid-template-columns: max-content 1fr; gap: 10px 24px; margin: 4px 0 0; padding: 22px 24px; border-radius: 22px; background: var(--card); }
dl.card dt { font: 800 14px/1.5 var(--display); color: var(--ink); }
dl.card dd { margin: 0; color: var(--ink-soft); font-variant-numeric: tabular-nums; }

.copy { cursor: copy; border-bottom: 1.5px dashed var(--multe); user-select: all; }
.copy.done::after { content: " · kopiert"; color: var(--multe-deep); font-size: .8em; border: 0; }

.contact { display: flex; flex-wrap: wrap; gap: 20px 32px; align-items: center; justify-content: space-between; background: var(--card); border-radius: 32px; padding: clamp(24px, 4vw, 48px); }
.contact > div { display: grid; gap: 10px; min-width: 0; }
.contact .mail { font: 900 clamp(30px, 4.6vw, 54px)/1.05 var(--display); letter-spacing: -.02em; overflow-wrap: anywhere; }
.contact .muted { color: var(--ink-soft); max-width: 34em; }
.faq a { color: var(--ink); text-decoration-color: var(--multe); text-underline-offset: 3px; }

@media (max-width: 860px) {
  .doc { grid-template-columns: 1fr; }
  .toc { position: static; padding: 20px 22px; border-radius: 22px; background: var(--card); }
}
