/* Доводка оболочки живых страниц Rails.
   Шапку, подвал и крошки оформляет ОБЩИЙ лист сайта
   (/assets/css/components.css) — тот же файл, что у зеркальных страниц.
   Здесь остаётся только то, чего в нём нет: фон страницы и база крошек
   (в общем листе у `.crumb` объявлен один шрифт). Классы те же
   (.nav/.ttn/.foot/.crumb), чтобы
   живая страница и страницы прода читались как один сайт. */

/* ── ФОН СТРАНИЦЫ ──────────────────────────────────────────────────────
   Тот же фон, что у всех страниц сайта: неподвижное радиальное свечение в
   правом верхнем углу, само тело прозрачно. Сплошная заливка `bg-desk-bg`
   давала живому экрану СВОЙ фон — страница читалась как чужая.
   Значения взяты со страниц прода дословно, вместе со светлой парой.       */
/* Значения взяты с ГЛАВНОЙ дословно (#tt-cloudline и её body), а не подобраны
   на глаз: подложка #06100a и то же радиальное свечение в правом верхнем
   углу. Свечение на ::before и position:fixed — оно не уезжает при прокрутке
   длинной таблицы, как на лендинге не уезжает при прокрутке блоков. */
body{background:#06100a}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(circle at 78% 5%,#12371f 0,#07140c 38%,#050b07 100%)}
html.tt-light body{color:#151816;background:#edf2ed}
html.tt-light body::before{
  background:radial-gradient(circle at 78% 5%,#90dbaa 0,#f4fbf6 38%,#eaf5ee 100%)}

/* ── ШАПКА ─────────────────────────────────────────────────────────────
   Правил шапки здесь БОЛЬШЕ НЕТ: ими владеет общий лист сайта
   (/assets/css/components.css), подключённый в layouts/screen.html.erb.
   До 23.08.2026 копия жила здесь, и живой экран остался без поиска, темы,
   «дашборда» и переключателя языка — их дособирают скрипты сайта по
   разметке `header.nav`, которой в копии не было.                         */

/* ── МЕСТО ПОД ПРАВУЮ ЧАСТЬ ШАПКИ ──────────────────────────────────────
   Поиск, «дашборд», тему и EN/RU дособирают скрипты сайта — они приезжают
   после разбора страницы, и ряд ссылок прыгал влево у них на глазах
   (замечание владельца 24.08.2026: «шапка падает при переключении RU/EN»).
   Ширины замерены на бою ПОСЛЕ загрузки шрифтов (`document.fonts.ready`) и
   разные у локалей: подпись «dashboard» шире «дашборда». Замер до шрифтов
   давал другие числа — запасная гарнитура уже, и резерв уезжал на 6px. Каждая пришедшая часть гасит СВОЮ долю, а не
   весь резерв: скрипты выполняются в своём порядке, и общий выключатель
   вернул бы скачок для тех, кто приехал раньше остальных.
   На телефоне резерва нет: там правая часть уходит за бургер.              */
.nav .ttn{--st-hold-s:36px;--st-hold-d:87px;--st-hold-l:139px}
:lang(ru) .nav .ttn{--st-hold-d:77px}
.nav .ttn:has(.tt-sbtn){--st-hold-s:0px}
.nav .ttn:has(.ttdash){--st-hold-d:0px}
.nav .ttn:has(.ttlang){--st-hold-l:0px}
.nav .ttn .st-navhold{display:inline-block;height:1px;flex:0 0 auto;
  width:calc(var(--st-hold-s) + var(--st-hold-d) + var(--st-hold-l))}
@media (max-width:760px){.nav .ttn .st-navhold{display:none}}

/* ── ХЛЕБНЫЕ КРОШКИ ────────────────────────────────────────────────────
   Путь слева и тем же набором, что у ВСЕХ страниц сайта (просьба владельца
   24.08.2026; правку от 23.08 «сверху справа» она отменяет). Значения взяты
   со страницы прода дословно: 12px, приглушённый цвет, ссылка с подчёркиванием
   тонкой линией. Своей копии этих правил в общем листе нет — там у `.crumb`
   объявлен только шрифт, а размер и цвет живут в странице; поэтому база
   стоит здесь, а не подбирается на глаз.
   Отступы прода (`padding:20px 40px 0`) не переносятся: колонку живого
   экрана держит `main`, и второй горизонтальный отступ сдвинул бы путь
   относительно заголовка под ним.                                          */
.crumb.st-crumb{max-width:none;margin:0 0 6px;padding:0;text-align:left;
  font-family:'Space Grotesk', system-ui, sans-serif;font-size:12px;color:#8a948c}
.crumb.st-crumb a{color:#8a948c;text-decoration:none;
  border-bottom:1px solid rgba(138,148,140,.4)}
.crumb.st-crumb a:hover,.crumb.st-crumb a:focus-visible{color:#33ff66;
  border-bottom-color:rgba(51,255,102,.5)}
html.tt-light .crumb.st-crumb{color:#555d57}
html.tt-light .crumb.st-crumb a{color:#555d57;
  border-bottom:1px solid rgba(85,93,87,.4)}
html.tt-light .crumb.st-crumb a:hover,
html.tt-light .crumb.st-crumb a:focus-visible{color:#087a3a;
  border-bottom-color:rgba(8,122,58,.5)}

/* ── ПОДВАЛ ────────────────────────────────────────────────────────── */
.foot{box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) auto;
  align-items:center;column-gap:24px;row-gap:14px;
  width:100%;max-width:1120px;margin-inline:auto;
  padding:26px clamp(16px,4vw,40px);
  border-top:1px solid rgba(232,236,233,.14);
  font-family:'Space Grotesk', 'Manrope', system-ui, sans-serif;font-size:9px;color:#8a948c}
.foot-brand{display:flex;align-items:center;gap:14px;min-width:0}
.foot-mark{flex:0 0 auto;line-height:0}
.foot-mark video,.foot-mark img{width:34px;height:34px;border-radius:0;
  object-fit:cover;display:block}
.foot-mark .still{display:none}
@media (prefers-reduced-motion:reduce){
  .foot-mark video{display:none}
  .foot-mark .still{display:block}
}
.foot-brand-a{display:flex;align-items:center;gap:10px;text-decoration:none;
  color:inherit}
.foot-brand-a:hover h2{color:#33ff66}
.foot-brand-a:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(51,255,102,.28)}
.foot h2{font-family:'Space Grotesk','Manrope',system-ui,sans-serif;margin:0;font-size:11px;
  font-weight:600;letter-spacing:0;white-space:nowrap;color:#e8ece9}
.foot-links{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;min-width:0}
.foot-legal{display:flex;align-items:center;gap:10px;white-space:nowrap;
  justify-self:end}
.foot .cp,.foot .ver{color:#5a635c;margin:0}
.foot-side{display:block;justify-self:end}
.foot-cta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;
  align-items:stretch;width:min(100%,320px)}
.foot-cta a{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  width:100%;min-width:0;min-height:44px;padding:0 12px;
  border:1px solid rgba(232,236,233,.14);border-radius:0;
  background:transparent;color:#8a948c;text-decoration:none;font-weight:400;
  font-size:10px;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.foot-cta a:hover{border-color:rgba(51,255,102,.45);color:#33ff66}
.foot-cta a:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(51,255,102,.28)}
.foot a,.foot-links a{color:#8a948c;text-decoration:none;border-bottom:0}
.foot a:hover,.foot a:focus-visible{color:#33ff66}
.foot .fi{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.foot .fi i{font-style:normal;color:#5a635c;opacity:.5;border:0}
.foot .fi a,.foot .foot-links a,.foot .cp,.foot .ver{
  font-family:'Space Grotesk', 'Manrope', system-ui, sans-serif;
  font-size:9px;letter-spacing:.1em;text-transform:uppercase}
.foot .cp,.foot .ver{text-transform:none;letter-spacing:.06em}
.foot .foot-links a,.foot .fi a{display:inline-flex;align-items:center;
  min-height:24px;padding:2px 0}
@media(max-width:760px){
  .foot{grid-template-columns:1fr;row-gap:14px}
  .foot-side,.foot-legal{justify-self:start}
  .foot-legal{flex-wrap:wrap;white-space:normal;gap:4px 10px}
  .foot .cp,.foot .ver{white-space:normal}
  .foot h2{white-space:normal}
  .foot-side{width:100%}
  .foot-cta{width:100%}
}

/* ── СВЕТЛАЯ ПАРА ОБОЛОЧКИ ─────────────────────────────────────────────
   Общий лист сайта светлой темы НЕ содержит: на зеркальных страницах её
   дописывает свип theme_light.py прямо в страничные стили. У живого экрана
   страничных стилей нет, поэтому пара живёт здесь — иначе переключатель в
   шапке даёт светлый фон и тёмную шапку на нём.
   Значения посчитаны по тому же правилу: контраст перенесён, тон не тронут;
   зелёный на светлом — #087a3a (потолок насыщенного из §6.1).            */
html.tt-light .nav{border-bottom-color:rgba(16,32,23,.16)}
html.tt-light .nav>a{color:#102017}
html.tt-light .ttn a.l{color:#43584a}
html.tt-light .ttn a.l:hover,
html.tt-light .ttn a.l:focus-visible,
html.tt-light .ttn a.l.here{color:#087a3a}
html.tt-light .l-menu{background:#edf2ed;border-color:rgba(16,32,23,.16);
  box-shadow:0 24px 60px rgba(16,32,23,.18)}
html.tt-light .foot{border-top-color:rgba(16,32,23,.16)}