/* Оформление юридических страниц — app.yocoffee.ru/legal/*
 *
 * Один файл на все пять страниц. До 9 сентября 2026 у каждой был свой
 * <style> внутри разметки, и ни один из них не применялся: CSP на сервере
 * (style-src 'self', без unsafe-inline) встроенные стили не пропускает.
 * Страницы, на которые ссылается карточка App Store, всё это время
 * показывались гостю без оформления.
 *
 * ⚠️ Отсюда правило: стили сюда, в файл. Вернёшь <style> в страницу —
 * он молча перестанет работать, и выглядеть это будет не как ошибка, а
 * как «страница поехала».
 *
 * Цвета и шрифт те же, что у страницы скачивания на корне домена, и те
 * же, что в приложении (lib/theme/yo_colors.dart).
 */

/* ⚠️ Формат woff2, а не ttf, и это не только про вес (58 КБ против 124).
 * Расширения `.ttf` нет в /etc/nginx/mime.types, а в `location /legal/`
 * стоит `default_type text/html` — шрифт уезжал гостю с типом text/html.
 * Работало, но держалось на том, что браузеры не отсекают шрифты по
 * MIME, в отличие от скриптов и стилей. `woff2` в карте типов есть, и
 * nginx отдаёт его как font/woff2 без единой правки конфига. */
@font-face {
  font-family: "Onest";
  src: url("/legal/onest-variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;

  --blue: #075FAE;
  --ink: #102238;
  --ink-72: rgba(16, 34, 56, .72);
  --ink-56: rgba(16, 34, 56, .56);
  --ink-42: rgba(16, 34, 56, .42);
  --ink-12: rgba(16, 34, 56, .12);
  --ink-06: rgba(16, 34, 56, .06);
  --bg: #F6F3EE;
  --surface: #FFFFFF;
  --wrap: 760px;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  padding: 0 16px 48px;
  background: var(--bg);
  color: var(--ink);
  font-family: "Onest", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }

/* ---- шапка ---- */

.top {
  display: flex;
  align-items: center;
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 18px 4px;
}

.lockup {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--ink);
  min-height: 44px;
}

.lockup-mark { width: 40px; height: 40px; border-radius: 12px; }

.lockup-text {
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--ink-56);
}

.lockup-text b { font-weight: 800; color: var(--blue); }

/* ---- лист документа ---- */

main {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 30px 22px 34px;
  background: var(--surface);
  border-radius: 26px;
  box-shadow: 0 10px 28px var(--ink-06);
}

h1 {
  font-size: clamp(26px, 5.4vw, 34px);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0 0 10px;
}

/* Подзаголовок — первый абзац сразу за h1: «Приложение «ЙОУ Клуб» · ИП …».
   Ловится соседним селектором, чтобы не заводить класс в разметке и не
   трогать текст документа. */
h1 + p {
  margin: 0 0 26px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--ink-12);
  color: var(--ink-56);
  font-size: 15px;
}

h2 {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.25;
  margin: 34px 0 12px;
}

h3 {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 26px 0 8px;
}

p, li { margin: 0 0 14px; color: var(--ink-72); }

li { margin-bottom: 8px; }

ul, ol { padding-left: 22px; margin: 0 0 16px; }

b, strong { color: var(--ink); font-weight: 700; }

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

hr { border: none; border-top: 1px solid var(--ink-12); margin: 32px 0; }

/* ---- подвал ---- */

footer {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 26px 4px 0;
  font-size: 14px;
  color: var(--ink-42);
  text-align: center;
}

footer nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px 20px;
  margin-bottom: 10px;
}

footer nav a {
  color: var(--ink-56);
  text-decoration: none;
  white-space: nowrap;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

footer nav a:hover { color: var(--ink); text-decoration: underline; }

footer p { margin: 0; color: var(--ink-42); }

/* ---- широкий экран ---- */

@media (min-width: 700px) {
  main { padding: 40px 44px 46px; }
  .top { padding: 24px 4px; }
}

/* ---- печать ----
   Юридические документы печатают и прикладывают к обращениям: на бумаге
   лист без подложки и без теней, ссылки чёрные. */

@media print {
  body { background: #FFFFFF; padding: 0; }
  .top { display: none; }
  main { box-shadow: none; border-radius: 0; padding: 0; max-width: none; }
  a { color: #000000; }
  footer nav { display: none; }
}