/* Terms and privacy. Same tokens and type as the landing page (css/tokens.css). */

:root { box-sizing: border-box; padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }
* { box-sizing: border-box; }
body { font-size: 16px; line-height: 1.25; }
a { color: var(--accent); text-underline-offset: 3px; }
a:hover { color: var(--ink); }
a:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-sm); }
.wrap { width: 100%; max-width: 760px; margin: 0 auto; padding: 0 var(--space-m); }
header { border-bottom: 1px solid var(--line); }
.bar { display: flex; align-items: baseline; gap: 20px; padding: 20px var(--space-m); font-size: 14px; color: var(--ink-muted); }
.bar b { color: var(--ink); font-size: 18px; font-weight: 600; }
.bar a { margin-left: auto; color: var(--ink); text-decoration: none; }
h1 { margin: var(--space-xl) 0 var(--space-s); font-family: var(--font-display); font-size: clamp(32px, 6vw, 48px); font-weight: 500; letter-spacing: -0.01em; line-height: 1.05; text-wrap: balance; }
.sub { margin: 0; font-size: 12px; color: var(--ink-muted); }
h2 { margin: var(--space-xl) 0 var(--space-s); font-size: 20px; font-weight: 600; line-height: 1.1; text-wrap: balance; }
h2 span { font-family: var(--font-mono); font-size: 12px; font-weight: 400; letter-spacing: 0; color: var(--ink-muted); margin-right: 10px; }
p { margin: 0 0 14px; line-height: 1.625; color: var(--ink-muted); }
ul, ol { margin: 0 0 14px; padding-left: 20px; line-height: 1.625; color: var(--ink-muted); }
li { margin: 0 0 7px; }

/* The privacy notice's purpose / personal data / legal basis table. On a phone each row
   stacks into a block, with its column names from data-label. */
table { width: 100%; margin: var(--space-m) 0 20px; border-collapse: collapse; border-bottom: 1px solid var(--line); line-height: 1.4; color: var(--ink-muted); }
th, td { padding: 12px 16px 12px 0; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
th:last-child, td:last-child { padding-right: 0; }
thead th { padding-top: 0; border-top: 0; font-family: var(--font-mono); font-size: 12px; font-weight: 400; letter-spacing: 0; }
thead th:first-child { width: 27%; }
thead th:last-child { width: 30%; }
tbody th { font-weight: 600; color: var(--ink); }
td ul { margin: 0; }
td ul ul { margin-top: 7px; }
td li:last-child { margin-bottom: 0; }
.art { white-space: nowrap; }
@media (max-width: 600px) {
  table, tbody, tr, th, td { display: block; }
  thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  tr { padding: 14px 0; border-top: 1px solid var(--line); }
  th, td { padding: 0; border-top: 0; }
  td { margin-top: 12px; }
  td::before { content: attr(data-label); display: block; margin-bottom: 4px; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0; }
}
.mono { font-family: var(--font-mono); font-size: 13px; letter-spacing: 0; }
footer.ins-foot { background: var(--site-foot); border-top: 1px solid var(--site-foot-edge); color: var(--ink); margin-top: 96px; padding: var(--space-l) 0 calc(var(--space-xl) + env(safe-area-inset-bottom, 0px)); font-size: 14px; }
footer .links a { color: var(--ink); margin-right: 20px; text-decoration: none; }
footer .links a:hover { text-decoration: underline; }