/* ===== Футер сайта =====
 * Разметка — gen/footer.html, раскатка — node gen/apply-footer.js.
 *
 * До 28.07 оформление футера жило инлайновыми style= прямо в разметке и вместе
 * с ней копировалось в каждую из 211 страниц: около 4200 объявлений на сайт при
 * том, что блок один. Инлайн перебивает любой внешний стиль, поэтому правки в
 * общих файлах до футера не долетали, а цвета стояли хексами мимо палитры.
 * Теперь в разметке только классы, значения — здесь и из tokens.css.
 *
 * 10.08.2026, решение владельца: две колонки вместо трёх. Столбец «Документы»
 * убран, ссылки уехали мелкой строкой в самый низ — юридически они нужны, но
 * внимания не просят. Раньше на телефоне все три столбца вставали друг под
 * друга, каждая ссылка растягивалась до 44 пикселей плюс зазор 12, и футер
 * занимал 1001 пиксель, то есть 1,2 экрана.
 */

footer[data-foot]{background:var(--footer-bg); border-top:1px solid transparent;}
.ft-in{max-width:1180px; margin:0 auto; padding:56px 32px 30px;}

.ft-grid{display:grid; grid-template-columns:1.7fr 1fr; gap:40px;}
.ft-lbl{font-weight:700; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--footer-label); margin:0 0 16px;}

/* левая колонка: логотип, описание, кнопки магазинов */
.ft-brand{font-family:'Merriweather',serif; font-style:italic; font-weight:300; font-size:18px;
  letter-spacing:-.005em; color:var(--accent);}
.ft-brand img{height:22px; width:auto; display:block;}
.ft-about{font-size:15px; line-height:1.55; color:var(--neutral-soft); margin:14px 0 20px; max-width:300px;}
/* Отступ логотипа от кнопок. Раньше воздух держала строка `.ft-about` с её
   `margin:14px 0 20px`; 21.08.2026 текст убрали по решению владельца, и
   логотип сел вплотную на кнопки магазинов. Отступ теперь задаёт сам ряд
   кнопок и не зависит от того, есть над ним текст или нет. */
.ft-stores{display:flex; flex-wrap:wrap; gap:10px; margin-top:20px;}
/* Кнопки магазинов приведены к виду английского сайта (владелец, 21.08.2026:
   «а то они сейчас чёрные просто»). Официальные бейджи Apple и Google мы не
   скачиваем, поэтому собираем свои: та же высота 48, то же скругление, тот же
   подъём при наведении, а узнаваемость дают фирменные значки в цвете. */
.ft-store{text-decoration:none; display:inline-flex; align-items:center; gap:10px;
  min-height:48px; background:var(--footer-store); color:#fff;
  border:1px solid rgba(255,255,255,.14); border-radius:var(--radius-small); padding:8px 16px;
  transition:transform .16s ease, border-color .16s ease, background .16s ease;}
.ft-store:hover{transform:translateY(-2px); border-color:rgba(255,255,255,.28);
  background:color-mix(in srgb, var(--footer-store) 86%, #fff);}
.ft-store-ic{flex:none; display:block;}
.ft-store-txt{display:flex; flex-direction:column; line-height:1.15;}
/* 9,5 пикселя — ниже порога, с которого подпись читается на телефоне.
   На узком экране три бейджа делят строку, и служебная строка «Загрузите в»
   при читаемом кегле уже не помещается: там знак магазина и название говорят
   сами за себя. Тот же приём на cbtwithai.com. */
.ft-store-top{font-size:11.5px; opacity:.78; letter-spacing:.01em;}
.ft-store-name{font-size:15px; font-weight:600; letter-spacing:-.01em;}
@media(max-width:430px){
  .ft-store-top{display:none}
  .ft-store-name{font-size:15px}
}

/* правая колонка: связь */
.ft-support-links{display:flex; flex-wrap:wrap; gap:10px;}
.ft-tg{display:inline-flex; align-items:center; justify-content:center; gap:8px; background:var(--accent); color:#fff;
  font-weight:600; font-size:14px; padding:11px 18px; border-radius:var(--radius-pill); text-decoration:none;
  min-height:44px; box-sizing:border-box;}
.ft-dzen{display:inline-flex; align-items:center; justify-content:center; gap:8px; background:#000; color:#fff; font-weight:600;
  font-size:14px; padding:11px 18px; border-radius:var(--radius-pill); text-decoration:none;
  white-space:nowrap; flex:none; min-height:44px; box-sizing:border-box;}
/* Буква «Д» — знак Дзена, поэтому гротеск здесь системный: у Manrope она
   в квадрате 19×19 выходит уже фирменного знака. */
.ft-dzen-mark{display:inline-flex; align-items:center; justify-content:center; width:19px; height:19px;
  background:#fff; color:#000; border-radius:var(--radius-micro);
  font-family:Arial,Helvetica,sans-serif; font-weight:800; font-size:13px; line-height:1;}
.ft-note{font-size:13px; line-height:1.5; color:var(--neutral-soft); margin:14px 0 0;}

/* низ футера */
.ft-rule{height:1px; background:var(--neutral-line); margin:34px 0 18px;}
/* Документы: одна строка через точки, кегль мелкий. Отдельный столбец с
   заголовком «ДОКУМЕНТЫ» съедал на телефоне 224 пикселя ради четырёх ссылок,
   которые открывают один человек из ста. */
.ft-docs{display:flex; flex-wrap:wrap; align-items:center; font-size:13px; line-height:1.6; color:var(--footer-caption);}
.ft-docs a{color:inherit; text-decoration:none;}
.ft-docs a:hover{color:var(--accent); text-decoration:underline;}
.ft-docs span{opacity:.45; padding:0 8px;}
.ft-bottom{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center;
  gap:8px 24px; font-size:13px; color:var(--footer-caption);}
.ft-bottom a{color:inherit; text-decoration:none;}
.ft-bottom a:hover{color:var(--neutral-soft);}
.ft-author{white-space:nowrap;}
.ft-copy{margin:12px 0 0; font-size:12.5px; line-height:1.6; color:var(--footer-caption);}
.ft-copy a{color:inherit; text-decoration:underline;}
.ft-copy a:hover{color:var(--neutral-soft);}
/* Легаси: строка договоров жила отдельным блоком, часть страниц ещё её содержит */
.ft-legal{font-size:13px; line-height:1.65; color:var(--neutral-soft); max-width:920px; margin:0 0 20px;}

@media(max-width:880px){ .ft-grid{grid-template-columns:1fr !important; gap:30px !important;} }
@media(max-width:520px){
  .ft-in{padding:40px 20px 24px;}
  .ft-about{margin-bottom:16px;}
  /* Кнопки связи делят строку пополам: два действия в ряд вместо двух рядов,
     и подвал становится короче ровно на высоту одной кнопки. */
  .ft-support-links{flex-wrap:nowrap; gap:9px;}
  .ft-tg,.ft-dzen{flex:1 1 0; min-width:0; padding:11px 12px; white-space:nowrap;}
  .ft-rule{margin:26px 0 14px;}
  .ft-bottom{flex-direction:column; align-items:flex-start; gap:10px;}
  .ft-docs{font-size:13px;}
  .ft-docs span{padding:0 6px;}
}