/* Стиль документов клуба: оферта, персональные данные, контакты и реквизиты.

   Задача этих страниц — не продавать, а спокойно объяснять. Поэтому
   единственное место на сайте, где мы работаем на светлом: длинный
   юридический текст на тёмном фоне утомляет глаза уже через страницу.

   22.08.2026: файл перестал быть отдельным набором цветов и шрифтов.
   Теперь это дневная поверхность общей системы — те же токены, те же
   размеры, тот же ритм, просто светлые значения. Из-за прежнего
   разнобоя (у витрины одна бронза, у документов другая, кнопки трёх
   разных форм) сайт и выглядел собранным из кусков.

   Разметку страниц менять не потребовалось: имена классов те же. */

@import url('/sistema.css');

/* Дневные значения токенов. Компоненты системы читают имена,
   поэтому перекрашивается всё сразу — и кнопки, и поля, и списки. */
:root{
  --fon:#f6f3ec;
  --fon-2:#efeadf;
  --poverhnost:#fffdf8;
  --poverhnost-2:#fffdf8;
  --liniya:rgba(26,34,52,.13);
  --liniya-2:rgba(26,34,52,.22);

  --tekst:#141c2c;
  --tekst-2:#4a566c;
  --tekst-3:#6f7a8e;

  --bronza:#8a6229;        /* на светлом нужен тёмный акцент: контраст 4,8:1 */
  --bronza-sv:#7a561f;
  --bronza-tush:rgba(138,98,41,.08);
  --bronza-dym:rgba(138,98,41,.32);

  --ten:0 16px 40px rgba(20,28,44,.09);
  --ten-mal:0 6px 18px rgba(20,28,44,.06);
}

body{font-size:17px;line-height:1.72}

/* ── шапка: единственное тёмное пятно, держит связь с витриной ── */

.shapka{background:#0b1220;padding:20px 0 21px;position:static;margin:0;
  max-width:none}
.shapka .vnutri{max-width:760px;margin:0 auto;padding:0 var(--polya);
  display:flex;justify-content:space-between;align-items:center;gap:var(--v5)}
.shapka .logo{font-family:var(--shrift-zag);font-size:19px;font-weight:800;
  color:#eee6d8;letter-spacing:.02em;line-height:1.15}
.shapka .logo span{display:block;font-family:var(--shrift);font-size:8.5px;
  font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  color:#c08b41;margin-top:4px}
.shapka a{color:#e6bb7d;font-size:14px;white-space:nowrap;
  border-bottom:1px solid rgba(230,187,125,.3)}
.shapka a:hover{border-bottom-color:#e6bb7d}

/* ── полотно документа ── */

.wrap{max-width:760px;margin:0 auto;padding:0 var(--polya) var(--v9)}

a{color:var(--bronza);border-bottom:1px solid rgba(138,98,41,.32)}
a:hover{border-bottom-color:var(--bronza)}

h1{font-size:clamp(30px,4.4vw,44px);margin:var(--v8) 0 var(--v3)}
.date{color:var(--tekst-3);font-size:14.5px;margin:0 0 var(--v6)}

h2{font-size:clamp(21px,2.6vw,28px);margin:var(--v8) 0 var(--v4);
  padding-top:var(--v5);border-top:1px solid var(--liniya)}
h2:first-of-type{border-top:none;padding-top:0}

h3{font-family:var(--shrift);font-size:16px;font-weight:700;letter-spacing:0;
  line-height:1.35;margin:var(--v5) 0 10px;color:var(--tekst)}

p{margin-bottom:15px;max-width:none}
p+p{margin-top:-2px}

ul,ol{margin:0 0 17px 3px;list-style:none}
li{position:relative;padding-left:22px;margin-bottom:9px}
li::before{content:'';position:absolute;left:2px;top:.68em;
  width:5px;height:5px;border-radius:50%;background:var(--bronza);opacity:.55}
ol{counter-reset:n}
ol li{counter-increment:n}
ol li::before{content:counter(n) '.';background:none;width:auto;height:auto;
  left:0;top:0;color:var(--bronza);font-weight:700;opacity:1;font-size:15px}

b,strong{font-weight:600}

/* ── реквизиты: не таблица, а спокойный список ── */

.rekviz{background:var(--poverhnost);border:1px solid var(--liniya);
  border-radius:var(--r);padding:8px var(--v6);margin:var(--v6) 0}
.rekviz div{display:flex;gap:var(--v5);padding:13px 0;align-items:baseline;
  border-bottom:1px solid var(--liniya)}
.rekviz div:last-child{border-bottom:none}
.rekviz b{font-family:var(--shrift);font-weight:600;width:225px;flex:none;
  color:var(--tekst-3);font-size:12px;text-transform:uppercase;
  letter-spacing:.08em;line-height:1.45}
.rekviz span{font-size:16.5px}

/* ── выноска: то, что важно не пропустить ── */

.vazhno{background:var(--bronza-tush);border-left:2px solid var(--bronza);
  padding:var(--v5) var(--v5);border-radius:0 var(--r-mal) var(--r-mal) 0;
  margin:var(--v6) 0;font-size:16.5px}
.vazhno b{font-weight:600}

/* ── тарифы ── */

table{margin:var(--v5) 0;background:var(--poverhnost);
  border:1px solid var(--liniya);border-radius:var(--r);overflow:hidden}
.cena{font-weight:600;white-space:nowrap;font-size:17px}

/* ── юридический мелкий шрифт: присутствует, но не давит ── */

.melko{font-size:14.5px;line-height:1.62;color:var(--tekst-3)}
.melko a{color:var(--tekst-3);border-bottom-color:rgba(111,122,142,.3)}

footer{margin-top:var(--v8);padding-top:var(--v6);border-top:1px solid var(--liniya);
  color:var(--tekst-3);font-size:14px;line-height:1.62}
footer a{color:var(--tekst-2);border-bottom-color:rgba(74,86,108,.28)}
footer .vazhnoe-vnizu{color:var(--tekst-2);font-weight:600}

/* ── телефон ── */

@media(max-width:620px){
  body{font-size:16.5px}
  .rekviz{padding:6px var(--v5)}
  .rekviz div{flex-direction:column;gap:4px;padding:12px 0}
  .rekviz b{width:auto;font-size:11.5px}
  .rekviz span{font-size:16px}

  /* Таблицы на телефоне складываются в карточки.

     Раньше здесь стояло `display:block;overflow-x:auto;white-space:nowrap`:
     таблица прокручивалась вбок, и колонка «Цена» уезжала на 1 300 пикселей
     вправо — то есть цену, ради которой человек и открыл страницу, он видел
     только если догадывался возить пальцем. Замерено 27.08.2026.

     Подпись каждой ячейки берётся из `data-podpis` в разметке. */
  .wrap table{display:block;white-space:normal;border:none;background:none;
    border-radius:0;overflow:visible}
  .wrap table tbody{display:block}
  .wrap table tr{display:block;background:var(--poverhnost);
    border:1px solid var(--liniya);border-radius:var(--r);
    padding:10px var(--v5) 14px;margin-bottom:10px}
  .wrap table tr:first-child{display:none}     /* шапка таблицы не нужна:
                                                  подписи стоят у ячеек */
  .wrap table td{display:block;border:none;padding:7px 0}
  .wrap table td::before{content:attr(data-podpis);display:block;
    font-family:var(--shrift);font-size:11.5px;font-weight:600;
    text-transform:uppercase;letter-spacing:.08em;color:var(--tekst-3);
    margin-bottom:3px}
  .wrap table td.cena{font-size:19px;padding-top:9px;
    border-top:1px solid var(--liniya);margin-top:4px}
}

/* ── узкий телефон ──

   Ссылка «На главную» выезжала за край экрана: под логотипом стоит
   подпись «место, где становятся квалифицированными» — 297 пикселей,
   которые общая система держала одной строкой. Страница выходила
   за экран на 6 px при 390 и на 36 px при 360; следом уезжала
   и плашка про cookies — она считает ширину от страницы, а не от экрана.

   Чинится в общей системе, а не здесь: sistema.css прячет подпись
   в шапке на экранах до 620 px. Смотреть там же, если шапка
   когда-нибудь снова поедет. */

@media(max-width:430px){
  .shapka .vnutri{gap:var(--v4)}
}