/* Money Compass — общие стили юридических страниц (privacy / consent / terms). */

/* Self-hosted Manrope (variable) — без обращения к Google Fonts.
   Файлы лежат в public/fonts/ и попадают в dist/fonts/ как есть. */
@font-face {
  font-family: 'Manrope Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url('/fonts/manrope-cyrillic-wght-normal.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Manrope Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url('/fonts/manrope-latin-wght-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+2122;
}

:root {
  --bg: #060f22;
  --fg: #f4f8ff;
  --muted: #8fa4c7;
  --border: rgba(91, 143, 220, 0.18);
  --accent: #2997ff;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background-color: var(--bg);
  background-image:
    radial-gradient(1100px 620px at 15% -10%, rgb(20 92 255 / 0.14), transparent 60%),
    radial-gradient(900px 520px at 85% -6%, rgb(23 215 232 / 0.07), transparent 55%);
  background-repeat: no-repeat;
  color: var(--fg);
  font-family: 'Manrope Variable', 'Manrope', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

.page {
  max-width: 760px;
  margin: 0 auto;
  padding: 48px 24px 80px;
}

.page__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.9rem;
  margin-bottom: 34px;
  transition: color 0.2s;
}
.page__back:hover { color: var(--fg); }

h1 {
  font-size: clamp(1.5rem, 4vw, 2.1rem);
  line-height: 1.25;
  margin: 0 0 8px;
  letter-spacing: -0.01em;
}

.page__updated {
  color: var(--muted);
  font-size: 0.85rem;
  margin-bottom: 36px;
}

h2 {
  font-size: 1.15rem;
  margin: 36px 0 12px;
}

p, li { color: #cdd9ee; }
ul { padding-left: 22px; }
li { margin-bottom: 6px; }

a { color: var(--accent); }

.todo {
  background: rgb(246 191 82 / 0.08);
  border: 1px solid rgb(246 191 82 / 0.35);
  border-radius: 10px;
  padding: 2px 8px;
  color: #f6bf52;
  font-weight: 600;
}

.page__footer {
  margin-top: 56px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 0.82rem;
}