/* ==========================================================================
   Страница приватности KitKids — public, для родителя.

   Шапка и подвал — общие с лендингом (.land-top/.land-foot из landing.css,
   который эта страница тоже подключает): обе страницы публичные, и одинаковая
   «оправа» без копий правил — это и есть их родство. Всё, что ниже шапки,
   живёт здесь под префиксом .priv- — ни один селектор не спорит ни с
   приложением, ни с лендингом.

   Ни одного нового цвета или радиуса: только токены из app.css. Это страница
   для чтения: короткая строка (~66 знаков), плотный межстрочный, никаких
   анимаций входа — лендинг объясняет и продаёт, эта страница говорит правду.
   ========================================================================== */

/* Шапка: бренд здесь — ссылка домой, подчёркивание ей не нужно. */
.land-top__brand { text-decoration: none; }

.priv {
  max-width: 72ch;
  margin: 0 auto;
  padding: var(--s7) var(--s5) var(--s8);
}

/* ------------------------------ шапка статьи ------------------------------ */

.priv__eyebrow {
  display: inline-block;
  font-size: var(--fs-label); font-weight: 800; text-transform: uppercase;
  letter-spacing: .04em; color: var(--ink-muted);
  background: var(--amber-t); border-radius: var(--r-pill);
  padding: 6px var(--s3);
}
.priv__title {
  margin-top: var(--s4);
  font-family: var(--font-body); font-weight: 800;
  font-size: clamp(30px, 6.4vw, 44px);
  line-height: 1.1; letter-spacing: 0; color: var(--ink);
}
.priv__lead {
  margin-top: var(--s4);
  font-size: clamp(var(--fs-body), 2.4vw, 19px); line-height: 1.6;
  color: var(--ink-muted);
}
.priv__version {
  margin-top: var(--s4);
  display: inline-block;
  font-size: var(--fs-caption); font-weight: 700; color: var(--ink-muted);
  border: 2px solid var(--line); border-radius: var(--r-pill);
  padding: 4px 12px; background: var(--surface);
}

/* ------------------------------- секции ----------------------------------- */

.priv__sec { margin-top: var(--s8); scroll-margin-top: 80px; }
.priv__sec h2 {
  font-family: var(--font-body); font-weight: 800;
  font-size: clamp(22px, 4.4vw, 29px);
  line-height: 1.2; color: var(--ink);
}
.priv__sec > p {
  margin-top: var(--s3);
  line-height: 1.65; color: var(--ink-muted);
}
.priv__sec > p + p { margin-top: var(--s3); }

/* Пометки-оговорки: честные «но», без которых текст врал бы умолчанием. */
.priv__note {
  margin-top: var(--s3);
  font-size: var(--fs-caption); line-height: 1.6; color: var(--ink-muted);
  padding-left: var(--s4);
  border-left: 3px solid var(--amber);
}

/* --------------------------- карточки-факты -------------------------------- */

.priv-facts {
  display: grid; gap: var(--s4); margin: var(--s5) 0 0; padding: 0;
  list-style: none;
}
.priv-fact {
  display: grid; gap: var(--s1);
  background: var(--surface); border-radius: var(--r-md);
  box-shadow: var(--sh-1); padding: var(--s4) var(--s5);
}
.priv-fact b { font-family: var(--font-body); font-weight: 800; font-size: var(--fs-body); }
.priv-fact span { font-size: var(--fs-body); line-height: 1.6; color: var(--ink-muted); }

/* --------------------------- «чего не делаем» ------------------------------ */

.priv-nevers {
  display: grid; gap: var(--s4); margin: var(--s5) 0 0; padding: 0;
  list-style: none;
}
.priv-never {
  display: grid; gap: 2px;
  font-size: var(--fs-body); line-height: 1.6; color: var(--ink-muted);
}
.priv-never::before {
  content: 'никогда';
  justify-self: start;
  font-size: var(--fs-caption); font-weight: 800; text-transform: uppercase;
  letter-spacing: .04em; color: #fff;
  background: var(--green); border-radius: var(--r-pill);
  padding: 2px 10px;
}

/* ---------------------- 152-ФЗ: сегодня и к запуску ------------------------ */

.priv-status {
  margin-top: var(--s5);
  padding: var(--s5);
  border-radius: var(--r-lg);
  background: var(--surface);
  box-shadow: var(--sh-1);
}
.priv-status--now { background: var(--green-t); box-shadow: none; }
.priv-status--next { background: var(--amber-t); box-shadow: none; }
.priv-status__tag {
  font-family: var(--font-body); font-weight: 800; font-size: var(--fs-body);
}
.priv-status ul {
  margin: var(--s3) 0 0; padding: 0; list-style: none;
  display: grid; gap: var(--s3);
}
.priv-status li {
  display: flex; gap: var(--s2); align-items: flex-start;
  font-size: var(--fs-body); line-height: 1.6; color: var(--ink-muted);
}
.priv-status--now li::before {
  content: '✓'; flex: none; color: var(--green); font-weight: 800;
}
.priv-status--next li::before {
  content: '→'; flex: none; color: var(--amber-p); font-weight: 800;
}

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

.priv__foot {
  margin-top: var(--s8); padding-top: var(--s6);
  border-top: 2px solid var(--line);
  display: grid; gap: var(--s3); justify-items: center; text-align: center;
}
.priv__foot > p { font-size: var(--fs-caption); color: var(--ink-muted); }

/* ------------------------------- ≥640px ------------------------------------ */

@media (min-width: 640px) {
  .priv { padding-inline: var(--s6); }
  .priv-facts { grid-template-columns: repeat(2, 1fr); gap: var(--s4); }
}

/* ------------------------- узкий телефон (358px) --------------------------- */

@media (max-width: 380px) {
  .land { font-size: var(--fs-body); }
  .priv { padding-inline: var(--s4); padding-top: var(--s6); }
  .priv-fact { padding: var(--s3) var(--s4); }
  .priv-status { padding: var(--s4); }
}

/* ------------------ маркировка возраста и заглушки (LEGAL1) --------------- */

/* «3+» в подвале юридических страниц — тот же знак, что в подвале лендинга
   (.land-foot__age в landing.css): один и тот же продукт обязан маркировать
   себя одинаково на всех страницах. */
.priv-age {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.4em;
  height: 2.4em;
  padding: 0 var(--s2);
  border: 2px solid var(--ink-muted);
  border-radius: var(--r-sm);
  font-family: var(--font-body);
  font-weight: 800;
  font-size: var(--fs-body);
  color: var(--ink);
}

/* Placeholder оператора — не текст, а заметная временная пометка: пунктир
   по янтарной подложке говорит «здесь будет настоящая строка», и случайный
   читатель видит незавершённость, а не реквизиты. */
.priv-todo {
  display: inline-block;
  padding: 2px 10px;
  border: 2px dashed var(--amber-p);
  border-radius: var(--r-sm);
  background: var(--amber-t);
  font-weight: 700;
}